:root {
  --navy-950: #071426;
  --navy-900: #10233f;
  --navy-800: #163457;
  --blue-700: #1955a5;
  --blue-600: #1f66cc;
  --blue-100: #e8f1ff;
  --blue-50: #f4f8ff;
  --cyan-600: #068897;
  --cyan-100: #dcf7f6;
  --green-700: #117354;
  --green-100: #ddf7eb;
  --amber-700: #9c5d08;
  --amber-100: #fff0cf;
  --red-700: #b53737;
  --red-200: #f4bab5;
  --red-100: #ffe4e1;
  --slate-900: #172235;
  --slate-700: #48566b;
  --slate-600: #647187;
  --slate-500: #7b8798;
  --slate-300: #cbd3df;
  --slate-200: #dde3eb;
  --slate-100: #edf1f5;
  --slate-50: #f6f8fb;
  --white: #fff;
  --page: #f1f4f8;
  --shadow-sm: 0 1px 2px rgba(10, 24, 45, .05), 0 4px 14px rgba(10, 24, 45, .04);
  --shadow-lg: 0 24px 60px rgba(9, 24, 45, .22);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --sidebar-width: 244px;
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--page); }
body { margin: 0; color: var(--slate-900); background: var(--page); font-family: var(--font); font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { color: inherit; font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .48; transform: none !important; box-shadow: none !important; }
h1, h2, h3, h4, p, dl, dd { margin: 0; }
h1, h2, h3, h4 { line-height: 1.25; }
input, select, textarea { min-width: 0; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid rgba(31, 102, 204, .28); outline-offset: 2px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; padding: 9px 14px; border-radius: var(--radius-sm); color: var(--white); background: var(--blue-700); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

.auth-screen { display: grid; min-height: 100vh; place-items: center; padding: 28px 18px; background: radial-gradient(circle at 18% 16%, rgba(51, 132, 224, .2), transparent 34%), radial-gradient(circle at 86% 82%, rgba(6, 136, 151, .15), transparent 32%), linear-gradient(145deg, #071426, #102c4f 58%, #0d3a50); }
.auth-card { width: min(440px, 100%); padding: 34px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 22px; background: rgba(255, 255, 255, .97); box-shadow: 0 30px 80px rgba(0, 9, 25, .35); }
.auth-brand { display: grid; width: 50px; height: 50px; margin-bottom: 24px; place-items: center; border-radius: 14px; color: var(--white); background: linear-gradient(145deg, var(--blue-600), var(--cyan-600)); font-size: 14px; font-weight: 900; letter-spacing: .1em; box-shadow: 0 10px 24px rgba(31, 102, 204, .24); }
.auth-card header > span { color: var(--blue-700); font-size: 11px; font-weight: 850; letter-spacing: .1em; }
.auth-card header h1 { margin-top: 4px; font-size: 26px; letter-spacing: -.035em; }
.auth-card header p { margin-top: 9px; color: var(--slate-600); font-size: 12px; }
.auth-form { display: grid; gap: 15px; margin-top: 26px; }
.auth-form > label { display: grid; gap: 6px; color: var(--slate-700); font-size: 11px; font-weight: 800; }
.auth-form input { width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--slate-300); border-radius: 9px; background: var(--white); outline: none; transition: border .15s ease, box-shadow .15s ease; }
.auth-form input:focus { border-color: var(--blue-600); box-shadow: 0 0 0 3px rgba(31, 102, 204, .12); }
.auth-submit { width: 100%; min-height: 44px; margin-top: 2px; }
.auth-error { padding: 10px 12px; border: 1px solid var(--red-200); border-radius: 8px; color: var(--red-700); background: var(--red-100); font-size: 11px; font-weight: 700; }
.auth-change-heading { padding: 12px 13px; border-radius: 9px; background: var(--blue-50); }
.auth-change-heading strong { display: block; color: var(--navy-800); }
.auth-change-heading p { margin-top: 3px; color: var(--slate-600); font-size: 10px; }
.auth-form-actions { display: flex; justify-content: flex-end; gap: 8px; }
.auth-form-actions .auth-submit { width: auto; margin: 0; }

.app-shell { min-height: 100vh; }
.sidebar {
  position: fixed; z-index: 30; inset: 0 auto 0 0; display: flex; width: var(--sidebar-width); flex-direction: column;
  color: #dce7f5; background: linear-gradient(180deg, var(--navy-950) 0%, #0d223e 100%); box-shadow: inset -1px 0 rgba(255, 255, 255, .05);
}
.brand { display: flex; align-items: center; gap: 12px; min-height: 82px; padding: 18px 20px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.brand-mark { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(132, 196, 255, .48); border-radius: 11px; color: #b9dcff; background: rgba(72, 153, 239, .15); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.brand strong { display: block; }
.brand strong { color: var(--white); font-size: 16px; letter-spacing: .02em; }
.main-nav { display: grid; gap: 4px; padding: 22px 12px; overflow-y: auto; }
.nav-item { display: flex; position: relative; align-items: center; gap: 12px; width: 100%; padding: 11px 12px; border: 0; border-radius: 9px; color: #b8c6d8; background: transparent; text-align: left; transition: background .16s ease, color .16s ease, transform .16s ease; }
.nav-item:hover { color: var(--white); background: rgba(255, 255, 255, .06); }
.nav-item.is-active { color: var(--white); background: linear-gradient(90deg, rgba(39, 117, 204, .34), rgba(39, 117, 204, .13)); }
.nav-item.is-active::before { position: absolute; left: -12px; width: 3px; height: 22px; border-radius: 0 3px 3px 0; background: #55a7ff; content: ""; }
.nav-icon { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(255, 255, 255, .11); border-radius: 7px; color: #a8c4e3; font-size: 13px; font-weight: 700; }
.nav-item.is-active .nav-icon { border-color: rgba(124, 190, 255, .42); color: #d9edff; background: rgba(98, 170, 243, .16); }
.sidebar-note { display: flex; align-items: center; gap: 10px; margin: auto 14px 16px; padding: 13px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; background: rgba(255, 255, 255, .035); }
.sidebar-note strong { display: block; }
.sidebar-note strong { color: #dce7f5; font-size: 12px; }
.connection-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--amber-100); box-shadow: 0 0 0 4px rgba(255, 207, 110, .08); }
.connection-dot.is-online { background: #4bd19a; box-shadow: 0 0 0 4px rgba(75, 209, 154, .1); }
.connection-dot.is-offline { background: #fa7272; box-shadow: 0 0 0 4px rgba(250, 114, 114, .1); }

.main-area { min-height: 100vh; margin-left: var(--sidebar-width); }
.topbar { display: flex; position: sticky; z-index: 20; top: 0; align-items: center; min-height: 82px; padding: 13px clamp(20px, 3vw, 42px); border-bottom: 1px solid var(--slate-200); background: rgba(255, 255, 255, .94); backdrop-filter: blur(12px); }
.page-heading { min-width: 160px; }
.page-heading h1 { font-size: 20px; letter-spacing: -.02em; }
.topbar-actions { display: flex; align-items: center; gap: 9px; margin-left: auto; }
.current-user { display: grid; grid-template-columns: auto auto auto; align-items: center; gap: 9px; margin-left: 3px; padding-left: 12px; border-left: 1px solid var(--slate-200); }
.current-user > div { display: grid; min-width: 78px; }
.current-user > div strong { max-width: 130px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.current-user > div small { color: var(--slate-500); font-size: 9px; }
.mobile-menu { display: none !important; margin-right: 9px; }
.icon-button { display: inline-grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border: 1px solid var(--slate-200); border-radius: 9px; color: var(--slate-700); background: var(--white); font-size: 18px; line-height: 1; }
.icon-button:hover { border-color: var(--slate-300); color: var(--blue-700); background: var(--slate-50); }
.icon-button.small { width: 30px; height: 30px; font-size: 14px; }
.icon-button.is-spinning { animation: spin .65s linear infinite; }
.search-trigger { display: flex; align-items: center; gap: 8px; min-width: 188px; height: 38px; padding: 0 9px 0 12px; border: 1px solid var(--slate-200); border-radius: 9px; color: var(--slate-500); background: var(--slate-50); text-align: left; }
.search-trigger span:nth-child(2) { flex: 1; }
kbd { padding: 2px 5px; border: 1px solid var(--slate-300); border-radius: 5px; color: var(--slate-500); background: var(--white); font-family: inherit; font-size: 10px; box-shadow: 0 1px 0 var(--slate-200); }
.button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 8px 15px; border: 1px solid transparent; border-radius: 9px; font-weight: 700; text-decoration: none; transition: transform .14s ease, box-shadow .14s ease, background .14s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { border-color: var(--blue-600); color: var(--white); background: var(--blue-600); box-shadow: 0 5px 14px rgba(31, 102, 204, .18); }
.button-primary:hover { background: #185ab8; }
.button-secondary { border-color: var(--slate-200); color: var(--slate-700); background: var(--white); }
.button-secondary:hover { border-color: #aab7c7; background: var(--slate-50); }
.button-danger { border-color: #d76565; color: var(--white); background: var(--red-700); box-shadow: 0 5px 14px rgba(181, 55, 55, .16); }
.button-danger:hover { background: #9f2f2f; }
.button-small { min-height: 32px; padding: 5px 11px; border-radius: 7px; font-size: 12px; }
.text-button { padding: 3px 0; border: 0; color: var(--blue-600); background: transparent; font-size: 12px; font-weight: 700; }
.text-button:hover { color: var(--blue-700); text-decoration: underline; text-underline-offset: 3px; }
.text-danger { color: var(--red-700); }
.text-danger:hover { color: #922929; }

.content { width: 100%; max-width: 1680px; margin: 0 auto; padding: 30px clamp(20px, 3vw, 42px) 54px; }
.module-action-bar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-bottom: 16px; }
.module-tabs + .module-action-bar { margin-top: -12px; }
.page-loading { display: grid; min-height: calc(100vh - 160px); place-content: center; justify-items: center; color: var(--slate-600); text-align: center; }
.page-loading strong { margin-top: 14px; color: var(--slate-900); font-size: 16px; }
.spinner { width: 30px; height: 30px; border: 3px solid var(--slate-200); border-top-color: var(--blue-600); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.empty-state { display: grid; min-height: 420px; place-content: center; justify-items: center; padding: 40px; text-align: center; }
.empty-state h2 { margin-top: 16px; font-size: 20px; }
.empty-state p { max-width: 480px; margin: 7px 0 20px; color: var(--slate-600); }
.empty-icon { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 50%; color: var(--red-700); background: var(--red-100); font-size: 24px; font-weight: 800; }
.inline-empty { display: flex; align-items: center; gap: 13px; width: 100%; min-height: 100px; padding: 22px; border: 1px dashed var(--slate-300); border-radius: var(--radius-md); color: var(--slate-600); background: var(--slate-50); }
.inline-empty > span { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 9px; color: var(--blue-600); background: var(--blue-100); }
.inline-empty div { flex: 1; }
.inline-empty strong { color: var(--slate-900); }
.inline-empty p { margin-top: 2px; font-size: 12px; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 16px; }
.metric-card { display: flex; min-height: 112px; align-items: center; gap: 14px; padding: 19px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.metric-icon { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 11px; color: var(--blue-700); background: var(--blue-100); font-weight: 800; }
.metric-card > div:last-child { min-width: 0; }
.metric-card span, .metric-card small { display: block; color: var(--slate-600); }
.metric-card span { font-size: 11px; font-weight: 700; }
.metric-card strong { display: block; overflow: hidden; margin: 2px 0; font-size: 21px; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.metric-card small { font-size: 10px; }
.metric-good .metric-icon { color: var(--green-700); background: var(--green-100); }
.metric-risk .metric-icon { color: var(--red-700); background: var(--red-100); }

.panel { min-width: 0; padding: 20px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.panel-header, .section-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 17px; }
.panel-header h3, .section-header h3 { font-size: 16px; }
.section-header > span { color: var(--slate-600); font-size: 12px; }
.count-pill { min-width: 28px; padding: 3px 8px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: 11px; font-weight: 800; text-align: center; }

.module-tabs { display: flex; gap: 4px; margin: 0 0 18px; padding: 4px; overflow-x: auto; border: 1px solid var(--slate-200); border-radius: 11px; background: rgba(255, 255, 255, .72); box-shadow: var(--shadow-sm); }
.module-tab { min-height: 38px; padding: 7px 18px; border: 0; border-radius: 8px; color: var(--slate-600); background: transparent; font-size: 12px; font-weight: 800; white-space: nowrap; }
.module-tab:hover { color: var(--blue-700); background: var(--blue-50); }
.module-tab.is-active { color: var(--white); background: var(--navy-800); box-shadow: 0 3px 10px rgba(10, 36, 67, .16); }

.attention-list { display: grid; gap: 8px; }
.attention-item { display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 10px; border: 1px solid var(--slate-100); border-radius: 9px; background: var(--slate-50); }
.attention-item > div { min-width: 0; flex: 1; }
.attention-item strong, .attention-item p { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attention-item strong { font-size: 12px; }
.attention-item p { margin-top: 2px; color: var(--slate-600); font-size: 10px; }
.attention-level { min-width: 35px; padding: 4px 6px; border-radius: 6px; color: var(--amber-700); background: var(--amber-100); font-size: 9px; font-weight: 800; text-align: center; }
.level-high { color: var(--red-700); background: var(--red-100); }

.dashboard-section { min-width: 0; }
.dashboard-section + .dashboard-section { margin-top: 24px; }
.dashboard-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.dashboard-section-head > div { min-width: 0; }
.dashboard-section-head > div > span { display: block; margin-bottom: 3px; color: var(--blue-700); font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.dashboard-section-head h2 { font-size: 18px; letter-spacing: -.02em; }
.dashboard-section-head > small { max-width: 440px; color: var(--slate-500); font-size: 9px; text-align: right; }
.dashboard-section-head > strong { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: 10px; }
.operating-data-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.operating-data-card { --operating-tone: var(--blue-600); position: relative; min-width: 0; overflow: hidden; padding: 17px 18px 15px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.operating-data-card::before { position: absolute; inset: 0 0 auto; height: 3px; background: var(--operating-tone); content: ""; }
.operating-data-card.tone-sales { --operating-tone: var(--blue-600); }
.operating-data-card.tone-receipt { --operating-tone: var(--green-700); }
.operating-data-card.tone-purchase { --operating-tone: var(--cyan-600); }
.operating-data-card.tone-invoice { --operating-tone: #7856b3; }
.operating-data-card header { margin-bottom: 11px; }
.operating-data-card header span { color: var(--operating-tone); font-size: 11px; font-weight: 850; }
.operating-data-card dl { display: grid; }
.operating-data-card dl > div { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid var(--slate-100); }
.operating-data-card dt { color: var(--slate-500); font-size: 9px; }
.operating-data-card dd { min-width: 0; overflow: hidden; font-size: 12px; font-weight: 800; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.worklist-board { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; align-items: start; }
.worklist-group { --worklist-tone: var(--blue-600); min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.worklist-sales { --worklist-tone: var(--blue-600); }
.worklist-purchase { --worklist-tone: var(--cyan-600); }
.worklist-cash { --worklist-tone: var(--green-700); }
.worklist-receipt { --worklist-tone: var(--green-700); }
.worklist-payment { --worklist-tone: var(--amber-700); }
.worklist-invoice { --worklist-tone: #7856b3; }
.worklist-group > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 11px 13px; border-top: 3px solid var(--worklist-tone); border-bottom: 1px solid var(--slate-100); }
.worklist-group > header h3 { font-size: 12px; }
.worklist-group > header span, .finance-task-grid > article > header span { min-width: 24px; padding: 2px 7px; border-radius: 999px; color: var(--worklist-tone); background: color-mix(in srgb, var(--worklist-tone) 11%, white); font-size: 9px; font-weight: 850; text-align: center; }
.worklist-group > div, .finance-task-grid > article > div { display: grid; padding: 0 11px; }
.worklist-group > small { display: block; padding: 9px 12px 11px; border-top: 1px solid var(--slate-100); color: var(--slate-500); font-size: 8px; }
.work-item { display: grid; grid-template-columns: 7px minmax(0, 1fr) auto auto; align-items: center; gap: 8px; min-width: 0; min-height: 58px; padding: 9px 0; }
.work-item + .work-item { border-top: 1px solid var(--slate-100); }
.work-item.is-blocked { background: linear-gradient(90deg, rgba(255, 240, 207, .35), transparent 72%); }
.work-item-level { width: 6px; height: 24px; border-radius: 999px; background: var(--slate-300); }
.work-item-level.is-high { background: var(--red-700); box-shadow: 0 0 0 3px rgba(181, 55, 55, .09); }
.work-item > div { min-width: 0; }
.work-item > div strong, .work-item > div p, .work-item > div small { display: block; }
.work-item > div strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.work-item > div p { display: -webkit-box; margin-top: 2px; overflow: hidden; color: var(--slate-500); font-size: 8px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.work-item > div small { margin-top: 3px; color: var(--amber-700); font-size: 8px; }
.work-item > b { max-width: 105px; overflow: hidden; color: var(--slate-700); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.work-item > .icon-button { width: 28px; height: 28px; }
.worklist-clear { padding: 20px 8px; color: var(--green-700); font-size: 9px; text-align: center; }

.trace-block { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--slate-100); }
.trace-label { display: block; margin-bottom: 7px; color: var(--slate-500); font-size: 9px; font-weight: 800; letter-spacing: .05em; }
.trace-chain { display: flex; align-items: stretch; gap: 5px; overflow-x: auto; padding-bottom: 3px; }
.trace-chain i { display: grid; place-items: center; color: var(--slate-300); font-size: 9px; font-style: normal; }
.trace-chain > div { min-width: 88px; padding: 7px 8px; border: 1px dashed var(--slate-300); border-radius: 7px; color: var(--slate-500); background: var(--slate-50); }
.trace-chain > div.is-done { border-style: solid; border-color: #bfdbd0; color: var(--green-700); background: #f2fbf7; }
.trace-chain span, .trace-chain strong { display: block; }
.trace-chain span { font-size: 8px; }
.trace-chain strong { overflow: hidden; margin-top: 2px; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.mini-metric-row { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 16px; overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.inventory-metrics { grid-template-columns: repeat(3, 1fr); }
.mini-metric-row > div { padding: 14px 18px; }
.mini-metric-row > div + div { border-left: 1px solid var(--slate-200); }
.mini-metric-row span, .mini-metric-row strong { display: block; }
.mini-metric-row span { color: var(--slate-600); font-size: 10px; }
.mini-metric-row strong { margin-top: 2px; font-size: 21px; }
.compact-search { display: flex; position: relative; align-items: center; }
.compact-search input { width: 220px; height: 34px; padding: 6px 34px 6px 10px; border: 1px solid var(--slate-200); border-radius: 8px; background: var(--slate-50); }
.compact-search > span:last-child { position: absolute; right: 11px; color: var(--slate-500); }
.entity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.entity-card { min-width: 0; padding: 15px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); transition: border .15s ease, box-shadow .15s ease, transform .15s ease; }
.entity-card:hover { border-color: #b7c9de; box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.entity-card header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.entity-code { color: var(--blue-700); font-size: 10px; font-weight: 800; letter-spacing: .03em; }
.entity-card h4 { overflow: hidden; margin-top: 12px; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.entity-card > p { min-height: 34px; margin-top: 4px; color: var(--slate-600); font-size: 10px; }
.entity-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--slate-100); }
.entity-card dt { color: var(--slate-500); font-size: 8px; }
.entity-card dd { overflow: hidden; margin-top: 1px; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.material-list { display: grid; gap: 9px; }
.material-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .62fr); align-items: center; gap: 22px; min-width: 0; padding: 16px 18px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); transition: border .15s ease, box-shadow .15s ease; }
.material-row:hover { border-color: #b7c9de; box-shadow: var(--shadow-sm); }
.material-main { min-width: 0; }
.material-title { display: flex; align-items: center; gap: 9px; }
.material-title > strong { font-size: 14px; }
.material-key-details { display: flex; overflow: hidden; align-items: center; gap: 7px; margin-top: 8px; color: var(--slate-700); white-space: nowrap; }
.material-key-details span { padding: 4px 7px; border-radius: 5px; background: var(--slate-50); font-size: 10px; font-weight: 650; }
.material-key-details i { flex: 0 0 auto; color: var(--slate-300); font-size: 13px; font-style: normal; }
.material-meta { display: grid; grid-template-columns: 1.5fr .8fr .65fr; gap: 14px; }
.material-meta span, .material-meta strong { display: block; }
.material-meta span { margin-bottom: 4px; color: var(--slate-500); font-size: 8px; }
.material-meta strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.panel-subtitle { margin-top: 3px; color: var(--slate-500); font-size: 10px; }
.material-code-guide { margin: -3px 0 12px; overflow: hidden; border: 1px solid #c7d9ee; border-radius: 9px; background: var(--blue-50); }
.material-code-guide summary { display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 14px; padding: 9px 12px; list-style: none; cursor: pointer; }
.material-code-guide summary::-webkit-details-marker { display: none; }
.material-code-guide summary strong, .material-code-guide summary small { display: block; }
.material-code-guide summary strong { color: var(--blue-700); font-size: 11px; }
.material-code-guide summary small { margin-top: 1px; color: var(--slate-600); font-size: 9px; }
.material-code-guide summary > span:last-child { color: var(--blue-700); font-size: 17px; transition: transform .16s ease; }
.material-code-guide[open] summary > span:last-child { transform: rotate(45deg); }
.material-code-guide > div { padding: 11px 12px 13px; border-top: 1px solid #d4e2f2; }
.material-code-guide > div > p { color: var(--slate-600); font-size: 10px; }
.material-code-examples { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 12px; margin-top: 9px; align-items: center; }
.material-code-examples code { padding: 3px 6px; border: 1px solid #c9daed; border-radius: 5px; color: var(--navy-800); background: var(--white); font-size: 9px; font-weight: 800; }
.material-code-examples span { color: var(--slate-600); font-size: 9px; }
.material-page-header { margin-bottom: 14px; }
.material-page-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.material-editor-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: -3px 0 14px; padding: 11px 12px; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--slate-50); }
.material-editor-toolbar > div:first-child strong, .material-editor-toolbar > div:first-child small { display: block; }
.material-editor-toolbar > div:first-child strong { color: var(--slate-700); font-size: 10px; }
.material-editor-toolbar > div:first-child small { margin-top: 2px; color: var(--slate-500); font-size: 8px; }
.material-editor-toolbar > div:last-child { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 7px; }
.backend-upgrade-warning, .legacy-backend-warning {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 16px; margin: 12px 0;
  padding: 11px 13px; border: 1px solid #e7c77f; border-left: 4px solid var(--amber-700); border-radius: 9px;
  color: var(--amber-700); background: #fff9eb; box-shadow: var(--shadow-sm);
}
.backend-upgrade-warning strong, .backend-upgrade-warning p, .backend-upgrade-warning > span, .legacy-backend-warning strong, .legacy-backend-warning p { display: block; }
.backend-upgrade-warning strong, .legacy-backend-warning strong { font-size: 11px; }
.backend-upgrade-warning p, .backend-upgrade-warning > span, .legacy-backend-warning p { margin-top: 2px; color: var(--slate-600); font-size: 9px; }
.backend-upgrade-warning > .button, .legacy-backend-warning > .button { grid-column: 2; grid-row: 1 / span 2; white-space: nowrap; }
.material-template-dropdown { display: inline-block; position: relative; z-index: 4; max-width: 100%; }
.material-template-dropdown[open] { z-index: 45; }
.material-template-dropdown > summary {
  display: inline-flex; min-height: 32px; align-items: center; justify-content: center; gap: 8px; padding: 5px 11px;
  border: 1px solid var(--slate-200); border-radius: 7px; color: var(--slate-700); background: var(--white);
  font-size: 12px; font-weight: 700; line-height: 1.4; list-style: none; white-space: nowrap; cursor: pointer;
}
.material-template-dropdown > summary::-webkit-details-marker { display: none; }
.material-template-dropdown > summary::marker { content: ""; }
.material-template-dropdown > summary:hover { border-color: #aab7c7; background: var(--slate-50); }
.material-template-dropdown > summary:focus-visible { outline: 3px solid rgba(31, 102, 204, .28); outline-offset: 2px; }
.material-template-dropdown > summary > span { color: var(--slate-500); font-size: 11px; transition: transform .16s ease; }
.material-template-dropdown[open] > summary { border-color: #aab7c7; color: var(--blue-700); background: var(--blue-50); }
.material-template-dropdown[open] > summary > span { transform: rotate(180deg); }
.material-template-menu {
  position: absolute; z-index: 1; top: calc(100% + 6px); right: 0; display: grid; width: max-content; min-width: 178px;
  padding: 5px; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); box-shadow: 0 12px 30px rgba(9, 24, 45, .18);
}
.material-template-dropdown:not([open]) > .material-template-menu { display: none; }
.material-template-menu a {
  display: flex; min-height: 42px; flex-direction: column; align-items: flex-start; justify-content: center; padding: 7px 10px; border-radius: 6px; color: var(--slate-700);
  font-size: 11px; font-weight: 750; text-decoration: none; white-space: nowrap;
}
.material-template-menu a strong, .material-template-menu a small { display: block; }
.material-template-menu a strong span { color: var(--slate-500); font-size: 9px; font-weight: 650; }
.material-template-menu a small { margin-top: 1px; color: var(--slate-500); font-size: 8px; font-weight: 500; }
.material-template-menu a:hover, .material-template-menu a:focus-visible { color: var(--blue-700); background: var(--blue-50); }
.material-template-menu a:focus-visible { outline: 2px solid rgba(31, 102, 204, .32); outline-offset: -2px; }
.material-category-stack { display: grid; gap: 10px; }
.material-category-group { overflow: hidden; border: 1px solid var(--slate-200); border-radius: 11px; background: var(--white); transition: border-color .15s ease, box-shadow .15s ease; }
.material-category-group[open] { border-color: #b8cbe1; box-shadow: var(--shadow-sm); }
.material-category-group > summary { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto 28px; min-height: 64px; align-items: center; gap: 12px; padding: 10px 14px; list-style: none; cursor: pointer; }
.material-category-group > summary::-webkit-details-marker { display: none; }
.material-category-group > summary::marker { content: ""; }
.material-category-group > summary:hover { background: #fbfcfe; }
.material-category-group[open] > summary { background: var(--blue-50); }
.material-category-group.is-editable[open] > summary { background: #fff9eb; }
.material-category-code { display: grid; width: 38px; height: 34px; place-items: center; border: 1px solid #bdd1e8; border-radius: 8px; color: var(--blue-700); background: var(--blue-50); font-size: 11px; font-weight: 850; letter-spacing: .04em; }
.material-category-group.is-editable .material-category-code { border-color: #ead19d; color: var(--amber-700); background: #fff9eb; }
.material-category-copy { min-width: 0; }
.material-category-copy strong, .material-category-copy small { display: block; }
.material-category-copy strong { font-size: 13px; }
.material-category-copy small { overflow: hidden; margin-top: 3px; color: var(--slate-500); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.material-category-count { padding: 4px 8px; border-radius: 999px; color: var(--slate-600); background: var(--slate-100); font-size: 9px; font-weight: 750; white-space: nowrap; }
.material-category-group > summary .details-chevron { color: var(--slate-500); transition: transform .16s ease; }
.material-category-group[open] > summary .details-chevron { transform: rotate(180deg); }
.material-category-body { padding: 10px 12px 12px; border-top: 1px solid var(--slate-100); background: var(--slate-50); }
.material-category-empty { padding: 18px; border: 1px dashed var(--slate-300); border-radius: 8px; color: var(--slate-500); background: var(--white); font-size: 10px; text-align: center; }
.material-library-table { overflow: hidden; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); }
.material-library-head, .material-library-row { display: grid; grid-template-columns: minmax(300px, 1fr) minmax(170px, .36fr) minmax(110px, .22fr); align-items: center; }
.material-library-table.is-editable .material-library-head, .material-library-row.is-editable { grid-template-columns: minmax(300px, 1fr) minmax(170px, .36fr) minmax(110px, .22fr) 108px; }
.material-library-head { min-height: 38px; color: var(--slate-500); background: var(--slate-50); font-size: 8px; font-weight: 800; letter-spacing: .03em; }
.material-library-head > span, .material-library-row > * { min-width: 0; padding: 8px 12px; }
.material-library-row { min-height: 76px; background: var(--white); }
.material-library-row + .material-library-row { border-top: 1px solid var(--slate-100); }
.material-library-row:hover { background: #fbfcfe; }
.library-material-info > div { display: flex; align-items: center; gap: 8px; }
.library-material-info > div > strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.library-material-info p { display: flex; overflow: hidden; align-items: center; gap: 5px; margin-top: 5px; color: var(--slate-600); white-space: nowrap; }
.library-material-info p span { font-size: 9px; font-weight: 650; }
.library-material-info p i { color: var(--slate-300); font-size: 11px; font-style: normal; }
.library-code strong, .library-code small, .library-stock strong, .library-stock small { display: block; }
.library-code small, .library-stock small { margin-top: 3px; color: var(--slate-500); font-size: 8px; }
.library-row-actions { display: flex; justify-content: flex-end; gap: 12px; }
.material-delete-note { margin-top: 10px; color: var(--slate-500); font-size: 9px; }
.material-library-note { margin-top: 11px; color: var(--slate-500); font-size: 9px; }

.party-list { display: grid; gap: 9px; }
.party-card { overflow: hidden; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); }
.party-card[open] { border-color: #b9cade; box-shadow: var(--shadow-sm); }
.party-card > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 30px; align-items: center; gap: 13px; padding: 14px 16px; list-style: none; cursor: pointer; }
.party-card > summary::-webkit-details-marker { display: none; }
.party-card > summary strong, .party-card > summary small { display: block; }
.party-card > summary strong { margin-top: 3px; font-size: 13px; }
.party-card > summary small { overflow: hidden; margin-top: 2px; color: var(--slate-500); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.party-card-body { padding: 15px 16px 16px; border-top: 1px solid var(--slate-100); background: var(--slate-50); }
.party-card-body dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.party-card-body dl > div { min-width: 0; padding: 10px; border: 1px solid var(--slate-100); border-radius: 8px; background: var(--white); }
.party-card-body dt { color: var(--slate-500); font-size: 8px; }
.party-card-body dd { overflow: hidden; margin-top: 2px; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.party-documents { display: flex; align-items: flex-start; gap: 12px; margin-top: 12px; padding: 11px; border: 1px dashed var(--slate-300); border-radius: 8px; background: var(--white); }
.party-documents > span { flex: 0 0 auto; color: var(--slate-500); font-size: 9px; font-weight: 800; }
.party-documents > div { display: flex; flex-wrap: wrap; gap: 5px; }
.document-chip { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 8px; border: 1px solid #c7d9ee; border-radius: 6px; color: var(--blue-700); background: var(--blue-50); font-size: 9px; font-weight: 700; text-decoration: none; }
a.document-chip:hover { border-color: var(--blue-600); text-decoration: underline; }
.document-empty { color: var(--slate-500); font-size: 9px; }
.party-card-body footer { display: flex; justify-content: flex-end; margin-top: 12px; }

.status-badge { display: inline-flex; max-width: 100%; align-items: center; gap: 5px; padding: 3px 7px; border-radius: 999px; color: var(--slate-700); background: var(--slate-100); font-size: 9px; font-weight: 800; white-space: nowrap; }
.status-badge > span { width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: currentColor; }
.status-success { color: var(--green-700); background: var(--green-100); }
.status-warning { color: var(--amber-700); background: var(--amber-100); }
.status-danger { color: var(--red-700); background: var(--red-100); }
.order-workspace { margin-top: 20px; }
.order-stack { display: grid; gap: 9px; }
.order-list-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 12px; padding: 10px 14px; border: 1px solid var(--slate-200); border-radius: 9px; color: var(--blue-700); background: var(--white); font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; }
.order-list-toggle:hover { border-color: var(--blue-600); background: var(--blue-50); }
.order-list-toggle:focus-visible { outline: 3px solid rgba(31, 102, 204, .28); outline-offset: 2px; }
.customer-order-groups { display: grid; gap: 15px; }
.sales-owner-section { display: grid; gap: 11px; padding: 14px; border: 1px solid #c9d7e7; border-radius: 14px; background: #f8fbff; }
.sales-owner-section + .sales-owner-section { margin-top: 4px; }
.sales-owner-section > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 2px; }
.sales-owner-section > header > div { display: flex; align-items: center; gap: 8px; }
.sales-owner-section > header span { padding: 3px 7px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: 8px; font-weight: 850; }
.sales-owner-section > header strong { font-size: 13px; }
.sales-owner-section > header small { color: var(--slate-500); font-size: 9px; }
.sales-owner-section > div { display: grid; gap: 10px; }
.sales-owner-section.is-unassigned { border-style: dashed; border-color: #e1bd82; background: #fffaf1; }
.sales-owner-section.is-unassigned > header span { color: var(--amber-700); background: var(--amber-100); }
.customer-order-group { overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.customer-order-group[open] { border-color: #b9cade; box-shadow: 0 8px 24px rgba(10, 24, 45, .07); }
.customer-order-group > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; min-height: 82px; padding: 15px 17px; border-left: 3px solid var(--blue-600); list-style: none; cursor: pointer; }
.customer-order-group > summary::-webkit-details-marker { display: none; }
.customer-order-group > summary:hover { background: var(--blue-50); }
.customer-order-group > summary > div:first-child { min-width: 0; }
.customer-order-group > summary > div:first-child > strong, .customer-order-group > summary > div:first-child > small { display: block; }
.customer-order-group > summary > div:first-child > strong { overflow: hidden; margin-top: 3px; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.customer-order-group > summary > div:first-child > small { overflow: hidden; margin-top: 3px; color: var(--slate-500); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.customer-group-label { display: inline-flex; padding: 2px 6px; border-radius: 5px; color: var(--blue-700); background: var(--blue-100); font-size: 8px; font-weight: 850; letter-spacing: .05em; }
.customer-group-status { display: grid; grid-template-columns: auto 30px; align-items: center; justify-items: end; gap: 2px 11px; }
.customer-group-status > small { grid-column: 1; color: var(--slate-500); font-size: 8px; }
.customer-group-status > .details-chevron { grid-column: 2; grid-row: 1 / span 2; }
.pending-marker, .clear-marker { display: inline-flex; align-items: center; gap: 6px; min-height: 25px; padding: 4px 8px; border-radius: 999px; font-size: 9px; font-weight: 850; white-space: nowrap; }
.pending-marker { border: 1px solid #f2c0bc; color: var(--red-700); background: var(--red-100); }
.pending-marker i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px rgba(181, 55, 55, .1); }
.clear-marker { color: var(--green-700); background: var(--green-100); }
.customer-order-body { padding: 12px; border-top: 1px solid var(--slate-200); background: var(--slate-50); }
.customer-order-body .order-card { box-shadow: none; }
.customer-order-body .compact-toggle { width: min(320px, 100%); margin-right: auto; margin-left: auto; background: rgba(255, 255, 255, .88); }
.order-card { margin-inline: 5px; padding: 11px 13px; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); box-shadow: 0 2px 8px rgba(10, 24, 45, .045); }
.order-card[open] { border-color: #c5d1df; box-shadow: 0 4px 13px rgba(10, 24, 45, .06); }
.order-card > summary { list-style: none; }
.order-card > summary::-webkit-details-marker { display: none; }
.order-summary { display: flex; min-height: 39px; align-items: center; gap: 10px; cursor: pointer; }
.order-summary .order-card-head { min-width: 0; flex: 1; }
.order-summary-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 5px; }
.order-summary-actions > .button { min-height: 27px; padding: 4px 8px; font-size: 9px; white-space: nowrap; }
.order-summary > .details-chevron { width: 25px; height: 25px; border-radius: 7px; font-size: 12px; }
.order-summary .entity-code { font-size: 8px; }
.details-chevron { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 8px; color: var(--slate-500); background: var(--slate-100); font-size: 15px; transform: rotate(90deg); transition: transform .16s ease; }
details[open] > summary .details-chevron { transform: rotate(270deg); }
.order-card-body { margin-top: 11px; padding-top: 11px; border-top: 1px solid var(--slate-100); }
.order-card-head { display: flex; align-items: flex-start; gap: 14px; justify-content: space-between; }
.order-card-head > div:first-child { min-width: 0; }
.order-card-head h3 { margin-top: 3px; font-size: 13px; line-height: 1.3; }
.order-card-head p { margin-top: 2px; color: var(--slate-600); font-size: 9px; }
.order-card-head h3, .order-card-head p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-value { min-width: 140px; text-align: right; }
.order-value > span, .order-value > strong { display: block; }
.order-value > span { color: var(--slate-500); font-size: 8px; }
.order-value > strong { margin: 1px 0 4px; font-size: 15px; }
.order-status-stack { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.order-status-stack .status-badge { gap: 4px; padding: 2px 6px; font-size: 8px; }
.order-status-stack .status-badge > span { width: 4px; height: 4px; }
.control-gates { display: grid; grid-template-columns: 1fr 24px 1fr; align-items: stretch; max-width: 780px; margin-top: 11px; }
.control-gate { padding: 8px 10px; border: 1px solid; border-radius: 7px; }
.control-gate > span, .control-gate > strong, .control-gate > small { display: block; }
.control-gate > span { font-size: 7px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.control-gate > strong { margin-top: 2px; font-size: 10px; }
.control-gate > small { margin-top: 2px; font-size: 8px; }
.gate-cash { border-color: #e7c075; color: var(--amber-700); background: #fffbf2; }
.gate-credit { border-color: #bdd5ef; color: var(--blue-700); background: var(--blue-50); }
.gate-connector { display: grid; place-items: center; color: var(--slate-300); }
.status-matrix { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin-top: 11px; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 7px; background: var(--slate-50); }
.status-matrix:has(> div:nth-child(7)) { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.status-matrix > div { min-width: 0; padding: 7px 8px; }
.status-matrix > div + div { border-left: 1px solid var(--slate-200); }
.status-matrix > div > span:first-child { display: block; margin-bottom: 4px; color: var(--slate-500); font-size: 7px; }
.status-matrix .status-badge { padding: 2px 6px; font-size: 8px; }
.progress-summary { display: grid; grid-template-columns: auto minmax(130px, 220px); align-items: center; gap: 10px; margin-top: 9px; }
.progress-summary > div:first-child { display: flex; gap: 6px; color: var(--slate-600); font-size: 8px; }
.progress-summary strong { color: var(--slate-900); }
.progress-track { overflow: hidden; height: 5px; border-radius: 999px; background: var(--slate-100); }
.progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), #39a6d7); }
.purchase-progress span { background: linear-gradient(90deg, var(--cyan-600), #47b89e); }
.card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--slate-100); }
.order-card .card-actions .button-small { min-height: 29px; padding: 4px 9px; font-size: 10px; }
.card-actions .text-button { margin-left: auto; }
.card-actions button:disabled { border-color: var(--slate-200); color: var(--slate-500); background: var(--slate-100); }
.gate-lock-notes { display: flex; flex-wrap: wrap; gap: 5px 13px; margin-top: 7px; color: var(--amber-700); font-size: 8px; }
.gate-lock-notes span::before { margin-right: 5px; content: "●"; font-size: 7px; }
.order-exception-note { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin-top: 10px; padding: 10px 12px; border: 1px solid var(--red-200); border-radius: 8px; color: var(--red-700); background: var(--red-100); font-size: 10px; }
.order-exception-note strong { white-space: nowrap; }
.invoice-row.has-exception { background: var(--red-100); }
.invoice-exception-text { color: var(--red-700) !important; white-space: normal !important; }
.exception-mark { color: var(--red-700); }
.order-documents { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; padding: 6px 9px; border-radius: 7px; background: var(--slate-50); }
.order-documents > span { flex: 0 0 auto; color: var(--slate-500); font-size: 9px; font-weight: 800; }
.order-documents > div { display: flex; min-width: 0; flex-wrap: wrap; gap: 5px; }
.source-banner { display: flex; gap: 8px; margin-top: 9px; padding: 6px 9px; border-radius: 7px; color: var(--slate-600); background: var(--slate-50); font-size: 9px; }
.source-banner span { color: var(--slate-500); }
.source-banner strong { color: var(--slate-700); }
.path-mode { flex: 0 0 auto; padding: 4px 7px; border-radius: 6px; color: var(--amber-700); background: var(--amber-100); font-size: 8px; font-weight: 800; }
.path-mode.is-credit { color: var(--blue-700); background: var(--blue-100); }

.finance-balance-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }
.balance-card { position: relative; overflow: hidden; padding: 20px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.balance-card::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--blue-600); content: ""; }
.balance-payable::before { background: var(--cyan-600); }
.balance-invoice::before { background: #8a64c7; }
.balance-card header { display: flex; align-items: center; justify-content: space-between; color: var(--slate-600); font-size: 11px; }
.balance-card > strong { display: block; margin-top: 13px; font-size: 25px; letter-spacing: -.03em; }
.balance-card > p { margin: 4px 0 14px; color: var(--slate-600); font-size: 10px; }
.balance-card > .text-button { margin-top: 14px; }
.invoice-split { display: flex; gap: 7px; margin-top: 12px; }
.invoice-split span { padding: 4px 8px; border-radius: 6px; color: var(--slate-600); background: var(--slate-100); font-size: 9px; }
.invoice-list { display: grid; }
.invoice-row { display: grid; grid-template-columns: 48px minmax(160px, 1.5fr) minmax(90px, .7fr) minmax(120px, .8fr) minmax(90px, .6fr) auto; align-items: center; gap: 13px; min-height: 70px; padding: 11px 5px; border-top: 1px solid var(--slate-100); }
.invoice-row:first-child { border-top: 0; }
.invoice-direction { padding: 5px 7px; border-radius: 6px; color: var(--blue-700); background: var(--blue-100); font-size: 9px; font-weight: 800; text-align: center; }
.direction-purchase { color: var(--cyan-600); background: var(--cyan-100); }
.invoice-row > div > span, .invoice-row > div > strong, .invoice-row > div > p { display: block; }
.invoice-row > div > span { color: var(--slate-500); font-size: 8px; }
.invoice-row > div > strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.invoice-row > div > p { overflow: hidden; margin-top: 2px; color: var(--slate-600); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.settled-mark { color: var(--green-700); font-size: 10px; font-weight: 800; }
.invoice-settlement-blocked { max-width: 116px; color: var(--amber-700); font-size: 9px; font-weight: 800; line-height: 1.35; text-align: center; }
.finance-workspace-split { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.finance-cash-panels { margin-bottom: 16px; }
.supply-finance { margin-top: 20px; }
.finance-task-section { margin-bottom: 19px; }
.finance-task-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.finance-task-grid > article { --worklist-tone: var(--navy-800); min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.finance-task-grid > article:nth-child(1) { --worklist-tone: var(--green-700); }
.finance-task-grid > article:nth-child(2) { --worklist-tone: var(--red-700); }
.finance-task-grid > article:nth-child(3) { --worklist-tone: var(--blue-600); }
.finance-task-grid > article:nth-child(4) { --worklist-tone: var(--cyan-600); }
.finance-task-grid > article:nth-child(5) { --worklist-tone: #7856b3; }
.finance-task-grid > article:nth-child(6) { --worklist-tone: var(--red-700); border-color: var(--red-200); background: linear-gradient(180deg, #fff7f6, var(--white) 68%); }
.finance-task-grid > article > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 43px; padding: 9px 12px; border-top: 3px solid var(--worklist-tone); border-bottom: 1px solid var(--slate-100); }
.finance-task-grid > article > header h3 { font-size: 11px; }
.finance-task-grid > article:nth-child(6) > header { border-bottom-color: var(--red-200); background: var(--red-100); }
.finance-task-grid > article:nth-child(6) > header h3, .finance-task-grid > article:nth-child(6) .worklist-clear { color: var(--red-700); }
.work-item-critical, .work-item.work-item-critical, .work-item.is-critical { margin-inline: -11px; padding-inline: 11px; border-color: var(--red-200); background: linear-gradient(90deg, rgba(255, 228, 225, .78), rgba(255, 247, 246, .34)); }
.work-item-critical .work-item-level, .work-item-critical > .work-item-level, .work-item.is-critical .work-item-level { background: var(--red-700); box-shadow: 0 0 0 3px rgba(181, 55, 55, .12); }
.work-item-critical > div strong, .work-item-critical > b, .work-item.is-critical > div strong, .work-item.is-critical > b { color: var(--red-700); }
.work-item-critical > .icon-button, .work-item.is-critical > .icon-button { border-color: var(--red-200); color: var(--red-700); background: #fff7f6; }

/* 财务工作台：异常、待办、资金流水和发票档案四个独立工作区。 */
.finance-board { min-width: 0; }
.finance-board + .finance-board { margin-top: 27px; }
.finance-section-head {
  display: flex; min-width: 0; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 13px;
  padding-bottom: 11px; border-bottom: 1px solid var(--slate-200);
}
.finance-section-head > div { min-width: 0; }
.finance-section-head > div > span { display: block; margin-bottom: 3px; color: var(--blue-700); font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.finance-section-head h2 { font-size: 17px; letter-spacing: -.015em; }
.finance-section-head p, .finance-section-head small { display: block; max-width: 720px; margin-top: 4px; color: var(--slate-500); font-size: 9px; }
.finance-section-head > strong { flex: 0 0 auto; padding: 4px 9px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: 10px; }
.finance-section-head > .button, .finance-section-head > div:last-child { flex: 0 0 auto; }
.finance-section-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }

.finance-anomaly-board { padding: 16px; border: 1px solid var(--red-200); border-left: 4px solid var(--red-700); border-radius: var(--radius-md); background: linear-gradient(105deg, #fff5f4, var(--white) 72%); box-shadow: var(--shadow-sm); }
.finance-anomaly-board .finance-section-head { border-bottom-color: var(--red-200); }
.finance-anomaly-board .finance-section-head > div > span, .finance-anomaly-board .finance-section-head h2 { color: var(--red-700); }
.finance-anomaly-board .finance-section-head > strong { color: var(--white); background: var(--red-700); }
.finance-anomaly-board .work-item { min-height: 64px; padding-inline: 11px; border: 1px solid var(--red-200); border-radius: 8px; background: rgba(255, 255, 255, .78); }
.finance-anomaly-board .work-item + .work-item { margin-top: 7px; }
.finance-anomaly-board .work-item-level { background: var(--red-700); box-shadow: 0 0 0 3px rgba(181, 55, 55, .1); }
.finance-anomaly-board .work-item > div strong, .finance-anomaly-board .work-item > b { color: var(--red-700); }
.finance-anomaly-board .worklist-clear { padding: 16px; border-radius: 8px; color: var(--green-700); background: rgba(255, 255, 255, .72); text-align: center; }

.finance-todo-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; align-items: start; }
.finance-todo-grid > article { --finance-todo-tone: var(--navy-800); min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.finance-todo-grid > article:nth-child(1) { --finance-todo-tone: var(--green-700); }
.finance-todo-grid > article:nth-child(2) { --finance-todo-tone: var(--red-700); }
.finance-todo-grid > article:nth-child(3) { --finance-todo-tone: var(--blue-600); }
.finance-todo-grid > article:nth-child(4) { --finance-todo-tone: var(--cyan-600); }
.finance-todo-grid > article:nth-child(5) { --finance-todo-tone: #7856b3; }
.finance-todo-grid > article > header { display: flex; min-height: 43px; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 11px; border-top: 3px solid var(--finance-todo-tone); border-bottom: 1px solid var(--slate-100); }
.finance-todo-grid > article > header h3 { min-width: 0; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.finance-todo-grid > article > header span { min-width: 24px; padding: 2px 7px; border-radius: 999px; color: var(--finance-todo-tone); background: color-mix(in srgb, var(--finance-todo-tone) 11%, white); font-size: 9px; font-weight: 850; text-align: center; }
.finance-todo-grid > article > div { display: grid; padding-inline: 10px; }

.finance-cashflow-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; margin-bottom: 0; }
.finance-cash-details { min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.finance-cash-details[open] { border-color: #bac9da; }
.finance-cash-summary {
  display: flex; min-width: 0; min-height: 102px; flex-wrap: wrap; align-items: center; gap: 11px 18px; padding: 15px 48px 15px 17px;
  list-style: none; cursor: pointer; position: relative;
}
.finance-cash-summary::-webkit-details-marker { display: none; }
.finance-cash-summary::marker { content: ""; }
.finance-cash-summary::after { position: absolute; top: 50%; right: 17px; color: var(--slate-500); content: "⌄"; font-size: 16px; line-height: 1; transform: translateY(-50%); transition: transform .16s ease; }
.finance-cash-details[open] > .finance-cash-summary::after { transform: translateY(-50%) rotate(180deg); }
.finance-cash-summary:focus-visible { outline: 3px solid rgba(31, 102, 204, .28); outline-offset: -3px; }
.finance-cash-summary > div:first-child { min-width: 150px; flex: 1 1 180px; }
.finance-cash-summary > div:first-child > span, .finance-cash-summary > div:first-child > small { display: block; color: var(--slate-500); font-size: 9px; }
.finance-cash-summary > div:first-child > strong { display: block; margin-top: 3px; color: var(--navy-800); font-size: 15px; }
.finance-cash-summary dl, .finance-cash-summary .finance-cash-amounts, .finance-cash-summary .finance-cash-metrics { display: grid; min-width: min(100%, 300px); flex: 1 1 280px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.finance-cash-summary dl > div, .finance-cash-summary .finance-cash-amounts > div, .finance-cash-summary .finance-cash-metrics > div { min-width: 0; padding-left: 10px; border-left: 1px solid var(--slate-200); }
.finance-cash-summary dt, .finance-cash-summary .finance-cash-amounts span, .finance-cash-summary .finance-cash-metrics span { display: block; color: var(--slate-500); font-size: 8px; }
.finance-cash-summary dd, .finance-cash-summary .finance-cash-amounts strong, .finance-cash-summary .finance-cash-metrics strong { display: block; overflow: hidden; margin: 2px 0 0; color: var(--slate-900); font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.finance-cash-body { min-width: 0; padding: 4px 16px 14px; border-top: 1px solid var(--slate-100); background: #fbfcfe; }
.finance-cash-body .cash-list { min-width: 0; }
.finance-cash-body .inline-empty { margin-top: 10px; background: var(--white); }

.finance-invoice-board { min-width: 0; }
.invoice-recent-list { overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.invoice-recent-list > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-bottom: 1px solid var(--slate-100); background: var(--slate-50); }
.invoice-recent-list > header h3 { font-size: 12px; }
.invoice-recent-list > header small { color: var(--slate-500); font-size: 8px; }
.invoice-recent-list > .invoice-list { padding-inline: 12px; }
.invoice-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin-bottom: 14px; }
.invoice-summary-card { --invoice-summary-tone: var(--blue-600); position: relative; min-width: 0; overflow: hidden; padding: 14px 15px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.invoice-summary-card::before { position: absolute; inset: 0 0 auto; height: 3px; background: var(--invoice-summary-tone); content: ""; }
.invoice-summary-card:nth-child(2) { --invoice-summary-tone: var(--cyan-600); }
.invoice-summary-card:nth-child(3) { --invoice-summary-tone: #7856b3; }
.invoice-summary-card:nth-child(4) { --invoice-summary-tone: var(--red-700); }
.invoice-summary-card span, .invoice-summary-card small { display: block; color: var(--slate-500); font-size: 9px; }
.invoice-summary-card strong { display: block; overflow: hidden; margin-top: 5px; color: var(--slate-900); font-size: 19px; letter-spacing: -.02em; text-overflow: ellipsis; white-space: nowrap; }
.invoice-summary-card small { margin-top: 3px; }

.invoice-archive { display: grid; gap: 9px; min-width: 0; }
.invoice-year-group { min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.invoice-year-group[open] { border-color: #b9cade; }
.invoice-year-group > summary, .invoice-month-group > summary { display: flex; position: relative; min-width: 0; align-items: center; gap: 10px; list-style: none; cursor: pointer; }
.invoice-year-group > summary::-webkit-details-marker, .invoice-month-group > summary::-webkit-details-marker { display: none; }
.invoice-year-group > summary::marker, .invoice-month-group > summary::marker { content: ""; }
.invoice-year-group > summary { min-height: 55px; padding: 10px 44px 10px 15px; background: linear-gradient(90deg, var(--blue-50), var(--white) 58%); }
.invoice-year-group > summary::before { display: grid; width: 31px; height: 27px; flex: 0 0 auto; place-items: center; border-radius: 6px; color: var(--blue-700); background: var(--blue-100); content: "▰"; font-size: 13px; }
.invoice-year-group > summary::after, .invoice-month-group > summary::after { position: absolute; top: 50%; right: 16px; color: var(--slate-500); content: "⌄"; transform: translateY(-50%); transition: transform .16s ease; }
.invoice-year-group[open] > summary::after, .invoice-month-group[open] > summary::after { transform: translateY(-50%) rotate(180deg); }
.invoice-year-group > summary:focus-visible, .invoice-month-group > summary:focus-visible { outline: 3px solid rgba(31, 102, 204, .26); outline-offset: -3px; }
.invoice-year-group > summary > div, .invoice-month-group > summary > div { min-width: 0; flex: 1; }
.invoice-year-group > summary strong, .invoice-month-group > summary strong { display: block; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.invoice-year-group > summary small, .invoice-month-group > summary small { display: block; overflow: hidden; margin-top: 2px; color: var(--slate-500); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.invoice-year-group > div { display: grid; gap: 7px; padding: 10px 12px 12px; border-top: 1px solid var(--slate-100); background: var(--slate-50); }
.invoice-month-group { min-width: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); }
.invoice-month-group[open] { border-color: #c4d2e1; }
.invoice-month-group > summary { min-height: 45px; padding: 8px 42px 8px 12px; }
.invoice-month-group > summary::before { width: 7px; height: 24px; flex: 0 0 auto; border-radius: 999px; background: var(--cyan-600); content: ""; }
.invoice-month-group > div { min-width: 0; padding: 0 11px 9px; border-top: 1px solid var(--slate-100); }
.invoice-archive-status, .invoice-file-health, .invoice-file-missing, .invoice-row > div > .invoice-file-health, .invoice-row > div > .invoice-file-missing { display: inline-flex; min-height: 22px; flex: 0 0 auto; align-items: center; padding: 2px 7px; border-radius: 999px; font-size: 8px; font-weight: 850; white-space: nowrap; }
.invoice-archive-status, .invoice-archive-status.is-archived, .invoice-archive-status.status-archived, .invoice-file-health, .invoice-row > div > .invoice-file-health { color: var(--green-700); background: var(--green-100); }
.invoice-archive-status.is-collecting, .invoice-archive-status.status-collecting { color: var(--amber-700); background: var(--amber-100); }
.invoice-archive-status.is-missing, .invoice-archive-status.status-missing, .invoice-file-missing, .invoice-row > div > .invoice-file-missing { color: var(--red-700); background: var(--red-100); }
.invoice-year-group .invoice-list, .invoice-month-group .invoice-list { min-width: 0; }
.invoice-history-workspace { min-width: 0; }
.invoice-archive-download { display: grid; grid-template-columns: minmax(230px, 1fr) minmax(145px, .35fr) auto minmax(145px, .35fr) auto; align-items: end; gap: 10px; margin-bottom: 12px; padding: 14px 15px; border: 1px solid #bfd1e6; border-radius: var(--radius-md); background: linear-gradient(100deg, var(--blue-50), var(--white)); box-shadow: var(--shadow-sm); }
.invoice-archive-download > div { align-self: center; }
.invoice-archive-download > div strong, .invoice-archive-download > div small { display: block; }
.invoice-archive-download > div strong { color: var(--navy-800); font-size: 12px; }
.invoice-archive-download > div small { max-width: 560px; margin-top: 3px; color: var(--slate-500); font-size: 8px; line-height: 1.45; }
.invoice-archive-download > label { color: var(--slate-600); font-size: 9px; font-weight: 800; }
.invoice-archive-download > label input { display: block; width: 100%; min-height: 36px; margin-top: 4px; padding: 6px 8px; border: 1px solid var(--slate-300); border-radius: 7px; color: var(--slate-800); background: var(--white); }
.invoice-archive-download > span { align-self: center; padding-bottom: 7px; color: var(--slate-400); font-size: 9px; }
.invoice-archive-warning { display: flex; align-items: center; gap: 8px 14px; margin-bottom: 12px; padding: 9px 12px; border: 1px solid var(--red-200); border-radius: 8px; color: var(--red-700); background: var(--red-100); font-size: 9px; }
.invoice-archive-warning span { color: var(--slate-600); }
.invoice-history-note { display: flex; align-items: center; gap: 10px; margin: 0 0 9px; color: var(--slate-500); font-size: 9px; }
.invoice-history-note > span { flex: 0 0 auto; padding: 3px 7px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-weight: 850; }
.cash-list { display: grid; }
.cash-row { display: grid; grid-template-columns: 34px minmax(125px, 1.25fr) minmax(92px, .7fr) minmax(100px, .8fr) minmax(105px, .7fr); align-items: center; gap: 10px; min-height: 66px; padding: 10px 4px; border-top: 1px solid var(--slate-100); }
.cash-row:first-child { border-top: 0; }
.cash-direction { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; color: var(--red-700); background: var(--red-100); font-size: 11px; font-weight: 900; }
.cash-direction.is-in { color: var(--green-700); background: var(--green-100); }
.cash-row > div { min-width: 0; }
.cash-row > div > span, .cash-row > div > strong, .cash-row > div > p { display: block; }
.cash-row > div > span { color: var(--slate-500); font-size: 8px; }
.cash-row > div > strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.cash-row > div > p { overflow: hidden; margin-top: 2px; color: var(--slate-500); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.inline-documents { display: flex !important; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.inline-documents .document-chip { min-height: 21px; max-width: 180px; overflow: hidden; padding: 2px 6px; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.warehouse-overview { margin-bottom: 16px; overflow: hidden; border: 1px solid #c7d9ee; border-radius: var(--radius-md); background: linear-gradient(135deg, #f7fbff 0%, var(--white) 72%); box-shadow: var(--shadow-sm); }
.warehouse-overview > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 18px; border-bottom: 1px solid var(--slate-200); }
.warehouse-overview > header span, .warehouse-overview > header strong { display: block; }
.warehouse-overview > header span { color: var(--blue-700); font-size: 9px; font-weight: 850; letter-spacing: .06em; }
.warehouse-overview > header strong { margin-top: 2px; font-size: 22px; }
.warehouse-overview > header p { color: var(--slate-500); font-size: 9px; text-align: right; }
.warehouse-overview-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.warehouse-overview-metrics > div { min-width: 0; padding: 13px 18px; }
.warehouse-overview-metrics > div + div { border-left: 1px solid var(--slate-200); }
.warehouse-overview-metrics span, .warehouse-overview-metrics strong { display: block; }
.warehouse-overview-metrics span { color: var(--slate-500); font-size: 8px; }
.warehouse-overview-metrics strong { overflow: hidden; margin-top: 3px; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.warehouse-inventory-panel > .panel-header { align-items: flex-end; }
.warehouse-inventory-list { display: grid; gap: 10px; }
.warehouse-inventory-group { overflow: hidden; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); }
.warehouse-inventory-group[open] { border-color: #b8cde4; box-shadow: 0 5px 16px rgba(15, 47, 82, .06); }
.warehouse-inventory-group.is-unknown { border-color: var(--red-200); }
.warehouse-inventory-group > summary { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(360px, 1.7fr) auto 18px; align-items: center; gap: 15px; min-height: 82px; padding: 13px 15px; list-style: none; cursor: pointer; }
.warehouse-inventory-group > summary::-webkit-details-marker { display: none; }
.warehouse-inventory-group > summary:hover { background: var(--slate-50); }
.warehouse-inventory-group[open] > summary { background: #f8fbff; }
.warehouse-identity { min-width: 0; }
.warehouse-identity span, .warehouse-identity strong, .warehouse-identity small { display: block; }
.warehouse-identity span { color: var(--blue-700); font-size: 8px; font-weight: 850; }
.warehouse-identity strong { overflow: hidden; margin-top: 2px; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.warehouse-identity small { margin-top: 3px; color: var(--slate-500); font-size: 8px; }
.warehouse-summary-metrics { display: grid; grid-template-columns: .65fr 1.15fr 1fr; min-width: 0; }
.warehouse-summary-metrics > div { min-width: 0; padding: 4px 12px; border-left: 1px solid var(--slate-200); }
.warehouse-summary-metrics dt { color: var(--slate-500); font-size: 8px; }
.warehouse-summary-metrics dd { overflow: hidden; margin-top: 3px; color: var(--slate-800); font-size: 11px; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.warehouse-warning { padding: 4px 7px; border-radius: 999px; color: var(--red-700); background: var(--red-100); font-size: 8px; font-weight: 850; white-space: nowrap; }
.warehouse-inventory-group > summary .details-chevron { transition: transform .16s ease; }
.warehouse-inventory-group[open] > summary .details-chevron { transform: rotate(180deg); }
.warehouse-inventory-body { padding: 0 15px 6px; border-top: 1px solid var(--slate-200); }
.warehouse-inventory-head, .inventory-row { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(70px, .45fr) minmax(105px, .65fr) minmax(120px, .75fr); align-items: center; gap: 14px; }
.warehouse-inventory-head { min-height: 34px; color: var(--slate-500); font-size: 8px; font-weight: 800; }
.inventory-row { min-height: 68px; padding: 11px 0; border-top: 1px solid var(--slate-100); }
.inventory-row > div { min-width: 0; }
.inventory-row span, .inventory-row strong { display: block; }
.inventory-row > div > span:not(.entity-code) { color: var(--slate-500); font-size: 8px; }
.inventory-row strong { overflow: hidden; margin-top: 2px; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.inventory-row.is-negative { margin: 0 -8px; padding-right: 8px; padding-left: 8px; background: var(--red-100); }
.inventory-row.is-negative > div:nth-child(3) strong { color: var(--red-700); }
.inventory-anomaly { display: inline-block !important; margin-top: 4px; padding: 2px 6px; border-radius: 999px; color: var(--red-700); background: #fff; font-size: 7px; font-weight: 850; }
.warehouse-inventory-empty { padding: 26px 12px; color: var(--slate-500); font-size: 9px; text-align: center; }
.warehouse-list-empty { border: 1px dashed var(--slate-300); border-radius: 9px; background: var(--slate-50); }

.after-sales-metrics > div:nth-child(3) strong { color: var(--red-700); }
.case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.case-card { padding: 15px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); }
.case-card header, .case-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.case-number { color: #7152a6; font-size: 9px; font-weight: 800; }
.case-card h4 { margin-top: 13px; font-size: 14px; }
.case-card > p { display: -webkit-box; min-height: 47px; margin-top: 5px; overflow: hidden; color: var(--slate-600); font-size: 10px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.case-source { margin-top: 13px; padding: 9px; border-radius: 7px; background: var(--slate-50); }
.case-source span, .case-source strong { display: block; }
.case-source span { color: var(--slate-500); font-size: 8px; }
.case-source strong { overflow: hidden; margin-top: 2px; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.case-card footer { margin-top: 13px; padding-top: 10px; border-top: 1px solid var(--slate-100); }
.case-card footer small { color: var(--slate-500); font-size: 9px; }
.priority { padding: 3px 7px; border-radius: 999px; color: var(--slate-700); background: var(--slate-100); font-size: 8px; font-weight: 800; }
.priority-high { color: var(--red-700); background: var(--red-100); }

.account-panel .panel-header > div { min-width: 0; }
.account-list { display: grid; gap: 8px; }
.account-row { display: grid; grid-template-columns: 42px minmax(150px, 1.3fr) minmax(90px, .7fr) minmax(105px, .8fr) auto minmax(170px, auto); align-items: center; gap: 14px; min-height: 72px; padding: 11px 13px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); }
.account-row.is-disabled { background: var(--slate-50); }
.account-avatar { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; color: var(--blue-700); background: var(--blue-100); font-weight: 900; }
.account-identity { display: grid; min-width: 0; }
.account-identity strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-identity span, .account-row > div:not(.account-avatar):not(.account-identity) > span { color: var(--slate-500); font-size: 9px; }
.account-row > div:not(.account-avatar):not(.account-identity) > strong { display: block; margin-top: 2px; font-size: 11px; }
.account-row footer { display: flex; justify-content: flex-end; gap: 7px; }
.account-protected { color: var(--slate-500); font-size: 9px; }
.dialog-note { grid-column: 1 / -1; padding: 11px 12px; border: 1px solid #c7d9ee; border-radius: 9px; background: var(--blue-50); }
.dialog-note strong { color: var(--blue-700); }
.dialog-note p { margin-top: 3px; color: var(--slate-600); font-size: 10px; }

.dialog-open { overflow: hidden; }
.dialog-layer { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 22px; }
.dialog-backdrop { position: absolute; inset: 0; background: rgba(5, 15, 30, .58); backdrop-filter: blur(3px); }
.dialog { position: relative; width: min(760px, 100%); max-height: min(88vh, 860px); overflow: auto; border: 1px solid rgba(255, 255, 255, .25); border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow-lg); }
.dialog-header { display: flex; position: sticky; z-index: 2; top: 0; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 22px 13px; background: var(--white); }
.dialog-header h2 { font-size: 21px; }
.dialog-body { padding: 20px 22px 22px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-field { min-width: 0; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label, .line-field legend { display: block; margin-bottom: 5px; color: var(--slate-700); font-size: 10px; font-weight: 800; }
.form-field label span { color: var(--red-700); }
.form-field input, .form-field select, .form-field textarea { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--slate-300); border-radius: 8px; background: var(--white); outline: none; }
.form-field textarea { min-height: 82px; resize: vertical; }
.form-field input:hover, .form-field select:hover, .form-field textarea:hover { border-color: #9aabba; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: var(--blue-600); box-shadow: 0 0 0 3px rgba(31, 102, 204, .12); }
.form-field.is-disabled label { color: var(--slate-500); }
.form-field input:disabled, .form-field select:disabled { color: var(--slate-500); background: var(--slate-100); cursor: not-allowed; }
.form-field.is-readonly input { border-color: #bfd1e6; color: var(--navy-800); background: var(--blue-50); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; font-weight: 800; letter-spacing: .025em; }
.form-help { display: block; margin-top: 5px; color: var(--slate-500); font-size: 9px; line-height: 1.45; }
.material-code-form-guide { grid-column: 1 / -1; padding: 12px 13px; border: 1px solid #c7d9ee; border-radius: 9px; background: var(--blue-50); }
.material-code-form-guide > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.material-code-form-guide strong { color: var(--blue-700); font-size: 11px; }
.material-code-form-guide code { padding: 3px 6px; border-radius: 5px; color: var(--navy-800); background: rgba(255, 255, 255, .8); font-size: 9px; font-weight: 800; }
.material-code-form-guide p { margin-top: 5px; color: var(--slate-600); font-size: 9px; }
.material-code-form-guide.is-legacy, .material-code-form-guide.is-locked { border-color: #ead19d; background: #fff9eb; }
.material-code-form-guide.is-legacy strong, .material-code-form-guide.is-locked strong { color: var(--amber-700); }
.checkbox-field { display: inline-flex !important; min-height: 40px; align-items: center; gap: 9px; margin: 0 !important; padding: 8px 10px; border: 1px solid var(--slate-200); border-radius: 8px; background: var(--slate-50); cursor: pointer; }
.checkbox-field input { width: 17px; min-height: 17px; height: 17px; flex: 0 0 auto; accent-color: var(--blue-600); }
.checkbox-field span { font-size: 11px; }
.line-field { margin: 0; padding: 0; border: 0; }
.line-field > legend { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; }
.line-edit-status { padding: 3px 7px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: 8px; font-weight: 850; }
.line-field.is-locked .line-edit-status { color: var(--amber-700); background: #fff0c9; }
.line-edit-notice { display: flex; align-items: center; gap: 8px 12px; margin: 2px 0 9px; padding: 8px 10px; border: 1px solid #c7d9ee; border-radius: 8px; color: var(--slate-600); background: var(--blue-50); font-size: 9px; }
.line-edit-notice strong { flex: 0 0 auto; color: var(--blue-700); font-size: 10px; }
.line-edit-notice.is-locked { border-color: #ead19d; background: #fff9eb; }
.line-edit-notice.is-locked strong { color: var(--amber-700); }
.line-editor { display: grid; gap: 8px; }
.line-row { display: grid; grid-template-columns: 22px minmax(150px, 1.7fr) minmax(80px, .6fr) minmax(95px, .7fr) 72px 32px; align-items: end; gap: 7px; padding: 10px; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--slate-50); }
.line-row.is-locked { border-color: var(--slate-200); background: #f7f9fb; }
.line-number { display: grid; width: 20px; height: 20px; margin-bottom: 10px; place-items: center; border-radius: 5px; color: var(--blue-700); background: var(--blue-100); font-size: 8px; font-weight: 800; }
.line-row .form-field label { font-size: 8px; }
.line-row .form-field input, .line-row .form-field select { min-height: 35px; padding: 6px 7px; font-size: 11px; }
.remove-line { width: 32px; height: 35px; margin-bottom: 0; color: var(--red-700); }
.line-row-lock { display: grid; width: 32px; height: 35px; place-items: center; border: 1px solid var(--slate-200); border-radius: 8px; color: var(--slate-500); background: var(--slate-100); font-size: 9px; font-weight: 850; }
.add-line { margin-top: 8px; }
.line-readonly-hint { align-self: center; color: var(--slate-500); font-size: 9px; font-weight: 750; }
.line-editor-footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-top: 9px; }
.order-line-total { display: grid; grid-template-columns: auto auto; align-items: baseline; justify-content: end; gap: 3px 10px; min-width: 250px; padding: 10px 13px; border: 1px solid #bfd1e6; border-radius: 9px; background: var(--blue-50); text-align: right; }
.order-line-total > span { color: var(--slate-600); font-size: 10px; font-weight: 800; }
.order-line-total > strong { color: var(--navy-800); font-size: 17px; font-variant-numeric: tabular-nums; }
.order-line-total > small { grid-column: 1 / -1; color: var(--blue-700); font-size: 9px; font-weight: 750; }
.file-drop { display: flex; position: relative; align-items: center; gap: 11px; min-height: 68px; padding: 12px 14px; border: 1px dashed #9fb6d0; border-radius: 9px; background: var(--blue-50); }
.file-drop > input { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; min-height: 0; opacity: 0; cursor: pointer; }
.file-drop > input:disabled { cursor: wait; }
.file-drop > span { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 9px; color: var(--blue-700); background: var(--blue-100); font-size: 18px; font-weight: 900; }
.file-drop strong, .file-drop small { display: block; }
.file-drop strong { font-size: 11px; }
.file-drop small { margin-top: 2px; color: var(--slate-600); font-size: 9px; font-weight: 400; }
.file-drop:focus-within { border-color: var(--blue-600); box-shadow: 0 0 0 3px rgba(31, 102, 204, .12); }
.recognition-status { margin-top: 6px; color: var(--slate-500); font-size: 9px; }
.recognition-status.is-loading { color: var(--blue-700); }
.recognition-status.is-success { color: var(--green-700); }
.recognition-status.is-error { color: var(--red-700); }
.recognition-result { margin-top: 9px; padding: 12px; border: 1px solid #c4dbcf; border-radius: 9px; background: #f3fbf7; }
.recognition-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.recognition-head strong { color: var(--green-700); font-size: 11px; }
.recognition-head span { color: var(--slate-500); font-size: 8px; }
.recognition-result dl { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; margin-top: 9px; }
.recognition-result dl > div { min-width: 0; padding: 6px 8px; border-radius: 6px; background: rgba(255, 255, 255, .75); }
.recognition-result dt { color: var(--slate-500); font-size: 8px; }
.recognition-result dd { overflow: hidden; margin-top: 1px; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.recognition-result p, .recognition-result li { color: var(--slate-600); font-size: 9px; }
.recognition-result ul { margin: 8px 0 0; padding-left: 18px; }
.recognition-applied { margin-top: 8px; color: var(--green-700) !important; font-weight: 800; }
.recognition-confirm { display: flex !important; align-items: flex-start; gap: 7px; margin: 11px 0 0 !important; padding-top: 10px; border-top: 1px solid rgba(17, 115, 84, .13); color: var(--slate-700) !important; cursor: pointer; }
.recognition-confirm input { width: 16px !important; height: 16px; min-height: 16px !important; flex: 0 0 auto; margin-top: 1px; accent-color: var(--green-700); }
.recognition-confirm span { color: var(--slate-700) !important; font-size: 9px; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--slate-100); }
.order-operation-zone { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 20px; padding: 14px 15px; border: 1px solid var(--slate-200); border-radius: 11px; background: var(--slate-50); }
.order-operation-zone > div:first-child { min-width: 0; }
.order-operation-zone > div:first-child > span { display: block; color: var(--slate-500); font-size: 10px; font-weight: 850; letter-spacing: .06em; }
.order-operation-zone > div:first-child > strong { display: block; margin-top: 3px; color: var(--navy-800); font-size: 14px; }
.order-operation-zone > div:first-child > p { max-width: 650px; margin-top: 4px; color: var(--slate-600); font-size: 11px; line-height: 1.55; }
.order-operation-zone.is-danger { border-color: #eccaca; background: #fff8f8; }
.order-operation-zone.is-danger > div:first-child > span, .order-operation-zone.is-danger > div:first-child > strong { color: var(--red-700); }
.order-operation-zone.is-locked { border-color: #e7c77f; background: #fff9eb; }
.order-operation-zone.is-locked > div:first-child > span { color: var(--amber-700); }
.order-operation-zone.is-completed { border-color: #b1dfca; background: var(--green-100); }
.order-operation-zone.is-completed > div:first-child > span, .order-operation-zone.is-completed > div:first-child > strong { color: var(--green-700); }
.order-operation-actions { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.order-operation-actions .cancellation-status { min-width: 116px; }
.order-operation-zone + .dialog-actions { margin-top: 12px; }
.existing-contracts { margin-bottom: 14px; padding: 12px 13px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--slate-50); }
.existing-contracts > header strong { font-size: 11px; }
.existing-contracts > header p { margin-top: 2px; color: var(--slate-500); font-size: 9px; }
.existing-contracts > div { display: grid; gap: 6px; margin-top: 9px; }
.existing-contract { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border: 1px solid var(--slate-200); border-radius: 8px; background: var(--white); }
.existing-contract > div { display: grid; min-width: 0; gap: 2px; }
.existing-contract span { color: var(--slate-500); font-size: 8px; }
.existing-contract strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.existing-contract-remove { flex: 0 0 auto; color: var(--red-700); }
.form-error, .dialog-warning { margin-top: 14px; padding: 11px 13px; border: 1px solid #f4bab5; border-radius: 8px; color: var(--red-700); background: #fff5f4; font-size: 11px; }
.dialog-warning { margin: 0; }
.dialog-warning p { margin-top: 4px; color: var(--slate-600); }
.dialog-info { grid-column: 1 / -1; padding: 10px 12px; border: 1px solid #c7d9ee; border-radius: 8px; color: var(--blue-700); background: var(--blue-50); font-size: 11px; }
.confirm-panel { padding: 16px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--slate-50); }
.confirm-panel > strong { font-size: 14px; }
.confirm-panel p { margin-top: 6px; color: var(--slate-600); font-size: 11px; }
.confirm-panel ul { margin: 12px 0 0; padding-left: 19px; color: var(--slate-700); font-size: 10px; }
.order-delete-confirm dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.order-delete-confirm dl > div { padding: 9px 10px; border: 1px solid #eed1d1; border-radius: 8px; background: var(--white); }
.order-delete-confirm dt { color: var(--slate-500); font-size: 8px; }
.order-delete-confirm dd { overflow: hidden; margin-top: 2px; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.order-delete-cleanup { margin-top: 10px; padding: 9px 10px; border-radius: 8px; background: #fff; color: var(--slate-700); font-size: 10px; }
.order-delete-cleanup ul { margin-top: 5px; }
.order-delete-confirm p b { color: var(--red-700); }
.order-delete-locked-panel { border-color: #e7c77f; background: #fff9eb; }
.order-delete-locked-panel > strong { color: var(--amber-700); }
.confirm-danger { border-color: #f0c1bd; background: #fff7f6; }
.import-guide { padding: 13px 14px; border: 1px solid #c7d9ee; border-radius: 10px; background: var(--blue-50); }
.import-guide strong { font-size: 12px; }
.import-guide p { margin: 3px 0 7px; color: var(--slate-600); font-size: 10px; }
.import-guide a { color: var(--blue-700); font-size: 10px; font-weight: 800; }
.import-drop { display: flex; align-items: center; gap: 13px; margin-top: 13px; padding: 18px; border: 1px dashed var(--slate-300); border-radius: 10px; background: var(--slate-50); cursor: pointer; }
.import-drop:hover { border-color: var(--blue-600); background: var(--blue-50); }
.import-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.import-drop > span { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 9px; color: var(--blue-700); background: var(--blue-100); font-size: 20px; }
.import-drop strong, .import-drop small { display: block; }
.import-drop small { margin-top: 2px; color: var(--slate-500); font-size: 9px; }
.import-preview { margin-top: 13px; }
.import-reading { display: flex; min-height: 100px; align-items: center; justify-content: center; gap: 12px; color: var(--slate-600); }
.import-reading .spinner { width: 23px; height: 23px; }
.import-summary { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; border: 1px solid var(--slate-200); border-radius: 9px; }
.import-summary > div { padding: 10px 12px; }
.import-summary > div + div { border-left: 1px solid var(--slate-200); }
.import-summary span, .import-summary strong { display: block; }
.import-summary span { color: var(--slate-500); font-size: 8px; }
.import-summary strong { margin-top: 2px; font-size: 17px; }
.import-summary .is-valid strong { color: var(--green-700); }
.import-summary .is-invalid strong { color: var(--red-700); }
.import-errors { margin-top: 10px; padding: 11px 13px; border: 1px solid #f4bab5; border-radius: 8px; color: var(--red-700); background: #fff5f4; font-size: 9px; }
.import-errors ul { max-height: 120px; margin: 6px 0 0; padding-left: 18px; overflow: auto; }
.import-errors p { margin-top: 5px; }
.import-sample { margin-top: 10px; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 9px; }
.import-sample-head, .import-sample > div:not(.import-sample-head) { display: grid; grid-template-columns: minmax(130px, .7fr) minmax(120px, .65fr) minmax(220px, 1.4fr); gap: 10px; align-items: center; padding: 8px 10px; }
.import-sample-head { color: var(--slate-500); background: var(--slate-50); font-size: 8px; font-weight: 800; }
.import-sample > div:not(.import-sample-head) + div { border-top: 1px solid var(--slate-100); }
.import-sample strong, .import-sample span, .import-sample small { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.import-sample small { color: var(--slate-500); }
.global-search label { display: block; margin-bottom: 7px; color: var(--slate-700); font-size: 10px; font-weight: 800; }
.global-search > div { display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--slate-300); border-radius: 10px; background: var(--slate-50); }
.global-search input { width: 100%; height: 44px; border: 0; background: transparent; outline: none; }
.search-results { display: grid; gap: 5px; margin-top: 13px; }
.search-result { display: grid; grid-template-columns: 65px 1fr auto 20px; align-items: center; gap: 9px; width: 100%; padding: 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; text-align: left; }
.search-result:hover { border-color: var(--slate-200); background: var(--slate-50); }
.search-result span { color: var(--blue-700); font-size: 9px; font-weight: 800; }
.search-result strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.search-result small { color: var(--slate-500); font-size: 9px; }
.search-result i { color: var(--slate-400); font-style: normal; }
.search-hint { padding: 30px; color: var(--slate-500); font-size: 11px; text-align: center; }

.toast-region { position: fixed; z-index: 150; right: 22px; bottom: 22px; display: grid; gap: 8px; pointer-events: none; }
.toast { display: flex; min-width: 260px; align-items: center; gap: 9px; padding: 12px 14px; border: 1px solid var(--slate-200); border-radius: 10px; color: var(--slate-700); background: var(--white); box-shadow: 0 12px 34px rgba(10, 24, 45, .18); opacity: 0; transform: translateY(10px); transition: opacity .2s ease, transform .2s ease; }
.toast.is-visible { opacity: 1; transform: translateY(0); }
.toast > span { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; color: var(--green-700); background: var(--green-100); font-weight: 800; }
.toast strong { font-size: 11px; }
.toast-warning > span { color: var(--amber-700); background: var(--amber-100); }

/* 销售待办总览 */
.sales-overview { display: grid; gap: 18px; }
.sales-overview-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 25px 28px; overflow: hidden; border: 1px solid #c9dcee; border-radius: var(--radius-lg); color: var(--white); background: radial-gradient(circle at 88% 20%, rgba(82, 184, 213, .35), transparent 30%), linear-gradient(135deg, #0b2546, #164f79); box-shadow: var(--shadow-sm); }
.sales-overview-hero > div { min-width: 0; }
.sales-overview-hero span { color: #9ed9f1; font-size: 10px; font-weight: 850; letter-spacing: .1em; }
.sales-overview-hero h2 { margin-top: 4px; font-size: 25px; letter-spacing: -.03em; }
.sales-overview-hero p { max-width: 720px; margin-top: 8px; color: #d9e8f4; font-size: 12px; }
.sales-overview-hero .button { flex: 0 0 auto; border-color: rgba(255,255,255,.28); color: var(--white); background: rgba(255,255,255,.12); }
.followup-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; }
.followup-metrics .metric-card { min-height: 100px; padding: 15px; }
.followup-metrics .metric-icon { width: 36px; height: 36px; }
.metric-danger .metric-icon { color: var(--red-700); background: var(--red-100); }
.metric-primary .metric-icon { color: var(--blue-700); background: var(--blue-100); }
.metric-success .metric-icon { color: var(--green-700); background: var(--green-100); }
.metric-warning .metric-icon { color: var(--amber-700); background: var(--amber-100); }
.sales-stage-guide { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; padding: 13px 16px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.sales-stage-guide span { display: flex; position: relative; align-items: center; gap: 8px; min-width: 0; color: var(--slate-600); font-size: 10px; font-weight: 750; }
.sales-stage-guide span:not(:last-child)::after { width: 100%; height: 1px; margin-right: 9px; background: var(--slate-200); content: ""; }
.sales-stage-guide i { display: grid; width: 23px; height: 23px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--blue-700); background: var(--blue-100); font-size: 9px; font-style: normal; }
.followup-workspace { padding: 20px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.followup-workspace .section-header p { margin-top: 3px; color: var(--slate-500); font-size: 10px; }
.followup-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.followup-list > .inline-empty { grid-column: 1 / -1; }
.followup-card { min-width: 0; padding: 17px; border: 1px solid var(--slate-200); border-left: 4px solid var(--blue-600); border-radius: 11px; background: linear-gradient(180deg, var(--white), #fbfcfe); }
.followup-card.tone-warning { border-left-color: #d99117; }
.followup-card.tone-ready, .followup-card.tone-complete { border-left-color: #20a272; }
.followup-card.tone-danger { border-left-color: var(--red-700); }
.followup-card > header { display: flex; justify-content: space-between; gap: 15px; }
.followup-card > header > div:first-child { min-width: 0; }
.followup-card h3 { overflow: hidden; margin-top: 3px; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.followup-card header p { overflow: hidden; margin-top: 4px; color: var(--slate-500); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.followup-value { display: flex; flex: 0 0 auto; align-items: flex-end; flex-direction: column; gap: 6px; text-align: right; }
.followup-value > strong { font-size: 13px; }
.stamp-status { display: inline-flex; align-items: center; gap: 5px; width: fit-content; padding: 4px 7px; border-radius: 999px; color: var(--slate-700); background: var(--slate-100); font-size: 9px; font-weight: 800; white-space: nowrap; }
.stamp-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.stamp-warning { color: var(--amber-700); background: var(--amber-100); }
.stamp-success { color: var(--green-700); background: var(--green-100); }
.stamp-danger { color: var(--red-700); background: var(--red-100); }
.followup-current { margin-top: 15px; padding: 12px 13px; border-radius: 9px; background: var(--slate-50); }
.followup-current > span, .followup-card footer span { display: block; color: var(--slate-500); font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.followup-current strong { display: block; margin-top: 2px; color: var(--navy-800); font-size: 16px; }
.followup-current p { margin-top: 3px; color: var(--slate-600); font-size: 10px; }
.followup-progress { margin-top: 15px; }
.followup-progress-track { height: 5px; overflow: hidden; border-radius: 99px; background: var(--slate-100); }
.followup-progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), var(--cyan-600)); }
.followup-steps { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 8px; }
.followup-steps span { display: grid; justify-items: center; gap: 3px; color: var(--slate-400, #9aa5b5); font-size: 7px; }
.followup-steps i { width: 6px; height: 6px; border: 1px solid var(--slate-300); border-radius: 50%; background: var(--white); }
.followup-steps .is-done { color: var(--green-700); font-weight: 800; }
.followup-steps .is-done i { border-color: var(--green-700); background: var(--green-700); }
.followup-steps .is-current { color: var(--blue-700); font-weight: 800; }
.followup-steps .is-current i { border: 2px solid var(--blue-600); background: var(--white); }
.followup-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--slate-100); }
.followup-card footer strong { display: block; margin-top: 1px; font-size: 10px; }

/* 合同归档与盖章 */
.contract-archive-workspace { display: grid; gap: 14px; }
.contract-archive-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px; border: 1px solid #c6d9ed; border-radius: var(--radius-md); background: linear-gradient(135deg, #f2f8ff, #f8fcfb); box-shadow: var(--shadow-sm); }
.contract-archive-heading > div:first-child { min-width: 0; }
.contract-archive-heading > div:first-child > span { color: var(--blue-700); font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.contract-archive-heading h2 { margin-top: 3px; font-size: 20px; }
.contract-archive-heading p { max-width: 800px; margin-top: 5px; color: var(--slate-600); font-size: 11px; line-height: 1.55; }
.contract-archive-heading > div:last-child { min-width: 104px; padding: 11px 15px; border-radius: 11px; color: var(--white); background: var(--navy-800); text-align: center; }
.contract-archive-heading > div:last-child strong, .contract-archive-heading > div:last-child span { display: block; }
.contract-archive-heading > div:last-child strong { font-size: 25px; }
.contract-archive-heading > div:last-child span { color: #cbdced; font-size: 9px; }
.contract-archive-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.contract-archive-metrics article { min-width: 0; padding: 14px 16px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.contract-archive-metrics span, .contract-archive-metrics small { display: block; color: var(--slate-500); font-size: 9px; }
.contract-archive-metrics strong { display: block; margin: 2px 0; color: var(--navy-800); font-size: 23px; }
.contract-archive-metrics small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contract-archive-download { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(135px, .35fr) auto minmax(135px, .35fr) minmax(170px, .45fr) auto; align-items: end; gap: 10px; padding: 16px; border: 1px solid #bfd1e6; border-radius: var(--radius-md); background: linear-gradient(100deg, var(--blue-50), var(--white)); box-shadow: var(--shadow-sm); }
.contract-archive-download > div { align-self: center; }
.contract-archive-download > div strong, .contract-archive-download > div small { display: block; }
.contract-archive-download > div strong { color: var(--navy-800); font-size: 12px; }
.contract-archive-download > div small { max-width: 600px; margin-top: 3px; color: var(--slate-500); font-size: 8px; line-height: 1.45; }
.contract-archive-download > label { color: var(--slate-600); font-size: 9px; font-weight: 800; }
.contract-archive-download > label input, .contract-archive-download > label select { display: block; width: 100%; min-height: 38px; margin-top: 4px; padding: 6px 8px; border: 1px solid var(--slate-300); border-radius: 7px; color: var(--slate-800); background: var(--white); font: inherit; }
.contract-archive-download > span { align-self: center; padding-bottom: 8px; color: var(--slate-400); font-size: 9px; }
.contract-archive-download > button { min-height: 38px; white-space: nowrap; }
.contract-archive-note { display: flex; align-items: center; gap: 8px 14px; padding: 10px 13px; border: 1px solid var(--amber-200); border-radius: 8px; color: var(--amber-700); background: var(--amber-100); font-size: 9px; }
.contract-archive-note span { color: var(--slate-600); }

.contract-stamp-workspace { display: grid; gap: 14px; }
.contract-stamp-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 23px; border: 1px solid #cbdcef; border-radius: var(--radius-md); background: linear-gradient(135deg, #f3f8ff, #f7fbfc); }
.contract-stamp-heading > div:first-child { min-width: 0; }
.contract-stamp-heading > div:first-child > span { color: var(--blue-700); font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.contract-stamp-heading h2 { margin-top: 3px; font-size: 19px; }
.contract-stamp-heading p { max-width: 740px; margin-top: 5px; color: var(--slate-600); font-size: 11px; }
.contract-stamp-heading > div:last-child { min-width: 88px; padding: 10px 14px; border-radius: 10px; color: var(--white); background: var(--navy-800); text-align: center; }
.contract-stamp-heading > div:last-child strong, .contract-stamp-heading > div:last-child span { display: block; }
.contract-stamp-heading > div:last-child strong { font-size: 23px; }
.contract-stamp-heading > div:last-child span { color: #cbdced; font-size: 9px; }
.contract-stamp-list { display: grid; gap: 11px; }
.contract-stamp-card { padding: 18px 19px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); }
.contract-stamp-card.status-submitted { border-left: 4px solid #d99117; }
.contract-stamp-card.status-stamped { border-left: 4px solid var(--green-700); }
.contract-stamp-card.status-returned { border-left: 4px solid var(--red-700); }
.contract-stamp-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.contract-stamp-card > header > div:first-child { min-width: 0; }
.contract-stamp-card header h3 { margin-top: 3px; font-size: 16px; }
.contract-stamp-card header p { margin-top: 3px; color: var(--slate-500); font-size: 10px; }
.contract-stamp-card > header > div:last-child { display: flex; align-items: flex-end; flex-direction: column; gap: 6px; }
.stamp-priority { padding: 3px 7px; border-radius: 6px; color: var(--red-700); background: var(--red-100); font-size: 9px; font-weight: 850; }
.contract-stamp-card dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.contract-stamp-card dl > div { min-width: 0; padding: 9px 10px; border-radius: 8px; background: var(--slate-50); }
.contract-stamp-card dt { color: var(--slate-500); font-size: 8px; }
.contract-stamp-card dd { overflow-wrap: anywhere; margin-top: 2px; font-size: 10px; font-weight: 750; }
.contract-stamp-card .stamp-return-reason { grid-column: span 2; color: var(--red-700); background: var(--red-100); }
.contract-document-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.contract-document-columns section { min-width: 0; padding: 11px; border: 1px solid var(--slate-200); border-radius: 9px; }
.contract-document-columns section > span { display: block; margin-bottom: 7px; color: var(--slate-500); font-size: 8px; font-weight: 850; letter-spacing: .05em; }
.contract-document-columns section > div { display: flex; flex-wrap: wrap; gap: 5px; }
.contract-stamp-card > footer { display: flex; justify-content: flex-end; gap: 7px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--slate-100); }

/* 订单与采购执行详情：保持小屏可读，不再使用 7–10px 的业务正文 */
.order-summary-actions > .button { min-height: 32px; padding: 5px 10px; font-size: 12px; }
.order-summary .entity-code { font-size: 11px; }
.order-card-head h3 { font-size: 16px; }
.order-card-head p { margin-top: 4px; font-size: 13px; }
.order-value > span { font-size: 11px; }
.order-value > strong { font-size: 17px; }
.order-status-stack .status-badge, .status-matrix .status-badge { padding: 3px 8px; font-size: 11px; }
.order-card-body { font-size: 13px; line-height: 1.5; }
.order-documents > span { font-size: 12px; }
.control-gate { padding: 11px 12px; }
.control-gate > span { font-size: 11px; }
.control-gate > strong { margin-top: 3px; font-size: 14px; }
.control-gate > small { margin-top: 3px; font-size: 12px; }
.status-matrix > div { padding: 10px; }
.status-matrix > div > span:first-child { font-size: 11px; }
.progress-summary > div:first-child { font-size: 13px; }
.order-card .card-actions .button-small { min-height: 34px; padding: 6px 12px; font-size: 12px; }
.gate-lock-notes { margin-top: 9px; font-size: 13px; }
.source-banner { align-items: center; padding: 9px 11px; font-size: 13px; }
.purchase-promised-date { margin-left: auto; padding: 4px 7px; border-radius: 6px; color: var(--blue-700) !important; background: var(--blue-100); font-size: 12px; white-space: nowrap; }
.purchase-promised-date b { margin-left: 3px; color: var(--navy-800); font-size: 13px; }
.purchase-promised-date.is-missing { color: var(--amber-700) !important; background: var(--amber-100); }
.currency-comparison-note { padding: 4px 7px; border-radius: 6px; color: var(--blue-700) !important; background: var(--blue-50); font-size: 11px; font-weight: 750; }
.path-mode { font-size: 11px; }
.trace-label { font-size: 12px; }
.trace-chain > div { min-width: 112px; padding: 9px 10px; }
.trace-chain span { font-size: 11px; }
.trace-chain strong { font-size: 13px; }
.order-exception-note { font-size: 13px; }

/* 订单库存占用与交付 */
.order-fulfillment-panel { margin: 11px 0; overflow: hidden; border: 1px solid #cbd9e8; border-radius: 9px; background: #fbfdff; }
.order-fulfillment-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 13px; border-bottom: 1px solid var(--slate-200); }
.order-fulfillment-panel > header > div { min-width: 0; }
.order-fulfillment-panel > header span, .order-fulfillment-panel > header strong, .order-fulfillment-panel > header small { display: block; }
.order-fulfillment-panel > header span { color: var(--blue-700); font-size: 11px; font-weight: 850; }
.order-fulfillment-panel > header strong { margin-top: 2px; font-size: 15px; }
.order-fulfillment-panel > header small { margin-top: 3px; color: var(--slate-500); font-size: 12px; }
.order-fulfillment-panel > header dl { display: grid; min-width: 310px; grid-template-columns: repeat(3, 1fr); }
.order-fulfillment-panel > header dl > div { padding: 3px 12px; border-left: 1px solid var(--slate-200); }
.order-fulfillment-panel dt { color: var(--slate-500); font-size: 11px; }
.order-fulfillment-panel dd { margin-top: 2px; font-size: 14px; font-weight: 850; }
.order-fulfillment-panel .has-shortage { color: var(--red-700); background: #fff8f7; }
.fulfillment-line-head, .fulfillment-line { display: grid; grid-template-columns: minmax(210px, 1.5fr) repeat(5, minmax(72px, .45fr)); align-items: center; gap: 10px; }
.fulfillment-line-head { min-height: 34px; padding: 0 13px; color: var(--slate-500); font-size: 11px; font-weight: 800; }
.fulfillment-line { min-height: 64px; padding: 9px 13px; border-top: 1px solid var(--slate-100); background: var(--white); }
.fulfillment-line > div { min-width: 0; }
.fulfillment-line span, .fulfillment-line strong, .fulfillment-line small { display: block; }
.fulfillment-line > div > span:not(.entity-code) { color: var(--slate-500); font-size: 11px; }
.fulfillment-line strong { overflow: hidden; margin-top: 2px; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.fulfillment-line small { margin-top: 3px; color: var(--slate-500); font-size: 11px; }
.fulfillment-line .fulfillment-replenishment { overflow: visible; color: var(--blue-700); font-size: 11px; font-weight: 750; line-height: 1.35; white-space: normal; }

/* 双地点库存与调拨 */
.inventory-rule-note { display: flex; align-items: center; gap: 10px 16px; margin: -5px 0 16px; padding: 11px 14px; border: 1px solid #c8d9ec; border-radius: 9px; color: var(--slate-600); background: var(--blue-50); font-size: 12px; }
.inventory-rule-note strong { flex: 0 0 auto; color: var(--blue-700); }
.inventory-shortage-board { overflow: hidden; margin-bottom: 16px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.inventory-shortage-board.has-shortages { border-color: #e9c8bc; }
.inventory-shortage-board > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 15px; border-bottom: 1px solid var(--slate-200); background: #fffaf7; }
.inventory-shortage-board.is-clear > header { background: #f7fbf8; }
.inventory-shortage-board > header > div > span { color: var(--amber-700); font-size: 11px; font-weight: 850; }
.inventory-shortage-board.is-clear > header > div > span { color: var(--green-700); }
.inventory-shortage-board > header h3 { margin-top: 2px; font-size: 16px; }
.inventory-shortage-board > header p { margin-top: 3px; color: var(--slate-600); font-size: 12px; }
.inventory-shortage-board > header > strong { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; color: var(--amber-700); background: var(--amber-100); font-size: 12px; }
.inventory-shortage-board.is-clear > header > strong { color: var(--green-700); background: var(--green-100); }
.inventory-shortage-list { display: grid; padding: 0 14px; }
.inventory-shortage-row { display: grid; min-height: 72px; grid-template-columns: minmax(180px, 1.2fr) minmax(180px, 1.2fr) minmax(100px, .6fr) minmax(110px, .6fr) auto; align-items: center; gap: 13px; padding: 10px 2px; border-top: 1px solid var(--slate-100); }
.inventory-shortage-row:first-child { border-top: 0; }
.inventory-shortage-row > div { display: grid; min-width: 0; gap: 2px; }
.inventory-shortage-row > div > strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.inventory-shortage-row > div > span:not(.entity-code), .inventory-shortage-row small { color: var(--slate-500); font-size: 11px; }
.inventory-shortage-quantity strong { color: var(--red-700); font-size: 14px !important; }
.inventory-shortage-clear { padding: 15px; color: var(--slate-600); font-size: 12px; }
.warehouse-inventory-head, .inventory-row { grid-template-columns: minmax(210px, 1.55fr) repeat(4, minmax(95px, .65fr)); }
.inventory-row > div:first-child small:not(.inventory-anomaly) { margin-top: 3px; color: var(--slate-500); font-size: 10px; }
.stock-transfer-workspace { display: grid; gap: 13px; }
.transfer-workspace-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 22px; border: 1px solid #c8d9ec; border-radius: var(--radius-md); background: linear-gradient(135deg, #f3f8ff, #f8fcfb); }
.transfer-workspace-head > div { min-width: 0; }
.transfer-workspace-head > div > span { color: var(--blue-700); font-size: 10px; font-weight: 850; letter-spacing: .06em; }
.transfer-workspace-head h2 { margin-top: 3px; font-size: 20px; }
.transfer-workspace-head p { max-width: 760px; margin-top: 5px; color: var(--slate-600); font-size: 12px; }
.transfer-workspace-head dl { display: grid; min-width: 170px; grid-template-columns: 1fr 1fr; overflow: hidden; border-radius: 9px; background: var(--navy-800); }
.transfer-workspace-head dl > div { padding: 10px 13px; text-align: center; }
.transfer-workspace-head dl > div + div { border-left: 1px solid rgba(255,255,255,.16); }
.transfer-workspace-head dt { color: #cbdced; font-size: 10px; }
.transfer-workspace-head dd { margin-top: 2px; color: var(--white); font-size: 20px; font-weight: 850; }
.stock-transfer-list { display: grid; gap: 10px; }
.stock-transfer-card { padding: 16px 18px; border: 1px solid var(--slate-200); border-left: 4px solid var(--cyan-600); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.stock-transfer-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.stock-transfer-card h3 { margin-top: 3px; font-size: 16px; }
.stock-transfer-card header p { margin-top: 4px; color: var(--slate-600); font-size: 12px; }
.stock-transfer-card header p i { margin-inline: 6px; color: var(--blue-600); font-style: normal; }
.stock-transfer-card dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
.stock-transfer-card dl > div { padding: 9px 10px; border-radius: 7px; background: var(--slate-50); }
.stock-transfer-card dt { color: var(--slate-500); font-size: 11px; }
.stock-transfer-card dd { margin-top: 2px; font-size: 13px; font-weight: 800; }
.transfer-note { margin-top: 9px; color: var(--slate-600); font-size: 12px; }
.stock-transfer-card > footer { display: flex; justify-content: flex-end; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--slate-100); }

/* 免退退税管理 */
.tax-refund-workspace { display: grid; gap: 13px; }
.tax-refund-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 23px; border: 1px solid #cfdbeb; border-radius: var(--radius-md); background: linear-gradient(135deg, #f4f8ff, #fbfaf4); }
.tax-refund-hero > div { min-width: 0; }
.tax-refund-hero > div > span { color: var(--blue-700); font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.tax-refund-hero h2 { margin-top: 3px; font-size: 20px; }
.tax-refund-hero p { max-width: 830px; margin-top: 5px; color: var(--slate-600); font-size: 12px; }
.tax-refund-hero dl { display: grid; min-width: 170px; grid-template-columns: 1fr 1fr; overflow: hidden; border-radius: 9px; background: var(--navy-800); }
.tax-refund-hero dl > div { padding: 10px 13px; text-align: center; }
.tax-refund-hero dl > div + div { border-left: 1px solid rgba(255,255,255,.16); }
.tax-refund-hero dt { color: #cbdced; font-size: 10px; }
.tax-refund-hero dd { margin-top: 2px; color: var(--white); font-size: 20px; font-weight: 850; }
.tax-refund-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tax-refund-metrics article { padding: 14px 16px; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); box-shadow: var(--shadow-sm); }
.tax-refund-metrics span { color: var(--slate-500); font-size: 11px; }
.tax-refund-metrics strong { display: block; margin-top: 4px; font-size: 18px; }
.tax-refund-flow { display: grid; grid-template-columns: repeat(6, 1fr); overflow: hidden; border: 1px solid var(--slate-200); border-radius: 9px; background: var(--white); }
.tax-refund-flow span { display: flex; position: relative; min-height: 50px; align-items: center; justify-content: center; gap: 7px; padding: 8px; color: var(--slate-600); font-size: 11px; font-weight: 800; text-align: center; }
.tax-refund-flow span + span { border-left: 1px solid var(--slate-200); }
.tax-refund-flow i { display: grid; width: 22px; height: 22px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--white); background: var(--blue-600); font-size: 10px; font-style: normal; }
.tax-refund-list { display: grid; gap: 10px; }
.tax-refund-card { padding: 17px 18px; border: 1px solid var(--slate-200); border-left: 4px solid var(--slate-400, #9aa5b5); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.tax-refund-card.tone-warning { border-left-color: var(--amber-700); }
.tax-refund-card.tone-success { border-left-color: var(--green-700); }
.tax-refund-card.tone-danger { border-left-color: var(--red-700); }
.tax-refund-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.tax-refund-card h3 { margin-top: 3px; font-size: 16px; }
.tax-refund-card header p { margin-top: 4px; color: var(--slate-500); font-size: 12px; }
.tax-refund-amounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
.tax-refund-amounts > div { padding: 10px 11px; border-radius: 8px; background: var(--slate-50); }
.tax-refund-amounts span, .tax-refund-details dt { color: var(--slate-500); font-size: 11px; }
.tax-refund-amounts strong { display: block; margin-top: 3px; font-size: 14px; }
.tax-refund-details { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.tax-refund-details > div { padding: 9px 10px; border: 1px solid var(--slate-100); border-radius: 8px; }
.tax-refund-details dd { overflow-wrap: anywhere; margin-top: 2px; font-size: 12px; font-weight: 750; }
.tax-refund-calculation { overflow: hidden; margin-top: 9px; border: 1px solid var(--slate-200); border-radius: 8px; background: var(--white); }
.tax-refund-calculation > summary { display: flex; min-height: 40px; align-items: center; gap: 9px; padding: 9px 11px; color: var(--navy-800); background: var(--slate-50); cursor: pointer; font-size: 12px; font-weight: 800; list-style: none; }
.tax-refund-calculation > summary::-webkit-details-marker { display: none; }
.tax-refund-calculation > summary strong { margin-left: auto; color: var(--slate-500); font-size: 11px; }
.tax-refund-calculation > summary i { color: var(--blue-700); font-size: 17px; font-style: normal; line-height: 1; transition: transform .16s ease; }
.tax-refund-calculation[open] > summary i { transform: rotate(180deg); }
.tax-refund-calculation > div { padding: 5px 11px 9px; }
.tax-refund-calculation-head, .tax-refund-calculation article { display: grid; grid-template-columns: minmax(180px, 1.3fr) repeat(4, minmax(105px, .7fr)); gap: 9px; align-items: center; }
.tax-refund-calculation-head { padding: 7px 3px; color: var(--slate-500); font-size: 11px; font-weight: 750; }
.tax-refund-calculation article { min-height: 46px; padding: 7px 3px; border-top: 1px solid var(--slate-100); font-size: 12px; }
.tax-refund-calculation article > div { display: grid; gap: 2px; min-width: 0; }
.tax-refund-calculation article > div strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tax-refund-calculation article small { color: var(--slate-500); font-size: 11px; }
.tax-refund-calculation article > strong { color: var(--blue-700); font-size: 13px; }
.tax-refund-missing { display: grid; gap: 3px; margin-top: 9px; padding: 10px 12px; border: 1px solid var(--red-200); border-radius: 8px; color: var(--red-700); background: var(--red-100); font-size: 12px; }
.tax-refund-documents { display: flex; align-items: center; gap: 10px; margin-top: 9px; padding: 9px 11px; border-radius: 8px; background: var(--slate-50); font-size: 12px; }
.tax-refund-documents > span { color: var(--slate-500); font-weight: 800; }
.tax-refund-documents > div { display: flex; flex-wrap: wrap; gap: 5px; }
.tax-refund-card > footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 7px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--slate-100); }

.dialog:has(.order-line-row) { width: min(1200px, 100%); }
.line-row.sales-line-row { grid-template-columns: 22px minmax(150px, 1.5fr) minmax(72px, .48fr) minmax(92px, .62fr) 84px minmax(108px, .8fr) 80px 32px; }
.line-row.purchase-line-row { grid-template-columns: 22px minmax(145px, 1.3fr) minmax(70px, .45fr) minmax(90px, .58fr) 75px minmax(175px, 1.35fr) minmax(85px, .55fr) 32px; }
.tax-refund-line-field.is-disabled { opacity: .54; }
.document-field.is-required > label::after { color: var(--red-700); content: " *"; }

.order-cancellation-workspace { display: grid; gap: 16px; }
.cancellation-workspace-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 24px; overflow: hidden; border: 1px solid #cbdcef; border-radius: var(--radius-md); background: linear-gradient(135deg, #f3f8ff 0%, #f8fbff 65%, #eaf6f5 100%); box-shadow: var(--shadow-sm); }
.cancellation-workspace-heading > div { min-width: 0; }
.cancellation-workspace-heading > div > span { color: var(--blue-700); font-size: 10px; font-weight: 900; letter-spacing: .09em; }
.cancellation-workspace-heading h2 { margin-top: 3px; font-size: 21px; }
.cancellation-workspace-heading p { max-width: 780px; margin-top: 6px; color: var(--slate-600); font-size: 12px; }
.cancellation-workspace-heading > strong { display: grid; min-width: 112px; min-height: 72px; place-items: center; padding: 10px 16px; border-radius: 12px; color: var(--white); background: linear-gradient(145deg, var(--navy-900), var(--navy-800)); font-size: 26px; line-height: 1; box-shadow: 0 10px 24px rgba(16, 35, 63, .18); }
.cancellation-workspace-heading > strong span { color: #cbdced; font-size: 10px; font-weight: 700; }
.cancellation-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cancellation-metrics article { min-width: 0; padding: 14px 16px; border: 1px solid var(--slate-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); }
.cancellation-metrics span, .cancellation-metrics small { display: block; color: var(--slate-500); font-size: 10px; }
.cancellation-metrics strong { display: block; margin: 2px 0; color: var(--navy-800); font-size: 24px; line-height: 1.25; }
.cancellation-workspace-group { display: grid; gap: 10px; padding: 15px; border: 1px solid var(--slate-200); border-radius: var(--radius-md); background: rgba(255, 255, 255, .55); }
.cancellation-workspace-group > header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 0 2px; }
.cancellation-workspace-group h3 { font-size: 16px; }
.cancellation-workspace-group header p { margin-top: 2px; color: var(--slate-500); font-size: 10px; }
.cancellation-workspace-group > header > span { color: var(--slate-600); font-size: 11px; font-weight: 800; }
.cancellation-workspace-group > div { display: grid; gap: 12px; }
.cancellation-workspace-group.is-actionable { border-color: #d9c18b; background: #fffbf1; }
.cancellation-workspace-group.is-history { background: rgba(246, 248, 251, .8); }
.order-cancellation-card { padding: 18px 19px; border: 1px solid var(--slate-200); border-left: 4px solid var(--blue-600); border-radius: var(--radius-md); background: var(--white); box-shadow: var(--shadow-sm); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.order-cancellation-card.status-returned { border-left-color: var(--amber-700); }
.order-cancellation-card.status-rejected, .order-cancellation-card.status-withdrawn { border-left-color: var(--red-700); }
.order-cancellation-card.status-approved { border-left-color: var(--cyan-600); }
.order-cancellation-card.status-completed { border-left-color: var(--green-700); }
.order-cancellation-card.is-targeted { border-color: var(--blue-600); box-shadow: 0 0 0 4px rgba(31, 102, 204, .13), var(--shadow-lg); transform: translateY(-2px); }
.order-cancellation-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.order-cancellation-card > header > div { min-width: 0; }
.order-cancellation-card h3 { margin-top: 3px; font-size: 17px; }
.order-cancellation-card header p { margin-top: 3px; color: var(--slate-500); font-size: 11px; }
.cancellation-status { display: inline-grid; grid-template-columns: 8px auto; gap: 0 7px; min-width: 122px; align-items: center; padding: 7px 10px; border: 1px solid #e3c682; border-radius: 9px; color: var(--amber-700); background: var(--amber-100); }
.cancellation-status > i { grid-row: 1 / 3; width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px rgba(156, 93, 8, .12); }
.cancellation-status > span { font-size: 10px; font-weight: 850; line-height: 1.2; }
.cancellation-status > b { font-size: 8px; font-weight: 700; line-height: 1.2; opacity: .75; }
.cancellation-status-returned { color: var(--amber-700); }
.cancellation-status-rejected, .cancellation-status-withdrawn { border-color: var(--red-200); color: var(--red-700); background: var(--red-100); }
.cancellation-status-approved { border-color: #a9dfdc; color: var(--cyan-600); background: var(--cyan-100); }
.cancellation-status-completed { border-color: #b1dfca; color: var(--green-700); background: var(--green-100); }
.cancellation-audit-lock, .cancellation-order-lock { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; padding: 10px 12px; border: 1px solid #e3c682; border-radius: 9px; color: var(--amber-700); background: var(--amber-100); }
.cancellation-audit-lock strong, .cancellation-order-lock strong { flex: 0 0 auto; font-size: 11px; }
.cancellation-audit-lock span, .cancellation-order-lock span { color: var(--slate-700); font-size: 10px; }
.cancellation-order-lock > div { display: flex; align-items: center; gap: 9px; }
.order-edit-button.is-cancellation-locked { color: var(--amber-700); border-color: #e3c682; background: #fffaf0; opacity: .78; }
.cancellation-amounts { display: grid; grid-template-columns: minmax(150px, 1fr) 22px minmax(150px, 1fr) minmax(130px, .75fr) minmax(130px, .75fr); gap: 9px; align-items: center; margin-top: 13px; }
.cancellation-amounts > div { min-width: 0; padding: 10px 11px; border-radius: 8px; background: var(--slate-50); }
.cancellation-amounts > div:nth-child(3) { background: var(--blue-50); }
.cancellation-amounts > div > span { display: block; color: var(--slate-500); font-size: 9px; }
.cancellation-amounts > div > strong { display: block; overflow: hidden; margin-top: 2px; text-overflow: ellipsis; font-size: 12px; white-space: nowrap; }
.cancellation-amounts > i { color: var(--blue-700); font-size: 17px; font-style: normal; text-align: center; }
.cancellation-reason { margin-top: 10px; padding: 10px 12px; border-left: 3px solid var(--slate-300); border-radius: 0 8px 8px 0; background: var(--slate-50); }
.cancellation-reason > span { color: var(--slate-500); font-size: 9px; font-weight: 800; }
.cancellation-reason p { margin-top: 3px; color: var(--slate-700); font-size: 11px; }
.cancellation-impact { margin-top: 12px; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 10px; }
.cancellation-impact > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 12px; background: var(--blue-50); }
.cancellation-impact > header > div strong, .cancellation-impact > header > div span { display: block; }
.cancellation-impact > header > div strong { color: var(--navy-800); font-size: 12px; }
.cancellation-impact > header > div span { margin-top: 2px; color: var(--slate-600); font-size: 9px; }
.cancellation-impact > header dl { display: flex; align-items: stretch; gap: 5px; }
.cancellation-impact > header dl > div { min-width: 78px; padding: 5px 8px; border-radius: 7px; background: rgba(255, 255, 255, .75); text-align: right; }
.cancellation-impact dt { color: var(--slate-500); font-size: 8px; }
.cancellation-impact dd { color: var(--blue-700); font-size: 12px; font-weight: 850; }
.cancellation-impact-lines { padding: 3px 12px 7px; }
.cancellation-impact-line { display: grid; grid-template-columns: minmax(180px, 1.4fr) repeat(4, minmax(76px, .55fr)); gap: 9px; align-items: center; min-height: 50px; padding: 7px 2px; border-top: 1px solid var(--slate-100); }
.cancellation-impact-line.is-purchase { grid-template-columns: minmax(180px, 1.4fr) repeat(5, minmax(76px, .55fr)); }
.cancellation-impact-line:first-child { border-top: 0; }
.cancellation-impact-line > div { display: grid; gap: 1px; min-width: 0; }
.cancellation-impact-line > div > span:not(.entity-code) { color: var(--slate-500); font-size: 8px; }
.cancellation-impact-line > div > strong { overflow: hidden; text-overflow: ellipsis; font-size: 11px; white-space: nowrap; }
.cancellation-exceptions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.cancellation-message-list { padding: 9px 10px; border: 1px solid var(--slate-200); border-radius: 8px; background: var(--slate-50); }
.cancellation-message-list > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cancellation-message-list header strong { font-size: 10px; }
.cancellation-message-list header span { display: grid; min-width: 18px; height: 18px; place-items: center; border-radius: 9px; background: rgba(0, 0, 0, .06); font-size: 8px; }
.cancellation-message-list ul { display: grid; gap: 4px; margin: 6px 0 0; padding-left: 15px; color: var(--slate-600); font-size: 9px; }
.cancellation-message-list.is-blockers { border-color: var(--red-200); color: var(--red-700); background: var(--red-100); }
.cancellation-message-list.is-warnings { border-color: #e3c682; color: var(--amber-700); background: var(--amber-100); }
.cancellation-message-list.is-tasks { border-color: #c7d9ee; color: var(--blue-700); background: var(--blue-50); }
.cancellation-documents { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 9px 11px; border-radius: 8px; background: var(--slate-50); }
.cancellation-documents > span { color: var(--slate-500); font-size: 9px; font-weight: 800; }
.cancellation-documents > div { display: flex; flex-wrap: wrap; gap: 5px; }
.cancellation-timeline { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--slate-100); }
.cancellation-timeline > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cancellation-timeline > header strong { font-size: 11px; }
.cancellation-timeline > header span { color: var(--slate-500); font-size: 9px; }
.cancellation-timeline ol { display: flex; margin: 10px 0 0; padding: 0; overflow-x: auto; list-style: none; }
.cancellation-timeline li { display: grid; position: relative; min-width: 155px; grid-template-columns: 11px minmax(0, 1fr); gap: 7px; padding: 0 14px 3px 0; }
.cancellation-timeline li::after { position: absolute; z-index: 0; top: 5px; right: 0; left: 5px; height: 1px; background: var(--slate-200); content: ""; }
.cancellation-timeline li:last-child::after { display: none; }
.cancellation-timeline li > i { z-index: 1; width: 10px; height: 10px; margin-top: 1px; border: 2px solid var(--white); border-radius: 50%; background: var(--blue-600); box-shadow: 0 0 0 1px var(--blue-600); }
.cancellation-timeline li > div { z-index: 1; min-width: 0; padding-right: 4px; background: var(--white); }
.cancellation-timeline li strong, .cancellation-timeline li span { display: block; }
.cancellation-timeline li strong { font-size: 9px; }
.cancellation-timeline li span { margin-top: 2px; color: var(--slate-500); font-size: 8px; }
.cancellation-timeline li p { margin-top: 3px; color: var(--slate-600); font-size: 8px; }
.order-cancellation-card > footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--slate-100); }
.cancellation-empty-copy { padding: 12px; color: var(--slate-500); font-size: 10px; text-align: center; }

.dialog:has(.cancellation-form-preview), .dialog:has(.cancellation-request-lines) { width: min(960px, 100%); }
.cancellation-form-preview { grid-column: 1 / -1; overflow: hidden; border: 1px solid #c7d9ee; border-radius: 11px; background: var(--white); }
.cancellation-form-preview > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 13px 14px; background: linear-gradient(135deg, var(--blue-50), #f2faf9); }
.cancellation-form-preview > header span, .cancellation-form-preview > header strong, .cancellation-form-preview > header p { display: block; }
.cancellation-form-preview > header span { color: var(--blue-700); font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.cancellation-form-preview > header strong { margin-top: 2px; font-size: 15px; }
.cancellation-form-preview > header p { margin-top: 3px; color: var(--slate-600); font-size: 10px; }
.cancellation-form-preview > header > b { flex: 0 0 auto; padding: 5px 8px; border-radius: 7px; color: var(--navy-800); background: rgba(255, 255, 255, .78); font-size: 10px; }
.cancellation-form-preview > dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; padding: 1px; background: var(--slate-200); }
.cancellation-form-preview > dl > div { min-width: 0; padding: 9px 11px; background: var(--white); }
.cancellation-form-preview dt { color: var(--slate-500); font-size: 8px; }
.cancellation-form-preview dd { overflow: hidden; margin-top: 2px; text-overflow: ellipsis; font-size: 11px; font-weight: 850; white-space: nowrap; }
.cancellation-form-preview > .cancellation-message-list { margin: 9px 11px; }
.cancellation-request-lines { padding: 0; overflow: hidden; border: 1px solid var(--slate-200); border-radius: 11px; }
.cancellation-request-lines > legend { width: 100%; padding: 12px 14px 0; font-size: 13px; font-weight: 850; }
.cancellation-request-lines > legend span { margin-right: 8px; color: var(--blue-700); font-size: 9px; letter-spacing: .08em; }
.cancellation-request-lines > p { padding: 3px 14px 10px; color: var(--slate-500); font-size: 9px; }
.cancellation-request-lines > div { display: grid; padding: 0 12px; }
.cancellation-request-line { display: grid; grid-template-columns: minmax(260px, 1.6fr) minmax(130px, .65fr) minmax(150px, .75fr); gap: 12px; align-items: center; min-height: 70px; padding: 9px 2px; border-top: 1px solid var(--slate-100); }
.cancellation-request-line:first-child { border-top: 0; }
.cancellation-request-material { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; }
.cancellation-request-material .line-number { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 7px; color: var(--blue-700); background: var(--blue-100); font-size: 9px; font-weight: 850; }
.cancellation-request-material > div { min-width: 0; }
.cancellation-request-material strong, .cancellation-request-material small { display: block; }
.cancellation-request-material strong { overflow: hidden; margin-top: 1px; text-overflow: ellipsis; font-size: 11px; white-space: nowrap; }
.cancellation-request-material small { margin-top: 2px; color: var(--slate-500); font-size: 8px; }
.cancellation-request-line > label { display: grid; gap: 4px; color: var(--slate-600); font-size: 9px; font-weight: 750; }
.cancellation-request-line input { width: 100%; height: 36px; padding: 0 9px; border: 1px solid var(--slate-300); border-radius: 8px; background: var(--white); }
.cancellation-request-line input[readonly] { color: var(--slate-700); background: var(--slate-50); }
.cancellation-request-line.is-locked { opacity: .55; }
.cancellation-request-lines > footer { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 2px; padding: 10px 14px; border-top: 1px solid var(--slate-200); background: var(--slate-50); }
.cancellation-request-lines > footer span { color: var(--slate-600); font-size: 10px; }
.cancellation-request-lines > footer strong { color: var(--blue-700); font-size: 15px; }

@media (max-width: 1260px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operating-data-grid, .worklist-board, .finance-task-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-todo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .invoice-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .entity-grid, .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-balance-grid { grid-template-columns: 1fr 1fr; }
  .balance-invoice { grid-column: 1 / -1; }
  .finance-workspace-split { grid-template-columns: 1fr; }
  .account-row { grid-template-columns: 42px minmax(140px, 1.2fr) minmax(85px, .6fr) auto minmax(170px, auto); }
  .account-row > div:nth-child(4) { display: none; }
  .followup-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .followup-list { grid-template-columns: 1fr; }
  .contract-archive-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .contract-archive-download { grid-template-columns: minmax(135px, 1fr) auto minmax(135px, 1fr) minmax(170px, 1.1fr) auto; }
  .contract-archive-download > div { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  :root { --sidebar-width: 244px; }
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; }
  .sidebar.is-open { transform: translateX(0); box-shadow: var(--shadow-lg); }
  .sidebar-scrim { position: fixed; z-index: 25; inset: 0; background: rgba(5, 15, 30, .46); }
  .main-area { margin-left: 0; }
  .mobile-menu { display: inline-grid !important; }
  .search-trigger { min-width: 38px; width: 38px; justify-content: center; padding: 0; }
  .search-trigger span:nth-child(2), .search-trigger kbd { display: none; }
  .finance-todo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-cashflow-grid { grid-template-columns: 1fr; }
  .invoice-archive-download { grid-template-columns: 1fr 1fr auto; }
  .invoice-archive-download > div { grid-column: 1 / -1; }
  .invoice-archive-download > button { grid-column: 1 / -1; justify-self: end; }
  .status-matrix, .status-matrix:has(> div:nth-child(7)) { grid-template-columns: repeat(3, 1fr); }
  .status-matrix > div:nth-child(n+4) { border-top: 1px solid var(--slate-200); }
  .status-matrix > div:nth-child(3n+1) { border-left: 0; }
  .invoice-row { grid-template-columns: 45px minmax(130px, 1fr) minmax(90px, .7fr) auto; }
  .invoice-row > div:nth-child(3), .invoice-row > div:nth-child(5) { display: none; }
  .cash-row { grid-template-columns: 34px minmax(140px, 1fr) minmax(100px, .7fr) auto; }
  .cash-row > div:nth-child(3), .cash-row > div:nth-child(4) { display: none; }
  .material-row { grid-template-columns: 1fr; gap: 14px; }
  .material-library-head, .material-library-row { grid-template-columns: minmax(220px, 1fr) minmax(140px, .4fr); }
  .material-library-table.is-editable .material-library-head, .material-library-row.is-editable { grid-template-columns: minmax(220px, 1fr) minmax(140px, .4fr) 100px; }
  .material-library-head > span:nth-child(3), .library-stock { display: none; }
  .current-user > div { display: none; }
  .current-user { grid-template-columns: auto auto; padding-left: 8px; }
  .account-row { grid-template-columns: 42px minmax(140px, 1fr) auto minmax(170px, auto); }
  .account-row > div:nth-child(3), .account-row > div:nth-child(4) { display: none; }
  .sales-stage-guide { grid-template-columns: repeat(3, 1fr); row-gap: 10px; }
  .sales-stage-guide span:nth-child(3n)::after { display: none; }
  .contract-archive-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contract-archive-download { grid-template-columns: 1fr 1fr; }
  .contract-archive-download > div { grid-column: 1 / -1; }
  .contract-archive-download > span { display: none; }
  .contract-archive-download > button { width: 100%; }
  .contract-stamp-card dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .order-fulfillment-panel > header { align-items: flex-start; flex-direction: column; }
  .order-fulfillment-panel > header dl { width: 100%; min-width: 0; }
  .fulfillment-line-head, .fulfillment-line { grid-template-columns: minmax(190px, 1.4fr) repeat(5, minmax(65px, .5fr)); }
  .inventory-shortage-row { grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(90px, .55fr) auto; }
  .inventory-shortage-row > div:nth-child(4) { display: none; }
  .tax-refund-flow { grid-template-columns: repeat(3, 1fr); }
  .tax-refund-flow span:nth-child(n+4) { border-top: 1px solid var(--slate-200); }
  .tax-refund-flow span:nth-child(4) { border-left: 0; }
  .tax-refund-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cancellation-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cancellation-amounts { grid-template-columns: 1fr 20px 1fr; }
  .cancellation-amounts > div:nth-child(n+4) { grid-column: span 1; }
  .cancellation-exceptions { grid-template-columns: 1fr; }
  .cancellation-request-line { grid-template-columns: minmax(220px, 1.3fr) minmax(115px, .65fr) minmax(135px, .7fr); }
}

@media (max-width: 680px) {
  .auth-card { padding: 25px 20px; border-radius: 17px; }
  .auth-card header h1 { font-size: 23px; }
  .topbar { min-height: 68px; padding: 10px 14px; }
  .page-heading { min-width: 0; }
  .page-heading h1 { font-size: 17px; }
  .topbar-actions { gap: 6px; }
  .current-user { grid-template-columns: auto; margin-left: 0; padding-left: 5px; }
  .current-user #change-password-button { display: none; }
  .topbar-actions > .button { width: 38px; overflow: hidden; padding: 0; color: transparent; font-size: 0; }
  .topbar-actions > .button::after { color: var(--white); content: "+"; font-size: 20px; }
  .content { padding: 22px 14px 42px; }
  .metric-grid, .finance-balance-grid { grid-template-columns: 1fr; }
  .followup-metrics { grid-template-columns: 1fr 1fr; }
  .sales-overview-hero { align-items: flex-start; flex-direction: column; padding: 20px; }
  .sales-overview-hero .button { width: 100%; }
  .sales-stage-guide { grid-template-columns: 1fr 1fr; }
  .sales-stage-guide span:nth-child(3n)::after { display: block; }
  .sales-stage-guide span:nth-child(2n)::after { display: none; }
  .followup-workspace { padding: 12px; }
  .followup-card > header { align-items: flex-start; flex-direction: column; }
  .followup-value { width: 100%; align-items: flex-start; text-align: left; }
  .followup-card > footer { align-items: flex-start; flex-direction: column; }
  .contract-archive-heading { align-items: flex-start; flex-direction: column; padding: 17px; }
  .contract-archive-heading > div:last-child { width: 100%; }
  .contract-archive-metrics, .contract-archive-download { grid-template-columns: 1fr; }
  .contract-archive-download > div, .contract-archive-download > label, .contract-archive-download > button { grid-column: 1; }
  .contract-archive-note { align-items: flex-start; flex-direction: column; }
  .contract-stamp-heading { align-items: flex-start; flex-direction: column; padding: 17px; }
  .contract-stamp-heading > div:last-child { width: 100%; }
  .contract-stamp-card { padding: 14px; }
  .contract-stamp-card > header { flex-direction: column; }
  .contract-stamp-card > header > div:last-child { align-items: flex-start; }
  .contract-stamp-card dl, .contract-document-columns { grid-template-columns: 1fr; }
  .contract-stamp-card .stamp-return-reason { grid-column: auto; }
  .contract-stamp-card > footer { align-items: stretch; flex-direction: column; }
  .contract-stamp-card > footer .button { width: 100%; }
  .cancellation-workspace-heading { align-items: flex-start; flex-direction: column; padding: 17px; }
  .cancellation-workspace-heading > strong { width: 100%; min-height: 60px; }
  .cancellation-metrics { grid-template-columns: 1fr 1fr; }
  .cancellation-workspace-group { padding: 10px; }
  .cancellation-workspace-group > header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .order-cancellation-card { padding: 14px; }
  .order-cancellation-card > header { align-items: flex-start; flex-direction: column; }
  .cancellation-status { min-width: 0; }
  .cancellation-audit-lock, .cancellation-order-lock, .cancellation-order-lock > div { align-items: flex-start; flex-direction: column; }
  .cancellation-amounts { grid-template-columns: 1fr 18px 1fr; }
  .cancellation-amounts > div:nth-child(4), .cancellation-amounts > div:nth-child(5) { grid-column: 1 / -1; }
  .cancellation-impact > header { align-items: flex-start; flex-direction: column; }
  .cancellation-impact > header dl { width: 100%; }
  .cancellation-impact > header dl > div { flex: 1; text-align: left; }
  .cancellation-impact-line, .cancellation-impact-line.is-purchase { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding-block: 10px; }
  .cancellation-impact-line > div:first-child { grid-column: 1 / -1; }
  .cancellation-documents { align-items: flex-start; flex-direction: column; }
  .order-cancellation-card > footer { align-items: stretch; flex-direction: column; }
  .order-cancellation-card > footer .button { width: 100%; }
  .cancellation-form-preview > header { flex-direction: column; }
  .cancellation-form-preview > dl { grid-template-columns: 1fr 1fr; }
  .cancellation-request-line { grid-template-columns: 1fr; gap: 8px; padding-block: 12px; }
  .cancellation-request-lines > footer { justify-content: space-between; }
  .tax-refund-hero, .transfer-workspace-head { align-items: flex-start; flex-direction: column; padding: 17px; }
  .tax-refund-hero dl, .transfer-workspace-head dl { width: 100%; }
  .tax-refund-metrics { grid-template-columns: 1fr; }
  .tax-refund-flow { grid-template-columns: 1fr 1fr; }
  .tax-refund-flow span:nth-child(n+3) { border-top: 1px solid var(--slate-200); }
  .tax-refund-flow span:nth-child(odd) { border-left: 0; }
  .tax-refund-flow span:nth-child(even) { border-left: 1px solid var(--slate-200); }
  .tax-refund-card > header, .stock-transfer-card > header { align-items: flex-start; flex-direction: column; }
  .tax-refund-amounts, .tax-refund-details, .stock-transfer-card dl { grid-template-columns: 1fr 1fr; }
  .tax-refund-calculation-head { display: none; }
  .tax-refund-calculation article { grid-template-columns: 1fr 1fr; gap: 5px 12px; }
  .tax-refund-calculation article > div { grid-column: 1 / -1; }
  .tax-refund-documents, .inventory-rule-note { align-items: flex-start; flex-direction: column; }
  .tax-refund-card > footer, .stock-transfer-card > footer { align-items: stretch; flex-direction: column; }
  .tax-refund-card > footer .button, .stock-transfer-card > footer .button { width: 100%; }
  .operating-data-grid, .worklist-board, .finance-task-grid { grid-template-columns: 1fr; }
  .finance-board + .finance-board { margin-top: 23px; }
  .finance-section-head { align-items: flex-start; flex-direction: column; gap: 7px; }
  .finance-section-head > .button, .finance-section-head > div:last-child { max-width: 100%; }
  .finance-section-actions { width: 100%; justify-content: flex-start; }
  .invoice-recent-list > header { align-items: flex-start; flex-direction: column; gap: 3px; }
  .invoice-archive-download { grid-template-columns: 1fr; }
  .invoice-archive-download > div, .invoice-archive-download > button { grid-column: 1; }
  .invoice-archive-download > span { display: none; }
  .invoice-archive-download > button { width: 100%; justify-self: stretch; }
  .invoice-archive-warning, .invoice-history-note { align-items: flex-start; flex-direction: column; }
  .finance-anomaly-board { padding: 12px; }
  .finance-anomaly-board .work-item { margin-inline: 0; padding-inline: 9px; }
  .finance-todo-grid, .invoice-summary-grid { grid-template-columns: 1fr; }
  .finance-cash-summary { min-height: 0; align-items: flex-start; padding: 13px 42px 13px 13px; }
  .finance-cash-summary dl, .finance-cash-summary .finance-cash-amounts, .finance-cash-summary .finance-cash-metrics { min-width: 0; flex-basis: 100%; }
  .finance-cash-summary dl > div, .finance-cash-summary .finance-cash-amounts > div, .finance-cash-summary .finance-cash-metrics > div { padding-left: 7px; }
  .finance-cash-summary dd, .finance-cash-summary .finance-cash-amounts strong, .finance-cash-summary .finance-cash-metrics strong { font-size: 10px; }
  .finance-cash-body { padding-inline: 11px; }
  .invoice-year-group > summary { align-items: flex-start; flex-wrap: wrap; padding: 10px 40px 10px 11px; }
  .invoice-year-group > summary::before { width: 27px; height: 24px; }
  .invoice-month-group > summary { align-items: flex-start; flex-wrap: wrap; padding-right: 38px; }
  .invoice-archive-status, .invoice-file-health, .invoice-file-missing { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .invoice-year-group > div { padding-inline: 8px; }
  .invoice-month-group > div { padding-inline: 7px; }
  .balance-invoice { grid-column: auto; }
  .metric-card { min-height: 96px; }
  .panel { padding: 15px; }
  .order-card { position: relative; margin-inline: 0; padding: 10px 11px; }
  .mini-metric-row { grid-template-columns: 1fr 1fr; }
  .mini-metric-row > div:nth-child(3) { border-top: 1px solid var(--slate-200); border-left: 0; }
  .mini-metric-row > div:nth-child(4) { border-top: 1px solid var(--slate-200); }
  .entity-grid, .case-grid { grid-template-columns: 1fr; }
  .material-meta { grid-template-columns: 1fr 1fr; }
  .material-meta > div:last-child { display: none; }
  .material-key-details { flex-wrap: wrap; white-space: normal; }
  .material-page-header { align-items: flex-start; }
  .material-page-actions { width: 100%; justify-content: flex-start; }
  .material-page-actions .compact-search { flex: 1 1 180px; }
  .material-page-actions .compact-search input { width: 100%; }
  .material-editor-toolbar { align-items: flex-start; flex-direction: column; }
  .material-editor-toolbar > div:last-child { width: 100%; justify-content: flex-start; }
  .material-template-dropdown { align-self: flex-start; }
  .material-template-menu { right: auto; left: 0; width: min(220px, calc(100vw - 28px)); min-width: 0; }
  .backend-upgrade-warning, .legacy-backend-warning { grid-template-columns: 1fr; }
  .backend-upgrade-warning > .button, .legacy-backend-warning > .button { grid-column: 1; grid-row: auto; width: 100%; }
  .material-category-group > summary { grid-template-columns: 36px minmax(0, 1fr) 26px; gap: 9px; padding-inline: 10px; }
  .material-category-code { width: 34px; height: 32px; }
  .material-category-count { grid-column: 2; justify-self: start; margin-top: -9px; }
  .material-category-group > summary .details-chevron { grid-column: 3; grid-row: 1 / span 2; }
  .material-category-body { padding: 8px; }
  .material-library-head { display: none; }
  .material-library-row, .material-library-row.is-editable { grid-template-columns: minmax(0, 1fr) auto; padding: 8px 4px; }
  .library-material-info { grid-column: 1; }
  .library-code { grid-column: 1; padding-top: 0; }
  .library-stock { display: none; }
  .library-row-actions { grid-column: 2; grid-row: 1 / span 2; flex-direction: column; align-self: stretch; justify-content: center; }
  .library-material-info p { flex-wrap: wrap; white-space: normal; }
  .import-sample-head, .import-sample > div:not(.import-sample-head) { grid-template-columns: 1fr 1fr; }
  .import-sample-head > span:last-child, .import-sample small { display: none; }
  .module-tabs { margin-bottom: 17px; }
  .module-tab { flex: 1 0 auto; padding-inline: 13px; }
  .panel-header { align-items: flex-start; }
  .dashboard-section-head { align-items: flex-start; flex-direction: column; gap: 7px; }
  .dashboard-section-head > small { max-width: none; text-align: left; }
  .customer-order-workspace > .section-header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .sales-owner-section { padding: 10px; }
  .sales-owner-section > header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .customer-order-group > summary { grid-template-columns: 1fr; gap: 10px; padding: 14px; }
  .customer-group-status { width: 100%; grid-template-columns: minmax(0, 1fr) 30px; justify-items: start; }
  .customer-group-status > .details-chevron { justify-self: end; }
  .customer-order-body { padding: 9px; }
  .compact-search input { width: 150px; }
  .order-card-head { display: flex; gap: 8px; }
  .order-value { min-width: 100px; margin-top: 0; text-align: right; }
  .order-status-stack { justify-content: flex-end; }
  .order-summary { flex-wrap: wrap; }
  .order-summary-actions { order: 3; width: 100%; justify-content: flex-end; }
  .order-summary > .details-chevron { position: absolute; right: 11px; }
  .order-summary-actions { padding-right: 32px; }
  .order-delete-confirm dl { grid-template-columns: 1fr; }
  .order-card .card-actions .button-small { min-height: 32px; }
  .order-fulfillment-panel > header dl { grid-template-columns: 1fr; }
  .order-fulfillment-panel > header dl > div { padding: 7px 0; border-top: 1px solid var(--slate-200); border-left: 0; }
  .fulfillment-line-head { display: none; }
  .fulfillment-line { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
  .fulfillment-line > div:first-child { grid-column: 1 / -1; }
  .control-gates { grid-template-columns: 1fr; gap: 6px; }
  .gate-connector { height: 15px; transform: rotate(90deg); }
  .status-matrix, .status-matrix:has(> div:nth-child(7)) { grid-template-columns: 1fr 1fr; }
  .status-matrix > div:nth-child(n+3) { border-top: 1px solid var(--slate-200); }
  .status-matrix > div:nth-child(odd) { border-left: 0; }
  .status-matrix > div:nth-child(even) { border-left: 1px solid var(--slate-200); }
  .work-item { grid-template-columns: 7px minmax(0, 1fr) auto; align-items: start; }
  .work-item > b { grid-column: 2; grid-row: 2; justify-self: start; max-width: none; }
  .work-item > .icon-button { grid-column: 3; grid-row: 1 / span 2; }
  .progress-summary { grid-template-columns: 1fr; }
  .card-actions .text-button { width: 100%; margin: 3px 0 0; text-align: left; }
  .gate-lock-notes { display: grid; }
  .source-banner { align-items: flex-start; flex-direction: column; }
  .purchase-promised-date { margin-left: 0; }
  .invoice-row { grid-template-columns: 40px 1fr auto; gap: 8px; }
  .invoice-row > div:nth-child(4) { display: none; }
  .party-card > summary { grid-template-columns: minmax(0, 1fr) 30px; }
  .party-card > summary .status-badge { display: none; }
  .party-card-body dl { grid-template-columns: 1fr; }
  .party-card-body footer { align-items: flex-start; flex-direction: column; }
  .party-documents, .order-documents { align-items: flex-start; flex-direction: column; }
  .warehouse-overview > header { align-items: flex-start; flex-direction: column; gap: 5px; }
  .warehouse-overview > header p { text-align: left; }
  .warehouse-overview-metrics { grid-template-columns: 1fr; }
  .warehouse-overview-metrics > div + div { border-top: 1px solid var(--slate-200); border-left: 0; }
  .inventory-shortage-board > header { align-items: flex-start; flex-direction: column; }
  .inventory-shortage-row { grid-template-columns: 1fr 1fr; gap: 9px; padding: 12px 2px; }
  .inventory-shortage-row > div:nth-child(4) { display: grid; }
  .inventory-shortage-row > button { grid-column: 1 / -1; justify-self: start; }
  .warehouse-inventory-panel > .panel-header { align-items: stretch; flex-direction: column; }
  .warehouse-inventory-panel .compact-search input { width: 100%; }
  .warehouse-inventory-group > summary { grid-template-columns: minmax(0, 1fr) 20px; gap: 9px; padding: 12px; }
  .warehouse-summary-metrics { grid-column: 1 / -1; grid-row: 2; grid-template-columns: 1fr; }
  .warehouse-summary-metrics > div { padding: 7px 0; border-top: 1px solid var(--slate-200); border-left: 0; }
  .warehouse-warning { grid-column: 1; justify-self: start; }
  .warehouse-inventory-group > summary .details-chevron { grid-column: 2; grid-row: 1; }
  .warehouse-inventory-body { padding: 0 12px 5px; }
  .warehouse-inventory-head { display: none; }
  .inventory-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .inventory-row > div:first-child { grid-column: 1 / -1; }
  .cash-row { grid-template-columns: 32px 1fr auto; }
  .recognition-result dl { grid-template-columns: 1fr; }
  .account-panel > .panel-header { align-items: stretch; flex-direction: column; }
  .account-panel > .panel-header .button { width: 100%; }
  .account-row { grid-template-columns: 38px minmax(0, 1fr); gap: 9px; }
  .account-avatar { width: 34px; height: 34px; }
  .account-row > div:nth-child(5) { grid-column: 2; }
  .account-row footer { grid-column: 1 / -1; justify-content: stretch; }
  .account-row footer .button { flex: 1; }
  .dialog-layer { padding: 0; place-items: end center; }
  .dialog { width: 100%; max-height: 94vh; border-radius: 18px 18px 0 0; }
  .dialog-header { padding: 17px 16px 11px; }
  .dialog-body { padding: 16px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-field-wide { grid-column: auto; }
  .line-row { grid-template-columns: 24px 1fr 32px; }
  .line-row .form-field { grid-column: 2 / 3; }
  .line-row .remove-line, .line-row .line-row-lock { grid-column: 3; grid-row: 1; }
  .line-number { grid-column: 1; grid-row: 1; }
  .line-edit-notice { align-items: flex-start; flex-direction: column; }
  .line-editor-footer { align-items: stretch; flex-direction: column; }
  .order-line-total { min-width: 0; width: 100%; }
  .existing-contract { align-items: flex-start; }
  .order-operation-zone { align-items: stretch; flex-direction: column; }
  .order-operation-actions { align-items: stretch; flex-direction: column; }
  .order-operation-zone > .button, .order-operation-actions .button { width: 100%; }
  .order-operation-actions .cancellation-status { width: 100%; }
  .search-result { grid-template-columns: 55px 1fr 18px; }
  .search-result small { display: none; }
  .toast-region { right: 12px; bottom: 12px; left: 12px; }
  .toast { min-width: 0; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}