/* Shared field rhythm. Labels containing controls always stack vertically. */
:is(#conFilter,.form-grid,.import-controls,.import-sheet-head,.mapping-grid) > label {
 display:flex; flex-direction:column; gap:6px; min-width:0;
 color:#435d70; font-size:14px;
}
:is(#conFilter,.form-grid,.import-controls,.import-sheet-head,.mapping-grid) > label > :is(input,select,textarea) {
 display:block; width:100%; max-width:100%; min-width:0; margin:0;
}
input,select,textarea {min-width:0;max-width:100%}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select {height:44px}
.field,.form-grid > *,.detail-grid > *,.import-controls > *,.mapping-grid > * {min-width:0}
.field label {line-height:1.5}
#conFilter {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;gap:16px;padding:20px}
#conFilter {align-items:start}
#conFilter input {width:100%;max-width:100%}
.filter-actions {grid-column:1/-1;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.filter-actions button {min-width:108px}
.page-heading > div,.panel-head > *,.dialog-head > div {min-width:0}
.page-heading,.panel-head {flex-wrap:wrap}
.page-heading .actions {margin-left:auto}
.panel-head h2,.panel-head h3,.dialog-head h2 {overflow-wrap:anywhere}
.panel-head .actions {flex-shrink:0;max-width:100%}
.dialog-head > button {flex-shrink:0}
.note,.panel-body p,.import-note,.kpi b {overflow-wrap:anywhere}
.table-wrap {max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
td:last-child:has(button) {max-width:none;overflow:visible;white-space:nowrap}
dialog {max-height:calc(100dvh - 32px);overscroll-behavior:contain}
dialog .panel-body .form-grid {padding:18px 0}
#workflowDialog .panel-head,#conDialog .panel-head {position:sticky;top:0;background:#fff;z-index:2}
#workflowDialog .panel-body > p,#conDialog .panel-body > p {margin:12px 0}
#workflowDialog .error,#conDialog .error {margin:12px 0}
.dialog-actions {flex-wrap:wrap}
button:disabled {cursor:not-allowed}
.mobile-navigation {display:none}
@media(max-width:1200px) {
 #conFilter {grid-template-columns:repeat(3,minmax(0,1fr))}
 .import-controls {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px) {
 .topbar {height:auto;min-height:76px;flex-wrap:wrap;padding:14px 20px;gap:12px;position:static}
 .top-actions {flex-wrap:wrap;margin-left:auto}
 .sidebar {top:0;height:100dvh}
 .tabs {top:0}
}
@media(max-width:720px) {
 body {font-size:14px}
 .topbar {padding:12px 14px;gap:12px}
 .brand {min-width:0;max-width:100%;gap:9px}
 .brand b {font-size:17px}
 .brand small {font-size:9px;letter-spacing:.08em}
 .mark {width:38px;height:38px;flex-shrink:0}
 .top-actions {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}
 .top-actions button {padding:8px 4px;font-size:13px;min-height:44px}
 .top-actions .badge,.top-actions .version {display:none}
 .mobile-navigation {display:flex;align-items:center;gap:12px;background:#fff;border-bottom:1px solid var(--line);padding:10px 14px}
 .mobile-navigation label {white-space:nowrap;color:var(--muted);font-size:13px}
 .mobile-navigation select {flex:1;width:0;min-height:44px}
 .sidebar {display:none}
 .tabs {position:static;height:52px;padding:6px 12px 0;max-width:100vw}
 .tab {flex:none;padding:5px 10px;gap:6px}
 .tab-close {min-width:32px;min-height:36px}
 main {padding:16px 12px;min-width:0}
 h1 {font-size:23px}h2 {font-size:18px}
 .page-heading {gap:14px;margin-bottom:18px;align-items:stretch}
 .page-heading .actions {margin-left:0;width:100%;display:flex;gap:8px}
 .page-heading .actions > button {flex:1 1 130px;min-height:44px;white-space:normal}
 #conFilter {grid-template-columns:repeat(2,minmax(0,1fr));padding:16px;gap:14px}
 .filter-actions {justify-content:stretch}
 .filter-actions button {flex:1;min-height:44px;min-width:0}
 .toolbar {padding:14px;align-items:stretch}
 .toolbar > input,.toolbar > .actions {width:100%;min-width:0}
 .toolbar .actions > select {width:100%}
 input,select,textarea {font-size:16px;min-height:44px}
 input[type=checkbox] {width:22px!important;height:22px;min-height:22px!important;accent-color:var(--blue)}
 .panel-head {align-items:flex-start;gap:10px;padding:14px}
 .panel-head .actions {width:100%}
 .panel-head .actions button {flex:1 1 140px;min-height:44px}
 .panel-body {padding:16px}
 .kpi b,#detailContent .kpi b {font-size:clamp(18px,4.8vw,23px);line-height:1.4}
 .kpi {min-width:0;padding:12px}
 .quick-grid {gap:8px}.quick {min-width:0}
 .table-wrap th,.table-wrap td {padding:12px}
 .table-wrap[data-scrollable]::before {content:'左右滑动查看完整表格 →';display:block;position:sticky;left:0;padding:8px 12px;font-size:12px;color:var(--blue);background:#f2f8fc;width:100%;box-sizing:border-box}
 .table-wrap td button {min-height:44px;padding:8px}
 .table-wrap:focus-visible {outline:2px solid var(--blue);outline-offset:-2px}
 dialog,#detail,#importDialog {width:calc(100vw - 16px);max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);margin:auto;border-radius:12px}
 .dialog-head {padding:14px;gap:10px}
 .dialog-head .icon-button {min-height:44px;min-width:44px}
 .form-grid {padding:16px;gap:16px;grid-template-columns:minmax(0,1fr)}
 .detail-grid {grid-template-columns:minmax(0,1fr)}
 #detailContent {padding:12px}
 .dialog-actions {padding:12px;gap:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .dialog-actions button {min-height:44px;flex:1}
 #importFromEditor {flex-basis:100%;margin:0}
 #conSave,#workflowSubmit {width:100%;min-height:44px}
 #conClose,#workflowClose {min-height:44px}
 .import-body {padding:14px}
 .import-controls,.import-sheet-head {grid-template-columns:minmax(0,1fr)}
 .import-sheet-head > div {grid-column:auto}
 .import-controls > button {min-height:44px}
 .mapping-grid {grid-template-columns:minmax(0,1fr)}
 .import-drop {padding:14px}
 .import-drop input {padding:8px;font-size:14px}
 .import-sheet-head {gap:14px;padding:14px}
 .mapping-details {padding:14px}
 .import-summary {gap:8px;padding:12px}
 #toast {bottom:max(16px,env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 24px);padding:12px 16px;overflow-wrap:anywhere}
 .error {margin:0 16px 14px}
}
@media(max-width:420px) {
 #conFilter {grid-template-columns:minmax(0,1fr)}
 .quick-grid {grid-template-columns:minmax(0,1fr)}
 .dashboard-head {padding:14px}
}

/* Original factory logo exported from the supplied PSD; keep its aspect ratio. */
.mark.factory-logo{display:block;object-fit:contain;width:53px;height:43px;border-radius:0;background:transparent;box-shadow:none;flex-shrink:0}
@media(max-width:720px){.mark.factory-logo{width:47px;height:38px}}

.record-image{display:block;max-width:120px;max-height:90px;object-fit:contain} #templateDialog{width:min(780px,calc(100vw - 16px))} #templatePreview{margin:0 20px 16px} #templateDialog label{display:flex;flex-direction:column;gap:6px} #templateDialog input[type=checkbox]{width:auto;align-self:flex-start}
/* SKU identity is consistent across catalogues, operations and finance. */
.sku-card{display:flex;align-items:center;gap:12px;min-width:190px;max-width:360px;margin:6px 0;text-align:left;white-space:normal}.sku-photo,.sku-placeholder{width:64px;height:64px;flex:0 0 64px;border:1px solid #dae5ed;border-radius:10px;background:#f6f9fc;overflow:hidden;padding:3px;display:flex;align-items:center;justify-content:center}.sku-photo img{width:100%;height:100%;object-fit:contain}.sku-placeholder{font-size:11px;color:#7891a4}.sku-copy{display:flex;flex-direction:column;gap:3px;min-width:0;overflow-wrap:anywhere}.sku-copy b{font-size:13px;color:#1268a5}.sku-copy small{color:#768b9c}.sku-selection:empty{display:none}.sku-selection{margin-top:8px}.item-pick-trigger{margin-top:8px}#itemPickerDialog{width:min(940px,calc(100vw - 24px));padding:0}#itemPhotoDialog{width:min(800px,calc(100vw - 24px));padding:16px}.item-picker-body{padding:16px}.item-picker-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:16px}.item-choice{border:1px solid #dce6ef;border-radius:12px;padding:12px}.item-choice .sku-card{max-width:100%;min-width:0}.item-choice>button{width:100%;margin-top:8px}.sku-enlarged{display:block;max-width:100%;max-height:70vh;object-fit:contain;margin:auto}.field:has(input[data-image-field]){grid-column:1/-1}.record-image{max-width:160px;max-height:140px;object-fit:contain}.sku-copy>span{line-height:1.4}
@media(max-width:600px){.sku-photo,.sku-placeholder{width:54px;height:54px;flex-basis:54px}.item-picker-grid{grid-template-columns:1fr}.sku-selection .sku-card{min-width:0}.sku-card{max-width:280px}}
.product-bom{border:1px solid #dce7ef;padding:18px;border-radius:12px;background:#f8fbfe}.product-bom>p{color:#6d8496;line-height:1.6}.bom-edit-row{display:grid;grid-template-columns:minmax(200px,2fr) 1fr 1fr;gap:12px;padding:16px 0;border-bottom:1px solid #dde7f0}.bom-edit-row .field{min-width:0}.bom-edit-row button{align-self:end}#addProductMaterial{margin-top:12px}@media(max-width:650px){.bom-edit-row{grid-template-columns:1fr}.product-bom{padding:12px}}

/* Latest catalogue material prices drive the product's per-piece cost preview. */
.bom-cost-metrics{display:flex;flex-wrap:wrap;gap:10px 20px;align-self:center;min-width:0}
.bom-cost-metrics>div{display:flex;flex-direction:column;min-width:0;gap:3px}
.bom-cost-metrics span{font-size:12px;color:var(--muted)}
.bom-cost-metrics b{font-size:14px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bom-cost-summary{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 18px;margin-top:16px;padding:14px 16px;border:1px solid #cbe1ee;border-radius:9px;background:#edf6fc;color:#375f79}
.bom-cost-summary>b{font-size:20px;color:var(--blue);font-variant-numeric:tabular-nums}
.bom-cost-summary>small{flex-basis:100%;color:var(--muted)}
.bom-cost-summary:not([data-cost-status="ready"])>b{font-size:16px;color:var(--muted)}
.product-bom>.bom-cost-formula{margin-top:8px;font-size:12px;overflow-wrap:anywhere}
@media(max-width:650px){.bom-cost-metrics{gap:12px 24px}.bom-cost-summary{padding:12px}.bom-cost-summary>b{font-size:18px}}