:root {
    --font-main: "Source Han Sans SC", "思源黑体", "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
    --black: #000000;
    --dark: #333333;
    --mid: #777777;
    --light: #999999;
    --border: #000000;
    --bg: #ffffff;
    --side: #d9d9d9;
    --title: 33px;
    --subtitle: 27px;
    --body: 20px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100%; font-family: var(--font-main); font-size: var(--body); color: var(--black); background: var(--bg); }
a { color: var(--black); text-decoration: underline; }
.system-shell { display: flex; min-height: 100vh; }
.sidebar { width: 220px; background: var(--side); padding: 64px 26px; flex: 0 0 220px; }
.sidebar-title { font-size: var(--body); font-weight: 800; margin-bottom: 24px; }
.sidebar-user { font-size: 15px; font-weight: 600; margin: 12px 0 48px; }
.sidebar-nav { list-style: none; padding: 0; margin: 0; }
.sidebar-nav li { margin: 28px 0; }
.sidebar-nav a { font-size: var(--body); font-weight: 800; color: var(--black); text-decoration: underline; }
.sidebar-nav a.active { color: #e60012; }
.main { flex: 1; padding: 48px 56px 80px; max-width: 1320px; }
.page-title { font-size: var(--title); font-weight: 900; margin: 0 0 24px; }
.section-title { display: inline-block; font-size: var(--subtitle); font-weight: 900; border: 2px solid var(--border); padding: 4px 10px; margin: 32px 0 16px; background: #fff; }
.subbar { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid var(--border); padding-bottom: 10px; margin-bottom: 22px; }
.row { display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; margin-bottom: 14px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.panel { border: 2px dashed var(--border); padding: 16px; margin: 14px 0 24px; background: #fff; }
.panel-solid { border: 2px solid var(--border); padding: 16px; margin: 14px 0 24px; background: #fff; }
.panel-head { background: #888; color: #fff; text-align: center; font-size: var(--body); font-weight: 800; padding: 6px 10px; margin: -16px -16px 16px; }
label { font-size: var(--body); font-weight: 700; margin-right: 6px; }
input, select, textarea { font-family: var(--font-main); font-size: var(--body); color: var(--black); border: 2px solid var(--border); background: #fff; min-height: 36px; padding: 4px 8px; }
textarea { width: 100%; min-height: 112px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--light); }
button, .button { font-family: var(--font-main); font-size: var(--body); font-weight: 800; border: 2px solid var(--black); background: var(--dark); color: #fff; border-radius: 6px; padding: 6px 14px; cursor: pointer; transition: transform .08s ease, background .12s ease, box-shadow .12s ease; text-decoration: none; display: inline-block; }
button:hover, .button:hover { background: #000; box-shadow: 0 0 0 3px rgba(0,0,0,.12); }
button:active, .button:active { transform: translateY(1px); }
button:disabled, .button.disabled { background: #cfcfcf; border-color: #cfcfcf; color: #fff; cursor: not-allowed; box-shadow: none; transform: none; }
.button-light { background: #fff; color: #000; }
.button-danger { background: #000; color: #fff; }
.flash-wrap { margin: 0 0 20px; }
.flash { border: 2px solid #000; padding: 10px 14px; font-weight: 800; margin-bottom: 8px; }
.flash.success { background: #f1f1f1; }
.flash.error { background: #fff; color: #e60012; }
.muted { color: var(--light); }
.note { font-size: 15px; color: var(--light); margin: 6px 0; }
.divider { border: 0; border-top: 2px solid var(--border); margin: 36px 0; }
/* Table rules: strict native table, full borders. */
table { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 14px 0 24px; border: 2px solid var(--border); }
thead th { font-size: var(--body); font-weight: 900; border: 2px solid var(--border); background: #eeeeee; padding: 8px 10px; text-align: left; vertical-align: middle; }
tbody td { font-size: var(--body); border: 2px solid var(--border); padding: 8px 10px; text-align: left; vertical-align: middle; min-height: 44px; overflow-wrap: anywhere; }
td.actions { text-align: right; white-space: nowrap; }
td.actions form { display: inline-block; margin-left: 6px; }
.table-sm thead th, .table-sm tbody td { font-size: 16px; padding: 6px 8px; }
.card { border: 2px solid var(--border); padding: 18px; background: #fff; min-height: 130px; }
.card h3 { font-size: var(--subtitle); margin: 0 0 12px; }
.card .amount { font-size: var(--title); font-weight: 900; }
.upload-box { border: 2px dashed var(--border); padding: 18px; min-height: 112px; display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.product-thumb { width: 110px; height: 165px; object-fit: cover; background: #000; display: block; }
.kv { display: inline-block; margin-right: 18px; margin-bottom: 10px; }
.status-pill { display: inline-block; border: 2px solid #000; padding: 3px 8px; font-weight: 900; background: #fff; }
.hidden { display: none; }
.chart-bars { border: 2px solid #000; padding: 20px; min-height: 260px; display: flex; align-items: end; gap: 18px; }
.chart-bar { flex: 1; border: 2px solid #000; min-height: 4px; display: flex; align-items: flex-start; justify-content: center; padding-top: 6px; font-size: 15px; }
.pie-list { border: 2px solid #000; padding: 18px; }
.pie-list div { display: flex; justify-content: space-between; border-bottom: 1px solid #000; padding: 8px 0; }
.login-shell { min-height: 100vh; display: grid; place-items: center; background: #fff; }
.login-card { border: 2px solid #000; width: 520px; padding: 36px; }
.login-card h1 { font-size: var(--title); margin: 0 0 24px; }
@media (max-width: 900px) { .system-shell { flex-direction: column; } .sidebar { width: 100%; flex: none; padding: 24px; } .main { padding: 28px; } .grid-2, .grid-3 { grid-template-columns: 1fr; } }

/* ===== v2 prototype alignment patch ===== */
.main {
    max-width: none;
    width: calc(100vw - 220px);
    padding: 48px 60px 90px;
}
.prototype-page {
    width: min(1500px, calc(100vw - 340px));
    min-width: 980px;
}
.prototype-subbar {
    min-height: 68px;
    margin-bottom: 34px;
}
.compact-title {
    margin: 0;
}
.top-actions {
    display: flex;
    align-items: center;
    gap: 28px;
}
.inline-filter {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}
.inline-filter select {
    width: 150px;
}
.create-area {
    margin-left: 60px;
    margin-bottom: 46px;
    width: calc(100% - 120px);
}
.bar-button {
    display: block;
    min-width: 140px;
    text-align: left;
    border-radius: 0;
    margin-bottom: 0;
}
.create-panel {
    margin-top: 0;
    padding: 22px 28px;
}
.form-row-wide input { width: 210px; }
.prototype-line {
    border: 0;
    border-top: 2px solid #000;
    margin: 34px 0 46px;
}
.prototype-table {
    width: calc(100% - 120px);
    margin-left: 60px;
    table-layout: fixed;
}
.rd-list-table thead th {
    background: #999;
    color: #fff;
    border-color: #999;
    font-size: 20px;
}
.rd-list-table tbody td {
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-bottom: 0;
    padding: 14px 8px;
    font-weight: 700;
}
.plain-status { font-weight: 900; }
.action-cell {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
td.action-cell form { margin-left: 0; }
.compact-action {
    padding: 5px 10px;
    font-size: 16px;
    border-radius: 0;
}
.business-hint {
    margin-left: 60px;
    color: #999;
    font-weight: 700;
}
.inline-flash-wrap {
    margin: 0 0 14px;
}
.inline-flash {
    border: 2px solid #000;
    display: inline-block;
    padding: 8px 14px;
    font-weight: 800;
    background: #f2f2f2;
}
.inline-flash.error { color: #e60012; background: #fff; }
.product-info-layout {
    display: grid;
    grid-template-columns: 760px 760px;
    gap: 34px;
    align-items: start;
}
.product-media-card,
.product-basic-card {
    min-height: 0;
}
.media-row {
    display: grid;
    grid-template-columns: 110px 170px 170px;
    gap: 18px;
    align-items: start;
}
.compact-upload {
    width: 170px;
    min-height: 165px;
    padding: 8px;
    font-size: 14px;
}
.compact-upload label,
.compact-upload input,
.compact-upload button,
.compact-upload .muted,
.compact-upload a {
    font-size: 14px;
}
.compact-upload button {
    border-radius: 0;
    padding: 4px 8px;
}
.product-thumb {
    width: 110px;
    height: 165px;
}
.prototype-panel {
    border: 2px dashed #000;
    padding: 16px;
}
.basic-form-grid {
    display: grid;
    grid-template-columns: auto 210px auto 210px auto 140px auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
}
.align-right { text-align: right; }
.module-row {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 28px;
    align-items: start;
}
.module-row .compact-title { margin-top: 0; }
.module-main {
    max-width: 1180px;
}
.bom-form-grid {
    display: grid;
    grid-template-columns: auto 240px auto 240px auto 240px;
    gap: 12px 18px;
    align-items: center;
}
.bom-fold-list {
    margin: 14px 0 20px;
}
.bom-fold {
    border: 2px solid #000;
    margin-bottom: 8px;
    background: #ddd;
}
.bom-fold summary {
    list-style: none;
    cursor: pointer;
    padding: 8px 12px;
    font-weight: 900;
    background: #d9d9d9;
}
.bom-fold summary::-webkit-details-marker { display: none; }
.fold-body {
    background: #fff;
    border-top: 2px solid #000;
    padding: 12px;
}
.bom-mini-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    font-size: 16px;
}
.bom-table,
.cost-table {
    width: 100%;
    margin-left: 0;
}
.bom-table thead th,
.cost-table thead th {
    background: #999;
    color: #fff;
    text-align: left;
}
.bom-table thead tr:nth-child(2) th,
.cost-table thead tr:nth-child(2) th {
    background: #eee;
    color: #000;
}
.color-bom-table { margin-top: 22px; }
.bom-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    margin: 18px 0 10px;
}
.bom-action-row button { width: 100%; border-radius: 0; }
.color-panel { width: 430px; }
.cost-fold-body input,
.cost-fold-body select { font-size: 16px; }
.cost-total {
    border: 2px solid #000;
    width: 220px;
    padding: 8px 12px;
    font-weight: 800;
}
@media (max-width: 1300px) {
    .prototype-page { width: 1180px; }
    .product-info-layout { grid-template-columns: 500px 620px; }
    .media-row { grid-template-columns: 110px 170px; }
}

/* ===== v3 prototype correction patch ===== */
:root { --content-width: 1280px; }
.main {
    width: calc(100vw - 220px);
    max-width: var(--content-width);
    padding: 48px 42px 90px;
}
.page-frame,
.prototype-page {
    width: 100%;
    max-width: var(--content-width);
    min-width: 0;
}
.narrow-frame { max-width: 1180px; }
.section-title,
.mini-title,
.compact-title {
    background: #d9d9d9;
    color: #000;
    border: 2px solid #000;
    min-width: 116px;
    text-align: center;
    padding: 4px 10px;
    font-size: 20px;
    line-height: 1.2;
}
.filter-label {
    display: inline-block;
    background: #d9d9d9;
    border: 2px solid #000;
    padding: 4px 10px;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.2;
}
.sidebar { width: 190px; flex-basis: 190px; padding: 56px 22px; }
.sidebar-title, .sidebar-nav a { font-size: 20px; }
.subbar { margin-bottom: 26px; }
.prototype-line { margin: 34px 0; }
.aligned-block,
.aligned-table,
.prototype-table { width: 100%; margin-left: 0; }
.prototype-toggle-bar {
    display: block;
    width: 100%;
    min-height: 38px;
    background: #999;
    color: #fff;
    border: 2px solid #999;
    border-radius: 0;
    text-align: left;
    padding: 5px 12px;
    font-weight: 900;
}
.prototype-toggle-bar:hover { background: #777; }
.small-toggle { width: 260px; margin-bottom: 0; }
.create-area { margin-left: 0; width: 100%; }
.create-panel { margin-top: 0; width: 100%; }
.rd-list-table thead th,
.production-table thead th { background: #999; color: #fff; border-color: #999; }
.rd-list-table tbody td,
.production-table tbody td { font-weight: 700; }
.action-cell { display: table-cell; text-align: right; }
.action-cell form { display: inline-block; }
.compact-action { font-size: 16px; padding: 4px 8px; }
.business-hint { color: #e60012; font-weight: 800; font-size: 16px; }
.inline-hint { display: inline-block; margin-left: 12px; }
.business-panel .flash-wrap { margin: 0 0 12px; }

/* RD detail alignment */
.product-info-layout-v3 {
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 34px;
    align-items: start;
}
.product-media-card-v3 {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 18px;
    align-items: start;
}
.upload-stack { display: grid; grid-template-rows: auto auto; gap: 12px; }
.product-basic-card-v3 { width: 100%; }
.product-thumb { width: 110px; height: 165px; background: #000; }
.compact-upload {
    width: 250px;
    min-height: 128px;
    padding: 8px 10px;
}
.basic-form-grid-v3 {
    display: grid;
    grid-template-columns: auto 210px auto 210px auto 150px auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 14px;
}
.product-basic-card-v3 textarea { min-height: 96px; }
.module-row-v3 {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 28px;
    align-items: start;
}
.module-main-v3 { width: 100%; max-width: 1020px; }
.bom-form-grid-v3 {
    display: grid;
    grid-template-columns: auto 210px auto 210px auto 210px;
    gap: 12px 18px;
    align-items: center;
}
.bom-action-row-v3 { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; margin: 14px 0 20px; }
.bom-action-row-v3 button { width: 100%; border-radius: 0; }
.full-inline-table { width: 100%; margin-left: 0; }
.bom-fold summary { background: #d9d9d9; }
.bom-table thead th, .cost-table thead th { background: #999; color: #fff; }
.bom-table thead tr:nth-child(2) th, .cost-table thead tr:nth-child(2) th { background: #eee; color: #000; }
input[readonly] { background: #f7f7f7; }

/* Production pages */
.production-list-page .task-panels { margin: 10px 0 28px; }
.task-box { min-height: 150px; }
.task-box .mini-title { margin-top: 0; font-size: 20px; }
.production-detail-page .prototype-section { margin: 26px 0 34px; }
.section-line-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 2px solid #000;
    padding-bottom: 10px;
    margin-bottom: 14px;
}
.top-production-form {
    border: 0;
    padding: 0;
    margin: 0 0 12px;
}
.tight-row { gap: 8px 12px; margin-bottom: 10px; }
.size-row input { width: 58px; }
.top-production-form input { max-width: 190px; }
.calc-badge {
    display: inline-block;
    border: 2px solid #000;
    background: #d9d9d9;
    padding: 4px 10px;
    font-weight: 900;
}
.warning-banner {
    display: inline-block;
    background: #d9d9d9;
    color: #e60012;
    padding: 6px 12px;
    font-size: 20px;
    font-weight: 900;
}
.sample-guidance-panel textarea { min-height: 72px; margin: 8px 0 12px; }
.purchase-entry-head { display: flex; align-items: center; gap: 12px; margin: 14px 0 0; }
.sample-return-row { margin: 12px 0; }
.stock-line {
    border: 2px solid #000;
    background: #d9d9d9;
    padding: 6px 10px;
    margin: 8px 0;
    font-weight: 800;
}
.stock-form { margin-top: 10px; }
.stock-form input { width: 64px; }
.admin-cost-section { margin-top: 34px; }
.table-sm thead th, .table-sm tbody td { font-size: 15px; padding: 5px 7px; }

/* Finance pages */
.finance-page .panel-solid { margin-bottom: 24px; }

@media (max-width: 1300px) {
    .main { max-width: none; padding: 38px 32px 80px; }
    .product-info-layout-v3 { grid-template-columns: 380px 1fr; }
    .compact-upload { width: 220px; }
    .basic-form-grid-v3 { grid-template-columns: auto 170px auto 170px auto 130px auto; }
    .bom-form-grid-v3 { grid-template-columns: auto 180px auto 180px; }
}

/* ===== v4 annotated correction patch ===== */
:root { --content-width: 1280px; }
body { overflow-x: auto; }
.main { max-width: var(--content-width); }
.narrow-frame { max-width: 1180px; }
.micro-form label,
.micro-form input,
.micro-form select,
.micro-form textarea,
.micro-form button,
.micro-form .muted,
.micro-form a { font-size: 16px; line-height: 1.2; }
.micro-form input,
.micro-form select { min-height: 30px; padding: 3px 6px; }
.small-btn { font-size: 16px; line-height: 1.2; padding: 4px 9px; border-radius: 4px; white-space: nowrap; }
.tiny-delete { font-size: 14px; line-height: 1; padding: 3px 7px; border-radius: 3px; }
.panel-head { color:#fff; }
.flash-wrap { margin: 0 0 10px; }
.flash { font-size: 16px; padding: 7px 10px; display: inline-block; }

/* RD list action column anti-overflow */
.rd-list-table { table-layout: fixed; }
.rd-list-table th:nth-child(1){width:12%!important;}
.rd-list-table th:nth-child(2){width:16%!important;}
.rd-list-table th:nth-child(3){width:27%!important;}
.rd-list-table th:nth-child(4){width:13%!important;}
.rd-list-table th:nth-child(5){width:12%!important;}
.rd-list-table th:nth-child(6){width:20%!important;}
.rd-list-table .action-cell { white-space: nowrap; text-align: right; padding-right: 0; }
.rd-list-table .compact-action { font-size: 15px; padding: 3px 7px; margin-left: 3px; }

/* RD detail product info corrected proportion */
.product-info-layout-v4 {
  display: grid;
  grid-template-columns: 460px 1fr;
  gap: 30px;
  align-items: start;
}
.product-media-card-v4 {
  display: grid;
  grid-template-columns: 110px 160px 160px;
  gap: 12px;
  align-items: start;
  border: 1px solid transparent;
}
.product-media-card-v4 .compact-upload { width: 160px; min-height: 165px; padding: 7px; }
.product-media-card-v4 .compact-upload input[type=file] { width: 100%; border-width: 1px; }
.product-basic-card-v4 { max-width: 640px; }
.compact-business-panel { padding: 14px; }
.compact-business-panel .panel-head { margin: -14px -14px 12px; }
.basic-form-grid-v4 {
  display: grid;
  grid-template-columns: auto 180px auto 180px auto 120px auto;
  gap: 8px 10px;
  align-items: center;
  margin-bottom: 12px;
}
.product-basic-card-v4 textarea { min-height: 82px; }

/* RD BOM corrected dense layout */
.module-row-v4 {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 26px;
  align-items: start;
}
.module-main-v4 { width: 100%; max-width: 980px; }
.bom-form-grid-v4 {
  display: grid;
  grid-template-columns: 58px 190px 70px 190px 70px 190px;
  gap: 10px 14px;
  align-items: center;
}
.bom-form-grid-v4 label { text-align: left; margin: 0; font-weight: 800; }
.form-bottom-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; }
.business-hint.inline-hint { margin-left: 0; color: #e60012; font-size: 15px; }
.tax-incl-hint { font-size: 10px; color: #c2410c; font-weight: 600; letter-spacing: 0.3px; }
.bom-form-grid-v4 label .tax-incl-hint + br { display: none; }
.bom-fold summary { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.inline-delete-form { display:inline-block; margin:0; }
.bom-action-row-v4 { display:grid; grid-template-columns: 1fr 1fr; gap:70px; margin:14px 0 20px; }
.bom-action-row-v4 button { width:100%; border-radius:0; }
.color-bom-table thead th:first-child { position: relative; color:#777; }
.confirm-bom-mini { float:right; font-size:14px; padding:2px 7px; border-radius:3px; margin-top:-2px; }
.color-cell-input { width:100%; min-height:24px; font-size:15px; padding:2px 5px; color:#777; border:1px solid #000; }
.color-bom-edit-form { margin: 0; }

/* RD COST alignment */
.cost-entry-grid {
  display:grid;
  grid-template-columns: 52px 100px 52px 100px 70px;
  gap:8px 10px;
  align-items:center;
}
.cost-entry-grid label:nth-of-type(3) { grid-column: 1; }
.cost-entry-grid input[type=file] { min-height:28px; border-width:1px; }
.other-cost-grid {
  display:grid;
  grid-template-columns: 52px 150px 52px 160px 52px 90px 78px 120px 70px;
  gap:8px 10px;
  align-items:center;
}
.other-cost-grid label:nth-of-type(5) { grid-column: 1; }
.other-cost-grid input[type=file] { border-width:1px; }
.cost-table button { font-size:14px; padding:3px 7px; }

/* Production create form */
.create-production-grid {
  display:grid;
  grid-template-columns: 80px 260px 90px 220px 80px 220px 80px;
  gap:10px 12px;
  align-items:center;
}
.create-production-grid .assigned-to-readonly {
  grid-column: 1 / span 3;
  grid-row: 2;
  font-size: 13px;
  color: #4b5563;
  padding: 0 4px;
}
.create-production-grid .assigned-to-readonly b { color: #111827; }
.create-production-grid > button.small-btn[type="submit"] {
  grid-column: 4;
  grid-row: 2;
  width: 90px;
  justify-self: start;
}

/* 生产计划：产品检索选择（款号/名称简称） */
.product-search-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
}
.product-search-input {
  width: 100%;
  box-sizing: border-box;
}
.product-search-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 80;
  display: none;
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  max-height: 260px;
  overflow-y: auto;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14);
}
.product-search-dropdown.open { display: block; }
.product-search-item {
  display: flex;
  gap: 8px;
  align-items: baseline;
  padding: 6px 10px;
  font-size: 13px;
  line-height: 1.4;
  cursor: pointer;
}
.product-search-item .ps-code { font-weight: 600; white-space: nowrap; color: #111827; }
.product-search-item .ps-name {
  color: #6b7280;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.product-search-item:hover,
.product-search-item.active { background: #eef5ff; }
.product-search-empty {
  padding: 8px 10px;
  font-size: 12px;
  color: #9ca3af;
}
.product-search-error {
  grid-column: 5 / span 3;
  grid-row: 2;
  font-size: 12px;
  color: #dc2626;
  align-self: center;
}

/* Production detail top layout */
.production-top-block { margin-bottom: 18px; }
.production-basic-grid {
  display:grid;
  grid-template-columns: 58px 170px 75px 220px 85px 160px 88px 80px;
  gap:8px 10px;
  align-items:center;
  margin-bottom:8px;
}
.production-size-grid {
  display:grid;
  grid-template-columns: 28px 48px 28px 48px 28px 48px 28px 48px 58px 58px;
  gap:7px 8px;
  align-items:center;
  width:max-content;
}
.production-size-grid input { width:48px; }
.cut-grid { grid-template-columns: 110px 28px 48px 28px 48px 28px 48px 28px 48px 58px 58px; }
.purchase-rule-row { display:flex; justify-content:space-between; gap:16px; margin-bottom:10px; }
.warning-banner { font-size:16px; text-align:right; max-width:650px; }
.procurement-grid {
  display:grid;
  grid-template-columns: 86px 230px 100px 110px 70px 70px;
  gap:8px 10px;
  align-items:center;
}
.procurement-grid label:nth-of-type(3){ grid-column:1; grid-row:2; }
.procurement-grid input[name=tracking_no]{ grid-column:2; grid-row:2; }
.procurement-grid label:nth-of-type(4){ grid-column:1; grid-row:3; }
.procurement-grid input[name=payment_voucher]{ grid-column:2; grid-row:3; }
.procurement-grid label:nth-of-type(5){ grid-column:3; grid-row:3; }
.procurement-grid select[name=payment_method]{ grid-column:4; grid-row:3; }
.procurement-grid label:nth-of-type(6){ grid-column:5; grid-row:3; }
.procurement-grid input[name=supplier_voucher]{ grid-column:6 / span 1; grid-row:3; width:170px; }
.procurement-grid input[type=file]{ border-width:1px; }
.stock-grid {
  display:grid;
  grid-template-columns: 28px 58px 28px 58px 28px 58px 28px 58px 74px 74px;
  gap:8px 9px;
  align-items:center;
  margin-bottom:10px;
}
.stock-grid input { width:58px; }
.rework-grid { grid-template-columns: 28px 58px 28px 58px 28px 58px 28px 58px 110px; }
.sample-return-row input { max-width: 260px; }

@media (max-width: 1300px){
  .product-info-layout-v4 { grid-template-columns: 430px 1fr; }
  .product-media-card-v4 { grid-template-columns: 100px 145px 145px; }
  .product-media-card-v4 .compact-upload{ width:145px; }
  .basic-form-grid-v4 { grid-template-columns:auto 150px auto 150px auto 110px auto; }
  .bom-form-grid-v4 { grid-template-columns:58px 165px 70px 165px; }
}

/* ===== v5 annotated correction patch ===== */
:root { --content-width: 1280px; }

/* 研发列表：操作按钮靠近操作栏左侧，不再在宽列最右边漂移 */
.rd-list-table th:nth-child(1){width:12%!important;}
.rd-list-table th:nth-child(2){width:16%!important;}
.rd-list-table th:nth-child(3){width:30%!important;}
.rd-list-table th:nth-child(4){width:13%!important;}
.rd-list-table th:nth-child(5){width:12%!important;}
.rd-list-table th:nth-child(6){width:17%!important;}
.rd-list-table .action-cell {
  text-align: left !important;
  padding-left: 12px !important;
  padding-right: 0 !important;
  white-space: nowrap;
}
.rd-list-table .compact-action { margin-left: 0; margin-right: 6px; }
.rd-list-table .action-cell form { margin: 0 6px 0 0; }

/* 产品基础信息：款号、产品名第一排，季节第二排，备注第三排 */
.basic-form-grid-v5 {
  display: grid;
  grid-template-columns: 52px 200px 72px 1fr auto;
  gap: 14px 16px;
  align-items: start;
  margin-bottom: 0;
}
.basic-form-grid-v5 input,
.basic-form-grid-v5 textarea {
  width: 100%;
  box-sizing: border-box;
}
.basic-form-grid-v5 .basic-save-btn {
  grid-column: 5;
  grid-row: 1;
  justify-self: end;
  white-space: nowrap;
}
.basic-form-grid-v5 .season-label { grid-column: 1; grid-row: 2; }
.basic-form-grid-v5 .season-input { grid-column: 2; grid-row: 2; }
.basic-form-grid-v5 .remark-label {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 4px;
}
.basic-form-grid-v5 .remark-input {
  grid-column: 1 / -1;
  grid-row: 4;
  min-height: 82px;
  resize: vertical;
}
.basic-form-grid-v5 .remark-actions {
  grid-column: 1 / -1;
  grid-row: 5;
  text-align: right;
}
.product-basic-card-v4 { max-width: 740px; }

/* BOM 添加物料：固定内容宽度与按钮位置，展开后不改变页面比例 */
.module-main-v4 { max-width: 1020px; overflow: visible; }
#materialPanel { width: 100%; max-width: 1020px; }
.bom-form-grid-v4 {
  grid-template-columns: 70px 185px 82px 185px 82px 185px !important;
  gap: 12px 16px !important;
}
.bom-form-grid-v4 input { width: 100%; }
.form-bottom-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-top: 18px;
}
.form-bottom-row .small-btn { flex: 0 0 auto; }

/* 颜色BOM确认后：表头/提示栏转浅橙色，表示已确认 */
.color-bom-table.bom-confirmed thead tr:first-child th,
.color-bom-table.bom-confirmed thead tr:nth-child(2) th {
  background: #f6d6a8 !important;
  color: #000 !important;
}
.color-bom-table.bom-confirmed { border-color: #c98222; }
.confirm-bom-mini {
  float: right;
  font-size: 14px;
  padding: 3px 8px;
  border-radius: 3px;
}

/* 产品COST：按原型重新排布，避免文字和输入框挤压/遮挡 */
.cost-entry-grid-v5 {
  display: grid;
  grid-template-columns: 72px 170px 72px 170px 1fr 110px;
  gap: 12px 14px;
  align-items: center;
  width: 100%;
  max-width: 960px;
}
.cost-entry-grid-v5 > label { white-space: nowrap; margin: 0; }
.cost-entry-grid-v5 > input { width: 170px; }
.cost-entry-grid-v5 .cost-confirm-btn { grid-column: 6; grid-row: 1; justify-self: end; width: 90px; }
.file-card {
  border: 2px solid #000;
  min-height: 64px;
  padding: 6px 8px;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 4px 10px;
  background: #fff;
}
.file-card label { grid-column: 1 / span 2; margin: 0; white-space: nowrap; }
.file-card span { color: #000; font-size: 15px; white-space: nowrap; }
.file-card input[type=file] { width: 150px; min-height: 28px; padding: 2px; font-size: 14px; border-width: 1px; }
.cost-entry-grid-v5 .voucher-card { grid-column: 1 / span 3; grid-row: 2; }
.cost-entry-grid-v5 .supplier-card { grid-column: 1 / span 3; grid-row: 3; }
.pay-card {
  border: 2px solid #000;
  min-height: 64px;
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}
.pay-card label { margin: 0; white-space: nowrap; }
.pay-card select { width: 150px; min-height: 30px; }
.cost-entry-grid-v5 .pay-card { grid-column: 4 / span 2; grid-row: 2 / span 2; width: 190px; }

/* 其他费用：严格参考原型页，首排 类型/金额/确认，第二排 凭证/支付方式 */
.other-cost-grid-v5 {
  display: grid;
  grid-template-columns: 72px 220px 110px 260px 1fr 110px;
  gap: 14px 16px;
  align-items: start;
  width: 100%;
  max-width: 980px;
}
.other-cost-grid-v5 > label { margin: 0; white-space: nowrap; align-self: center; }
.other-cost-grid-v5 > select,
.other-cost-grid-v5 > input { width: 100%; }
.other-cost-grid-v5 .other-confirm-btn { grid-column: 6; grid-row: 1; width: 92px; justify-self: end; }
.other-cost-grid-v5 .other-voucher-card { grid-column: 1 / span 3; grid-row: 2; }
.other-cost-grid-v5 .other-pay-card { grid-column: 4 / span 2; grid-row: 2; width: 220px; }

/* 生产详情：货期需求保持一行；取消实际裁剪栏后的顶部排版 */
.production-basic-grid {
  grid-template-columns: 70px 190px 85px 230px 105px 170px 105px 80px !important;
  gap: 10px 12px !important;
  align-items: center;
}
.production-basic-grid label { white-space: nowrap; margin: 0; }
.production-basic-grid .target-date-label { white-space: nowrap; }
.production-basic-grid .target-date-input { width: 170px; }
.production-size-grid { margin-top: 8px; }
.cut-form-row, .cut-grid { display: none !important; }

@media (max-width: 1350px) {
  .basic-form-grid-v5 { grid-template-columns: 52px 185px 72px 1fr auto; }
  .bom-form-grid-v4 { grid-template-columns: 62px 165px 74px 165px !important; }
  .cost-entry-grid-v5 { grid-template-columns: 62px 150px 62px 150px 1fr 95px; }
  .other-cost-grid-v5 { grid-template-columns: 62px 190px 96px 220px 1fr 95px; }
}


/* ===== v6 correction patch ===== */
.login-card input::placeholder { color: transparent; }
.task-box p { font-size: 17px; line-height: 1.45; }
.production-list-page .task-box { min-height: 132px; }
#productionColorwaySelect option[hidden] { display: none; }
.stock-form.compact-stock-form { padding: 8px 10px; }
.compact-stock-form .stock-grid {
  grid-template-columns: 22px 46px 22px 46px 22px 46px 22px 46px 64px 64px;
  gap: 5px 6px;
  margin-bottom: 6px;
}
.compact-stock-form .rework-grid {
  grid-template-columns: 22px 46px 22px 46px 22px 46px 22px 46px 92px;
}
.compact-stock-form label,
.compact-stock-form input,
.compact-stock-form button { font-size: 13px; }
.compact-stock-form input { width: 46px; min-height: 24px; padding: 2px 4px; }
.compact-stock-form .small-btn { font-size: 13px; padding: 2px 5px; min-height: 24px; }

/* ===== v7 locked-usage correction patch ===== */
.bom-action-row-v7 {
  grid-template-columns: 1fr 1fr 1.25fr;
  gap: 14px;
}
.bom-head-actions {
  float: right;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.confirm-bom-mini.confirmed-btn {
  background: #9b9b9b !important;
  color: #fff !important;
}
.delete-bom-btn {
  background: #333 !important;
  color: #fff !important;
}
.required-missing,
input.required-missing,
select.required-missing,
textarea.required-missing {
  border: 2px solid #e60012 !important;
  background: #fff5f5 !important;
}
.form-inline-error {
  display: block;
  width: fit-content;
  margin: 0 0 10px 0;
  padding: 6px 12px;
  border: 2px solid #e60012;
  color: #e60012;
  background: #fff;
  font-weight: 900;
  font-size: 16px;
}
.cost-entry-grid-v5 .pay-card,
.other-cost-grid-v5 .other-pay-card {
  align-self: start;
  margin-top: 0 !important;
}
.pay-card label {
  display: block;
  margin-bottom: 6px;
  line-height: 1.1;
}
.urgent-red {
  color: #e60012;
  font-weight: 900;
}
.loss-rate-input {
  width: 74px;
  height: 26px;
  font-size: 14px;
  padding: 2px 4px;
}
.loss-adjust-row {
  margin-top: -14px;
  margin-bottom: 12px;
}
.accessory-confirm-row input {
  max-width: 360px;
}
@media (max-width: 1200px) {
  .bom-action-row-v7 { grid-template-columns: 1fr; }
  .bom-head-actions { float: none; margin-left: 8px; }
}

/* v8: inline business action message. Never uses global top flash position. */
.ajax-inline-message {
  display: inline-block;
  margin: 4px 0 8px 0;
  padding: 4px 10px;
  border: 1px solid #000;
  background: #f2f2f2;
  color: #000;
  font-size: 14px;
  line-height: 1.4;
}
.ajax-inline-message.success { background: #eeeeee; }
.ajax-inline-message.error { background: #fff3f3; color: #000; }

/* ===== v9 stability patch ===== */
/* Production list row actions: show business message in row and never rely on top flash. */
.production-table .action-cell { position: relative; vertical-align: middle; }
.row-inline-message {
  display: block;
  margin-top: 4px;
  min-height: 18px;
  font-size: 13px;
  line-height: 1.25;
  white-space: normal;
  text-align: left;
  font-weight: 900;
}
.row-inline-message.error { color: #e60012; }
.row-inline-message.success { color: #000; }

/* Production detail procurement guide: prevent loss-rate input from invading requirement columns. */
.production-detail-page .procurement-guide-table {
  table-layout: fixed !important;
  width: 100% !important;
  max-width: 100% !important;
}
.production-detail-page .procurement-guide-table th,
.production-detail-page .procurement-guide-table td {
  font-size: 14px !important;
  line-height: 1.25 !important;
  padding: 4px 5px !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  vertical-align: middle !important;
}
.production-detail-page .procurement-guide-table .loss-rate-input {
  width: 54px !important;
  max-width: 54px !important;
  min-width: 0 !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 1px 3px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  display: inline-block !important;
}
.production-detail-page .loss-adjust-row {
  margin-top: 6px !important;
  margin-bottom: 12px !important;
}


/* ===== v9.2 focused production/RD stability patch ===== */
.status-ready-production {
  color: #F28C28 !important;
  font-weight: 900 !important;
}
.production-top-with-image {
  display: grid;
  grid-template-columns: 120px 1fr;
  column-gap: 22px;
  align-items: start;
}
.production-style-image-card {
  width: 112px;
  min-height: 150px;
}
.production-style-image {
  width: 112px;
  height: 150px;
  object-fit: cover;
  border: 2px solid #000;
  background: #eee;
  display: block;
}
.production-style-placeholder {
  width: 112px;
  height: 150px;
  border: 2px solid #000;
  background: #e6e6e6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #777;
  font-size: 14px;
  font-weight: 800;
}
.production-top-form-with-image {
  min-width: 0;
}
.status-small-badge {
  font-size: 16px !important;
  line-height: 1.2 !important;
  min-height: 28px !important;
  padding: 3px 8px !important;
}
.sample-return-row .small-btn,
.accessory-confirm-row .small-btn {
  font-size: 16px !important;
  padding: 4px 9px !important;
}
.procurement-record-table {
  table-layout: fixed !important;
}
.procurement-record-table th,
.procurement-record-table td {
  font-size: 14px !important;
  padding: 4px 5px !important;
  line-height: 1.2 !important;
}
.procurement-delete-cell {
  text-align: center !important;
  white-space: nowrap !important;
}
.procurement-delete-cell form { margin: 0 !important; }
.procurement-grid-v92 {
  display: grid;
  grid-template-columns: 96px minmax(180px, 1.4fr) 100px 140px 92px minmax(160px, 1fr);
  gap: 12px 12px;
  align-items: center;
}
.procurement-grid-v92 label {
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.15;
}
.procurement-grid-v92 input,
.procurement-grid-v92 select {
  width: 100%;
  min-height: 30px;
  font-size: 16px;
}
.procurement-grid-v92 input[type=file] {
  padding: 2px 4px;
  font-size: 14px;
}
.procurement-submit-wrap {
  grid-column: 5 / 7;
  text-align: left;
}
.procurement-submit-btn {
  font-size: 15px !important;
  padding: 4px 8px !important;
  min-width: 82px;
}
.button-busy {
  background: #999 !important;
  border-color: #777 !important;
  color: #fff !important;
  cursor: not-allowed !important;
}
@media (max-width: 1200px) {
  .production-top-with-image { grid-template-columns: 1fr; row-gap: 14px; }
  .procurement-grid-v92 { grid-template-columns: 96px 1fr 96px 1fr; }
  .procurement-submit-wrap { grid-column: 1 / -1; }
}


/* ===== v9.3 finance bill confirmation ===== */
.bill-confirm-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.inline-form { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.bill-confirm-table th, .bill-confirm-table td { text-align: center; vertical-align: middle; }
.tiny-button { display: inline-block; background: #333; color: #fff; padding: 5px 8px; text-decoration: none; font-size: 14px; line-height: 1.1; border-radius: 2px; }
.small-title { font-size: 20px; margin-top: 18px; }


/* v9.5: clearer in-place feedback for AJAX buttons and instant product image refresh */
.ajax-button-feedback {
  display: inline-flex;
  align-items: center;
  margin-left: 10px;
  min-height: 24px;
  padding: 2px 8px;
  border: 1px solid #333;
  font-size: 14px;
  line-height: 1.2;
  background: #f5f5f5;
  color: #111;
  vertical-align: middle;
}
.ajax-button-feedback.success { border-color: #333; background: #e8e8e8; color: #111; }
.ajax-button-feedback.error { border-color: #f04438; color: #f04438; background: #fff; }
.button-busy { opacity: .65; cursor: not-allowed !important; }
.product-image-slot { width: 200px; min-height: 300px; display: flex; align-items: flex-start; justify-content: center; }
.product-thumb-empty { background: #000; width: 200px; height: 300px; }
.hidden { display: none !important; }

/* ===== v9.7 production detail/order/status refinements ===== */
.production-detail-page .production-basic-grid {
  grid-template-columns: auto 220px auto 300px auto 220px !important;
  align-items: center;
}
.production-detail-page .production-top-total-row {
  margin-top: 14px;
  margin-left: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-height: 40px;
}
.production-detail-page .order-total-badge-inline {
  min-width: 180px;
  text-align: left;
}
.production-detail-page .inline-red-note {
  color: #ff3b30;
  font-size: 15px;
  font-weight: 800;
  margin-left: 16px;
  white-space: nowrap;
}
.production-detail-page textarea.red-hint-placeholder::placeholder {
  color: #dc2626;
  opacity: 1;
  font-weight: 600;
}
.production-detail-page .btn-inline-hint {
  color: #6b7280;
  font-size: 13px;
  margin-right: 10px;
}
.production-detail-page .loss-adjust-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}
.production-list-page .urgent-item-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 8px 0;
}
.production-list-page .urgent-item-row p {
  margin: 0;
  flex: 1;
}
.production-list-page .urgent-dismiss-form {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.production-list-page .urgent-done-btn {
  font-size: 14px !important;
  padding: 2px 8px !important;
  white-space: nowrap;
}
.production-table .status-select-form {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.production-table .status-select {
  min-height: 28px !important;
  height: 30px !important;
  font-size: 15px !important;
  padding: 2px 5px !important;
  max-width: 108px;
}
.production-table .status-confirm-btn {
  font-size: 14px !important;
  padding: 3px 8px !important;
  min-height: 28px !important;
}
.production-table .status-in-production,
.production-table .status-in-production select,
.production-table .status-in-production span {
  color: #f28c28 !important;
  font-weight: 900;
}

/* ===== v9.8 RD detail media layout stabilization =====
   Fix: product image slot width was enlarged in v9.5, but the parent grid still
   used the older narrow columns, causing upload cards to overlap the image area.
*/
.rd-detail-page .product-info-layout-v4 {
  grid-template-columns: minmax(620px, 660px) minmax(660px, 1fr) !important;
  gap: 42px !important;
  align-items: start !important;
}

.rd-detail-page .product-media-card-v4 {
  display: grid !important;
  grid-template-columns: 200px 180px 180px !important;
  gap: 18px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 620px !important;
  overflow: visible !important;
}

.rd-detail-page .product-image-slot {
  width: 200px !important;
  min-width: 200px !important;
  height: 300px !important;
  min-height: 300px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: transparent !important;
}

.rd-detail-page .product-image-slot .product-thumb,
.rd-detail-page .product-image-slot .product-thumb-empty {
  width: 200px !important;
  height: 300px !important;
  min-width: 200px !important;
  min-height: 300px !important;
  object-fit: cover !important;
  display: block !important;
  background: #000 !important;
}

.rd-detail-page .product-media-card-v4 .compact-upload,
.rd-detail-page .product-media-card-v4 .upload-box {
  width: 180px !important;
  min-width: 180px !important;
  max-width: 180px !important;
  min-height: 180px !important;
  padding: 9px !important;
  overflow: hidden !important;
}

.rd-detail-page .product-media-card-v4 .compact-upload input[type=file] {
  width: 100% !important;
  max-width: 100% !important;
  font-size: 14px !important;
  overflow: hidden !important;
}

.rd-detail-page .product-media-card-v4 .compact-upload button {
  width: 100% !important;
  max-width: 100% !important;
  font-size: 16px !important;
  padding: 5px 8px !important;
  border-radius: 0 !important;
}

.rd-detail-page .product-basic-card-v4 {
  max-width: 760px !important;
  min-width: 0 !important;
}

@media (max-width: 1500px) {
  .rd-detail-page .product-info-layout-v4 {
    grid-template-columns: 620px minmax(560px, 1fr) !important;
    gap: 30px !important;
  }
  .rd-detail-page .product-basic-card-v4 { max-width: 700px !important; }
}

/* ===== BOM lifecycle status bar ===== */
.bom-lifecycle-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #888780;
  margin-bottom: 10px;
  padding: 6px 14px;
  background: #F1EFE8;
  border-radius: 6px;
  width: fit-content;
}
.bom-lifecycle-step {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.bom-lifecycle-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #B4B2A9;
  flex-shrink: 0;
}
.bom-lifecycle-dot.active-rnd { background: #378ADD; }
.bom-lifecycle-dot.active-bulk { background: #D85A30; }
.bom-lifecycle-dot.active-locked { background: #639922; }
.bom-lifecycle-connector {
  width: 18px;
  height: 1px;
  background: #B4B2A9;
  flex-shrink: 0;
}
.bom-lifecycle-step.active { color: #2C2C2A; font-weight: 500; }

/* Tooltip for disabled action buttons */
[data-tooltip] {
  position: relative;
}
[data-tooltip]:hover::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: #2C2C2A;
  color: #fff;
  font-size: 12px;
  padding: 5px 10px;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 100;
  pointer-events: none;
}
[data-tooltip]:hover::before {
  content: "";
  position: absolute;
  bottom: calc(100% + 1px);
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #2C2C2A;
  z-index: 100;
  pointer-events: none;
}

/* ===== v4 editorial redesign（参考 1818 达人运营台）=====
   衬线标题 + 重点/次重点层级 + 清晰留白，只覆盖视觉，不动布局 */
:root {
    --font-serif: Georgia, "Songti SC", "STSong", "SimSun", "Noto Serif SC", serif;
    --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    --ink: #151515;
    --body-text: #333333;
    --mid: #6c7177;
    --light: #92979c;
    --border: #d8dde1;
    --border-soft: #eceeed;
    --bg: #f6f8f7;
    --panel-bg: #ffffff;
    --head-bg: #f4f5f3;
    --accent: #c8102e;
    --highlight: #fff1cf;
    --title: 34px;
    --subtitle: 20px;
    --body: 16px;
}
html, body { font-family: var(--font-main); font-size: var(--body); color: var(--body-text); background: var(--bg); }
a { color: var(--ink); }

/* —— 侧边栏：白底细线，导航层级化 —— */
.sidebar { background: #ffffff; border-right: 1px solid var(--border-soft); padding: 40px 24px; }
.sidebar-title { font-family: var(--font-serif); font-size: 22px; font-weight: 700; color: var(--ink); letter-spacing: .02em; margin-bottom: 20px; }
.sidebar-user { font-size: 13px; color: var(--mid); font-weight: 400; margin: 10px 0 28px; }
.sidebar .button-light { font-size: 13px; padding: 4px 12px; border: 1px solid var(--border); background: #fff; color: var(--mid); border-radius: 4px; }
.sidebar-nav li { margin: 4px 0; }
.sidebar-nav a { display: block; font-size: 15px; font-weight: 400; color: var(--body-text); text-decoration: none; letter-spacing: .06em; padding: 9px 12px; border-left: 3px solid transparent; border-radius: 0 4px 4px 0; }
.sidebar-nav a:hover { background: var(--head-bg); }
.sidebar-nav a.active { color: var(--ink); font-weight: 700; background: var(--head-bg); border-left-color: var(--accent); }
.sidebar-nav a.muted { color: var(--light); }

/* —— 标题层级：重点 = 衬线大标题，次重点 = 灰色小字 —— */
.main { background: var(--bg); }
.page-title { font-family: var(--font-serif); font-size: var(--title); font-weight: 700; color: var(--ink); letter-spacing: .02em; margin: 0 0 8px; padding-bottom: 16px; border-bottom: 1px solid var(--border-soft); }
.section-title { font-family: var(--font-serif); font-size: var(--subtitle); font-weight: 700; color: var(--ink); border: none; border-left: 4px solid var(--ink); padding: 2px 0 2px 12px; margin: 36px 0 14px; background: transparent; }
.subbar { border-bottom: 1px solid var(--border); padding-bottom: 12px; }
h1, h2, h3, .card h3 { font-family: var(--font-serif); color: var(--ink); }
.note, .muted, .business-hint { color: var(--light); font-size: 13px; font-weight: 400; }

/* —— 面板与卡片：细边框白底 —— */
.panel, .panel-solid { border: 1px solid var(--border); background: var(--panel-bg); border-radius: 6px; }
.panel { border-style: solid; }
.panel-head { background: var(--ink); color: #fff; font-size: 14px; font-weight: 600; letter-spacing: .08em; padding: 8px 12px; border-radius: 5px 5px 0 0; }
.card { border: 1px solid var(--border); background: var(--panel-bg); border-radius: 6px; min-height: 110px; }
.card h3 { font-size: 15px; font-weight: 700; color: var(--mid); font-family: var(--font-main); }
.card .amount { font-family: var(--font-serif); font-size: 30px; font-weight: 700; color: var(--ink); }
.upload-box { border: 1px dashed var(--border); border-radius: 6px; background: var(--panel-bg); }

/* —— 表格：细线、灰底表头、小字号层级 —— */
table { border: 1px solid var(--border); background: var(--panel-bg); }
thead th { font-size: 13px; font-weight: 700; color: var(--mid); letter-spacing: .06em; border: 1px solid var(--border); background: var(--head-bg); padding: 9px 10px; }
tbody td { font-size: 15px; color: var(--body-text); border: 1px solid var(--border-soft); padding: 9px 10px; }
tbody tr:hover td { background: #fafbfa; }
.rd-list-table thead th { background: var(--head-bg); color: var(--mid); border-color: var(--border); font-size: 13px; }
.rd-list-table tbody td { font-weight: 400; padding: 12px 8px; border-bottom: 1px solid var(--border-soft); }
.table-sm thead th, .table-sm tbody td { font-size: 13px; }
.bom-table thead th, .cost-table thead th { background: var(--head-bg); color: var(--mid); }
.plain-status { font-weight: 700; color: var(--ink); }

/* —— 按钮与表单：主按钮深黑，次按钮白底灰边 —— */
button, .button { font-size: 14px; font-weight: 600; border: 1px solid var(--ink); background: var(--ink); color: #fff; border-radius: 4px; padding: 7px 16px; }
button:hover, .button:hover { background: #000; box-shadow: none; }
.button-light { background: #fff; color: var(--ink); border-color: var(--border); }
.button-light:hover { background: var(--head-bg); }
button:disabled, .button.disabled { background: #eceeed; border-color: #eceeed; color: var(--light); }
.compact-action { padding: 4px 10px; font-size: 13px; border-radius: 3px; }
.bar-button { border-radius: 4px; }
label { font-size: 14px; font-weight: 600; color: var(--ink); }
input, select, textarea { font-size: 15px; color: var(--body-text); border: 1px solid var(--border); background: #fff; border-radius: 4px; min-height: 34px; padding: 5px 9px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 2px rgba(21,21,21,.08); }

/* —— 状态与提示 —— */
.flash { border: 1px solid var(--border); border-radius: 4px; font-weight: 600; font-size: 14px; }
.flash.success { background: var(--head-bg); color: var(--ink); }
.flash.error { background: #f9e7e7; color: var(--accent); border-color: #ecc9c9; }
.inline-flash { border: 1px solid var(--border); border-radius: 4px; font-size: 14px; }
.inline-flash.error { color: var(--accent); background: #f9e7e7; }
.status-pill { border: 1px solid var(--ink); border-radius: 999px; font-size: 12px; font-weight: 700; padding: 2px 10px; }
.divider, .prototype-line { border-top: 1px solid var(--border-soft); }
.chart-bars { border: 1px solid var(--border); border-radius: 6px; background: var(--panel-bg); }
.chart-bar { border: 1px solid var(--ink); font-size: 13px; }
.pie-list { border: 1px solid var(--border); border-radius: 6px; background: var(--panel-bg); }
.pie-list div { border-bottom: 1px solid var(--border-soft); }

/* —— 登录页 —— */
.login-shell { background: var(--bg); }
.login-card { border: 1px solid var(--border); border-radius: 8px; background: #fff; box-shadow: 0 8px 30px rgba(21,21,21,.06); }
.login-card h1 { font-family: var(--font-serif); font-size: 30px; font-weight: 700; color: var(--ink); }

/* ===== v4.1 补丁：残余灰色组件统一 ===== */
.prototype-toggle-bar { background: var(--ink); color: #fff; border: 1px solid var(--ink); border-radius: 4px; font-size: 15px; font-weight: 600; letter-spacing: .08em; min-height: 42px; }
.prototype-toggle-bar:hover { background: #000; }
.filter-label { background: transparent; border: none; padding: 0; font-size: 13px; font-weight: 700; color: var(--mid); letter-spacing: .08em; }
.production-table thead th { background: var(--head-bg); color: var(--mid); border-color: var(--border); font-size: 13px; letter-spacing: .06em; }
.production-table tbody td { font-weight: 400; }

/* ===== 针织面料 BOM（2026-08-31）===== */
.fabric-category-select { width: 100%; }
.knit-fields {
  margin: 10px 0 4px;
  padding: 10px 12px;
  border: 1px dashed var(--border);
  border-radius: 4px;
  background: #fafaf8;
}
.knit-fields.hidden { display: none; }
.knit-fields-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: .06em;
  margin-bottom: 8px;
}
.knit-fields-sub {
  font-size: 11px;
  font-weight: 400;
  color: var(--mid);
  letter-spacing: 0;
  margin-left: 6px;
}
.knit-calc-result {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft);
  font-size: 12px;
  color: var(--mid);
}
.knit-calc-result b { color: var(--ink); font-size: 13px; }
.knit-calc-result .knit-per-meter { width: 100%; }
.knit-calc-result .knit-per-meter b { color: #c2410c; }
.knit-calc-result .knit-formula {
  width: 100%;
  font-size: 11px;
  color: #9a9a92;
  letter-spacing: 0;
}
.knit-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: var(--ink);
  border-radius: 2px;
  padding: 1px 5px;
  margin-left: 4px;
  letter-spacing: .05em;
  vertical-align: middle;
}
.knit-detail-line, .knit-result-line {
  grid-column: 1 / -1;
  font-size: 12px;
  color: var(--mid);
  line-height: 1.6;
}
.knit-result-line b { color: #c2410c; }

/* 物料类别徽章：针织黑 / 采购款琥珀 / 纱线蓝（2026-08-31）*/
.cat-badge-knit { background: var(--ink); }
.cat-badge-purchase { background: #b45309; }
.cat-badge-yarn { background: #1d4ed8; }

/* ---- 研发中心：简洁 / 成本 双视角切换（2026-08-31）---- */
.view-switch-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 0 4px;
}
.view-tab {
  font-size: 13px;
  padding: 5px 16px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--mid);
  background: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.view-tab:hover { border-color: var(--ink); color: var(--ink); }
.view-tab-active {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.view-tab-active:hover { color: #fff; }
.view-switch-hint {
  font-size: 12px;
  color: var(--mid);
  line-height: 1.5;
  flex: 1 1 240px;
}

.rd-list-table-cost { table-layout: fixed; }
.rd-list-table-cost td { vertical-align: top; }
.supplier-cell { line-height: 1.5; }
.supplier-tag {
  display: inline-block;
  font-size: 11px;
  line-height: 1.5;
  padding: 1px 6px;
  margin: 0 4px 3px 0;
  border-radius: 3px;
  background: #f3f4f6;
  border: 1px solid var(--border);
  color: #374151;
  white-space: nowrap;
}
.cost-cell { white-space: nowrap; }
.rd-list-table-cost tfoot td {
  border-top: 2px solid var(--border);
  background: #fafafa;
}

/* ===== 研发中心 · 总览视角（2026-09-03）：小图 + 中文状态 + 供应商单耗堆叠 ===== */
.rd-list-overview td { vertical-align: middle; }
.thumb-cell { padding: 4px 6px; }
.rd-thumb {
  display: block;
  width: 30px;
  height: 40px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border, #ddd);
  background: #f5f5f5;
}
.rd-thumb-empty { background: #ececec; }
.style-cell .style-code { font-weight: 600; }
.style-cell .style-name { font-size: 12px; color: #8a8a8a; margin-top: 2px; }
.cons-cell { padding: 4px 8px; min-width: 0; }
.cons-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  line-height: 1.7;
  font-size: 12px;
  white-space: nowrap;
}
.cons-sup {
  max-width: 11em;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #333;
}
.cons-part { color: #9a9a9a; }
.cons-part:not(:empty)::before { content: "· "; }
.cons-qty {
  margin-left: auto;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #1f6f43;
}
.cons-details summary {
  font-size: 12px;
  color: #8a8a8a;
  cursor: pointer;
  user-select: none;
}
.cons-details summary:hover { color: #1f6f43; }

/* ===== BOM 物料行：预估成本小字（2026-09-03）===== */
.est-cost { font-size: 12px; color: #1f6f43; }
.est-cost b, .knit-est-cost b { font-weight: 600; }
.knit-est-cost { color: #1f6f43; }

/* 针织试算区：待算原因提示（2026-09-03） */
.knit-warn { color: #c0392b; font-size: 12px; }
.knit-warn:empty { display: none; }

/* ===== SKC/颜色BOM 颜色标识点（2026-09-03）：色点跟随产品颜色 ===== */
.color-swatch {
  display: inline-block;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
  vertical-align: -2px;
  margin-right: 4px;
}

/* ===== SKC 按大版本分组隔断（2026-09-03）：产品BOM 2.0 / 1.0 ===== */
.major-version-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 20px 0 10px;
}
.major-version-divider .mv-label {
  font-weight: 700;
  font-size: 14px;
  color: #24303f;
  background: #eaf1f8;
  border-left: 4px solid #378ADD;
  padding: 4px 14px;
  border-radius: 2px;
  white-space: nowrap;
}
.major-version-divider .mv-badge {
  font-size: 12px;
  color: #1f6f43;
  border: 1px solid #1f6f43;
  border-radius: 10px;
  padding: 1px 9px;
  white-space: nowrap;
}
.major-version-divider::after {
  content: "";
  flex: 1;
  border-top: 1px dashed #c2ccd8;
}

/* 辅料类别徽标（2026-09-03）：单位手填、价格单位=用量单位 */
.cat-badge-accessory { background: #7c3aed; }