/* Shared foundation and components for every ERP page. */
.auth-panel { color:var(--color-login-text); background:var(--color-login-panel); padding:var(--space-12); border-radius:var(--login-art-radius); }
.rail:has(.system-settings-entry) { display:flex; flex-direction:column; }
.rail:has(.system-settings-entry) > button { flex-shrink:0; }
.rail .system-settings-entry { position:sticky; bottom:0; margin-top:auto; flex-shrink:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-1); padding:var(--space-3) var(--space-1); min-height:var(--control-height-lg); color:var(--color-text-secondary); background:var(--color-bg); border-top:1px solid var(--color-divider); text-decoration:none; }
.rail .system-settings-entry:hover { color:var(--color-link); background:var(--color-primary-bg); }
.auth-form { display:grid; gap:var(--space-4); }
.auth-form label { display:grid; gap:var(--space-2); }
.auth-form .auth-password { display:flex; gap:var(--space-2); }
.auth-form .auth-password input { flex:1; width:0; }
.auth-form .auth-submit { width:100%; background:var(--color-login-button); border-color:var(--color-login-button); color:var(--color-bg); }
.auth-form .auth-submit:hover:not(:disabled) { background:var(--color-login-button-hover); border-color:var(--color-login-button-hover); color:var(--color-bg); }
.auth-status { color:var(--color-login-muted); min-height:var(--line-height-body); overflow-wrap:anywhere; }
.auth-session { position:fixed; right:var(--space-4); bottom:var(--space-4); display:flex; gap:var(--space-2); align-items:center; padding:var(--space-2); border:1px solid var(--color-border); background:var(--color-bg); border-radius:var(--radius); z-index:100; box-shadow:var(--shadow-popup); }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { font-family: var(--font-family); }
body { margin: 0; color: var(--color-text); background: var(--color-bg-layout); font-size: var(--font-size-body); line-height: var(--line-height-body); font-weight: var(--font-weight-normal); }
button, input, select, textarea { font: inherit; color: inherit; }
button, input, select, textarea, a { -webkit-tap-highlight-color: transparent; }
button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1); min-height: var(--control-height); padding: var(--space-1) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg); white-space: nowrap; cursor: pointer; transition: border-color var(--motion-fast), background var(--motion-fast), color var(--motion-fast); }
button:hover:not(:disabled) { color: var(--color-link); border-color: var(--color-primary); }
button:active:not(:disabled) { border-color: var(--color-primary-active); }
button.primary { color: var(--color-bg); border-color: var(--color-primary); background: var(--color-primary); }
button.primary:hover:not(:disabled) { color: var(--color-bg); border-color: var(--color-primary-hover); background: var(--color-primary-hover); }
button.primary:active:not(:disabled) { background: var(--color-primary-active); border-color: var(--color-primary-active); }
button.danger { color: var(--color-error); border-color: var(--color-error-fill); background: var(--color-bg); }
button.danger:hover:not(:disabled) { color: var(--color-bg); background: var(--color-error-fill); border-color: var(--color-error-fill); }
button.danger.primary { color: var(--color-bg); background: var(--color-error-fill); border-color: var(--color-error-fill); }
button.icon-button { width: var(--control-height); padding: var(--space-1); }
button:disabled, input:disabled, select:disabled, textarea:disabled { color: var(--color-disabled-text); background: var(--color-bg-disabled); border-color: var(--color-border); cursor: not-allowed; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { min-width: 0; min-height: var(--control-height); padding: var(--space-1) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg); line-height: var(--line-height-body); }
input::placeholder, textarea::placeholder { color: var(--color-placeholder); opacity: 1; }
input:not(:disabled):hover, select:not(:disabled):hover, textarea:not(:disabled):hover { border-color: var(--color-primary-hover); }
input:disabled, select:disabled, textarea:disabled { background: var(--color-bg-disabled); }
input[type="checkbox"], input[type="radio"] { appearance: none; width: 16px; height: 16px; flex: 0 0 16px; padding: 0; margin: 3px 0; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-bg); cursor: pointer; position: relative; }
input[type="radio"] { border-radius: 50%; }
input[type="checkbox"]:checked { border-color: var(--color-primary); background: var(--color-primary); }
input[type="checkbox"]:checked::after { content: ""; position: absolute; width: 5px; height: 9px; top: 1px; left: 4px; border: solid var(--color-bg); border-width: 0 2px 2px 0; transform: rotate(45deg); }
input[type="radio"]:checked { border-color: var(--color-primary); }
input[type="radio"]:checked::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--color-primary); }
input[type="checkbox"]:disabled, input[type="radio"]:disabled { background: var(--color-bg-disabled); cursor: not-allowed; }
:where(button, input, select, textarea, a, summary, tr[tabindex], th[tabindex]):focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; box-shadow: var(--focus-ring); }
a { color: var(--color-link); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, p, dl { margin: 0; }
h1, .page-title { font-size: var(--font-size-page); line-height: var(--line-height-page); font-weight: var(--font-weight-strong); }
h2, .section-title { font-size: var(--font-size-title); line-height: var(--line-height-title); font-weight: var(--font-weight-strong); }
h3 { font-size: var(--font-size-body); line-height: var(--line-height-body); font-weight: var(--font-weight-medium); }
p + p { margin-top: var(--space-2); }
.muted, .form-note { color: var(--color-text-secondary); }
.caption { color: var(--color-text-muted); font-size: var(--font-size-sm); line-height: var(--line-height-sm); }
.numeric { font-variant-numeric: tabular-nums; }
.icon { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; flex: 0 0 16px; }
.tag { display: inline-block; padding: 0 var(--space-2); margin: 2px var(--space-1) 2px 0; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-bg-subtle); color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-sm); white-space: nowrap; }
.tag.data-value { font-size: var(--font-size-body); line-height: var(--line-height-body); }
.tag.success { color: var(--color-success); background: var(--color-success-bg); border-color: var(--color-success); }
.tag.warning { color: var(--color-warning); background: var(--color-warning-bg); border-color: var(--color-warning); }
.tag.error { color: var(--color-error); background: var(--color-error-bg); border-color: var(--color-error-fill); }
table { border-collapse: separate; border-spacing: 0; font-size: var(--font-size-body); line-height: var(--line-height-body); }
.resource-switch { position: relative; width: var(--cost-switch-width); min-width: var(--cost-switch-width); height: var(--cost-switch-height); min-height: var(--cost-switch-height); justify-content: flex-end; border: 0; padding: 0; border-radius: var(--cost-switch-height); background: var(--color-disabled-text); color: var(--color-bg); text-align: right; padding-right: var(--space-2); }
.resource-switch::after { content: ''; position: absolute; top: calc((var(--cost-switch-height) - var(--cost-switch-knob)) / 2); left: calc((var(--cost-switch-height) - var(--cost-switch-knob)) / 2); width: var(--cost-switch-knob); height: var(--cost-switch-knob); background: var(--color-bg); border-radius: 50%; }
.resource-switch[aria-checked="true"] { background: var(--color-primary); justify-content: flex-start; text-align: left; padding-left: var(--space-2); }
.resource-switch[aria-checked="true"]::after { left: calc(var(--cost-switch-width) - var(--cost-switch-knob) - (var(--cost-switch-height) - var(--cost-switch-knob)) / 2); }
.resource-section-title { display: flex; align-items: center; gap: var(--space-4); margin: var(--space-6) 0; font-size: var(--font-size-title); line-height: var(--line-height-title); font-weight: var(--font-weight-medium); }
.resource-section-title::after { content: ''; flex: 1; border-top: 1px solid var(--color-border); }
.resource-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3) var(--space-6); }
.resource-form-grid > label { display:flex; align-items:center; gap:var(--space-2); min-width:0; }
.resource-form-grid > label > span:first-child { flex:0 0 120px; text-align:right; }
.resource-form-grid input:not([type="radio"]):not([type="checkbox"]), .resource-form-grid select { width:100%; min-width:0; }
.resource-form-grid .full { grid-column:1/-1; }
.resource-required { color:var(--color-error); margin-right:var(--space-1); }
.resource-upload { width:calc(var(--space-12) * 2); height:calc(var(--space-12) * 2); border:1px dashed var(--color-border); background:var(--color-bg-subtle); display:flex; flex-direction:column; }
.resource-image-preview { max-width:calc(var(--space-12) * 3); max-height:calc(var(--space-12) * 3); object-fit:contain; }
.resource-segment { display:flex; align-items:center; }
.resource-segment button { border-radius:0; }
.resource-segment button:first-child { border-radius:var(--radius) 0 0 var(--radius); }
.resource-segment button:last-child { border-radius:0 var(--radius) var(--radius) 0; }
.resource-radio-group { display:flex; gap:var(--space-4); align-items:center; flex-wrap:wrap; }
.resource-radio-group label { display:flex; gap:var(--space-2); align-items:center; }
@media (max-width:640px) { .resource-form-grid { grid-template-columns:1fr; } }
.resource-flag::before { content: '⚑'; margin-right: var(--space-1); color: var(--flag-color, var(--flag-none)); }
.resource-flag[data-flag="红色旗帜"] { --flag-color: var(--flag-red); }
.resource-flag[data-flag="黄色旗帜"] { --flag-color: var(--flag-yellow); }
.resource-flag[data-flag="绿色旗帜"] { --flag-color: var(--flag-green); }
.resource-flag[data-flag="蓝色旗帜"] { --flag-color: var(--flag-blue); }
.resource-flag[data-flag="紫色旗帜"] { --flag-color: var(--flag-purple); }
th { height: var(--space-12); vertical-align: middle; font-weight: var(--font-weight-normal); }
tbody td { height: var(--table-row-height); }
th, td { padding: var(--space-3); text-align: left; border-bottom: 1px solid var(--color-divider); }
th { color: var(--color-text); background: var(--color-primary-bg); }
td.numeric, th.numeric { text-align: right; }
.pagination { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-top: 1px solid var(--color-divider); background: var(--color-bg); font-size: var(--font-size-body); line-height: var(--line-height-body); font-variant-numeric: tabular-nums; }
.pagination button { min-width: var(--control-height); padding: var(--space-1) var(--space-2); }
.pagination button.active { color: var(--color-link); border-color: var(--color-primary); background: var(--color-primary-bg); font-weight: var(--font-weight-medium); }
.pagination input { width: 56px; }
.pagination select { width: 104px; }
dialog { --dialog-width: 520px; width: min(var(--dialog-width), calc(100vw - 32px)); max-height: calc(100dvh - 64px); padding: 0; overflow: hidden; border: 0; border-radius: var(--radius-lg); background: var(--color-bg); color: var(--color-text); box-shadow: var(--shadow-popup); }
dialog[open] { display: flex; flex-direction: column; }
dialog[data-size="medium"] { --dialog-width: 720px; }
dialog.resource-drawer { --dialog-width: var(--dialog-width-freight); margin: auto auto 0; max-height: calc(100dvh - var(--control-height-lg)); height: calc(100dvh - var(--control-height-lg)); border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.resource-collapse { border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.resource-collapse-header { display:flex; align-items:center; min-height:var(--collapse-row-height); padding:var(--space-2) var(--space-4); gap:var(--space-2); background:var(--color-bg-subtle); border-bottom:1px solid var(--color-border); }
.resource-collapse-toggle { flex:1; text-align:left; justify-content:flex-start; border:0; background:transparent; }
.resource-collapse-toggle span:first-child { display:inline-block; width:var(--space-6); }
.resource-collapse-header > button:not(.resource-collapse-toggle) { border:0; background:transparent; color:var(--color-link); }
.resource-collapse-header > button.danger { color:var(--color-error); }
.resource-collapse-content { padding:var(--space-4); border-bottom:1px solid var(--color-border); overflow:auto; }
.resource-freight-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.resource-freight-table th, .resource-freight-table td { border:1px solid var(--color-border); height:var(--table-row-height-compact); padding:var(--space-1); text-align:center; font-weight:var(--font-weight-normal); }
.resource-freight-table th { background:var(--color-bg-subtle); }
.resource-freight-table td:first-child { text-align:left; padding:var(--space-2); }
.resource-freight-table input { width:100%; min-width:0; }
.resource-freight-table button, button.resource-link { height:auto; min-height:var(--control-height); border:0; background:transparent; color:var(--color-link); padding:var(--space-1); }
.resource-freight-table button.danger { color:var(--color-error); }
.resource-region-tree { list-style:none; padding:0; margin:0; }
.resource-region-tree ul { list-style:none; padding-left:var(--space-6); }
.resource-region-tree summary { display:flex; align-items:center; gap:var(--space-2); min-height:var(--control-height); cursor:pointer; }
.resource-region-tree summary::before { content:'›'; width:var(--space-3); }
.resource-region-tree details[open] > summary::before { content:'⌄'; }
.resource-region-tree label { display:inline-flex; align-items:center; gap:var(--space-2); min-height:var(--control-height); }
.resource-default-options { display:flex; flex-wrap:wrap; gap:var(--space-4); }
.resource-default-options label { display:flex; align-items:center; gap:var(--space-2); }
.resource-freight-line { display:flex; align-items:center; gap:var(--space-2); flex-wrap:nowrap; min-height:var(--control-height-lg); white-space:nowrap; }
.resource-icon { width:var(--font-size-title); height:var(--font-size-title); fill:none; stroke:currentColor; stroke-width:1.5; }
.resource-freight-line input[type="number"] { width:var(--freight-input-width); }
.resource-warning { padding:var(--space-2) var(--space-4); background:var(--color-warning-bg); color:var(--color-text); margin-bottom:var(--space-2); }
.resource-error { color:var(--color-error); }
dialog[data-size="large"] { --dialog-width: 1040px; }
dialog::backdrop { background: var(--color-mask); }
.modal-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) var(--space-6); border-bottom: 1px solid var(--color-divider); flex-shrink: 0; }
.modal-header h2 { font-size: var(--font-size-title); line-height: var(--line-height-title); }
.modal-header button { border: 0; color: var(--color-text-secondary); width: var(--control-height); padding: var(--space-1); }
#modal-body, .modal-body { padding: var(--space-6); overflow: auto; }
.modal-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-3) var(--space-6); border-top: 1px solid var(--color-divider); flex-shrink: 0; }
.modal-footer button { min-width: 80px; }
.form-note { margin-bottom: var(--space-4); }
.entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-6); }
.entry-grid label { display: flex; flex-direction: column; gap: var(--space-2); }
.entry-grid label > span:first-child { color: var(--color-text-secondary); }
.entry-grid input, .entry-grid select, .entry-grid textarea { width: 100%; }
.required-mark { color: var(--color-error); margin-right: var(--space-1); }
.field-help { color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-sm); }
.field-error { color: var(--color-error); font-size: var(--font-size-sm); line-height: var(--line-height-sm); }
[aria-invalid="true"] { border-color: var(--color-error-fill) !important; }
.query-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--color-divider); }
#query-name { width: 100%; }
#toast { position: fixed; z-index: 20; top: var(--space-4); left: 50%; transform: translateX(-50%); max-width: calc(100vw - 32px); padding: var(--space-3) var(--space-4); border: 1px solid var(--color-divider); border-radius: var(--radius-lg); background: var(--color-bg); box-shadow: var(--shadow-toast); }
.flag { font-size: var(--font-size-title); line-height: var(--line-height-title); }
.flag-gray { color: var(--flag-gray); } .flag-red { color: var(--flag-red); } .flag-yellow { color: var(--flag-yellow); }
.flag-green { color: var(--flag-green); } .flag-blue { color: var(--flag-blue); } .flag-purple { color: var(--flag-purple); }
.panel-tabs { display: flex; align-items: center; gap: var(--space-1); padding: var(--space-1); overflow-x: auto; min-width: 0; }
.panel-tabs button { flex: 0 0 auto; border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg-subtle); color: var(--color-text-secondary); }
.panel-tabs button[aria-selected="true"] { color: var(--color-link); border-color: var(--color-primary-border); background: var(--color-bg); }
.panel-tabs.reference-panel-tabs { padding: 0; background: transparent; align-items: end; }
.panel-tabs.reference-panel-tabs button { border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.panel-tabs.reference-panel-tabs button[aria-selected="true"] { border-color: var(--color-border); }
.panel-empty { padding: var(--space-6); color: var(--color-text-secondary); }
/* Shared resource-directory table and action links. */
.resource-table { width: max-content; min-width: 100%; table-layout: fixed; }
.resource-table th { position: sticky; top: 0; z-index: 2; white-space: nowrap; border-right: 1px solid var(--color-divider); }
.resource-table td { border-right: 1px solid var(--color-divider); max-width: 240px; }
.resource-table tbody tr:nth-child(even) { background: var(--color-bg-subtle); }
.resource-table tbody tr:hover { background: var(--color-primary-bg); }
.resource-table .row-actions { position: sticky; right: 0; background: var(--color-bg); white-space: nowrap; }
.resource-table thead .row-actions { background: var(--color-primary-bg); z-index: 3; }
.resource-table td .cell { max-width: 200px; }
.resource-table .check-cell { width: 48px; text-align: center; }
.resource-table .check-cell input { display: block; margin: 0 auto; }
.material-reference .resource-table th { height:var(--material-header-height); text-align:center; font-weight:var(--font-weight-normal); padding:var(--space-2) var(--space-1); }
.material-reference .resource-table td { height:var(--table-row-height); text-align:center; font-size:var(--material-data-font-size); line-height:var(--material-data-line-height); padding:var(--space-2) var(--space-1); }
.material-reference .resource-table tbody tr:nth-child(even) { background:var(--color-bg); }
.material-reference .resource-table tbody tr:hover { background:var(--color-primary-bg); }
.material-reference .resource-actions { justify-content:center; gap:var(--space-3); }
.material-reference .resource-actions button, .material-reference .material-code { font-size:var(--material-data-font-size); line-height:var(--material-data-line-height); }
.material-reference .toolbar button, .material-reference .pagination button, .material-reference .pagination select, .material-reference .pagination input { height:var(--control-height-sm); min-height:var(--control-height-sm); }
.material-reference dialog[data-size="material"] { width:var(--dialog-width-material-form); }
.reference-material-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3) var(--space-6); }
.reference-material-form label { display:flex; align-items:center; gap:var(--space-2); min-width:0; }
.reference-material-form label > span { flex:0 0 90px; text-align:right; }
.reference-material-form input:not([type="radio"]), .reference-material-form select, .reference-material-form textarea { width:100%; min-width:0; }
.reference-material-form .form-wide { grid-column:1 / -1; }
.reference-material-form .material-radio { display:flex; align-items:center; gap:var(--space-2); }
@media(max-width:640px) { .reference-material-form { grid-template-columns:1fr; } }
.resource-actions { display: flex; gap: var(--space-2); }
.resource-actions button { min-height: var(--control-height-sm); padding: 0; border: 0; background: transparent; color: var(--color-link); }
.resource-actions .warning { color: var(--color-warning); }
.resource-actions .danger { color: var(--color-error); }
.resource-actions .success { color: var(--color-success); }
/* Shared resource navigation and template tabs. */
.resource-popover { position: fixed; z-index: 15; top: calc(var(--space-12) + var(--control-height-lg)); left: var(--rail-width); width: 248px; max-height: calc(100dvh - var(--space-12) - var(--control-height-lg)); overflow: auto; padding: var(--space-2); border: 1px solid var(--color-divider); border-radius: var(--radius); background: var(--color-bg); box-shadow: var(--shadow-popup); }
.resource-popover summary { padding: var(--space-3); cursor: pointer; color: var(--color-link); }
.resource-popover button { width: 100%; justify-content: flex-start; border: 0; margin-bottom: var(--space-1); }
.resource-popover [aria-current="page"] { color: var(--color-link); background: var(--color-primary-bg); }
.resource-tabs { display: flex; flex: 0 0 auto; gap: var(--space-6); padding: 0 var(--space-4); border-bottom: 1px solid var(--color-divider); overflow-x: auto; }
.resource-tabs button { flex: 0 0 auto; min-height: var(--control-height-lg); border: 0; border-radius: 0; border-bottom: 2px solid transparent; color: var(--color-text-secondary); }
.resource-tabs [aria-selected="true"] { color: var(--color-link); border-bottom-color: var(--color-primary); }
.category-list button { border: 0; border-radius: var(--radius); color: var(--color-text-secondary); background: var(--color-bg); }
.category-list button[aria-pressed="true"] { color: var(--color-link); background: var(--color-primary-bg); }
/* Compact production forms: shared across recording and subsequent workshop pages. */
.production-actions { flex: 0 0 auto; align-self: flex-end; display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) 0; }
.production-actions span { white-space: nowrap; color: var(--color-text-muted); }
.production-card { border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg); padding: var(--space-3); }
.production-field { display: flex; align-items: stretch; gap: var(--space-2); }
.production-field > span:first-child { display: flex; align-items: center; justify-content: center; flex: 0 0 104px; padding: var(--space-1) var(--space-2); color: var(--color-text-secondary); background: var(--color-bg-layout); }
.production-field > input, .production-field > select, .production-field > textarea, .production-field > div { flex: 1; min-width: 0; }
.production-template-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.production-fields .production-field > select, .production-fields .production-field > .production-picker-field { flex: 0 0 208px; width: 208px; }
.production-fields .production-field > .production-dependent { flex: 0 0 280px; width: 280px; }
.production-template-row .remove-project { flex: 0 0 var(--control-height); }
.remove-project { width: var(--control-height); padding: var(--space-1); color: var(--color-error); border-color: transparent; }
.resource-select-popup { position: fixed; z-index: 1000; overflow-y: auto; background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius); box-shadow: var(--shadow-popup); }
.resource-select-popup button { display: block; width: 100%; border: 0; border-radius: 0; text-align: left; padding-inline: var(--space-2); }
.resource-select-popup button[aria-selected="true"] { background: var(--color-primary-bg); }
.resource-select-popup button[hidden] { display: none; }
.resource-select-search { position: sticky; top: 0; padding: var(--space-1); background: var(--color-bg); }
.resource-select-search input { width: 100%; }
.resource-select-empty { padding: var(--space-2); color: var(--color-text-secondary); }
.production-line-head { display: flex; align-items: center; justify-content: space-between; padding-left: var(--space-2); background: var(--color-bg-layout); color: var(--color-text-secondary); }
.production-line-fields label { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; color: var(--color-text-secondary); }
.production-line-fields input { width: 100%; padding-inline: var(--space-2); color: var(--color-text); font-variant-numeric: tabular-nums; }
.production-line-fields button { color: var(--color-text); }
.catalog-search { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
.catalog-search input { flex: 1; }
.catalog-table-scroll { max-height: 40vh; overflow: auto; border: 1px solid var(--color-border); }
.catalog-table { min-width: 1600px; width: 100%; }
.catalog-table th { position: sticky; top: 0; white-space: nowrap; }
.catalog-table td { max-width: 240px; overflow-wrap: anywhere; }
.catalog-table tbody tr:hover { background: var(--color-primary-bg); cursor: pointer; }
.catalog-pagination { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-2); padding-top: var(--space-3); }
@media (max-width: 640px) {
  dialog { max-height: calc(100dvh - 32px); }
  .entry-grid { grid-template-columns: 1fr; }
  .modal-header, #modal-body, .modal-body, .modal-footer { padding: var(--space-4); }
}
.resource-cascade { --resource-menu-width: 224px; position: fixed; inset: 0; z-index: 30; pointer-events: none; }
.resource-menu-panel { position: fixed; width: var(--resource-menu-width); max-height: calc(100dvh - var(--space-4)); overflow-y: auto; padding: var(--space-2) 0; border-radius: var(--radius); background: var(--color-bg); box-shadow: var(--shadow-popup); pointer-events: auto; }
.resource-menu-item { width: 100%; min-height: var(--control-height-lg); height: auto; border: 0; border-radius: 0; padding: var(--space-2) var(--space-4); justify-content: space-between; text-align: left; background: var(--color-bg); }
.resource-menu-item:hover, .resource-menu-item.resource-menu-active, .resource-menu-item[aria-current="page"] { background: var(--color-primary-bg); color: var(--color-link); }
.resource-menu-arrow { margin-left: var(--space-3); }
.resource-nav-notice { position: fixed; bottom: var(--space-6); left: 50%; transform: translateX(-50%); max-width: calc(100vw - var(--space-8)); padding: var(--space-3) var(--space-4); border-radius: var(--radius); background: var(--color-bg); box-shadow: var(--shadow-toast); z-index: 40; }
@media (max-width: 720px) { .resource-cascade { --resource-menu-width: 184px; } }
@media (max-width: 560px) { .resource-cascade { --resource-menu-width: calc(100vw / 3); } .resource-menu-item { padding-inline: var(--space-2); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
/* Shared expression editor for main-material and accessory formulas. */
.formula-buttons { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-3) 0 var(--space-5); }
.formula-buttons button { min-width: 48px; }
.formula-heading { margin: var(--space-4) 0 var(--space-2); }
#formula-expression { width: 100%; min-height: 96px; margin-top: var(--space-3); }
/* Reference-system variants, opt-in so existing directories are unchanged. */
.resource-table-compact th, .resource-table-compact td { height: var(--table-row-height-compact); padding: calc((var(--table-row-height-compact) - var(--line-height-body) - 1px) / 2) var(--space-2); }
.resource-table-compact input[type="checkbox"], .resource-table-compact input[type="radio"] { display: block; margin: 0 auto; }
.resource-table-compact .resource-actions button { min-height: var(--line-height-body); height: var(--line-height-body); }
.resource-table-plain th, .resource-table-plain thead .row-actions { background: var(--color-bg); }
.resource-table-centered th, .resource-table-centered td { text-align: center; }
.process-reference { font-family:var(--font-family); }
.process-reference .resource-table th { font-weight:var(--process-header-weight); }
.process-reference .category-list button { line-height:var(--process-category-line-height); }
button.success.primary { color: var(--color-bg); background: var(--color-success-fill); border-color: var(--color-success-fill); }
button.success.primary:hover:not(:disabled) { color: var(--color-bg); background: var(--color-success); border-color: var(--color-success); }
.resource-table-centered .resource-actions { align-items: center; justify-content: center; }
.resource-actions .action-divider { height: 14px; border-left: 1px solid var(--color-border); }
.resource-pagination { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-2); flex-wrap: wrap; }
.resource-pagination button { min-width: var(--control-height); padding-inline: var(--space-2); border-color: transparent; background: transparent; }
.resource-pagination button[aria-current="page"] { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-bg); }
.resource-pagination button:disabled { border-color: transparent; background: transparent; }
.resource-pagination select { width: 104px; }
.resource-pagination input { width: 56px; }
.resource-pagination label { display: flex; align-items: center; gap: var(--space-2); }
dialog[data-size="reference-form"] { --dialog-width: var(--dialog-width-reference-form); }
dialog[data-size="reference-picker"] { --dialog-width: var(--dialog-width-reference-picker); }
dialog[data-size="reference-expression"] { --dialog-width: var(--dialog-width-reference-expression); }
dialog[data-size="reference-main-form"] { --dialog-width: var(--dialog-width-reference-main-form); }
dialog[data-size="reference-main-expression"] { --dialog-width: var(--dialog-width-reference-main-expression); }
dialog[data-size="reference-binding"] { --dialog-width: var(--dialog-width-reference-binding); }
.reference-query { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-3) var(--space-4); padding: var(--space-3) var(--space-4); flex: 0 0 auto; }
.reference-query label { display: flex; align-items: center; gap: var(--space-2); min-width: 0; }
.reference-query label > span { flex: 0 0 104px; text-align: right; white-space: nowrap; color: var(--color-text-secondary); }
.reference-query input,.reference-query select { width: 100%; min-width: 0; }
.reference-query .toolbar { grid-column: 1 / -1; padding: 0; }
.expression-token-editor:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; box-shadow: var(--focus-ring); }
@media (max-width: 1200px) { .reference-query { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 640px) { .reference-query { grid-template-columns: 1fr; } }
.reference-form > label { display: flex; align-items: center; gap: 0; margin-bottom: var(--space-4); }
.resource-multiselect { position:relative; flex:1; min-width:0; }
.resource-multiselect-trigger { width:100%; text-align:left; justify-content:flex-start; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.resource-multiselect-panel { position:absolute; top:100%; left:0; right:0; z-index:5; padding:var(--space-2); background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius); box-shadow:var(--shadow-popup); }
.resource-multiselect-options { max-height:240px; overflow:auto; }
.resource-multiselect-options label { display:flex; align-items:center; gap:var(--space-2); padding:var(--space-2); }
.resource-multiselect-options input[type="checkbox"] { flex-shrink:0; }
.resource-multiselect-actions { display:flex; justify-content:flex-end; gap:var(--space-2); border-top:1px solid var(--color-divider); padding-top:var(--space-2); }
.reference-form > label > span:first-child { flex: 0 0 104px; text-align: right; padding-right: var(--space-2); }
.reference-form input:not([type="radio"]):not([type="checkbox"]), .reference-form select { min-width: 0; flex: 1; width: 100%; }
.reference-form input[readonly] { background: var(--color-bg-layout); }
.reference-form > label > button { flex: 0 0 116px; }
.reference-form fieldset { display: flex; align-items: center; gap: var(--space-4); padding: 0; border: 0; margin: 0 0 var(--space-4); }
.reference-form legend { float: left; width: 104px; text-align: right; padding-right: var(--space-2); }
.reference-form fieldset label { display: flex; align-items: center; gap: var(--space-2); }
.expression-token-editor { min-height: 112px; padding: var(--space-4); margin-top: var(--space-6); border: 1px solid var(--color-divider); background: var(--color-bg); box-shadow: inset 0 3px 8px rgb(0 0 0 / 6%); }
.expression-token-editor:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.expression-token { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: var(--control-height); margin: 0 var(--space-2) var(--space-2) 0; padding-inline: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg-subtle); }
.expression-buttons { display: flex; flex-wrap: wrap; gap: var(--space-6); margin: var(--space-3) 0 var(--space-6); }
.expression-buttons button { min-width: 48px; }
.expression-buttons[data-kind="variables"] { display: grid; grid-template-columns: repeat(5,minmax(48px,88px)); justify-content: space-between; gap: var(--space-3) var(--space-6); }
.expression-buttons[data-kind="variables"] button { min-width: 88px; }
.expression-buttons[data-kind="digits"] { display: grid; grid-template-columns: repeat(10,minmax(0,1fr)); gap: var(--space-4); }
.expression-buttons[data-kind="digits"] button { min-width: 0; }
.expression-heading { margin-top: var(--space-4); }
@media (max-width: 640px) { .expression-buttons[data-kind="variables"] { grid-template-columns: repeat(3,minmax(48px,88px)); } }
@media (max-width: 640px) { .expression-buttons[data-kind="digits"] { grid-template-columns: repeat(5,minmax(0,1fr)); } }
.template-process-picker { position:relative; min-width:0; }
.cascade-trigger { width:100%; text-align:left; }
.cascade-panel { display:flex; position:absolute; z-index:10; top:100%; left:0; width:100%; background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius); box-shadow:var(--shadow-popup); }
.cascade-panel[hidden] { display:none; }
.cascade-panel > div { flex:1; min-width:0; max-height:240px; overflow:auto; padding:var(--space-2); }
.cascade-panel button { display:block; width:100%; text-align:left; border:0; }
.cascade-panel button[aria-pressed="true"] { background:var(--color-primary-bg); color:var(--color-link); }
.resource-matrix { border-collapse:collapse; width:max-content; min-width:100%; }
.resource-matrix th,.resource-matrix td { min-width:120px; max-width:300px; padding:var(--space-2) var(--space-3); height:var(--table-row-height-compact); border:1px solid var(--color-divider); text-align:center; white-space:nowrap; font-weight:var(--font-weight-normal); }
.resource-matrix thead th { position:sticky; top:0; z-index:2; background:var(--color-primary-bg); }
.resource-matrix tr > :first-child { position:sticky; left:0; z-index:1; min-width:150px; background:var(--color-bg-subtle); }
.resource-matrix thead tr > :first-child { z-index:3; }
.resource-matrix td { background:var(--color-bg); }
.resource-matrix .matrix-formula { border:0; background:transparent; color:var(--color-link); text-decoration:underline; height:auto; padding:0; }
.resource-matrix.accessory-matrix th,.resource-matrix.accessory-matrix td { min-width:64px; max-width:none; }
.resource-matrix.accessory-matrix thead tr:first-child th { position:static; }
.resource-matrix.accessory-matrix thead tr:last-child th { position:static; }
.resource-matrix.accessory-matrix tr > :first-child { position:static; min-width:96px; }
.resource-matrix.accessory-matrix tfoot td { background:var(--color-bg-subtle); }
/* 原系统辅料页：浅蓝双层表头，14px正文，固定列宽，不随空余宽度拉伸。 */
.resource-matrix.accessory-matrix { min-width:0; table-layout:fixed; font-family:var(--cost-font-family); font-size:var(--cost-font-size); line-height:var(--cost-line-height); color:var(--color-cost-text); }
.resource-matrix.accessory-matrix th,.resource-matrix.accessory-matrix td { padding:var(--space-1); min-width:0; height:var(--accessory-row-height); font-size:var(--cost-font-size); line-height:var(--cost-line-height); font-weight:var(--font-weight-normal); }
.resource-matrix.accessory-matrix thead th { height:var(--accessory-header-height); background:var(--color-primary-bg); }
.resource-matrix.accessory-matrix tr > :first-child { min-width:0; background:var(--color-bg); }
.resource-matrix.accessory-matrix thead tr > :first-child { background:var(--color-primary-bg); }
.resource-matrix.accessory-matrix tfoot td { background:var(--color-bg-subtle); }
.accessory-matrix col.aux-template { width:64px; }
.accessory-matrix col.aux-property { width:96px; }
.accessory-matrix col.aux-processing { width:80px; }
.accessory-matrix col.aux-dimension { width:64px; }
.accessory-matrix col.aux-value { width:72px; }
/* 原系统录单用料表：白底黑框，两层表头，不拉伸填满页面。 */
.production-cost-scroll { max-width:100%; overflow:auto; }
.production-cost-matrix { border-collapse:collapse; table-layout:fixed; width:max-content; background:var(--color-bg); color:var(--color-cost-text); font-family:var(--cost-font-family); font-size:var(--cost-font-size); line-height:var(--cost-line-height); font-weight:var(--font-weight-normal); }
.production-cost-matrix th,.production-cost-matrix td { border:1px solid var(--color-cost-grid); padding:var(--cost-cell-padding); text-align:center; white-space:nowrap; background:var(--color-bg); color:var(--color-cost-text); vertical-align:middle; }
.production-cost-matrix th { height:var(--cost-header-height); padding-block:var(--space-1); font-weight:var(--cost-header-weight); }
.production-cost-summary th { font-weight:var(--font-weight-normal); }
.production-cost-matrix td { height:var(--cost-row-height); font-weight:var(--font-weight-normal); }
.production-cost-matrix col.cost-property { width:96px; }
.production-cost-matrix col.cost-product { width:132px; }
.production-cost-matrix col.cost-number { width:88px; }
.production-cost-matrix col.cost-total { width:80px; }
/* 原系统工价：每条明细独立一张紧凑分组表，无底部合计或横线。 */
.production-wage-tables { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-4); width:max-content; }
.production-cost-matrix.production-wage-matrix { table-layout:auto; }
.production-wage-matrix td { height:var(--wage-row-height); }
.production-wage-matrix col.wage-property { width:65px; }
.production-wage-matrix col.wage-number { width:37px; }
.production-wage-matrix col.wage-total { width:51px; }
.production-cost-matrix.production-accessory-matrix { table-layout:auto; }
.production-accessory-matrix th { font-weight:var(--font-weight-normal); }
.production-accessory-matrix col.aux-property { width:94px; }
.production-accessory-matrix col.aux-processing { width:78px; }
.production-accessory-matrix col.aux-dimension { width:42px; }
.production-accessory-matrix col.aux-value { width:44px; }
.production-cost-scroll:has(.production-accessory-matrix) { margin-bottom:var(--space-2); }
.matrix-sidebar-heading { padding:var(--space-3); margin:0; background:var(--color-bg-subtle); border-bottom:1px solid var(--color-divider); }
.matrix-group { display:flex; justify-content:space-between; gap:var(--space-2); }
.matrix-group span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* 原系统订单列表尺寸配置，正文和操作仍使用公共角色。 */
.order-reference #orders td {
  font-size: var(--order-data-font-size);
  line-height: var(--order-data-line-height);
  padding: var(--order-cell-padding) var(--space-2);
}
.order-reference #orders th {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  font-weight: var(--font-weight-normal);
  padding: var(--space-2);
}
.order-reference .quick {
  background: var(--color-primary-bg);
  border-color: var(--color-primary-border);
}
.order-reference .reference-recording-toolbar .quick { background:var(--color-primary-soft); color:var(--color-text); border-color:var(--color-primary-border); font-weight:var(--font-weight-normal); }
.reference-recording-toolbar button { min-height:var(--control-height-sm); padding-block:0; border-radius:var(--radius-sm); }
.order-reference .reference-recording-toolbar .quick.active { color:var(--color-text); font-weight:var(--font-weight-normal); }
.reference-recording-toolbar .count { color:var(--color-error); }
.reference-recording-toolbar .toolbar-actions > button:disabled { background:var(--color-primary); border-color:var(--color-primary); color:var(--color-bg); opacity:var(--opacity-disabled, .6); }
.reference-recording-toolbar .toolbar-actions > button:disabled:first-child::before { content:"⟳"; }
.reference-recording-toolbar .toolbar-actions > button:disabled:nth-child(2)::before { content:"▣"; }
.order-reference .online-number { display:inline-block; max-width:100%; padding:0 var(--space-1); border:1px solid var(--color-border); border-radius:var(--radius-sm); background:var(--color-bg-subtle); color:var(--color-text-secondary); vertical-align:middle; }
/* Shared member directory, adapted to the ERP theme. */
.member-card { background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-4); min-width:0; }
.member-tree button { width:100%; text-align:left; margin-bottom:var(--space-1); }
.member-tree button[aria-current] { color:var(--color-link); background:var(--color-primary-bg); }
.member-tree details > summary { cursor:pointer; padding:var(--space-2); }
.member-tree .member-tree { margin-left:var(--space-4); }
.member-sources { display:flex; gap:var(--space-2); overflow:auto; margin:var(--space-4) 0; }
.member-sources > * { flex:1 0 160px; text-align:left; }