.sc {
  --sc-bg: #f8f9fc;
  --sc-card: #ffffff;
  --sc-subtle: #f4f7fb;
  --sc-line: #e1e7f0;
  --sc-text: #172033;
  --sc-text-2: #536178;
  --sc-muted: #8490a3;
  --sc-blue: #2f7df4;
  --sc-blue-soft: #edf5ff;
  color: var(--sc-text);
  font-size: 13px;
  min-width: 0;
}
.sc *, .sc *::before, .sc *::after { box-sizing: border-box; }
.sc h2, .sc h3, .sc p { margin: 0; }
.sc button { font-family: inherit; }

/* Page title and toolbar */
.sc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.sc-page-title { min-width: 260px; }
.sc-page-title > small { display: block; margin-bottom: 7px; color: var(--sc-blue); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.sc-page-title h2 { font-size: 28px; line-height: 1.2; letter-spacing: -.03em; }
.sc-page-title p { margin-top: 7px; color: var(--sc-muted); line-height: 1.6; }
.sc-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.sc-actions-tools, .sc-actions-publish { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.sc-actions-publish { padding-left: 10px; border-left: 1px solid var(--sc-line); }
.sc-actions .btn { min-height: 38px; padding: 8px 13px; white-space: nowrap; }
.sc .btn:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.sc-status { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; min-height: 42px; margin-bottom: 12px; padding: 9px 14px; border: 1px solid #d8e4f3; border-radius: 10px; background: #f7faff; }
.sc-status-info { display: flex; min-width: 0; align-items: center; flex-wrap: wrap; gap: 9px; }
.sc-status i { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px #fff; }
.sc-status.active i { background: var(--green); }
.sc-status strong { font-size: 12px; }
.sc-status span { color: var(--sc-muted); }
.sc-status small { color: var(--sc-text-2); font-weight: 700; }
.sc-status-info > b { padding: 4px 8px; border-radius: 6px; background: #fff3de; color: #a6650c; font-size: 10px; }
.sc-status.active .sc-status-info > b { background: #eaf7f1; color: #14805d; }
.sc-status > .sc-actions { margin-left: auto; }

/* Three-column maintenance workspace */
.sc-workspace { display: grid; grid-template-columns: 205px 300px minmax(600px, 1fr); min-height: 660px; height: calc(100dvh - 238px); max-height: 820px; border: 1px solid var(--sc-line); border-radius: 14px; background: var(--sc-card); box-shadow: 0 10px 30px rgba(36, 56, 88, .07); overflow: hidden; }
.sc-pane { position: relative; min-width: 0; min-height: 0; padding: 16px; border-right: 1px solid var(--sc-line); background: var(--sc-card); overflow: auto; }
.sc-pane:first-child { padding-inline: 13px; background: #fbfcfe; }
.sc-pane:nth-child(2) { display: flex; flex-direction: column; overflow: hidden; background: #f6f8fb; }
.sc-pane:last-child { display: flex; flex-direction: column; padding: 0; border-right: 0; overflow: hidden; }
.sc-pane-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 54px; margin-bottom: 13px; padding-bottom: 13px; border-bottom: 1px solid var(--sc-line); }
.sc-pane-head h3 { font-size: 16px; line-height: 1.3; }
.sc-pane-head small { display: block; margin-top: 4px; color: var(--sc-muted); font-size: 11px; }
.sc-pane-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.sc-pane-actions .btn { min-height: 34px; padding: 6px 10px; font-size: 11px; white-space: nowrap; }
.sc-pane:nth-child(2) > .sc-pane-head { flex: 0 0 auto; }
.sc-pane:nth-child(2) > .sc-field-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }

/* Category tree */
.sc-category-list, .sc-field-list { display: flex; flex-direction: column; gap: 7px; }
.sc-category-row { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; align-items: center; gap: 7px; width: 100%; min-height: 40px; padding: 8px 8px 8px calc(8px + var(--depth) * 13px); border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--sc-text-2); text-align: left; }
.sc-category-row:hover { border-color: var(--sc-line); background: #fff; }
.sc-category-row.active { border-color: #a9c9f6; background: var(--sc-blue-soft); color: #216fd2; box-shadow: inset 3px 0 0 var(--sc-blue); }
.sc-category-row > span:nth-child(2) { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.sc-category-row b { min-width: 23px; padding: 3px 6px; border-radius: 10px; background: #edf1f6; color: #718097; font-size: 10px; font-weight: 600; text-align: center; }

/* Configuration-item list */
.sc-field-card { display: grid; grid-template-columns: 16px 34px minmax(0, 1fr) 22px; align-items: center; gap: 8px; min-height: 72px; padding: 9px 8px; border: 1px solid var(--sc-line); border-radius: 10px; background: #fff; box-shadow: 0 2px 6px rgba(36, 56, 88, .04); }
.sc-field-card:hover { border-color: #b8c9df; }
.sc-field-card.active { border-color: #79aef5; background: #f1f7ff; box-shadow: 0 0 0 2px #deecff; }
.sc-field-card.dragging { opacity: .45; }
.sc-field-card.drag-over { box-shadow: inset 0 -3px var(--sc-blue); }
.sc-grip { display: grid; place-items: center; width: 16px; height: 32px; color: #9aa6b7; cursor: grab; }
.sc-grip::before { content: '⠿'; font-size: 17px; }
.sc-order { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #eef2f7; color: #687a91; font-size: 11px; font-weight: 800; }
.sc-field-card.active .sc-order { background: #dceaff; color: #216fd2; }
.sc-field-main { display: block; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--sc-text); text-align: left; }
.sc-field-main strong, .sc-field-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-field-main strong { font-size: 13px; line-height: 1.45; }
.sc-field-main small { margin-top: 4px; color: var(--sc-muted); font-size: 10px; line-height: 1.5; }
.sc-field-main:focus-visible { outline: 2px solid var(--sc-blue); outline-offset: 3px; border-radius: 4px; }
.sc-field-more { padding: 5px; border: 0; background: transparent; color: #7f8da1; font-size: 18px; line-height: 1; }

/* Editor */
.sc-editor-head { display: flex; align-items: center; gap: 12px; min-height: 82px; padding: 14px 20px; border-bottom: 1px solid var(--sc-line); background: #fff; }
.sc-editor-symbol { display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px; background: var(--sc-blue-soft); color: var(--sc-blue); font-size: 18px; font-weight: 700; }
.sc-editor-title { min-width: 0; }
.sc-editor-title > small { display: block; color: var(--sc-blue); font-size: 10px; font-weight: 700; }
.sc-editor-title h3 { margin-top: 3px; font-size: 18px; line-height: 1.35; }
.sc-editor-title p { margin-top: 4px; color: var(--sc-muted); font-size: 11px; }
.sc-editor-badges { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.sc-dirty { padding: 4px 7px; border-radius: 6px; background: #fff3de; color: #a6650c; font-size: 10px; }
.sc-tabs { display: flex; flex: 0 0 auto; gap: 18px; padding: 0 20px; border-bottom: 1px solid var(--sc-line); background: #fff; }
.sc-tabs button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 49px; padding: 0 4px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: #718097; font-size: 12px; font-weight: 600; }
.sc-tabs button:hover { color: var(--sc-text); }
.sc-tabs button.active { border-color: var(--sc-blue); color: var(--sc-blue); }
.sc-tabs button span { color: #a0acbc; font-size: 9px; font-weight: 800; }
.sc-tabs button.active span { color: var(--sc-blue); }
.sc-tabs button b { display: grid; place-items: center; min-width: 20px; height: 20px; border-radius: 10px; background: #e9eef5; color: #697c95; font-size: 9px; }
.sc-tabs button.active b { background: #e1edff; color: var(--sc-blue); }
.sc-editor-body { container-name: sc-condition-editor; container-type: inline-size; flex: 1; min-width: 0; min-height: 0; padding: 16px 20px 6px; overflow-x: hidden; overflow-y: auto; background: var(--sc-bg); }
.sc-editor-body > .sc-section, .sc-editor-body > .sc-inline-note { width: 100%; max-width: 980px; min-width: 0; margin-inline: auto; }
.sc-footer-save { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 20px; border-top: 1px solid var(--sc-line); background: #fff; }
.sc-footer-save > span { color: var(--sc-muted); font-size: 10px; }

/* Forms and sections */
.sc-section { margin-bottom: 12px; padding: 16px; border: 1px solid var(--sc-line); border-radius: 11px; background: #fff; }
.sc-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.sc-section-head strong { font-size: 14px; }
.sc-section-head small { display: block; margin-top: 4px; color: var(--sc-muted); font-size: 11px; font-weight: 400; }
.sc-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.sc-form:has(> label > .sc-money-control) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sc-form label, .sc-block-label { display: flex; flex-direction: column; gap: 7px; color: #718097; font-size: 11px; font-weight: 600; }
.sc-form label.full { grid-column: 1 / -1; }
.sc-form > .full { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 10px; }
.sc-matrix-scope-help { margin: 0; }
.sc input:not([type=checkbox]):not([type=file]), .sc select, .sc textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #d5dfec; border-radius: 8px; background: #fff; color: var(--sc-text); font: 500 12px 'Noto Sans SC', 'DM Sans', sans-serif; }
.sc input:focus, .sc select:focus, .sc textarea:focus { outline: 2px solid #73a7ff; outline-offset: 1px; }
.sc input:disabled { background: #f3f5f8; color: var(--sc-muted); }
.sc-choice { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3px; min-height: 42px; padding: 4px; border-radius: 8px; background: #edf1f6; }
.sc-choice:has(> button:nth-child(3)) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sc-choice:has(> button:nth-child(4)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sc-choice button { min-height: 34px; padding: 7px 9px; border: 0; border-radius: 6px; background: transparent; color: #718097; font-size: 11px; font-weight: 600; }
.sc-choice button.active { background: #fff; color: var(--sc-blue); box-shadow: 0 1px 6px rgba(36, 56, 88, .14); }
.sc-help { color: var(--sc-muted); font-size: 11px; font-weight: 400; line-height: 1.65; }
.sc-inline-note { padding: 11px 13px; border: 1px solid var(--sc-line); border-radius: 8px; background: #f5f8fc; color: var(--sc-muted); }
.sc-input-unit { display: flex; align-items: center; border: 1px solid #d5dfec; border-radius: 8px; background: #fff; overflow: hidden; }
.sc-input-unit input { border: 0 !important; border-radius: 0 !important; }
.sc-input-unit span { padding: 0 10px; color: var(--sc-muted); white-space: nowrap; }
.sc-money-control { display: flex; gap: 8px; min-width: 0; }
.sc .sc-money-control input { flex: 1 1 0%; width: 0; min-width: 0; }
.sc .sc-money-control > .select-control { flex: 0 0 76px; width: 76px; min-width: 76px; }
.sc .sc-money-control .select-trigger { padding-left: 8px; padding-right: 22px; }
.sc .sc-money-control .select-trigger::after { right: 8px; }
.sc .sc-money-control select { flex: 0 0 76px; width: 76px; min-width: 76px; padding-inline: 7px; font-weight: 600; }
.sc-model-quantities { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 10px; border-radius: 8px; background: var(--sc-subtle); }

/* Tables */
.sc-table-wrap { overflow: auto; border: 1px solid var(--sc-line); border-radius: 9px; background: #fff; }
.sc-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.sc-table th, .sc-table td { padding: 11px 10px; border-bottom: 1px solid #ebeff5; text-align: left; vertical-align: middle; }
.sc-table th { background: #f6f8fb; color: #7f8da1; font-size: 10px; font-weight: 700; white-space: nowrap; }
.sc-table td { color: var(--sc-text-2); }
.sc-table tbody tr:hover { background: #fafcff; }
.sc-table tbody tr:last-child td { border-bottom: 0; }
.sc-table td small { display: block; margin-top: 4px; color: var(--sc-muted); }
.sc-nowrap { white-space: nowrap; }
.sc-tag { display: inline-flex; align-items: center; padding: 4px 7px; border-radius: 6px; background: #eef2f7; color: #68768b; font-size: 10px; }
.sc-tag.blue { background: #eaf3ff; color: #2f6cc8; }
.sc-tag.orange { background: #fff4df; color: #b87816; }
.sc-icon { min-height: 32px; padding: 6px 8px; border: 1px solid #d5dfec; border-radius: 7px; background: #fff; color: var(--sc-blue); }
.sc-icon:hover { border-color: #9bbef0; background: #f5f9ff; }
.sc-icon.danger { color: var(--red); }

/* Option values use readable rows instead of a horizontally compressed table. */
.sc-option-list { display: grid; gap: 9px; }
.sc-option-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--sc-line); border-radius: 10px; background: #fff; }
.sc-option-row:hover { border-color: #b8c9df; box-shadow: 0 3px 12px rgba(36, 56, 88, .05); }
.sc-option-row.dragging { opacity: .45; }
.sc-option-row.drag-over { box-shadow: inset 0 -3px var(--sc-blue); }
.sc-option-order { display: grid; place-items: center; gap: 2px; color: var(--sc-muted); }
.sc-option-order .sc-grip { height: 20px; }
.sc-option-content { min-width: 0; }
.sc-option-content > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.sc-option-content > header strong, .sc-option-content > header small { display: block; }
.sc-option-content > header strong { font-size: 14px; }
.sc-option-content > header small { margin-top: 3px; color: var(--sc-muted); font-size: 10px; }
.sc-option-name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sc-option-thumbnail { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 7px; object-fit: cover; }
.sc-option-tags { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.sc-option-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.sc-option-meta > span { min-width: 0; padding: 8px 9px; border-radius: 7px; background: #f6f8fb; }
.sc-option-meta small, .sc-option-meta b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-option-meta small { color: var(--sc-muted); font-size: 9px; }
.sc-option-meta b { margin-top: 4px; color: var(--sc-text-2); font-size: 11px; }
.sc-option-actions { display: flex; flex-direction: column; gap: 6px; }

/* Empty, notice and menus */
.sc-empty { display: grid; place-items: center; min-height: 120px; padding: 24px; border: 1px dashed #d7e0ec; border-radius: 9px; background: #fbfcfe; color: var(--sc-muted); line-height: 1.8; text-align: center; }
.sc-editor-empty { margin: 18px; min-height: 250px; }
.sc-editor-empty strong, .sc-editor-empty span { display: block; }
.sc-editor-empty strong { color: var(--sc-text); font-size: 14px; }
.sc-editor-empty span { margin-top: 5px; font-size: 11px; }
.sc-notice { margin-bottom: 12px; padding: 10px 14px; border: 1px solid #cfe8dc; border-radius: 8px; background: #effaf5; color: #14805d; }
.sc-notice.error { border-color: #f0d3da; background: #fff2f4; color: #c94a5e; }
.sc-notice.warning { border-color: #efd8aa; background: #fff8e9; color: #8a5a10; }
.sc-reference-alert { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sc-reference-alert-copy { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.sc-reference-alert-copy strong, .sc-reference-alert > .btn { flex: 0 0 auto; }
.sc-reference-alert-copy span { line-height: 1.6; }
.sc-menu { position: fixed; z-index: 9; top: 0; left: 0; visibility: hidden; width: 150px; padding: 7px; border: 1px solid var(--sc-line); border-radius: 9px; background: #fff; box-shadow: 0 12px 30px rgba(23, 32, 51, .16); }
.sc-menu button { width: 100%; padding: 9px; border: 0; border-radius: 6px; background: transparent; color: var(--sc-text); text-align: left; }
.sc-menu button:hover { background: var(--sc-subtle); }
.sc-menu button.danger { color: var(--red); }

/* Scope and grouped conditions */
.sc-scope-controls { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.sc-scope-picker { width: 100%; min-width: 0; margin-top: 10px; }
.sc-scope-picker .cc-picker-label { color: #718097; font-size: 11px; font-weight: 600; }
.sc-scope-picker .cc-multi-control { flex-wrap: wrap; min-height: 42px; max-height: none; overflow: visible; border-color: #d5dfec; border-radius: 8px; background: var(--sc-card); }
.sc-scope-picker .cc-multi-tags { display: contents; }
.sc-scope-picker .cc-multi-chip { max-width: 100%; overflow-wrap: anywhere; }
.sc-scope-picker .cc-multi-summary { flex: 0 0 auto; padding: 4px 7px; border-radius: 6px; background: #eef4ff; color: var(--sc-blue); font-size: 11px; font-weight: 700; white-space: nowrap; }
.sc-scope-picker .cc-multi-trigger { flex: 1 1 110px; min-width: 110px; font: 500 12px 'Noto Sans SC', 'DM Sans', sans-serif; }
.sc-scope-picker .cc-multi-chevron { flex: 0 0 16px; margin-left: auto; transform: rotate(90deg); transition: transform .18s ease; }
.sc-scope-picker .cc-multi-trigger[aria-expanded=true] .cc-multi-chevron { transform: rotate(-90deg); }
.sc-option-rule-detail { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--sc-line); }
.sc-option-rule-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.sc-option-rule-detail-head strong { display: block; font-size: 12px; }
.sc-option-rule-detail-head small { display: block; margin-top: 2px; color: var(--sc-muted); font-size: 10px; }
.sc-option-rule-detail .sc-rule-tree, .sc-option-rule-detail .sc-rule-empty, .sc-option-rule-detail .sc-scope-picker { margin-top: 0; }
.sc-option-scope-controls { display: grid; grid-template-columns: minmax(0, 1fr); align-items: end; gap: 8px; }
.sc-option-scope-controls > label { display: flex; flex-direction: column; gap: 5px; color: #718097; font-size: 11px; font-weight: 600; }
.sc-condition { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(104px, .7fr) minmax(0, 1.35fr) auto; align-items: end; gap: 8px; margin-top: 9px; }
.sc-condition-control { display: grid; min-width: 0; gap: 5px; color: #718097; font-size: 11px; font-weight: 600; }
.sc-condition-control > span { min-height: 16px; }
.sc-condition-control select { width: 100%; min-width: 0; }
.sc-condition-target { min-width: 0; }
.sc-condition-target .cc-picker-label { min-height: 16px; }
.sc-condition-action { align-self: end; min-width: 68px; min-height: 42px; padding-inline: 11px; white-space: nowrap; }
.sc-rule-empty { margin-top: 12px; padding: 18px; border: 1px dashed #d5dfec; border-radius: 9px; background: #fbfcfe; color: var(--sc-muted); text-align: center; }
.sc-rule-tree { display: grid; min-width: 0; gap: 10px; margin-top: 12px; }
.sc-rule-relation { display: grid; grid-template-columns: minmax(120px, .35fr) minmax(0, 1fr); align-items: center; gap: 10px; width: 100%; min-width: 0; padding: 10px 12px; border-radius: 8px; background: #f4f7fb; color: var(--sc-muted); }
.sc-rule-relation span { font-size: 11px; font-weight: 600; }
.sc-rule-relation select { width: 100%; min-width: 0; }
.sc-rule-relation > .select-control, .sc-rule-group > header > .select-control { width: auto; max-width: 100%; min-width: 0; justify-self: stretch; }
.sc-rule-group { width: 100%; min-width: 0; padding: 12px; border: 1px solid var(--sc-line); border-radius: 10px; background: #fbfcfe; }
.sc-rule-group > header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, 220px) auto; align-items: center; gap: 10px; margin-bottom: 9px; padding-bottom: 9px; border-bottom: 1px solid #e8eef5; }
.sc-rule-group > header > div { min-width: 0; }
.sc-rule-group > header b, .sc-rule-group > header small { display: block; }
.sc-rule-group > header small { margin-top: 2px; color: var(--sc-muted); font-size: 10px; }
.sc-rule-group > header select { width: 100%; min-width: 0; }
.sc-rule-add { margin-top: 9px; }

/* Dialogs and option drawer */
.sc-dialog { width: min(960px, calc(100vw - 30px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--sc-line); border-radius: 15px; background: #fff; color: var(--sc-text); box-shadow: 0 24px 76px rgba(23, 32, 51, .28); overflow: hidden; }
.sc-dialog::backdrop { background: rgba(21, 32, 51, .52); backdrop-filter: blur(1px); }
.sc-dialog-head, .sc-dialog-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 22px; border-bottom: 1px solid var(--sc-line); }
.sc-dialog-head h3 { font-size: 20px; }
.sc-dialog-head p { margin-top: 5px; color: var(--sc-muted); }
.sc-dialog-foot { justify-content: flex-end; border-top: 1px solid var(--sc-line); border-bottom: 0; }
.sc-close { padding: 4px 8px; border: 0; background: transparent; color: var(--sc-muted); font-size: 24px; }
.sc-dialog-body { max-height: calc(100dvh - 170px); padding: 20px 22px; background: #f8f9fc; overflow: auto; }
.sc-matrix-editor-dialog[open], .sc-history-dialog[open] { display: flex; flex-direction: column; }
.sc-matrix-editor-dialog .sc-dialog-head, .sc-matrix-editor-dialog .sc-dialog-foot, .sc-history-dialog .sc-dialog-head, .sc-history-dialog .sc-dialog-foot { flex: 0 0 auto; }
.sc-matrix-editor-dialog .sc-dialog-body, .sc-history-dialog .sc-dialog-body { flex: 1 1 auto; min-height: 0; max-height: none; overscroll-behavior: contain; }
.sc-option-drawer { position: fixed; inset: 0 0 0 auto; width: min(980px, calc(100vw - 280px)); height: 100dvh; max-height: 100dvh; margin: 0; border-width: 0 0 0 1px; border-radius: 0; }
.sc-option-drawer .sc-dialog-head { min-height: 88px; padding: 18px 24px; }
.sc-option-drawer .sc-dialog-body { height: calc(100dvh - 158px); max-height: none; padding: 16px 22px; }
.sc-option-drawer .sc-dialog-body > .sc-section { margin-bottom: 12px; }
.sc-option-drawer .sc-dialog-foot { position: absolute; right: 0; bottom: 0; left: 0; min-height: 70px; padding: 12px 22px; background: #fff; }
/* 物料规则卡片：头部“动作 + 删除规则”，字段区自适应列宽；
   适用型号、按型号用量、口径提示都是整行元素——旧版固定 5 列网格放不下这些新增内容，
   会把删除按钮挤到隐式格里并被物料选择面板盖住（PCC-SALES-RULE-MODEL-084）。 */
.sc-material-row { display: grid; gap: 10px; padding: 12px; margin-bottom: 10px; border: 1px solid var(--sc-line); border-radius: 10px; background: var(--sc-card); }
.sc-material-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sc-material-head > label { flex: 0 1 220px; }
.sc-material-delete { flex: none; }
.sc-material-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 12px; align-items: end; }
.sc-material-fields > .sc-material-models,
.sc-material-fields > .sc-model-quantities,
.sc-material-fields > .sc-material-scope-hint,
.sc-material-fields > .sc-help { grid-column: 1 / -1; }
.sc-material-fields > .sc-model-quantities { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.sc-material-scope-hint { margin: 0; }
/* 控件文字样式统一：标签、下拉、输入、树形选择触发器同字号同高 */
.sc-material-row label { font-size: 11px; font-weight: 600; color: #718097; }
.sc-material-row select, .sc-material-row input:not([type=checkbox]), .sc-material-row .cc-picker-trigger { font: 500 12px 'Noto Sans SC', 'DM Sans', sans-serif; }
.sc-material-row .cc-multi-control { min-height: 42px; border-color: #d5dfec; border-radius: 8px; background: var(--sc-card); }
.sc-material-row .cc-multi-chip, .sc-material-row .cc-multi-trigger, .sc-material-row .cc-multi-option { font: 500 12px 'Noto Sans SC', 'DM Sans', sans-serif; }
.sc-material-row .cc-picker-label { font-size: 11px; font-weight: 600; }
.sc-accompany-row { display: grid; grid-template-columns: 1fr 120px 160px auto; gap: 8px; align-items: end; padding: 12px; border-bottom: 1px solid var(--sc-line); }
.sc-material-row .cc-value-picker { gap: 7px; }
.sc-material-row .cc-picker-label { color: #718097; font-size: 11px; font-weight: 600; }
.sc-material-row .cc-picker-trigger { height: 42px; min-height: 42px; padding: 9px 11px; border: 1px solid #d5dfec; border-radius: 8px; background: var(--sc-card); color: var(--sc-text); font: 500 12px 'Noto Sans SC', 'DM Sans', sans-serif; }
.sc-material-row .cc-picker-panel, .sc-material-row .cc-picker-hint { border-color: var(--sc-line); }
.sc-material-row .cc-picker-trigger:focus-visible { outline: 2px solid #73a7ff; outline-offset: 1px; }
.sc-accompany-row { grid-template-columns: 1fr 120px 160px auto; }
.sc-upload { display: flex; align-items: center; gap: 10px; min-height: 42px; }
.sc-upload img { width: 46px; height: 46px; border-radius: 7px; object-fit: cover; }
.sc-upload input { display: none; }

/* Preview and field library */
.sc-preview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sc-preview section { padding: 13px; border: 1px solid var(--sc-line); border-radius: 10px; background: #fff; }
.sc-preview-options { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.sc-preview-options span { padding: 7px 9px; border-radius: 7px; background: var(--sc-subtle); }
.sc-library-mode { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.sc-library-mode button { padding: 13px; border: 1px solid var(--sc-line); border-radius: 9px; background: #fff; color: var(--sc-text); text-align: left; }
.sc-library-mode button.active { border-color: #82b4fa; background: var(--sc-blue-soft); box-shadow: 0 0 0 2px #deebff; }
.sc-library-mode strong, .sc-library-mode small { display: block; }
.sc-library-mode small { margin-top: 4px; color: var(--sc-muted); }
.sc-library-list { display: grid; gap: 10px; }
.sc-library-list section { overflow: hidden; border: 1px solid var(--sc-line); border-radius: 10px; background: #fff; }
.sc-library-list section > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: #f6f8fb; }
.sc-library-list section > header small { flex: 0 0 auto; padding-right: 13px; color: var(--sc-muted); white-space: nowrap; }
.sc-library-group-toggle { display: flex; align-items: center; gap: 7px; min-width: 0; flex: 1; padding: 8px 13px; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; }
.sc-library-group-toggle:hover { color: var(--sc-blue); }
.sc-library-group-toggle:focus-visible { outline: 2px solid var(--sc-blue); outline-offset: -2px; }
.sc-library-group-toggle strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-library-group-items[hidden] { display: none; }
.sc-library-list label { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border-top: 1px solid #edf1f6; }
.sc-library-list label:hover { background: #fafcff; }
.sc-library-list label span, .sc-library-list label b, .sc-library-list label small { display: block; }
.sc-library-list label small { margin-top: 3px; color: var(--sc-muted); }

/* Material matrix */
.sc-file-action { display: inline-flex; cursor: pointer; }
.sc-file-action input { display: none; }
.sc-matrix-scope { margin: 10px 0 0; }
.sc-material-models { min-width: 0; }
.sc-matrix-progress { margin: 10px 0 0; color: var(--sc-muted); font-size: 11px; font-weight: 400; line-height: 1.65; }
.sc-matrix-progress strong { color: var(--sc-text); font-weight: 600; }
.sc-matrix-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.sc-matrix-table th, .sc-matrix-table td { min-width: 140px; padding: 8px; border-right: 1px solid var(--sc-line); border-bottom: 1px solid var(--sc-line); background: #fff; }
.sc-matrix-table th:first-child { min-width: 110px; }
.sc-matrix-table tr:last-child th, .sc-matrix-table tr:last-child td { border-bottom: 0; }
.sc-matrix-table th:last-child, .sc-matrix-table td:last-child { border-right: 0; }
.sc-matrix-cell { display: block; width: 100%; min-height: 58px; padding: 9px; border: 1px solid #e0e7f0; border-radius: 8px; background: #f9fbfd; color: var(--sc-text); text-align: left; }
.sc-matrix-cell small, .sc-matrix-cell strong { display: block; }
.sc-matrix-cell small { color: var(--sc-muted); font-size: 9px; }
.sc-matrix-cell strong { margin-top: 5px; font-size: 11px; }
.sc-matrix-cell.warning { border-color: #efd29a; background: #fff9ef; color: #a36506; }
.sc-matrix-cell.active { border-color: #b8d2f6; background: #f1f7ff; color: #216fd2; }
.sc-matrix-cell.selected { box-shadow: 0 0 0 2px #4d95f4; }
.sc-matrix-cell-panel { margin-top: 12px; padding: 14px; border: 1px solid #bad2f1; border-radius: 10px; background: #f5f9ff; }
.sc-matrix-cell-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.sc-matrix-cell-panel > header small, .sc-matrix-cell-panel > header strong { display: block; }
.sc-matrix-cell-panel > header small { color: var(--sc-blue); font-size: 9px; font-weight: 700; }
.sc-matrix-cell-panel > header strong { margin-top: 4px; }
.sc-cell-state { display: grid; grid-template-columns: repeat(2, minmax(110px, 1fr)); gap: 4px; padding: 3px; border-radius: 8px; background: #e9eef5; }
.sc-cell-state button { min-height: 34px; border: 0; border-radius: 6px; background: transparent; color: var(--sc-muted); font-weight: 600; }
.sc-cell-state button.active { background: #fff; color: var(--sc-blue); box-shadow: 0 1px 5px rgba(35, 58, 92, .08); }
.sc-cell-editor { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px 12px; align-items: end; padding-top: 3px; }
.sc-cell-editor > select, .sc-cell-editor > .sc-input-unit { display: inline-flex; width: 100%; margin: 0; }
.sc-cell-editor > [data-material-picker] { width: 100%; }
.sc-matrix-additions { display: grid; gap: 7px; min-width: 0; }
.sc-matrix-additions > div { display: grid; grid-template-columns: minmax(200px, 1.3fr) minmax(140px, .9fr) minmax(110px, .7fr) auto; gap: 8px; align-items: end; padding: 8px; border: 1px solid var(--sc-line); border-radius: 8px; background: #fff; }
.sc-matrix-additions > .btn { justify-self: start; }
.sc-cell-editor > .sc-matrix-additions { grid-column: 1 / -1; min-width: 0; }
@media (max-width: 900px) {
  .sc-cell-editor { grid-template-columns: 1fr; }
  .sc-matrix-additions > div { grid-template-columns: 1fr; }
}

/* Dark theme */
[data-theme=dark] .sc { --sc-bg: #0c1420; --sc-card: #121c2b; --sc-subtle: #172335; --sc-line: #28364b; --sc-text: #e8eef8; --sc-text-2: #b8c5d7; --sc-muted: #8f9db1; --sc-blue: #6da8ff; --sc-blue-soft: #172b49; }
[data-theme=dark] .sc-pane, [data-theme=dark] .sc-editor-head, [data-theme=dark] .sc-tabs, [data-theme=dark] .sc-footer-save, [data-theme=dark] .sc-section, [data-theme=dark] .sc-table-wrap, [data-theme=dark] .sc-table td, [data-theme=dark] .sc-field-card, [data-theme=dark] .sc-dialog, [data-theme=dark] .sc-option-drawer .sc-dialog-foot, [data-theme=dark] .sc-library-list section, [data-theme=dark] .sc-preview section, [data-theme=dark] .sc input:not([type=checkbox]):not([type=file]), [data-theme=dark] .sc select, [data-theme=dark] .sc textarea, [data-theme=dark] .sc-input-unit { background: var(--sc-card); }
[data-theme=dark] .sc-pane:first-child, [data-theme=dark] .sc-pane:nth-child(2), [data-theme=dark] .sc-editor-body, [data-theme=dark] .sc-dialog-body, [data-theme=dark] .sc-empty, [data-theme=dark] .sc-rule-empty, [data-theme=dark] .sc-rule-relation, [data-theme=dark] .sc-rule-group { background: var(--sc-bg); }
[data-theme=dark] .sc-status { border-color: #2d4666; background: #14253b; }
[data-theme=dark] .sc-status i { box-shadow: 0 0 0 4px #1c2b40; }
[data-theme=dark] .sc-category-row:hover, [data-theme=dark] .sc-field-card:hover, [data-theme=dark] .sc-choice button.active, [data-theme=dark] .sc-cell-state button.active { background: #172438; }
[data-theme=dark] .sc-category-row.active, [data-theme=dark] .sc-field-card.active, [data-theme=dark] .sc-library-mode button.active, [data-theme=dark] .sc-editor-symbol { background: #172b49; }
[data-theme=dark] .sc-table th, [data-theme=dark] .sc-library-list section > header { background: #172335; }
[data-theme=dark] .sc-option-drawer .sc-rule-group, [data-theme=dark] .sc-matrix-additions > div, [data-theme=dark] .sc-matrix-table th, [data-theme=dark] .sc-matrix-table td, [data-theme=dark] .sc-matrix-cell, [data-theme=dark] .sc-matrix-cell-panel { background: #121c2b; }
[data-theme=dark] .sc input:disabled { background: #0e1826; }
[data-theme=dark] .sc-option-row { background: var(--sc-card); }
[data-theme=dark] .sc-option-meta > span { background: #172335; }
[data-theme=dark] .sc-material-row .cc-picker-label { color: var(--sc-muted); }
[data-theme=dark] .sc-material-row .cc-picker-trigger { border-color: var(--sc-line); background: var(--sc-card); color: var(--sc-text); }
[data-theme=dark] .sc-notice.warning { border-color: #70551f; background: #2b2415; color: #f7c86a; }

/* Responsive */
@media (max-width: 1320px) {
  .sc-workspace { grid-template-columns: 185px 270px minmax(540px, 1fr); }
  .sc-pane { padding: 14px; }
  .sc-pane:first-child { padding-inline: 10px; }
  .sc-field-card { grid-template-columns: 14px 32px minmax(0, 1fr) 20px; gap: 6px; }
  .sc-pane-actions .btn { padding-inline: 8px; }
}
@media (max-width: 1060px) {
  .sc-head { align-items: flex-start; flex-direction: column; }
  .sc-actions { justify-content: flex-start; }
  .sc-status > .sc-actions { width: 100%; margin-left: 0; }
  .sc-workspace { grid-template-columns: minmax(160px, .75fr) minmax(220px, 1fr) minmax(0, 2fr); height: auto; max-height: none; overflow: hidden; }
  .sc-editor-body { min-height: 560px; }
}
@media (max-width: 900px) {
  .sc-reference-alert, .sc-reference-alert-copy { align-items: flex-start; flex-direction: column; }
  .sc-actions-publish { padding-left: 0; border-left: 0; }
  .sc-workspace { display: block; overflow: visible; }
  .sc-pane { overflow: visible; border-right: 0; border-bottom: 1px solid var(--sc-line); }
  .sc-pane:nth-child(2) { display: block; overflow: visible; }
  .sc-pane:nth-child(2) > .sc-field-list { overflow: visible; }
  .sc-pane:last-child { overflow: visible; }
  .sc-form, .sc-preview, .sc-library-mode { grid-template-columns: 1fr; }
  .sc-form:has(> label > .sc-money-control) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-form label.full { grid-column: auto; }
  .sc-condition { grid-template-columns: minmax(0, 1fr) minmax(112px, .7fr); }
  .sc-condition-target { grid-column: 1 / -1; }
  .sc-condition-action { grid-column: 1 / -1; justify-self: end; min-height: 38px; }
  .sc-option-row { grid-template-columns: 24px minmax(0, 1fr); }
  .sc-option-actions { grid-column: 2; flex-direction: row; justify-content: flex-end; }
  .sc-option-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-rule-group > header { grid-template-columns: minmax(0, 1fr) auto; }
  .sc-rule-group > header > div { grid-column: 1 / -1; width: 100%; }
  .sc-rule-group > header select { width: 100%; }
  .sc-matrix-cell-panel > header { align-items: flex-start; flex-direction: column; }
  .sc-cell-state { width: 100%; }
  .sc-option-drawer { width: 100vw; }
  .sc-option-drawer .sc-dialog-head, .sc-option-drawer .sc-dialog-foot { padding-inline: 16px; }
  .sc-option-drawer .sc-dialog-body { padding: 14px; }
  .sc-accompany-row, .sc-matrix-additions > div { grid-template-columns: 1fr 1fr; }
  /* 规则卡片本身是纵向两段（头部 + 字段区），字段区在窄屏收成单列 */
  .sc-material-fields { grid-template-columns: 1fr; }
  .sc-material-head { flex-wrap: wrap; }
  .sc-matrix-additions { min-width: 320px; }
}
@media (max-width: 600px) {
  .sc-form:has(> label > .sc-money-control) { grid-template-columns: 1fr; }
  .sc-rule-relation { grid-template-columns: 1fr; justify-content: stretch; }
  .sc-condition { grid-template-columns: 1fr; }
  .sc-condition-target, .sc-condition-action { grid-column: auto; }
  .sc-condition-action { justify-self: stretch; width: 100%; }
  .sc-rule-group > header { grid-template-columns: 1fr; }
  .sc-rule-group > header > div { grid-column: auto; }
  .sc-rule-group > header .sc-condition-action { width: 100%; }
}

@container sc-condition-editor (max-width: 760px) {
  .sc-rule-relation { grid-template-columns: 1fr; }
  .sc-rule-group > header { grid-template-columns: minmax(0, 1fr) auto; }
  .sc-rule-group > header > div { grid-column: 1 / -1; }
  .sc-rule-group > header > .select-control { grid-column: 1; }
  .sc-rule-group > header > .sc-condition-action { grid-column: 2; }
  .sc-condition { grid-template-columns: minmax(0, 1fr) minmax(104px, .65fr); }
  .sc-condition-target { grid-column: 1 / -1; }
  .sc-condition-action { grid-column: 1 / -1; justify-self: end; }
}

@container sc-condition-editor (max-width: 480px) {
  .sc-rule-group > header, .sc-condition { grid-template-columns: 1fr; }
  .sc-rule-group > header > div, .sc-rule-group > header > .select-control, .sc-rule-group > header > .sc-condition-action, .sc-condition-target, .sc-condition-action { grid-column: auto; }
  .sc-condition-action, .sc-rule-group > header .sc-condition-action { justify-self: stretch; width: 100%; }
}

/* PCC-PROCESS-STEP-TOGGLE-567：停用配置项在列表中的灰色呈现 */
.sc-field-card.is-disabled { background: #f6f7f9; box-shadow: none; }
.sc-field-card.is-disabled .sc-field-main strong, .sc-field-card.is-disabled .sc-field-main small { color: #9aa4b2; }
.sc-field-card.is-disabled .sc-order { background: #e8ebee !important; color: #8b95a3 !important; }