:root {
  --teal: #0f7f88;
  --teal-dark: #08656d;
  --blue: #176ea6;
  --blue-dark: #115783;
  --amber: #b97516;
  --success: #2f7d52;
  --danger: #b44545;
  --line: #d1d9de;
  --line-dark: #9aa8b0;
  --soft: #e8f2f3;
  --ink: #1f2a30;
  --muted: #5a6b75;
  --head: #dfe7eb;
  --surface: #fff;
  --canvas: #f3f6f7;
  --focus: #e9f7fa;
  --shadow-sm: 0 1px 3px rgba(26, 49, 59, .12);
  --shadow-md: 0 10px 28px rgba(24, 47, 57, .18);
}

* { box-sizing: border-box; }
.hidden { display: none !important; }
.access-hidden { display: none !important; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Microsoft YaHei", "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-size: 14px;
}

button, input, select { font: inherit; }
button { cursor: pointer; }
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #1c86b8;
  outline-offset: 1px;
}

.login-gate {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  grid-template-rows: 174px 1fr 90px;
  grid-template-columns: minmax(320px, 1fr) minmax(420px, 560px) minmax(20px, 1fr);
  background: #f3fafc;
}
.login-gate.hidden { display: none; }
.login-hero {
  grid-column: 1 / 4;
  display: flex;
  align-items: center;
  gap: 34px;
  padding-left: 70px;
  color: #fff;
  background: #0c7d87;
}
.login-brand {
  display: flex;
  align-items: center;
  gap: 28px;
  font-size: 30px;
  font-weight: 800;
}
.login-brand span { font-size: 28px; }
.login-hero p {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
}
.login-card {
  grid-column: 2;
  align-self: center;
  display: grid;
  gap: 18px;
  min-height: 420px;
  padding: 20px 72px 24px;
  background: #fff;
  border: 1px solid #c7d3d8;
  border-radius: 6px;
  box-shadow: var(--shadow-md);
}
.login-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  height: 48px;
}
.login-title {
  margin: 0;
  color: #174849;
  font-size: 22px;
  line-height: 1.3;
}
.login-tabs.single-mode { display: none; }
.login-tabs button {
  height: 32px;
  border: 0;
  background: transparent;
  color: #777;
  font-size: 22px;
}
.login-tabs button:first-child { border-right: 1px solid #bbb; }
.login-tabs button.active { color: #0076ff; }
.login-card label {
  display: grid;
  grid-template-columns: 64px 1fr;
  align-items: center;
  gap: 12px;
  color: #50657a;
}
.login-card input {
  height: 42px;
  padding: 0 12px;
  border: 1px solid #d7dce0;
  font-size: 18px;
}
.login-card input:focus {
  outline: 1px solid #0a8fd1;
  border-color: #0a8fd1;
}
.login-password-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px;
  min-width: 0;
}
.login-password-control input {
  width: 100%;
  min-width: 0;
  border-radius: 3px 0 0 3px;
}
.login-password-control button {
  min-width: 58px;
  height: 42px;
  padding: 0 8px;
  border: 1px solid #b9c8ce;
  border-left: 0;
  border-radius: 0 3px 3px 0;
  background: #f4f7f8;
  color: #075f73;
  font-weight: 600;
}
#loginSubmit {
  height: 58px;
  margin-top: 12px;
  border: 1px solid var(--blue-dark);
  border-radius: 4px;
  background: var(--blue);
  color: #fff;
  font-size: 30px;
  font-weight: 800;
}
.login-message {
  min-height: 22px;
  margin: 0;
  color: #c02626;
}
.login-card footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #087797;
}
.login-card footer button {
  border: 0;
  background: transparent;
  color: #087797;
  text-decoration: underline;
}
.login-card .hidden { display: none; }
.login-tabs:has(button.hidden) { grid-template-columns: 1fr; }
.login-tabs:has(button.hidden) button:first-child { border-right: 0; }

.registration-request-modal {
  position: fixed;
  inset: 0;
  z-index: 230;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(18, 40, 48, .48);
}
.registration-request-dialog {
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  border: 1px solid #9aadb5;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(17, 38, 46, .28);
}
.registration-request-dialog > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  align-items: start;
  padding: 20px 20px 16px;
  border-bottom: 1px solid #d2dde1;
  background: #f4f8f9;
}
.registration-request-dialog h2 { margin: 0 0 6px; color: #174c58; font-size: 22px; }
.registration-request-dialog header p { margin: 0; color: var(--muted); line-height: 1.6; }
.registration-request-dialog header button {
  width: 42px;
  height: 42px;
  border: 0;
  background: transparent;
  color: #35515b;
  font-size: 28px;
  line-height: 1;
}
.registration-request-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 20px;
  padding: 20px;
}
.registration-request-fields label { display: grid; gap: 7px; min-width: 0; color: #385560; }
.registration-request-fields label > span { font-weight: 600; }
.registration-request-fields label b { color: var(--danger); }
.registration-request-fields input,
.registration-request-fields textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #aebdc3;
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
}
.registration-request-fields input { height: 42px; padding: 0 10px; }
.registration-request-fields textarea { min-height: 92px; padding: 9px 10px; resize: vertical; font: inherit; line-height: 1.55; }
.registration-request-wide { grid-column: 1 / -1; }
.registration-request-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.registration-request-message { min-height: 22px; margin: 0; padding: 0 20px 12px; color: var(--danger); }
.registration-request-message.success { color: var(--success); font-weight: 600; }
.registration-request-dialog > footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid #d2dde1;
  background: #f7f9fa;
}
.registration-request-dialog > footer span { color: var(--muted); font-size: 13px; }
.registration-request-dialog > footer button { min-width: 92px; height: 38px; border: 1px solid #9babb2; border-radius: 3px; background: #fff; color: #304851; }
.registration-request-dialog > footer button[type="submit"] { border-color: var(--blue-dark); background: var(--blue); color: #fff; }
.registration-request-dialog > footer button:disabled { cursor: default; opacity: .68; }

.desktop {
  min-width: 1180px;
  height: 100vh;
  display: grid;
  grid-template-rows: 112px 32px 1fr 24px;
  background: #fff;
}

.topbar {
  position: relative;
  display: grid;
  grid-template-columns: 245px 1fr 120px;
  grid-template-rows: 58px 54px;
  background: #0c7d87;
  color: #fff;
}

.brand {
  grid-row: 1 / 3;
  display: flex;
  align-items: flex-start;
  padding: 16px 0 0 22px;
  font-size: 30px;
  font-weight: 800;
}

.topnav {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-top: 25px;
}

.shortcut {
  grid-column: 2 / 4;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 24px;
  padding: 0 34px 8px 0;
}

.topnav button, .shortcut button, .window-tools span {
  border: 0;
  background: transparent;
  color: #fff;
}

.topnav button, .shortcut button { padding: 4px 0; white-space: nowrap; }
.topnav button::before { content: "▦ "; }
.shortcut button::before { content: "▹ "; }
.topnav button.active, .shortcut button.active { font-weight: 700; text-decoration: underline; }

.window-tools {
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  padding: 12px 16px 0 0;
  font-weight: 700;
}
.auth-status {
  position: absolute;
  top: 84px;
  right: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 13px;
}
.auth-status button {
  height: 24px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(255,255,255,.12);
  color: #fff;
}
.auth-status #adminHomeButton {
  border-color: #fff;
  background: #fff;
  color: #087c90;
  font-weight: 700;
}
.auth-status button:hover {
  background: rgba(255,255,255,.24);
}
.auth-status #adminHomeButton:hover {
  background: #e8fbff;
}
.auth-status .hidden { display: none; }

.dropdown-menu {
  position: fixed;
  z-index: 50;
  min-width: 196px;
  padding: 5px 0;
  border: 1px solid #9eb6bf;
  background: #fbf9ff;
  box-shadow: 2px 3px 4px rgba(0,0,0,.2);
}

.dropdown-menu::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 24px;
  background: #d9eef2;
}

.dropdown-menu .menu-item {
  position: relative;
}

.dropdown-menu button {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  min-height: 27px;
  padding: 3px 26px 3px 34px;
  border: 0;
  background: transparent;
  color: #000;
  text-align: left;
  white-space: nowrap;
}

.dropdown-menu button:hover { background: #d4e8ec; outline: 1px solid #6e8aa6; }
.menu-arrow {
  position: absolute;
  right: 8px;
}
.submenu {
  display: none;
  position: absolute;
  left: calc(100% - 1px);
  top: 0;
  min-width: 190px;
  padding: 5px 0;
  border: 1px solid #9eb6bf;
  background: #fbf9ff;
  box-shadow: 2px 3px 4px rgba(0,0,0,.2);
}
.submenu::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 24px;
  background: #d9eef2;
}
.menu-item:hover > .submenu {
  display: block;
}
.menu-sep { position: relative; z-index: 1; height: 1px; margin: 4px 4px 4px 30px; background: #a8a8a8; }

.tabbar {
  display: flex;
  align-items: flex-end;
  gap: 1px;
  border-bottom: 1px solid var(--line-dark);
  background: var(--soft);
}

.tab {
  height: 31px;
  min-width: 86px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-bottom: 0;
  background: #edf4f5;
  color: #111;
}

.tab.hidden { display: none; }
.tab.active { background: #fff; border-top-color: var(--teal); }

.tab .close-tab {
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
  margin-left: 6px;
  background: #c84949;
  color: #fff;
  font-size: 11px;
  line-height: 14px;
  border: 1px solid #a32626;
  pointer-events: auto;
}

.tab .close-tab:hover {
  background: #9d2222;
}

.workarea {
  min-height: 0;
  display: grid;
  grid-template-columns: 102px 1fr 230px;
  border-top: 1px solid #c5c5c5;
}

.side { display: grid; align-content: start; background: #1d9aa6; border-right: 1px solid #138894; }
.side button { height: 76px; border: 0; border-bottom: 1px solid rgba(255,255,255,.1); color: #fff; background: transparent; font-weight: 700; }
.side button.active, .side button:hover { background: rgba(0,0,0,.12); }
.side span { display: block; font-size: 25px; line-height: 26px; }
.side b { display: block; margin-top: 4px; }

.content {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: 46px 1fr;
  background: #fff;
}

.toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  background: #fafafa;
}

.toolbar b { font-size: 16px; }
.toolbar span { margin-left: 10px; color: var(--muted); font-size: 12px; }
.search { display: grid; grid-template-columns: 260px 56px 56px; gap: 6px; }

input, select {
  min-width: 0;
  border: 0;
  border-bottom: 1px solid #aeb8bf;
  background: transparent;
  outline: none;
  height: 28px;
  padding: 3px 5px;
}

input:focus, select:focus { border-bottom-color: var(--teal); background: #f5fcfd; }
.search input { border: 1px solid #bfcbd1; background: #fff; }
.search button, .primary, .view-actions button, .settings-actions button, .query-box footer button { border: 0; background: var(--blue); color: #fff; }

.view { min-height: 0; display: none; padding: 18px; overflow: auto; }
.view.active { display: block; }

.module-cards {
  min-height: 100%;
  display: grid;
  grid-template-columns: repeat(3, 100px);
  justify-content: center;
  align-content: start;
  column-gap: 152px;
  row-gap: 118px;
  padding-top: 160px;
}

.module-card {
  width: 100px;
  height: 100px;
  border: 1px solid #12abc0;
  border-radius: 7px;
  background: #fff;
  color: var(--teal);
}

.module-card:hover, .module-card.active { background: var(--teal); color: #fff; }
.module-card span { display: block; height: 54px; font-size: 34px; line-height: 52px; }
.module-card b { display: block; color: inherit; font-weight: 500; }

.rightbar { border-left: 1px solid var(--line); background: #fff; padding: 12px 0; }
.rightbar h3 { margin: 0; padding: 0 20px 8px; font-size: 14px; color: #1d4855; }
.rightbar h3::before { content: "▥ "; color: var(--teal); }
.rightbar button { display: block; width: 100%; min-height: 40px; text-align: left; padding: 0 20px; border: 0; border-top: 1px dashed #d9d9d9; background: #fff; color: #334; }
.rightbar button::before { content: "•"; color: #555; margin-right: 10px; }
.rightbar button:hover { background: #e8f7fa; color: var(--teal-dark); }

.grid-head { height: 28px; display: flex; align-items: center; justify-content: flex-end; color: var(--muted); }
.grid-head button.active { background: var(--teal); color: #fff; border-color: var(--teal); }
.table-pager {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  min-height: 30px;
  margin-left: 4px;
  border: 1px solid #aab9c0;
  border-radius: 3px;
  background: #fff;
  color: #334b56;
  overflow: hidden;
}
.table-pager button {
  width: 32px;
  min-width: 32px;
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #1a5f79;
  font-size: 20px;
  line-height: 1;
}
.table-pager button:hover:not(:disabled) { background: #e8f5f6; }
.table-pager-status {
  min-width: 54px;
  padding: 0 7px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.table-wrap {
  max-height: calc(100vh - 244px);
  overflow: auto;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

table { width: 100%; border-collapse: collapse; white-space: nowrap; font-size: 13px; }
th, td { height: 30px; padding: 5px 8px; border-right: 1px solid #d9dee2; border-bottom: 1px solid #d9dee2; }
th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: linear-gradient(#f3f7f9, #e4edf1);
  color: #34454d;
  font-weight: 700;
  text-align: left;
  box-shadow: 0 1px 0 #bdc9d0;
}
tbody tr:nth-child(even) td { background: #fbfcfd; }
tr:hover td { background: #f2fbfd; }
tr[data-open-doc],
tr[data-view-statement] { cursor: pointer; }
tr[data-open-doc]:hover td,
tr[data-view-statement]:hover td { background: #e8f7fa; }
.num { text-align: right; font-variant-numeric: tabular-nums; }

.document-view { padding: 14px 0 0; background: #fff; }
.document-form { min-height: 100%; display: grid; grid-template-rows: auto auto auto minmax(230px, 1fr) auto auto; }
.doc-head { display: flex; justify-content: space-between; align-items: start; padding: 4px 12px 8px 24px; }
.doc-head h1 { margin: 0; color: #000; font-size: 30px; font-weight: 500; }
.doc-meta { display: grid; grid-template-columns: 250px 250px; gap: 12px; }
.legacy-document-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 16px 0;
  padding: 8px 11px;
  border: 1px solid #d8b15b;
  border-left: 4px solid #b97812;
  background: #fff8e8;
  color: #62480f;
  font-size: 13px;
  line-height: 1.45;
}
.legacy-document-notice strong { flex: 0 0 auto; color: #8a5d07; }
.document-form.legacy-document-readonly input:disabled,
.document-form.legacy-document-readonly select:disabled,
.document-form.legacy-document-readonly textarea:disabled {
  color: #34454d;
  -webkit-text-fill-color: #34454d;
  opacity: 1;
  cursor: not-allowed;
}
.document-form.legacy-document-readonly .doc-grid input:disabled,
.document-form.legacy-document-readonly .doc-grid select:disabled {
  background: #f5f7f8;
}
.document-form.legacy-document-readonly tr[data-legacy-remark-missing="1"] input[data-field="remark"]::placeholder {
  color: #7a8790;
  -webkit-text-fill-color: #7a8790;
  opacity: 1;
  font-style: italic;
}
.document-form.legacy-document-readonly :is(
  tr[data-legacy-code-missing="1"] input[data-field="code"],
  tr[data-legacy-model-missing="1"] input[data-field="model"],
  tr[data-legacy-model-not-applicable="1"] input[data-field="model"]
)::placeholder {
  color: #7a8790;
  -webkit-text-fill-color: #7a8790;
  opacity: 1;
  font-style: italic;
}
.document-form.legacy-document-readonly tr[data-identity-inferred="1"] :is(input[data-field="code"], input[data-field="model"]) {
  text-decoration: underline dotted #9a762d;
  text-underline-offset: 3px;
}
.doc-fields { display: grid; grid-template-columns: 2fr 1.2fr 1.1fr 1.2fr; gap: 8px 42px; padding: 8px 14px 18px; }
.doc-fields label, .doc-meta label, .doc-bottom label { display: grid; grid-template-columns: 76px 1fr; align-items: end; color: #38506a; }

.doc-grid-wrap, .finance-grid-wrap {
  overflow: auto;
  border-top: 1px solid #9ba8b0;
  border-bottom: 1px solid #b8c1c7;
  background: #f6f7f8;
}
.doc-grid { min-width: 1120px; table-layout: fixed; }
.finance-grid { min-width: 660px; width: 660px; }
.doc-grid th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 32px;
  background: #dbe5ea;
  color: #145b75;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
}
.doc-grid td { height: 34px; padding: 0; background: #f7f7f7; }
.doc-grid tbody tr:nth-child(even) td { background: #f1f4f5; }
.doc-grid tbody tr:hover td { background: #e9f7fa; }
.doc-grid td:first-child { width: 42px; text-align: center; color: #000; background: #f4f4f4; }
.mobile-line-delete { display: none; }
.doc-grid .doc-column-hidden { display: none; }
.doc-grid input, .doc-grid select { width: 100%; height: 33px; border: 0; border-bottom: 0; background: transparent; padding: 0 6px; }
.doc-grid input:focus, .doc-grid select:focus {
  background: #fffdeb;
  outline: 2px solid #25a5b8;
  outline-offset: -2px;
}
.doc-grid tbody tr.line-validation-error td {
  background: #fff1ee;
}
.doc-grid tbody tr.product-confirmed td:nth-child(2) {
  box-shadow: inset 3px 0 #2f7b65;
}
.doc-grid tbody tr.product-unconfirmed td:nth-child(2) {
  box-shadow: inset 3px 0 #b97516;
}
.doc-grid tbody tr.product-unconfirmed td:nth-child(2) input {
  background: #fff9ea;
}
.doc-grid .field-validation-error,
.document-form .field-validation-error {
  background: #fff8f5;
  outline: 2px solid #c63d2f;
  outline-offset: -2px;
}
.doc-grid tbody tr:not(:focus-within):not(:hover):not(.row-meta-visible) td:nth-child(6) :is(input, select),
.doc-grid tbody tr:not(:focus-within):not(:hover):not(.row-meta-visible) td:nth-child(11) select {
  color: transparent;
  opacity: 0;
}
.doc-grid tbody tr:not(:focus-within):not(:hover):not(.row-meta-visible) td:nth-child(6) :is(input, select)::placeholder {
  color: transparent;
}
.doc-grid tbody tr:hover td:nth-child(6) :is(input, select),
.doc-grid tbody tr:hover td:nth-child(11) select {
  color: #687985;
}
.doc-grid tbody tr:focus-within td:nth-child(6) :is(input, select),
.doc-grid tbody tr:focus-within td:nth-child(11) select,
.doc-grid tbody tr.row-meta-visible td:nth-child(6) :is(input, select),
.doc-grid tbody tr.row-meta-visible td:nth-child(11) select {
  color: #000;
  opacity: 1;
}
.doc-grid tbody tr.gift-line td:nth-child(8),
.doc-grid tbody tr.gift-line td:nth-child(9) {
  background: #f3f8f9;
}
.doc-grid tbody tr.gift-line [data-field="unitPrice"],
.doc-grid tbody tr.gift-line [data-field="amount"] {
  visibility: hidden;
}
.doc-grid tbody tr.gift-line td:first-child {
  box-shadow: inset 3px 0 #3f8f9e;
}
.doc-grid tbody tr.gift-line td:nth-child(11) select {
  color: #0f6170;
  font-weight: 700;
  background: #e5f4f5;
}
.doc-grid tbody tr[data-gift-line="yes"] td:nth-child(8)::before,
.doc-grid tbody tr[data-gift-line="yes"] td:nth-child(9)::before {
  content: "赠品";
  display: block;
  padding: 8px 6px;
  color: #4b7480;
  font-size: 12px;
  text-align: center;
}

.shortage-supplier-quick-pick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 7px;
}

.shortage-supplier-chip {
  min-width: 0;
  max-width: 170px;
  overflow: hidden;
  padding: 4px 8px;
  border: 1px solid #a9d6dc;
  border-radius: 3px;
  background: #f4fbfb;
  color: #155d6b;
  font-size: 12px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shortage-supplier-chip:hover,
.shortage-supplier-chip:focus-visible {
  border-color: #197d8d;
  background: #dff3f5;
  outline: none;
}
.shortage-supplier-chip.selected {
  border-color: #0b7484;
  background: #0b8294;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}

.shortage-supplier-empty {
  color: #8a5c20;
  font-size: 12px;
}
.doc-grid tbody tr.needs-cost-price td {
  background: #fff8e7;
}
.doc-grid tbody tr.needs-cost-price [data-field="unitPrice"] {
  outline: 2px solid var(--amber, #b97516);
  outline-offset: -2px;
}
.doc-grid tbody tr.needs-cost-price td:nth-child(11) select {
  background: #fff0cf;
  color: #87520f;
  font-weight: 700;
  box-shadow: inset 3px 0 #c78627;
}
.doc-grid tbody tr.needs-cost-price td:nth-child(11) select:focus {
  background: #fff8e6;
}

.finance-grid-wrap { display: none; min-height: 260px; background: linear-gradient(90deg, #fff 0 660px, #f5f5f5 660px); }
.finance-doc .finance-grid-wrap { display: block; }
.finance-doc .doc-grid-wrap { display: none; }
.finance-doc .goods-field { display: none; }
.finance-doc .discount-field,
.finance-doc .net-total-field,
.finance-doc .mobile-qty-stepper { display: none; }
.finance-doc .doc-bottom {
  grid-template-columns: minmax(280px, 1fr) minmax(240px, .8fr) minmax(220px, .7fr) 114px;
}
.finance-doc .line-assist { grid-column: 1 / -1; }
.finance-doc #docPaidAmount[readonly] {
  color: #173637;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  background: #eef4f2;
}
.mobile-document-details-toggle { display: none; }

.doc-bottom { display: grid; grid-template-columns: 260px 200px 114px 1fr 260px; gap: 18px; align-items: center; min-height: 82px; padding: 10px 6px; background: #f3f3f3; }
.line-assist { grid-column: 1 / -1; min-height: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; padding: 5px 10px; border: 1px solid #c8d4da; background: #f8fcfd; color: #21445c; font-size: 13px; }
.line-assist span { display: inline-flex; gap: 6px; white-space: nowrap; }
.line-assist b { color: #687985; font-weight: 500; }
.line-assist .line-assist-gift { color: #0f6170; font-weight: 700; }
.line-assist .line-assist-gift b { color: #0f6170; font-weight: 700; }
.line-assist .line-assist-confirmed { color: #25634f; font-weight: 700; }
.line-assist .line-assist-confirmed b { color: #25634f; font-weight: 700; }
.line-assist .line-assist-pending { color: #8a5c20; font-weight: 700; }
.line-assist .line-assist-pending b { color: #8a5c20; font-weight: 700; }
.mobile-qty-stepper { display: none; }
.doc-bottom button { height: 28px; border: 1px solid #aaa; background: #e9e9e9; color: #222; }
.doc-total { display: flex; justify-content: flex-end; align-items: center; gap: 10px; color: #596b86; }
.doc-total input { width: 130px; background: #fff; }
.doc-total b { min-width: 150px; color: #333; font-size: 17px; text-align: right; }
.doc-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 14px; border-top: 1px solid #e1e1e1; background: #fff; }
.doc-actions .primary { min-width: 105px; height: 34px; }
.mobile-more { display: none; }
#newDocumentButton { order: 0; }
#copyLegacyDocumentButton { order: 1; }
#postDocumentButton { order: 1; }
#saveOrderButton { order: 2; }
#shareDocumentButton { order: 3; }
#printDocumentButton { order: 4; }
.doc-actions [data-open="home"] { order: 5; }
#settleButton { order: 5; }
.doc-actions button:nth-child(2) { order: 6; }
#reverseDocumentButton { order: 7; }
.primary.danger { background: var(--danger); }
.primary:disabled, .primary.danger:disabled { background: #b8c0c5; color: #eef3f5; cursor: not-allowed; }

.arap-view { padding: 0; display: none; grid-template-rows: 98px 1fr 54px; }
.arap-view.active { display: grid; }
.arap-head { display: grid; grid-template-columns: auto 330px 1fr 220px; align-items: center; gap: 18px; padding: 0 16px 0 6px; }
.arap-head h1 { margin: 0; font-size: 30px; color: #526b7a; font-weight: 500; }
.arap-head label { color: #38506a; }
.arap-head .check { justify-self: end; color: #333; }
.arap-body { min-height: 0; display: grid; grid-template-columns: 270px 1fr; border-top: 1px solid #777; }
.tree { padding: 8px; border-right: 1px solid #9aa; background: #fff; color: #333; }
.arap-table { max-height: none; border: 0; }
.arap-table table { width: 760px; }
.arap-table th { background: var(--head); color: #245c77; font-size: 16px; }
.arap-table tfoot td { background: #ffffdf; color: #001f9b; font-weight: 700; font-size: 16px; }

.view-actions { display: grid; grid-template-columns: repeat(8, auto) 1fr repeat(3, auto); gap: 10px; align-items: center; padding: 10px 18px; border-top: 1px solid #999; background: #fff; }
.view-actions button { height: 30px; min-width: 82px; }

.settings-view { padding: 0; display: none; grid-template-rows: 31px 1fr 52px; }
.settings-view.active { display: grid; }
.config-tabs { display: flex; background: #eee; border-bottom: 1px solid #999; }
.config-tabs button { min-width: 166px; height: 31px; border: 1px solid #999; border-bottom: 0; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 100%, 0 100%); background: #f8f8f8; color: #111; }
.config-tabs button.active { background: #fff; }
.config-panel { display: none; padding: 44px 0 0 68px; }
.config-panel.active { display: block; }
.config-panel label { display: grid; grid-template-columns: 142px 405px; align-items: center; margin: 0 0 20px; color: #38506a; }
.config-panel input, .config-panel select { border: 1px solid #aeb8bf; background: #fff; }
.license { margin: 74px 0 0 36px; color: #00809a; font-size: 16px; }
.config-table { width: 720px; }
.config-table td:nth-child(1) { width: 60px; }
.config-table td:nth-child(3) { width: 96px; text-align: center; }
.config-table tr:first-child td { background: var(--head); color: #145b75; }
#config-print label.check { display: block; margin: 50px 0 60px; color: #111; }
.sync-panel { display: flex; gap: 44px; align-items: center; }
.sync-panel label { display: flex; gap: 10px; align-items: center; margin: 0; }
.settings-actions { display: flex; gap: 26px; align-items: center; padding-left: 104px; border-top: 1px solid #999; }
.settings-actions button { min-width: 106px; height: 35px; }
.admin-tools { display: flex; align-items: center; gap: 12px; margin: 18px 0 18px 24px; }
.admin-tools button { height: 32px; min-width: 120px; border: 0; background: var(--blue); color: #fff; }
.admin-tools span { color: #38506a; }
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.file-action {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid #0d7fa7;
  background: #fff;
  color: #0b7398;
  cursor: pointer;
}
.file-action:hover,
.file-action:focus-visible { background: #eaf8fc; outline: 2px solid #78c7df; outline-offset: 2px; }
.security-config {
  max-width: 1100px;
  margin: 0 24px 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  background: #f8fbfc;
}
.security-config h3 { margin: 0 0 14px; color: #174f62; }
.security-config > button { min-height: 32px; border: 0; background: var(--blue); color: #fff; }
.security-config > button:disabled { background: #aebbc0; cursor: not-allowed; }
.session-list { display: grid; gap: 8px; margin: 8px 0 12px; }
.session-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  padding: 8px 10px;
  border: 1px solid #d6e0e4;
  background: #fff;
}
.session-item div { min-width: 0; }
.session-item b,
.session-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.session-item small { color: #607681; }
.session-current { margin-left: 8px; color: var(--teal-dark); font-weight: 700; }
.user-admin { margin: 0 24px 18px; max-width: 1100px; }
.user-admin-form { display: grid; grid-template-columns: 150px 150px 150px 120px 104px; gap: 8px; margin-bottom: 10px; align-items: center; }
.user-admin-form input, .user-admin-form select, #userRows select { height: 30px; border: 1px solid #aeb9bf; background: #fff; }
.user-admin-form button { height: 32px; border: 0; background: var(--blue); color: #fff; }
.user-wrap, .audit-wrap, .backup-wrap { margin: 0 24px; max-width: 1100px; max-height: 320px; overflow: auto; border: 1px solid var(--line); background: #fff; }
.user-admin .user-wrap { margin: 0; }
.user-disabled { color: #6f7a80; background: #f4f6f7; }
.user-status { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border: 1px solid; font-size: 12px; white-space: nowrap; }
.user-status.is-active { color: #176b43; border-color: #86bda4; background: #edf8f2; }
.user-status.is-disabled { color: #8a3434; border-color: #d1a0a0; background: #fff1f1; }
.user-actions { display: flex; gap: 6px; white-space: nowrap; }
.user-actions .danger-quiet:not(:disabled) { color: #9c2929; border-color: #d5a0a0; background: #fff7f7; }
.user-actions .danger-quiet:not(:disabled):hover { color: #fff; border-color: #a52d2d; background: #a52d2d; }
.permission-editor-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 4px 2px 14px; border-bottom: 1px solid var(--line); }
.permission-editor-head span { color: var(--muted); }
.permission-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin-top: 12px; }
.permission-editor-grid label { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 6px 8px; border-bottom: 1px solid #e3e9ec; }
.permission-editor-grid input { width: 18px; height: 18px; flex: 0 0 auto; }
.backup-wrap { max-height: 170px; margin-bottom: 12px; }
.audit-wrap { max-height: 360px; }
.link-button { display: inline-block; padding: 2px 8px; border: 1px solid #9fb6c2; color: #006f98; text-decoration: none; background: #fff; }

.report-stats { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 14px; max-width: 900px; }
.report-stats article { min-height: 88px; padding: 16px; border: 1px solid var(--line); background: #fff; }
.report-stats span { display: block; color: var(--muted); }
.report-stats b { display: block; margin-top: 10px; font-size: 24px; color: var(--teal-dark); }

.statusbar { display: grid; grid-template-columns: 120px 1fr 120px 240px 120px; align-items: center; border-top: 1px solid #cfcfcf; background: #efefef; color: #111; font-size: 12px; }
.statusbar span { height: 24px; padding: 3px 8px; border-right: 1px solid #c9c9c9; }
.statusbar .ok { color: #078a1f; text-align: center; }

.toast { position: fixed; left: 50%; bottom: 38px; transform: translateX(-50%); display: none; padding: 9px 14px; background: #263238; color: #fff; border-radius: 4px; box-shadow: 0 12px 30px rgba(0,0,0,.18); z-index: 100; }
.toast.show { display: block; }
.statusbar .pending { color: #5f6d6b; }
.statusbar .error { color: #b42318; font-weight: 700; }
.toast button { min-height: 28px; margin-left: 14px; padding: 2px 12px; border: 1px solid #fff; background: transparent; color: #fff; font-weight: 600; }

.modal { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; background: rgba(0,0,0,.08); }
.modal.hidden { display: none; }
.query-box { width: 657px; height: 546px; background: #fff; border: 1px solid #2c5ba0; box-shadow: 0 12px 34px rgba(0,0,0,.18); }
.query-box header { height: 27px; display: grid; grid-template-columns: 28px 1fr 34px; align-items: center; background: #2b5a9d; color: #fff; }
.query-box header b { text-align: center; font-weight: 500; }
.query-box header button { border: 0; background: transparent; color: #fff; font-size: 20px; }
.query-box fieldset { margin: 28px 35px 0; padding: 30px 20px; border: 1px solid #bfc5c8; display: grid; grid-template-columns: 1fr 1fr; gap: 34px 38px; }
.query-box legend { color: #222; }
.query-box label { display: grid; grid-template-columns: 74px 1fr; align-items: center; color: #38506a; font-size: 17px; }
.query-box input { border: 1px solid #aeb8bf; background: #fff; }
.query-box footer { display: flex; justify-content: flex-end; gap: 14px; padding: 33px 23px 0; }
.query-box footer button { width: 106px; height: 36px; font-size: 16px; }
.column-config-box { width: min(560px, calc(100vw - 24px)); background: #fff; border: 1px solid #54758a; box-shadow: 0 16px 42px rgba(0,0,0,.2); }
.column-config-box header { height: 42px; display: grid; grid-template-columns: 1fr 42px; align-items: center; padding-left: 14px; border-bottom: 1px solid #c4d0d6; background: #eef5f7; color: #21445c; }
.column-config-box header button { height: 40px; border: 0; background: transparent; font-size: 24px; }
.column-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 18px; padding: 18px; }
.column-options label { display: flex; align-items: center; gap: 9px; min-height: 38px; padding: 0 8px; border-bottom: 1px solid #edf0f2; }
.column-options input { width: 18px; min-width: 18px; height: 18px; }
.column-config-box footer { display: grid; grid-template-columns: auto 1fr auto auto; gap: 8px; padding: 12px 18px; border-top: 1px solid #d6dde1; }
.column-config-box footer button { min-width: 86px; height: 34px; }
.workflow-box { width: min(980px, calc(100vw - 24px)); max-height: calc(100vh - 32px); display: grid; grid-template-rows: 42px minmax(0, 1fr) 54px; background: #fff; border: 1px solid #54758a; box-shadow: 0 16px 42px rgba(0,0,0,.22); }
.workflow-box.workflow-box-wide { width: min(1420px, calc(100vw - 24px)); }
.workflow-box > header { display: grid; grid-template-columns: 1fr 42px; align-items: center; padding-left: 14px; border-bottom: 1px solid #c4d0d6; background: #eef5f7; color: #21445c; }
.workflow-box > header button { height: 40px; border: 0; background: transparent; font-size: 24px; }
.workflow-body { min-height: 240px; overflow: auto; padding: 14px; }
.workflow-box > footer { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 8px; padding: 9px 14px; border-top: 1px solid #d6dde1; }
.workflow-box > footer button { min-width: 88px; height: 34px; }
.workflow-form { display: grid; grid-template-columns: repeat(2, minmax(220px, 1fr)); gap: 12px 18px; margin-bottom: 14px; }
.workflow-form label { display: grid; grid-template-columns: 94px minmax(0, 1fr); align-items: center; gap: 8px; }
.workflow-form input, .workflow-form select, .workflow-table input { min-width: 0; height: 32px; border: 1px solid #aebbc4; background: #fff; }
.master-grid-head { display: flex; align-items: center; gap: 6px; }
.master-grid-note { color: #60747d; font-size: 13px; }
.grid-head-spacer { flex: 1; }
.master-grid-head button { min-width: 76px; }
.customer-master-table { min-width: 1040px; }
.customer-master-table th:first-child { width: 110px; }
.customer-master-table th:nth-child(2) { width: 210px; }
.master-code-control { display: grid; min-width: 0; gap: 3px; }
.master-code-control small { color: #60747d; font-size: 12px; line-height: 1.25; }
.master-code-control input[data-code-mode="auto"] { border-color: #68a8b1; background: #f1fbfc; }
#productRows tr[data-product-id],
#customerRows tr[data-customer-id],
#arapRows tr[data-customer-id],
#warehouseRows tr[data-warehouse-id],
#stockRows tr[data-stock-id],
#documentRows tr[data-open-doc],
#documentRows tr[data-open-order],
#documentRows tr[data-view-statement],
#documentRows tr[data-view-invoice] { cursor: pointer; }
#productRows tr.selected td,
#customerRows tr.selected td,
#arapRows tr.selected td,
#warehouseRows tr.selected td,
#stockRows tr.selected td { background: #dff1f4; }
.inactive-master-row td { color: #76848b; background: #f3f5f6; }
.master-form .workflow-wide { grid-column: 1 / -1; }
.workflow-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.workflow-table th, .workflow-table td { height: 34px; padding: 4px 7px; border: 1px solid #c8d1d7; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workflow-table th { background: #dbe5eb; color: #174b66; font-weight: 500; }
.workflow-table td.num, .workflow-table th.num { text-align: right; }
.workflow-table input[type="number"] { width: 100%; text-align: right; }
.shortage-alert {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: -14px -14px 14px;
  padding: 12px 14px;
  border-bottom: 1px solid #e0c66d;
  background: #fff8df;
  color: #5d4810;
}
.shortage-alert b { color: #a13d2d; font-size: 16px; }
.shortage-settings { grid-template-columns: repeat(2, minmax(280px, 1fr)); }
.shortage-mode {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid #aebbc4;
  border-radius: 3px;
  overflow: hidden;
}
.shortage-mode label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px;
  cursor: pointer;
}
.shortage-mode label + label { border-left: 1px solid #c8d1d7; }
.shortage-mode input { width: 15px; height: 15px; }
.shortage-supplier-all > span { display: grid; grid-template-columns: 1fr auto; }
.shortage-supplier-all button { min-width: 58px; border-left: 0; }
.shortage-table th:nth-child(1) { width: 16%; }
.shortage-table th:nth-child(2) { width: 15%; }
.shortage-table th:nth-child(3),
.shortage-table th:nth-child(4),
.shortage-table th:nth-child(5),
.shortage-table th:nth-child(8) { width: 10%; }
.shortage-table th:nth-child(6) { width: 7%; }
.shortage-table th:nth-child(7) { width: 24%; }
.shortage-table td small { display: block; margin-top: 2px; color: #667b84; }
.shortage-table input { width: 100%; }
.shortage-table .shortage-supplier-cell { height: 58px; white-space: normal; overflow: visible; }
.shortage-supplier-cell > input { height: 30px; }
.shortage-supplier-cell label { display: flex; align-items: center; gap: 5px; margin-top: 3px; color: #526b77; font-size: 11px; line-height: 1.2; }
.shortage-supplier-cell label input { width: 14px; min-width: 14px; height: 14px; margin: 0; }
.shortage-table .stock-zero { color: #b44545; font-weight: 700; background: #fff3f1; }
.shortage-pending-master td { background: #f1f8fb; }
.shortage-invalid td { background: #fff1f0; }
.shortage-summary { justify-content: flex-start; }
.shortage-pending-note { margin-left: auto; color: #246a83; }
.shortage-price-note { color: #9a5b10; }
.shortage-warning { margin-left: auto; color: #b44545; }
.workflow-file { align-items: start !important; }
.workflow-file input[type="file"] { height: auto; min-height: 32px; padding: 4px; }
.workflow-file small { grid-column: 2; color: #536b77; line-height: 1.45; white-space: normal; }
.invoice-void { color: #7b858c; background: #f4f5f6; text-decoration-color: #a8afb4; }
.invoice-void td:not(:last-child) { text-decoration: line-through; }
.invoice-red td { background: #fff4f2 !important; color: #8f2c22; }
.invoice-red-linked td { background: #fffaf0 !important; }
.record-substatus { display: block; margin-top: 2px; color: #61747e; font-size: 11px; line-height: 1.25; }
.statement-list-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 8px 12px; padding: 9px 12px; border-bottom: 1px solid #c8d4d9; background: #f6f9f9; }
.statement-list-filters label { display: grid; gap: 3px; color: #526973; font-size: 11px; }
.statement-list-filters input, .statement-list-filters select { width: 150px; min-height: 30px; }
.statement-list-filters #statementFilterPartner { width: 190px; }
.statement-list-filters button { min-height: 30px; }
.statement-list-filters > span { flex: 1 1 220px; align-self: center; color: #60747d; font-size: 11px; text-align: right; }
.statement-balance-summary { display: grid; grid-template-columns: repeat(4, minmax(100px, 1fr)); gap: 1px; margin: 0 0 12px; border: 1px solid #c8d4d9; background: #c8d4d9; }
.statement-preview-summary { grid-template-columns: repeat(4, minmax(100px, 1fr)); }
.statement-balance-summary span { display: grid; gap: 5px; min-width: 0; padding: 9px 10px; background: #f6f9fa; color: #536872; font-size: 12px; }
.statement-balance-summary b { overflow: hidden; color: #163f50; font-size: 16px; text-overflow: ellipsis; }
.statement-flow-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 10px; border: 1px solid #bccbd0; background: #fff; }
.statement-flow-summary section { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 3px 12px; min-width: 0; padding: 10px 12px; border-right: 1px solid #d3dde1; }
.statement-flow-summary section:last-child { border-right: 0; }
.statement-flow-summary span { color: #526b75; font-size: 12px; }
.statement-flow-summary b { justify-self: end; color: #143f4d; font-size: 17px; }
.statement-flow-summary small { grid-column: 1 / -1; overflow: hidden; color: #61747c; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.statement-flow-summary section[data-flow-tone="in"] b { color: #14714c; }
.statement-flow-summary section[data-flow-tone="out"] b { color: #a44b24; }
.statement-list-flow b, .statement-list-flow small { display: block; white-space: nowrap; }
.statement-list-flow small { margin-top: 2px; color: #60747d; }
.statement-view-switch { display: flex; align-items: center; gap: 0; margin: 0 0 10px; }
.statement-view-switch > span { margin-right: 9px; color: #536b77; font-size: 12px; }
.statement-view-switch button { min-height: 31px; padding: 4px 14px; border: 1px solid #93a8b1; color: #345460; background: #fff; }
.statement-view-switch button + button { border-left: 0; }
.statement-view-switch button[aria-pressed="true"] { color: #fff; border-color: #087f8c; background: #087f8c; font-weight: 700; }
.statement-view-switch button:disabled { color: #8c999e; background: #eef1f2; cursor: not-allowed; }
.statement-view-switch small { margin-left: 4px; font-size: 10px; font-weight: 400; }
.statement-detail-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: -2px 0 10px; }
.statement-detail-actions span { margin-right: auto; color: #536b77; font-size: 12px; }
.statement-detail-actions button { min-width: 104px; }
.statement-balance { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.statement-balance small { font-size: 10px; font-weight: 700; }
.statement-balance b { color: inherit; font-size: 12px; font-variant-numeric: tabular-nums; }
.statement-balance-pair { display: inline-grid; gap: 2px; min-width: 96px; }
.statement-balance-pair > span { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; white-space: nowrap; }
.statement-balance-pair small { font-size: 10px; font-weight: 700; }
.statement-balance-pair b { color: inherit; font-size: 12px; font-variant-numeric: tabular-nums; }
.statement-balance-receivable { color: #9a3f22; }
.statement-balance-payable { color: #176699; }
.statement-balance-mixed { color: #6e4e19; }
.statement-balance-settled { color: #28734d; }
.statement-delta { display: inline-block; white-space: nowrap; font-weight: 600; font-variant-numeric: tabular-nums; }
.statement-delta-up { color: #9a3f22; }
.statement-delta-down { color: #176699; }
.statement-delta-zero { color: #75858c; font-weight: 400; }
.statement-data-notice { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 9px; margin: 0 0 10px; padding: 9px 11px; border: 1px solid #c8d4d9; line-height: 1.45; }
.statement-data-info { border-color: #9fc5d1; background: #eef8fa; color: #315b68; }
.statement-data-warning { border-color: #d8b562; background: #fff8df; color: #664d13; }
.statement-data-warning b { color: #9a3f22; }
.statement-source-ok { margin: 0 0 10px; color: #28734d; font-size: 11px; text-align: right; }
.statement-wide-table-wrap { min-width: 0; }
.statement-scroll-hint { display: none; margin: 0 0 5px; color: #526b77; font-size: 11px; text-align: right; }
.statement-detail-table { overflow: auto; border: 1px solid #c8d1d7; }
.statement-detail-table .workflow-table { border: 0; min-width: 880px; }
.statement-product-table .workflow-table { width: 100%; min-width: 100%; table-layout: fixed; }
.statement-product-table .workflow-table th:nth-child(1) { width: 82px; }
.statement-product-table .workflow-table th:nth-child(2) { width: 112px; }
.statement-product-table .workflow-table th:nth-child(3) { width: 82px; }
.statement-product-table .workflow-table th:nth-child(4) { width: 110px; }
.statement-product-table .workflow-table th:nth-child(5) { width: 60px; }
.statement-product-table .workflow-table th:nth-child(6) { width: 94px; }
.statement-product-table .workflow-table th:nth-child(7) { width: 48px; }
.statement-product-table .workflow-table th:nth-child(8) { width: 65px; }
.statement-product-table .workflow-table th:nth-child(9) { width: 72px; }
.statement-product-table .workflow-table th:nth-child(10),
.statement-product-table .workflow-table th:nth-child(11),
.statement-product-table .workflow-table th:nth-child(12),
.statement-product-table .workflow-table th:nth-child(13) { width: 82px; }
.statement-product-table .workflow-table th:nth-child(14) { width: 118px; }
.statement-product-table .workflow-table th:nth-child(15) { width: 145px; }
.statement-product-table .workflow-table th,
.statement-product-table .workflow-table td { overflow-wrap: anywhere; white-space: normal; }
.statement-product-table tr[data-detail-kind="finance"] td { background: #f4f8f8; color: #31515d; }
.statement-product-table tr[data-detail-kind="finance"] td:nth-child(4) { font-weight: 700; }
.statement-product-table:focus-visible { outline: 2px solid #087f8c; outline-offset: 2px; }
.workflow-box-wide .statement-scroll-hint { display: block; }
.statement-summary-table .workflow-table th:first-child { width: 94px; }
.statement-summary-table .workflow-table th:nth-child(2) { width: 150px; }
.statement-summary-table .workflow-table th:nth-child(3) { width: 105px; }
.statement-summary-table .workflow-table th:nth-child(4),
.statement-summary-table .workflow-table th:nth-child(5),
.statement-summary-table .workflow-table th:nth-child(6) { width: 104px; }
.statement-detail-table tr[data-open-doc] { cursor: pointer; }
.statement-detail-table tr[data-open-doc]:hover td { background: #edf7f8; }
.statement-doc-link { color: #087797; text-decoration: underline; text-underline-offset: 2px; }
.statement-empty { height: 72px !important; color: #667982; text-align: center !important; white-space: normal !important; }
.statement-list-empty b, .statement-list-empty span { display: block; margin: 3px 0; }
.statement-list-empty button { margin-top: 9px; min-width: 112px; }
.statement-range-actions { display: flex; align-items: center; gap: 7px; margin: -2px 0 12px; padding: 8px 10px; border: 1px solid #d5dee2; background: #f7f9fa; }
.statement-range-actions span { margin-right: 4px; color: #526b77; font-size: 12px; }
.statement-range-actions button { min-height: 28px; padding: 3px 12px; }
.statement-preview-empty { min-height: 190px; display: grid; place-items: center; padding: 24px; border: 1px dashed #c5d0d5; background: #fafcfc; }
.statement-range-notice { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin: 0 0 12px; padding: 12px; border: 1px solid #dfca82; background: #fff9e8; color: #5c4a16; }
.statement-range-notice b { color: #8d4c12; }
.statement-preview-table { max-height: 390px; overflow: auto; border: 1px solid #c8d1d7; }
.statement-preview-table .workflow-table { min-width: 1180px; border: 0; }
.statement-preview-table .statement-detail-table { overflow: visible; border: 0; }
.statement-preview-table small { display: block; padding: 8px 10px; color: #60727b; background: #f5f8f9; }
.partner-history-result-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: -2px 0 10px; color: #536b77; font-size: 12px; }
.partner-history-result-meta b { color: #075f73; }
.partner-history-table tr[data-open-doc],
.stock-history-table tr[data-open-doc] { cursor: pointer; }
.partner-history-table tr[data-open-doc]:hover td,
.stock-history-table tr[data-open-doc]:hover td { background: #edf7f8; }
.stock-in { color: #1e6c43; font-weight: 700; }
.stock-out { color: #a13d2d; font-weight: 700; }
.invoice-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; border: 1px solid #c8d4d9; background: #c8d4d9; }
.invoice-detail-grid span { display: grid; gap: 5px; min-width: 0; padding: 10px 12px; background: #f7f9fa; }
.invoice-detail-grid small { color: #647984; }
.invoice-detail-grid b { overflow-wrap: anywhere; color: #173f50; font-size: 15px; }
.invoice-detail-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0; }
.invoice-detail-actions button { min-height: 32px; }
.invoice-detail-muted { color: #6c7c84; }
.invoice-detail-remark { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px; padding: 10px 12px; border: 1px solid #d5dee2; background: #fafcfc; }
.invoice-detail-remark span { overflow-wrap: anywhere; }
.source-document-link { max-width: 100%; overflow: hidden; border: 0; background: transparent; color: #087797; text-decoration: underline; text-overflow: ellipsis; white-space: nowrap; }
.workflow-error { color: #a03f3f; }
.status-warning { display: inline-block; padding: 2px 6px; border: 1px solid #d8a44a; background: #fff5d9; color: #8a5200; font-size: 12px; }
.table-actions { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; }
.table-actions button { min-height: 26px; padding: 2px 7px; white-space: nowrap; }
.attachment-actions { max-width: 260px; }
.attachment-actions .table-link {
  max-width: 190px;
  overflow: hidden;
  border: 0;
  background: transparent;
  color: #087797;
  text-decoration: underline;
  text-overflow: ellipsis;
}
.workflow-empty { padding: 42px 12px; text-align: center; color: #647681; }
.workflow-summary { display: flex; justify-content: flex-end; gap: 24px; padding-top: 12px; font-weight: 600; }
.workflow-summary b { color: #007fa3; }
#arapRows tr.selected td { background: #dff3f6; }

.print-panel {
  position: fixed;
  z-index: 80;
  width: 168px;
  padding: 10px 20px;
  border: 1px solid #9d9682;
  background: #eee9d8;
  box-shadow: 0 2px 5px rgba(0,0,0,.24);
}
.print-panel.hidden { display: none; }
.print-panel button {
  width: 120px;
  height: 30px;
  margin: 0 0 8px;
  border: 1px solid #999;
  background: #f4f4f4;
  color: #111;
  text-align: left;
}
.print-panel label {
  display: block;
  margin: 2px 0 8px;
  color: #111;
}
.print-panel select {
  width: 120px;
  height: 22px;
  border: 1px solid #999;
  background: #fff;
  font-size: 12px;
}

.print-preview {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  grid-template-rows: 56px 1fr;
  background: #000;
}
.print-preview.hidden { display: none; }
.print-preview header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 12px;
  background: #efefef;
  border-bottom: 1px solid #999;
}
.print-preview header b { margin-right: auto; color: #111; }
.print-preview-status {
  max-width: 260px;
  overflow: hidden;
  color: #5b6b73;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.preview-template-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #43545b;
  font-size: 12px;
}
.preview-template-control select {
  width: 180px;
  height: 30px;
  border: 1px solid #9fadb3;
  background: #fff;
}
.print-preview header button, .editor-toolbar button {
  height: 28px;
  min-width: 68px;
  border: 1px solid #999;
  background: #f8f8f8;
  color: #111;
}
.preview-stage {
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 12px 0 80px;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.print-paper {
  position: relative;
  box-sizing: border-box;
  width: var(--paper-width, 210mm);
  min-height: var(--paper-height, 297mm);
  padding: var(--paper-margin-top, 9mm) var(--paper-margin-right, 9mm) var(--paper-margin-bottom, 8mm) var(--paper-margin-left, 9mm);
  background: #fff;
  color: #000;
  font-family: var(--paper-font-family, SimSun), SimSun, "Microsoft YaHei", serif;
  font-size: var(--paper-font-size, 12px);
}
.print-paper.print-paper-stack {
  display: grid;
  gap: 18px;
  width: auto;
  min-height: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.print-sheet {
  position: relative;
  box-sizing: border-box;
  width: var(--paper-width, 210mm);
  height: var(--paper-height, 297mm);
  min-height: var(--paper-height, 297mm);
  padding: var(--paper-margin-top, 9mm) var(--paper-margin-right, 9mm) var(--paper-margin-bottom, 8mm) var(--paper-margin-left, 9mm);
  overflow: hidden;
  background: #fff;
  color: #000;
  font-family: var(--paper-font-family, SimSun), SimSun, "Microsoft YaHei", serif;
  font-size: var(--paper-font-size, 12px);
  box-shadow: 0 2px 16px rgba(0, 0, 0, .35);
}
.paper-layout {
  width: 100%;
  min-height: calc(var(--paper-height, 297mm) - var(--paper-margin-top, 9mm) - var(--paper-margin-bottom, 8mm));
  transform: translate(var(--calibration-x, 0), var(--calibration-y, 0));
}
.paper-title { position: relative; }
.quotation-supplier-seal {
  position: absolute;
  top: -12px;
  right: 5%;
  width: 82px;
  height: 82px;
  object-fit: contain;
  pointer-events: none;
  opacity: .88;
}
.paper-title h1 {
  margin: 0 0 4px;
  text-align: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: 700;
  letter-spacing: 0;
}
.paper-title h2 {
  margin: 0 0 5px;
  text-align: inherit;
  font-family: inherit;
  font-size: .65em;
  font-weight: 700;
  letter-spacing: 0;
}
.paper-title-note {
  margin: 0 0 4px;
  font-size: .48em;
  font-weight: 400;
  line-height: 1.35;
  text-align: left;
  white-space: pre-line;
}
.paper-meta {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: 2px 16px;
  margin: 4px 0;
  font-size: inherit;
}
.paper-meta-delivery {
  width: var(--paper-table-width, 100%);
  grid-template-columns: var(--paper-meta-left-width, calc(100% - 220px)) minmax(0, 1fr);
  gap: 2px 0;
  margin: 4px auto 2px;
  font-size: inherit;
}
.paper-meta-delivery > div:nth-child(even) { padding-left: 0; }
.paper-meta-delivery [data-print-meta="customer"] {
  font-size: calc(1em + 1px);
  font-weight: 700;
}
.paper-meta-delivery [data-print-meta="doc-no"],
.paper-meta-delivery [data-print-meta="date"] { white-space: nowrap; }
.paper-meta-contract {
  width: var(--paper-table-width, 100%);
  grid-template-columns: minmax(0, 1fr) 240px;
  margin: 18px auto 8px;
  line-height: 1.7;
  font-size: inherit;
}
.contract-intro {
  width: var(--paper-table-width, 100%);
  margin: 6px auto 5px;
  font-size: inherit;
  text-align: left !important;
}
.paper-table {
  margin: 0 auto;
  width: var(--paper-table-width, 100%);
  table-layout: fixed;
  border-collapse: collapse;
  font-size: inherit;
}
.paper-table th, .paper-table td {
  box-sizing: border-box;
  height: var(--paper-row-height, 20px);
  padding: 1px 4px;
  border: 1px solid #000;
  color: #000;
  background: #fff;
  text-align: center;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  overflow-wrap: normal;
  word-break: normal;
  text-overflow: clip;
}
.paper-cell-text,
.paper-header-label {
  display: block;
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  overflow-wrap: normal;
  word-break: normal;
  text-overflow: clip;
}
.paper-cell-name {
  text-overflow: ellipsis;
}
.paper-table th {
  position: static;
  height: max(22px, var(--paper-row-height, 20px));
  background: #fff;
  font-weight: 700;
}
.paper-table tbody tr:nth-child(even) td { background: #fff; }
.paper-table tfoot td {
  background: #f6f6f6;
  font-weight: 700;
}
.paper-total-label,
.paper-total-uppercase,
.paper-total-amount,
.paper-total-summary {
  text-align: center !important;
  vertical-align: middle !important;
}
.paper-debt, .paper-business-remark, .paper-note {
  box-sizing: border-box;
  width: var(--paper-table-width, 100%);
  margin: 0 auto;
  border: 1px solid #000;
  border-top: 0;
  padding: 2px 5px;
  line-height: 1.15;
}
.paper-address {
  box-sizing: border-box;
  width: var(--paper-table-width, 100%);
  margin: 0 auto;
  border: 0;
  padding: 2px 0;
  line-height: 1.15;
}
.paper-business-remark {
  min-height: 24px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.paper-business-remark.is-empty { display: none; }
.paper-debt {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 0;
}
.paper-debt span { padding: 2px 6px; }
.paper-debt span + span { border-left: 1px solid #000; }
.paper-note {
  min-height: 44px;
  white-space: pre-line;
  font-family: inherit;
  font-weight: 400;
  line-height: 1.28 !important;
  letter-spacing: 0;
  text-align: left !important;
}
.paper-sign {
  box-sizing: border-box;
  width: var(--paper-table-width, 100%);
  margin: 8px auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 10px;
  font-size: inherit;
}
.contract-terms {
  box-sizing: border-box;
  width: var(--paper-table-width, 100%);
  margin: 10px auto 0;
  padding: 0;
  border: 0;
  font-size: inherit;
  line-height: 1.55;
}
.contract-terms > p { margin: 9px 0; text-align: left; }
.contract-terms > p:first-child { text-align: left !important; }
.contract-parties {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 34px;
  margin-top: 22px;
}
.contract-parties section { display: grid; gap: 3px; }
.contract-parties strong { min-height: 20px; }
.contract-parties span { min-height: 18px; }
.contract-supplier-party {
  position: relative;
  padding-right: 0;
}
.contract-supplier-seal {
  position: absolute;
  top: -6mm;
  left: 20mm;
  width: 42mm;
  height: 42mm;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  opacity: .84;
  mix-blend-mode: multiply;
  z-index: 2;
}
.contract-main-sheet .paper-meta-contract {
  margin-top: 7px;
  margin-bottom: 4px;
  line-height: 1.35;
  font-size: inherit;
}
.contract-main-sheet .contract-intro { margin: 3px auto; font-size: inherit; }
.contract-main-sheet .contract-terms {
  margin-top: 4px;
  font-size: inherit;
  line-height: 1.38;
}
.contract-main-sheet .contract-terms > p { margin: 5px 0; }
.contract-main-sheet .contract-parties { gap: 22px; margin-top: 10px; }
.contract-main-sheet .contract-parties section { gap: 1px; }
.contract-main-sheet .contract-parties strong,
.contract-main-sheet .contract-parties span { min-height: 16px; }
.contract-annex-sheet .paper-meta-contract { margin: 8px auto 5px; line-height: 1.4; font-size: inherit; }
.contract-annex-sheet .paper-title h1 { font-size: inherit; }
.paper-table thead { display: table-header-group; }
.paper-table tfoot { display: table-footer-group; }
.paper-table tr, .paper-block { break-inside: avoid; page-break-inside: avoid; }
.print-paper.image-exporting .print-sheet { box-shadow: none; }
.print-paper[data-print-profile="needle"] .paper-meta,
.print-paper[data-print-profile="needle"] .paper-table,
.print-paper[data-print-profile="needle"] .paper-debt,
.print-paper[data-print-profile="needle"] .paper-business-remark,
.print-paper[data-print-profile="needle"] .paper-note,
.print-paper[data-print-profile="needle"] .paper-address,
.print-paper[data-print-profile="needle"] .paper-sign {
  color: #000;
  font-weight: 600 !important;
  text-rendering: optimizeSpeed;
}
.print-paper[data-print-profile="needle"] .paper-table th,
.print-paper[data-print-profile="needle"] .paper-table tfoot td,
.print-paper[data-print-profile="needle"] b {
  font-weight: 700 !important;
}
.paper-zone { position: relative; width: 100%; }
.designer-paper .paper-layout { min-height: 100%; }
.designer-paper {
  height: var(--paper-height, 297mm);
  overflow: hidden;
}
.designer-paper .paper-zone {
  min-height: 28px;
  padding: 18px 5px 6px;
  border: 1px dashed #7c9aa8;
  background: rgba(240, 248, 250, .55);
}
.designer-paper .paper-zone + .paper-zone { border-top: 0; }
.designer-paper .paper-zone-label {
  position: absolute;
  top: 2px;
  left: 5px;
  color: #526b76;
  font-family: "Microsoft YaHei", sans-serif;
  font-size: 10px;
  font-weight: 400;
  pointer-events: none;
}
.designer-paper .paper-block {
  cursor: grab;
  outline: 1px solid transparent;
}
.designer-paper .paper-table-block { position: relative; }
.designer-paper .paper-table { position: relative; }
.paper-table-direct-help {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: var(--paper-table-width, 100%);
  min-height: 28px;
  margin: 0 auto;
  color: #496673;
  font: 11px "Microsoft YaHei", sans-serif;
}
.paper-table-direct-help span { margin-right: auto; }
.paper-table-direct-help button {
  height: 23px;
  margin-left: 5px;
  padding: 0 8px;
  border: 1px solid #5c8797;
  border-radius: 2px;
  background: #fff;
  color: #174b5e;
  font: 11px "Microsoft YaHei", sans-serif;
  cursor: ns-resize;
}
.paper-table-direct-help [data-resize-table] { cursor: ew-resize; }
.designer-paper .paper-table caption {
  height: 26px;
  padding: 0;
  color: #496673;
  font: 11px "Microsoft YaHei", sans-serif;
  caption-side: top;
  text-align: right;
}
.designer-paper .paper-table caption span { margin-right: 8px; }
.designer-paper .paper-table caption button {
  height: 23px;
  margin-left: 4px;
  padding: 0 7px;
  border: 1px solid #5c8797;
  border-radius: 2px;
  background: #fff;
  color: #174b5e;
  font: 11px "Microsoft YaHei", sans-serif;
}
.designer-paper .paper-table caption [data-resize-row] { cursor: ns-resize; }
.designer-paper .paper-table caption [data-resize-table] { cursor: ew-resize; }
.designer-paper .paper-table th,
.designer-paper .paper-table td { position: relative; cursor: cell; }
.designer-paper .paper-table th.selected-column,
.designer-paper .paper-table td.selected-column {
  background: #e1f4f7 !important;
  box-shadow: inset 1px 0 #42a8ba, inset -1px 0 #42a8ba;
}
.designer-paper .paper-table th.selected-column { background: #cbeaf0 !important; }
.designer-paper .paper-table tbody tr.selected-row td:not(.selected-column) {
  background: #f1fbfc !important;
  box-shadow: inset 0 1px #79b8c5, inset 0 -1px #79b8c5;
}
.designer-paper .paper-table th:focus { outline: 2px solid #008faf; outline-offset: -2px; }
.designer-paper .paper-header-label { display: block; min-width: 12px; min-height: 16px; }
.designer-paper .editing-label { z-index: 8; }
.designer-paper .paper-header-label[contenteditable="true"] {
  margin: -1px 2px;
  padding: 1px 3px;
  outline: 2px solid #008faf;
  background: #fff;
  color: #111;
  cursor: text;
}
.paper-column-resizer {
  position: absolute;
  z-index: 7;
  top: -1px;
  right: 0;
  width: 14px;
  height: calc(100% + 2px);
  cursor: col-resize;
  touch-action: none;
  background: rgba(0, 143, 175, .09);
}
.paper-column-resizer::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  width: 5px;
  height: 14px;
  transform: translateY(-50%);
  background: repeating-linear-gradient(to bottom, #087e97 0 2px, transparent 2px 4px);
}
.paper-column-resizer::after {
  content: "";
  position: absolute;
  top: 1px;
  right: 4px;
  bottom: 1px;
  width: 3px;
  background: #0a92ac;
  opacity: .68;
}
.paper-column-resizer:hover::after,
.template-resizing .paper-column-resizer::after { width: 4px; opacity: 1; box-shadow: 0 0 0 2px rgba(0, 143, 175, .16); }
.paper-row-resizer {
  position: absolute;
  z-index: 6;
  right: 0;
  bottom: 0;
  left: 0;
  width: auto;
  height: 9px;
  cursor: row-resize;
  touch-action: none;
  background: transparent;
}
.paper-row-resizer::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 1px;
  left: 0;
  height: 2px;
  background: #0a92ac;
  opacity: .28;
}
.paper-row-resizer::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: 2px;
  width: 14px;
  height: 4px;
  transform: translateX(50%);
  background: repeating-linear-gradient(to right, #087e97 0 2px, transparent 2px 4px);
  opacity: .62;
}
.paper-row-resizer:hover::after,
.template-resizing .paper-row-resizer::after { opacity: 1; box-shadow: 0 0 0 2px rgba(0, 143, 175, .14); }
.paper-row-resizer:hover::before,
.template-resizing .paper-row-resizer::before { height: 3px; opacity: 1; box-shadow: 0 0 0 2px rgba(0, 143, 175, .14); }
.paper-table-edge {
  position: absolute;
  z-index: 8;
  top: 28px;
  bottom: 0;
  width: 16px;
  cursor: ew-resize;
  touch-action: none;
  background: rgba(0, 143, 175, .09);
}
.paper-table-edge::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 22px;
  transform: translateY(-50%);
  background: repeating-linear-gradient(to bottom, #087e97 0 2px, transparent 2px 4px);
}
.paper-table-edge-left::before { left: 4px; }
.paper-table-edge-right::before { right: 4px; }
.paper-table-edge::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #008faf;
  opacity: .7;
}
.paper-table-edge-left { left: calc((100% - var(--paper-table-width, 100%)) / 2); }
.paper-table-edge-left::after { left: 0; }
.paper-table-edge-right { right: calc((100% - var(--paper-table-width, 100%)) / 2); }
.paper-table-edge-right::after { right: 0; }
.paper-table-edge:hover::after,
.template-resizing .paper-table-edge::after { width: 4px; opacity: 1; box-shadow: 0 0 0 2px rgba(0, 143, 175, .16); }
.template-resizing,
.template-resizing * { user-select: none !important; }
.template-resizing .designer-paper .paper-block { cursor: inherit; }
.designer-paper .paper-block:hover { outline-color: #0b9fba; }
.designer-paper .paper-block.selected { outline: 2px solid #008fb0; outline-offset: 1px; }
.designer-paper .paper-zone.drag-over { background: #ddf3f7; box-shadow: inset 0 0 0 2px #008fb0; }
.designer-paper.paper-overflow { box-shadow: 0 0 0 3px #c93d3d; }
.designer-paper.paper-overflow::after {
  content: "内容超出纸张，请减少行数、字号或边距";
  position: absolute;
  right: 8px;
  bottom: 6px;
  padding: 3px 7px;
  background: #c93d3d;
  color: #fff;
  font: 12px "Microsoft YaHei", sans-serif;
}

.template-editor {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: grid;
  grid-template-rows: 50px 36px 1fr;
  background: #e7e7e7;
  color: #111;
}
.template-editor.hidden { display: none; }
.template-editor header {
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-bottom: 1px solid #999;
  background: #f2f2f2;
}
.template-editor-heading {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 12px;
  margin-right: auto;
}
.template-editor header b { font-weight: 500; }
.template-editor-context {
  overflow: hidden;
  max-width: min(58vw, 760px);
  color: #5b6c73;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.template-editor-save-state {
  flex: 0 0 auto;
  margin-right: 10px;
  padding: 2px 7px;
  border: 1px solid #abc3c8;
  border-radius: 3px;
  color: #296b73;
  background: #edf7f8;
  font-size: 12px;
}
.template-editor-save-state.unsaved {
  border-color: #d5a347;
  color: #845500;
  background: #fff7df;
}
.template-editor header button {
  border: 0;
  background: transparent;
  font-size: 22px;
}
.editor-toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  overflow-x: auto;
  white-space: nowrap;
  padding: 4px 12px;
  border-bottom: 1px solid #aaa;
  background: #efefef;
}
.editor-toolbar select {
  flex: 0 0 190px;
  width: 150px;
  height: 26px;
  border: 1px solid #999;
  background: #fff;
}
.editor-toolbar .editor-zoom {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  color: #294d5d;
  font-size: 12px;
}
.editor-toolbar .editor-zoom select { flex-basis: 78px; width: 78px; }
.template-canvas {
  overflow: auto;
  padding: 34px 0 100px 90px;
  background: linear-gradient(90deg, #fefefe 0 880px, #e8e8e8 880px);
}
.template-canvas .print-paper {
  transform-origin: top left;
  transform: scale(.92);
  box-shadow: 0 0 0 1px #ccc;
}
.template-form {
  width: 920px;
  padding: 18px;
  background: #fff;
  border: 1px solid #b9c1c7;
}
.template-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 18px;
}
.template-form label {
  display: grid;
  gap: 4px;
  color: #24435a;
}
.template-section-title {
  margin: 4px 0 10px;
  padding-bottom: 5px;
  border-bottom: 1px solid #b9c1c7;
  color: #07506c;
  font-weight: 700;
}
.template-form input,
.template-form select,
.template-form textarea {
  min-height: 30px;
  padding: 4px 8px;
  border: 1px solid #aeb8bf;
  background: #fff;
}
.template-checks {
  display: flex;
  gap: 24px;
  margin: 16px 0;
}
.template-checks label {
  display: flex;
  align-items: center;
  gap: 6px;
}
.template-wide {
  margin: 10px 0;
}
.template-token-panel {
  display: grid;
  grid-template-columns: 1fr 190px;
  gap: 8px 12px;
  align-items: center;
  margin: 10px 0 14px;
  padding: 10px;
  border: 1px solid #c8d4da;
  background: #f8fcfd;
}
.template-token-panel div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.template-token-panel button {
  min-height: 28px;
  padding: 3px 10px;
  border: 1px solid #0aa1bf;
  background: #fff;
  color: #07506c;
  cursor: pointer;
}
.template-token-panel span {
  grid-column: 1 / -1;
  color: #5b6c78;
  font-size: 12px;
}
.template-columns {
  width: 100%;
  margin-top: 14px;
  border-collapse: collapse;
}
.template-columns th,
.template-columns td {
  border: 1px solid #c8d1d6;
  padding: 4px 6px;
}
.template-columns th {
  background: #cbd4dc;
  color: #07506c;
}
.template-columns input[type="number"] {
  width: 90px;
}
.template-columns select {
  width: 72px;
}

.template-canvas {
  overflow: hidden;
  padding: 0;
  background: #dfe4e7;
}
.template-designer {
  display: grid;
  grid-template-columns: 224px minmax(520px, 1fr) 380px;
  height: 100%;
  min-width: 1120px;
}
.template-palette,
.template-properties {
  min-width: 0;
  overflow-y: auto;
  background: #f7f9fa;
}
.template-palette { border-right: 1px solid #aeb9bf; }
.template-properties { border-left: 1px solid #aeb9bf; }
.template-pane-title {
  padding: 9px 12px;
  border-bottom: 1px solid #c6d0d5;
  background: #e7edf0;
  color: #183f50;
  font-size: 13px;
  font-weight: 700;
}
.template-palette-list { padding: 8px; }
.template-palette-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 36px;
  margin-bottom: 4px;
  padding: 5px 8px;
  border: 1px solid #b4c1c7;
  border-radius: 3px;
  background: #fff;
  color: #173b4c;
  text-align: left;
  cursor: grab;
}
.template-palette-block span { color: #607985; font-size: 11px; }
.template-palette-block.active { border-color: #008faf; box-shadow: inset 3px 0 #008faf; }
.template-palette-block.hidden-block { border-style: dashed; opacity: .72; }
.template-palette-block.dragging,
.template-columns tr.dragging { opacity: .45; }
.template-token-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  padding: 8px;
}
.template-token-buttons button {
  min-height: 30px;
  border: 1px solid #88a8b5;
  border-radius: 3px;
  background: #fff;
  color: #17495d;
}
.template-token-target,
.template-help { margin: 4px 10px 10px; }
.template-token-target { display: grid; gap: 4px; color: #244c5e; }
.template-token-target select { min-height: 30px; border: 1px solid #a8b6bd; background: #fff; }
.template-help { color: #5d7079; font-size: 12px; line-height: 1.45; }
.template-workbench {
  position: relative;
  min-width: 0;
  overflow: auto;
  background: #cfd5d8;
}
.template-paper-stage {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-width: 820px;
  min-height: 100%;
  padding: 34px 44px 100px;
}
.template-paper-stage .print-paper {
  flex: none;
  zoom: var(--designer-zoom, .9);
  box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
}
.template-ruler {
  position: sticky;
  z-index: 2;
  background: #edf0f2;
  pointer-events: none;
}
.template-ruler-horizontal { top: 0; left: 24px; width: calc(100% - 24px); height: 24px; border-bottom: 1px solid #9eaaaf; }
.template-ruler-vertical { top: 24px; left: 0; width: 24px; height: calc(100% - 24px); border-right: 1px solid #9eaaaf; }
.template-properties details { border-bottom: 1px solid #c6d0d5; }
.template-properties summary {
  padding: 9px 12px;
  background: #edf1f3;
  color: #183f50;
  font-weight: 700;
  cursor: pointer;
}
.template-properties details > :not(summary) { margin-left: 10px; margin-right: 10px; }
.template-block-properties { padding: 10px; border-bottom: 1px solid #c6d0d5; }
.template-block-properties > strong { display: block; margin-bottom: 8px; color: #006e88; }
.template-format-heading {
  margin: 10px 0 0;
  padding-top: 8px;
  border-top: 1px solid #d2dde1;
  color: #244c5e;
  font-size: 12px;
  font-weight: 700;
}
.template-block-properties label,
.template-properties .template-grid label,
.template-properties .template-wide { display: grid; gap: 3px; color: #294d5d; font-size: 12px; }
.template-block-properties input,
.template-block-properties select,
.template-properties input,
.template-properties select,
.template-properties textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 28px;
  padding: 3px 6px;
  border: 1px solid #a8b6bd;
  border-radius: 2px;
  background: #fff;
}
.template-property-grid,
.template-properties .template-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}
.template-block-properties .inline-check {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}
.template-block-properties .inline-check input,
.template-role-checks input,
.template-checks input { width: auto; min-height: 0; }
.template-visibility-button {
  width: 100%;
  min-height: 30px;
  margin-top: 8px;
  border: 1px solid #9caeb7;
  border-radius: 3px;
  background: #fff;
  color: #244c5e;
}
.template-cell-properties {
  padding: 10px;
  border-bottom: 1px solid #c6d0d5;
  background: #f1f8fa;
}
.template-row-properties {
  display: grid;
  gap: 7px;
  padding: 10px;
  border-bottom: 1px solid #c6d0d5;
  background: #f8fbfc;
}
.template-row-properties > strong { color: #006e88; }
.template-row-properties label { display: grid; gap: 3px; color: #294d5d; font-size: 12px; }
.template-row-properties input {
  box-sizing: border-box;
  width: 100%;
  min-height: 28px;
  padding: 3px 6px;
  border: 1px solid #a8b6bd;
  background: #fff;
}
.template-row-actions,
.template-reset-size { margin-top: 2px; }
.template-row-actions button,
.template-reset-size {
  width: 100%;
  min-height: 28px;
  border: 1px solid #8da7b1;
  border-radius: 3px;
  background: #fff;
  color: #174b5e;
}
.template-row-actions button:disabled { cursor: default; opacity: .52; }
.template-cell-properties > strong { display: block; color: #006e88; }
.template-cell-properties label { display: grid; gap: 3px; color: #294d5d; font-size: 12px; }
.template-cell-properties input,
.template-cell-properties select {
  box-sizing: border-box;
  width: 100%;
  min-height: 28px;
  padding: 3px 6px;
  border: 1px solid #a8b6bd;
  background: #fff;
}
.template-column-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 5px; margin-top: 8px; }
.template-column-actions button {
  min-height: 28px;
  border: 1px solid #8da7b1;
  background: #fff;
  color: #174b5e;
}
.template-properties .template-checks {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  margin: 12px 10px;
}
.template-properties .template-checks label,
.template-role-checks label { display: flex; align-items: center; gap: 6px; color: #294d5d; }
.template-properties .template-wide { margin-top: 9px; margin-bottom: 9px; }
.template-page-row-setting small {
  color: #637982;
  font-size: 11px;
  line-height: 1.35;
}
.template-seal-setting {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid #b7c8ce;
  border-left: 4px solid #217985;
  border-radius: 4px;
  background: #f6fafb;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.template-seal-setting.attention {
  border-color: #b9851d;
  background: #fffaf0;
  box-shadow: 0 0 0 3px rgba(185, 133, 29, .18);
}
.template-seal-setting > strong { grid-column: 1 / -1; color: #244b53; font-size: 14px; }
.template-seal-setting > label { min-width: 0; }
.template-seal-upload { display: grid; grid-template-columns: 84px minmax(0, 1fr); align-items: center; gap: 8px; }
.template-seal-setting input[type="file"] { padding: 3px; background: #fff; }
.template-seal-preview { display: flex; align-items: center; gap: 7px; }
.template-seal-preview img { width: 54px; height: 54px; object-fit: contain; border: 1px solid #ccd7db; background: #fff; }
.template-seal-preview span { color: #6a7b82; }
.template-seal-preview button { min-height: 28px; border: 1px solid #9cadb4; background: #fff; }
.template-seal-setting small { grid-column: 1 / -1; color: #60757e; line-height: 1.35; }
.template-role-checks { display: grid; gap: 8px; padding: 10px 0; }
.template-columns { table-layout: fixed; font-size: 12px; }
.template-columns th,
.template-columns td { padding: 3px; }
.template-columns th:first-child,
.template-columns td:first-child { width: 24px; }
.template-columns th:nth-child(2),
.template-columns td:nth-child(2) { width: 42px; text-align: center; }
.template-columns input,
.template-columns select { min-width: 0; width: 100%; }
.template-drag-handle { color: #607985; text-align: center; cursor: grab; }
.template-columns tr.drag-over { outline: 2px solid #008faf; }

/* Commercial UI consistency pass */
::selection { background: #cce9ed; color: #17333b; }
* {
  scrollbar-color: #a9bac1 #edf2f4;
  scrollbar-width: thin;
}
button,
input,
select,
textarea { border-radius: 3px; }
button { transition: background-color .12s ease, border-color .12s ease, color .12s ease; }
button:disabled { cursor: not-allowed; opacity: .68; }
button[aria-busy="true"] { cursor: wait; opacity: .78; }
button[aria-busy="true"]::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 7px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  vertical-align: -2px;
  animation: export-button-spin .75s linear infinite;
}
@keyframes export-button-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  button[aria-busy="true"]::before { animation: none; }
}

.desktop {
  grid-template-rows: 104px 34px minmax(0, 1fr) 24px;
}
.topbar {
  grid-template-columns: 220px minmax(0, 1fr) 112px;
  grid-template-rows: 54px 50px;
  border-bottom: 1px solid #075e66;
  box-shadow: var(--shadow-sm);
}
.brand {
  padding: 14px 0 0 20px;
  font-size: 27px;
  letter-spacing: 0;
}
.topnav {
  gap: 9px;
  padding-top: 17px;
}
.topnav button,
.shortcut button {
  min-height: 30px;
  padding: 4px 8px;
  border-radius: 3px;
  text-decoration: none;
}
.topnav button:hover,
.shortcut button:hover { background: rgba(255, 255, 255, .13); }
.topnav button.active,
.shortcut button.active {
  background: rgba(255, 255, 255, .18);
  box-shadow: inset 0 -2px #fff;
  text-decoration: none;
}
.shortcut {
  gap: 8px;
  padding: 2px 500px 6px 0;
}
.window-tools { padding-top: 10px; opacity: .88; }
.auth-status {
  top: 75px;
  right: 14px;
  gap: 7px;
}
.auth-status button {
  min-height: 26px;
  height: 26px;
  border-radius: 3px;
}

.dropdown-menu,
.submenu {
  padding: 4px 0;
  border-color: #9db0b8;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(25, 46, 55, .2);
}
.dropdown-menu::before,
.submenu::before { width: 27px; background: #e1eff1; }
.dropdown-menu button {
  min-height: 30px;
  padding-left: 36px;
  color: #1b252a;
}
.dropdown-menu button:hover {
  outline: 0;
  background: #dceff2;
  color: #084f58;
}
.menu-sep { background: #ccd5d9; }

.tabbar {
  align-items: stretch;
  overflow-x: auto;
  border-bottom-color: #9eabb1;
  background: #dceaec;
}
.tab {
  height: 33px;
  min-width: 92px;
  padding: 0 9px;
  border-color: #bac8cd;
  border-radius: 3px 3px 0 0;
  background: #edf4f5;
  color: #34434a;
}
.tab:hover { background: #f7fbfc; }
.tab.active {
  border-top: 2px solid var(--teal);
  background: #fff;
  color: #143c45;
  font-weight: 700;
}
.tab .close-tab {
  width: 16px;
  height: 16px;
  margin-left: 7px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: #9b4242;
  font-size: 14px;
  font-weight: 700;
}
.tab .close-tab { font-size: 14px; }
.tab .close-tab::before { content: none; }
.tab .close-tab:hover { background: #b44545; color: #fff; }

.workarea { grid-template-columns: 88px minmax(0, 1fr) 220px; border-top: 0; }
.workarea:has(.settings-view.active) { grid-template-columns: 88px minmax(0, 1fr); }
.workarea:has(.settings-view.active) .rightbar { display: none; }
.side {
  background: #126f78;
  border-right-color: #0b5e66;
  box-shadow: 1px 0 0 rgba(255,255,255,.2);
}
.side button {
  height: 68px;
  border-bottom-color: rgba(255,255,255,.12);
  font-weight: 600;
}
.side button.active {
  background: #fff;
  color: #0a6570;
  box-shadow: inset 4px 0 #d28a22;
}
.side button:hover:not(.active) { background: rgba(0,0,0,.12); }
.side span { font-size: 22px; }
.side b { font-size: 13px; }

.content { grid-template-rows: 44px minmax(0, 1fr); background: var(--surface); }
.toolbar {
  padding: 0 14px;
  background: #f7f9fa;
  box-shadow: inset 0 -1px #d4dde1;
}
.toolbar b { color: #153f49; }
.search { grid-template-columns: minmax(190px, 260px) 58px 58px; }
.search input {
  height: 31px;
  padding: 0 9px;
  border-color: #b8c7cd;
  border-radius: 3px;
}
.search button,
.primary,
.view-actions button,
.settings-actions button,
.query-box footer button,
.workflow-box > footer button,
.column-config-box footer button {
  min-height: 32px;
  border: 1px solid var(--blue-dark);
  border-radius: 3px;
  background: var(--blue);
  color: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .08);
}
.search button:hover,
.primary:hover,
.view-actions button:hover,
.settings-actions button:hover,
.query-box footer button:hover,
.workflow-box > footer button:hover,
.column-config-box footer button:hover { background: var(--blue-dark); }

.view { padding: 14px; background: var(--canvas); }
#homeView { background: #fff; }
.module-cards {
  grid-template-columns: repeat(3, 112px);
  column-gap: 112px;
  row-gap: 82px;
  padding-top: 90px;
}
.module-card {
  width: 112px;
  height: 104px;
  border-color: #72aeb5;
  border-radius: 6px;
  color: #0d707a;
  box-shadow: var(--shadow-sm);
}
.module-card:hover,
.module-card.active {
  border-color: var(--teal);
  background: #e8f5f6;
  color: #075c65;
  box-shadow: 0 5px 16px rgba(25, 87, 95, .16);
}
.module-card span { color: var(--teal); }
.module-card b { font-weight: 600; }

.rightbar {
  padding-top: 10px;
  border-left-color: #d4dde1;
  background: #fafcfc;
}
.rightbar h3 {
  padding: 2px 16px 10px;
  color: #234953;
}
.rightbar button {
  min-height: 39px;
  padding: 0 16px;
  border-top-color: #e2e8eb;
  background: transparent;
  color: #35484f;
}
.rightbar button:hover { background: #e7f3f4; color: #075e68; }

.grid-head {
  min-height: 36px;
  height: auto;
  gap: 6px;
  padding-bottom: 6px;
}
.grid-head button {
  min-height: 28px;
  border: 1px solid #aab9c0;
  border-radius: 3px;
  background: #fff;
  color: #334b56;
}
.table-wrap {
  border-color: #b8c5ca;
  border-radius: 3px;
  box-shadow: var(--shadow-sm);
}
table { color: #243239; }
th, td { height: 32px; border-color: #d7dfe3; }
th {
  background: #e4ebee;
  color: #29434e;
  box-shadow: inset 0 -1px #aebcc3;
}
tbody tr:nth-child(even) td { background: #f9fbfc; }
tbody tr:hover td,
tr[data-open-doc]:hover td { background: #e8f5f6; }
tbody tr.selected td,
#arapRows tr.selected td {
  background: #d9eef1;
  box-shadow: inset 0 1px #b7dce1, inset 0 -1px #b7dce1;
}
tbody tr.selected td:first-child { box-shadow: inset 3px 0 var(--teal), inset 0 1px #b7dce1, inset 0 -1px #b7dce1; }
.table-wrap tbody tr:only-child td[colspan],
.report-table tbody tr:only-child td[colspan] {
  height: 124px;
  padding: 28px 16px;
  color: #687b83;
  text-align: center;
  vertical-align: middle;
  background: #fbfcfc;
}
.table-actions button {
  border: 1px solid #a7b8c0;
  border-radius: 3px;
  background: #fff;
  color: #195d7e;
}
.table-actions button:hover { border-color: #508aa4; background: #edf6f9; }

.document-view { padding-top: 10px; background: #fff; }
.document-form {
  height: 100%;
  min-height: 0;
  border: 1px solid #d2dce0;
  border-radius: 3px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.doc-head {
  padding: 10px 16px 8px 18px;
  border-bottom: 1px solid #e0e6e9;
}
.doc-head h1 { color: #183d47; font-size: 27px; font-weight: 600; }
.doc-fields {
  gap: 8px 32px;
  padding: 12px 16px 16px;
  background: #fafcfc;
}
.doc-fields label,
.doc-meta label,
.doc-bottom label { color: #3d5d69; }
.doc-fields input:focus,
.doc-fields select:focus,
.doc-meta input:focus,
.doc-meta select:focus { background: #fff; box-shadow: inset 0 -2px var(--teal); }
.doc-grid-wrap,
.finance-grid-wrap {
  min-height: 0;
  overflow: auto;
  border-color: #9eafb6;
  background: #f3f5f6;
}
.doc-grid th {
  height: 34px;
  color: #174d60;
  font-size: 14px;
}
.doc-grid td { height: 35px; background: #fff; }
.doc-grid tbody tr:nth-child(even) td { background: #f8fafb; }
.doc-grid tbody tr:focus-within td {
  background: #fffced;
  box-shadow: inset 0 1px #e5d28d, inset 0 -1px #e5d28d;
}
.doc-grid tbody tr:focus-within td:first-child { box-shadow: inset 3px 0 var(--amber), inset 0 1px #e5d28d, inset 0 -1px #e5d28d; }
.doc-grid input:focus,
.doc-grid select:focus {
  outline: 0;
  box-shadow: inset 0 0 0 2px #258da1;
}
.doc-bottom {
  min-height: 76px;
  border-top: 1px solid #d8e0e3;
  background: #f7f9fa;
}
.line-assist {
  border-color: #b9d3da;
  border-radius: 3px;
  background: #eef8f9;
}
.doc-total b { color: #173d48; font-size: 18px; }
.doc-actions { background: #fafbfb; }
.doc-actions [data-open="home"] {
  border: 1px solid #9bacb3;
  background: #fff;
  color: #344c55;
}
.doc-actions [data-open="home"]:hover { background: #eef3f5; }

.arap-view { background: #fff; }
.arap-head { background: #f8fafb; }
.arap-head h1 { color: #254d5a; font-size: 27px; font-weight: 600; }
.arap-body { border-top-color: #aebbc1; }
.tree { border-right-color: #c4d0d5; background: #f7f9fa; }
.view-actions { border-top-color: #c5d0d5; background: #f8fafb; }

.report-stats {
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  max-width: 1040px;
}
.report-stats article {
  border-left: 4px solid var(--teal);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
}
.report-stats article:nth-child(2n) { border-left-color: var(--blue); }
.report-stats article:nth-child(3n) { border-left-color: var(--amber); }

.settings-view { grid-template-rows: 38px minmax(0, 1fr) 52px; background: var(--canvas); }
.config-tabs {
  gap: 2px;
  padding: 5px 8px 0;
  border-bottom-color: #aebcc2;
  background: #e5ebee;
}
.config-tabs button {
  min-width: 132px;
  height: 33px;
  border-color: #b7c3c8;
  border-radius: 3px 3px 0 0;
  clip-path: none;
  background: #f2f5f6;
  color: #3d5058;
}
.config-tabs button:hover { background: #fff; }
.config-tabs button.active {
  border-top: 2px solid var(--teal);
  background: #fff;
  color: #123f49;
  font-weight: 700;
}
.config-panel { overflow: auto; padding: 20px 24px 24px; }
.config-panel.active { background: #fff; }
#config-company.active {
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 520px));
  align-content: start;
  gap: 14px 28px;
}
#config-company > label {
  grid-template-columns: 120px minmax(0, 1fr);
  margin: 0;
}
#config-company > button,
#config-company .admin-note {
  grid-column: 1 / -1;
}
#config-company > button { justify-self: start; min-width: 160px; }
.config-panel label { color: #3c5964; }
.config-panel input,
.config-panel select {
  height: 32px;
  padding: 0 8px;
  border-color: #b8c5ca;
  border-radius: 3px;
}
.config-table { width: min(100%, 1180px); }
.license {
  margin: 24px 0 0;
  padding: 10px 12px;
  border-left: 3px solid var(--teal);
  background: #eef7f8;
  color: #185762;
  font-size: 14px;
}
.settings-actions {
  gap: 10px;
  padding-left: 24px;
  border-top-color: #c7d1d5;
  background: #f7f9fa;
}
.admin-tools {
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid #cad5da;
  border-radius: 3px;
  background: #f5f8f9;
}
.admin-tools button,
.user-admin-form button,
.security-config > button {
  border: 1px solid var(--blue-dark);
  border-radius: 3px;
  background: var(--blue);
  color: #fff;
}
.security-config {
  max-width: 1180px;
  margin: 0 0 14px;
  padding: 16px;
  border-radius: 4px;
  background: #f8fafb;
  box-shadow: var(--shadow-sm);
}
.security-config:not(.session-management) {
  display: grid;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
  gap: 10px 26px;
}
.security-config > h3 {
  grid-column: 1 / -1;
  margin: 10px 0 2px;
  padding-bottom: 7px;
  border-bottom: 1px solid #d7e0e4;
  color: #174d59;
  font-size: 15px;
}
.security-config > h3:first-child { margin-top: 0; }
.security-config > label {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  align-items: center;
  margin: 0;
}

.tenant-provision-admin,
.registration-admin {
  max-width: 100%;
  margin: 0 0 14px;
  border: 1px solid #c7d3d8;
  border-radius: 4px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.tenant-provision-admin > header,
.registration-admin > header {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(420px, auto);
  align-items: end;
  gap: 16px;
  padding: 14px 16px;
  border-bottom: 1px solid #d3dde1;
  background: #f5f8f9;
}
.tenant-provision-admin h3,
.registration-admin h3 { margin: 0 0 4px; color: #174d59; font-size: 16px; }
.tenant-provision-admin header p,
.registration-admin header p { margin: 0; color: var(--muted); }
.tenant-provision-admin > header button,
.tenant-provision-actions button {
  min-height: 34px;
  padding: 4px 12px;
  border: 1px solid var(--blue-dark);
  border-radius: 3px;
  background: var(--blue);
  color: #fff;
}
.tenant-provision-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #d3dde1;
}
.tenant-provision-form label { display: grid; gap: 5px; color: #36545c; font-size: 13px; }
.tenant-provision-form input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 9px;
  border: 1px solid #afbdc3;
  border-radius: 3px;
  background: #fff;
  font: inherit;
}
.tenant-provision-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.tenant-provision-actions span { margin-right: auto; color: #5a7078; }
.tenant-provision-actions #clearTenantProvision { border-color: #aab8bd; background: #fff; color: #38515a; }
.tenant-provision-table-wrap { max-width: 100%; max-height: 270px; overflow: auto; }
.tenant-provision-table { min-width: 860px; width: 100%; }
.tenant-provision-table th { position: sticky; top: 0; z-index: 1; white-space: nowrap; }
.tenant-provision-table td { vertical-align: middle; }
.registration-admin-filters { display: grid; grid-template-columns: minmax(220px, 1fr) 120px 72px; gap: 8px; }
.registration-admin-filters input,
.registration-admin-filters select { min-width: 0; height: 34px; padding: 0 8px; border: 1px solid #afbdc3; border-radius: 3px; background: #fff; }
.registration-admin-filters button,
.registration-admin-table button { border: 1px solid var(--blue-dark); border-radius: 3px; background: var(--blue); color: #fff; }
.registration-admin-table-wrap { max-width: 100%; overflow: auto; }
.registration-admin-table { min-width: 1240px; width: 100%; }
.registration-admin-table th { position: sticky; top: 0; z-index: 1; white-space: nowrap; }
.registration-admin-table td { vertical-align: top; line-height: 1.5; }
.registration-admin-table td small { display: block; margin-top: 3px; color: var(--muted); }
.registration-admin-table td a { color: #075f84; }
.registration-admin-table select,
.registration-admin-table textarea { width: 100%; min-width: 108px; border: 1px solid #adbbc1; border-radius: 3px; background: #fff; font: inherit; }
.registration-admin-table select { height: 32px; }
.registration-admin-table textarea { min-width: 180px; min-height: 58px; padding: 6px; resize: vertical; }
.registration-admin-table button { min-width: 64px; height: 32px; }
.registration-request-actions { display: grid; gap: 6px; }
.registration-provisioned { color: #176b43; font-weight: 700; text-align: center; white-space: nowrap; }
.registration-admin-table th:last-child,
.registration-admin-table td:last-child {
  position: sticky;
  right: 0;
  min-width: 78px;
  background: #fff;
  box-shadow: -5px 0 7px rgba(42, 68, 78, .08);
}
.registration-admin-table th:last-child { z-index: 3; background: #dfe8eb; }
.registration-admin-table td:last-child { z-index: 2; }
.registration-request-note { min-width: 180px; max-width: 280px; white-space: pre-wrap; }
.security-config > label.check {
  display: flex;
  grid-column: auto;
  min-height: 32px;
  gap: 8px;
}
.security-config > label.check input { width: 17px; height: 17px; }
.security-config > p,
.security-config > button { grid-column: 1 / -1; }
.security-config > button { justify-self: start; min-width: 142px; padding: 0 14px; }
.password-change { grid-template-columns: repeat(2, minmax(300px, 1fr)) !important; }
.session-management { max-width: 1180px; }
.session-item { border-radius: 3px; }
.session-current {
  padding: 1px 5px;
  border-radius: 2px;
  background: #def0e6;
  color: var(--success);
}
.user-admin,
.user-wrap,
.audit-wrap,
.backup-wrap {
  max-width: 1180px;
}
.user-admin { margin: 0 0 14px; }
.user-admin-head { margin-bottom: 8px; }
.user-admin-head h3 { margin: 0 0 3px; color: #214849; font-size: 16px; }
.user-admin-head p { margin: 0; color: var(--muted); }
.user-wrap,
.audit-wrap,
.backup-wrap {
  margin-left: 0;
  margin-right: 0;
  border-radius: 3px;
  box-shadow: var(--shadow-sm);
}
.user-admin-form {
  grid-template-columns: minmax(130px, 1fr) minmax(120px, 1fr) minmax(150px, 1fr) 120px 104px;
  padding: 10px;
  border: 1px solid #ccd7db;
  border-radius: 3px;
  background: #f5f8f9;
}
.admin-note { color: #64747b; }
.statement-scope-note {
  margin: -2px 0 12px;
  padding: 8px 10px;
  border-left: 3px solid #168697;
  background: #f3fafb;
  line-height: 1.6;
}
.accounting-close-panel {
  max-width: 1180px;
  margin: 0 0 14px;
  border: 1px solid #b9cbd2;
  background: #fff;
}
.accounting-close-panel > header {
  min-height: 54px;
  padding: 9px 12px;
  border-bottom: 1px solid #d5e0e4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #f6f9fa;
}
.accounting-close-panel h3,
.accounting-close-panel h4,
.accounting-close-panel p { margin: 0; }
.accounting-close-panel header p {
  margin-top: 3px;
  color: #61727a;
  font-size: 12px;
}
.accounting-close-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex-wrap: wrap;
}
.accounting-close-controls input { min-height: 32px; }
.accounting-close-status {
  min-width: 260px;
  color: #52666f;
  font-size: 12px;
}
.accounting-close-status[data-tone="closed"] { color: #176642; }
.accounting-close-status[data-tone="blocker"] { color: #9f281f; }
.accounting-close-status[data-tone="warning"] { color: #85540b; }
.accounting-close-status[data-tone="healthy"] { color: #176642; }
.accounting-close-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-bottom: 1px solid #d5e0e4;
}
.accounting-close-card {
  min-height: 86px;
  padding: 11px 12px;
  border-right: 1px solid #d5e0e4;
  display: grid;
  align-content: center;
  gap: 4px;
}
.accounting-close-card:last-child { border-right: 0; }
.accounting-close-card span,
.accounting-close-card small { color: #62757d; }
.accounting-close-card strong {
  color: #175d67;
  font-size: 20px;
  font-variant-numeric: tabular-nums;
}
.accounting-close-card.healthy {
  border-left: 3px solid #25805c;
  background: #f6fbf8;
}
.accounting-close-card.blocker {
  border-left: 3px solid #b83c2f;
  background: #fff7f5;
}
.accounting-close-card.blocker strong { color: #9f281f; }
.accounting-close-findings { border-bottom: 1px solid #d5e0e4; }
.accounting-close-findings-head {
  min-height: 40px;
  padding: 9px 12px;
  display: flex;
  align-items: baseline;
  gap: 10px;
  background: #f4f7f8;
}
.accounting-close-findings-head span,
.accounting-close-finding small,
.accounting-close-empty span { color: #62757d; }
.accounting-close-finding {
  min-height: 44px;
  padding: 8px 12px;
  border-top: 1px solid #e1e7e9;
  border-left: 4px solid #7f969f;
  display: grid;
  grid-template-columns: 58px minmax(180px, 1fr) minmax(120px, auto);
  align-items: center;
  gap: 10px;
}
.accounting-close-finding.blocker { border-left-color: #b83c2f; background: #fff9f7; }
.accounting-close-finding.warning { border-left-color: #b57612; background: #fffcf3; }
.accounting-close-finding.info { border-left-color: #24768d; }
.accounting-close-finding b { overflow-wrap: anywhere; }
.accounting-close-finding small { text-align: right; }
.accounting-close-empty {
  min-height: 54px;
  padding: 10px 12px;
  border-top: 1px solid #e1e7e9;
  border-left: 4px solid #25805c;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f6fbf8;
}
.accounting-close-history h4 { padding: 10px 12px 7px; }
.accounting-close-table-wrap { overflow-x: auto; }
.accounting-close-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.accounting-close-table th,
.accounting-close-table td {
  padding: 8px 10px;
  border-top: 1px solid #dbe3e6;
  text-align: left;
  vertical-align: middle;
}
.accounting-close-table th { color: #244f60; background: #e8eff2; }
.accounting-close-state {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid #b8c8ce;
  background: #f7fafb;
  color: #53676f;
  white-space: nowrap;
}
.accounting-close-state.closed { border-color: #9dc8b3; color: #176642; background: #f1faf5; }
.accounting-close-state.reopened { border-color: #d7bd84; color: #85540b; background: #fffbef; }
.accounting-close-confirm { display: grid; gap: 7px; line-height: 1.6; }
.accounting-close-confirm span { color: #61727a; }
.runtime-monitor {
  max-width: 1180px;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid #ccd7db;
  border-radius: 3px;
  background: #f8fafb;
}

.data-quality {
  margin: 14px 0;
  border: 1px solid #b9cbd2;
  background: #fff;
}
.data-quality > header {
  min-height: 48px;
  padding: 8px 12px;
  border-bottom: 1px solid #d5e0e4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.data-quality h3, .data-quality h4, .data-quality p { margin: 0; }
.data-quality header p { color: #61727a; font-size: 12px; }
.data-quality-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  border-bottom: 1px solid #d5e0e4;
}
.data-quality-card {
  min-height: 82px;
  padding: 12px;
  border-right: 1px solid #d5e0e4;
  display: grid;
  gap: 4px;
}
.data-quality-card:last-child { border-right: 0; }
.data-quality-card strong { font-size: 22px; color: #087f8c; }
.data-quality-card.attention strong { color: #a64b21; }
.data-quality-card small, .data-quality-actions span, .data-quality-unresolved small { color: #62757d; }
.data-governance-evidence-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid #d5e0e4;
  background: #f7fafb;
}
.governance-evidence-metric {
  min-width: 0;
  min-height: 66px;
  padding: 9px 12px;
  border: 0;
  border-right: 1px solid #d5e0e4;
  border-left: 3px solid #8ca0a8;
  border-radius: 0;
  background: transparent;
  color: #284c59;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-content: center;
  gap: 3px 8px;
  text-align: left;
}
.governance-evidence-metric:last-child { border-right: 0; }
.governance-evidence-metric strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.governance-evidence-metric small { grid-column: 1 / -1; color: #62757d; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.governance-evidence-metric.complete { border-left-color: #2b8a62; }
.governance-evidence-metric.partial { border-left-color: #b5791b; }
.governance-evidence-metric.missing { border-left-color: #b54a37; }
.governance-evidence-metric:hover, .governance-evidence-metric:focus-visible { background: #eaf3f5; }
.data-quality-actions { padding: 10px 12px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid #d5e0e4; }
.data-governance-toolbar {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  min-height: 54px;
  padding: 8px 12px;
  border-bottom: 1px solid #d5e0e4;
  background: #f7fafb;
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(500px, auto) auto auto;
  align-items: center;
  gap: 10px;
}
.data-governance-toolbar > * { min-width: 0; max-width: 100%; box-sizing: border-box; }
.data-governance-search { position: relative; min-width: 0; }
.data-governance-search input { width: 100%; max-width: 100%; min-width: 0; height: 34px; padding-right: 34px; box-sizing: border-box; }
.data-governance-search button {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 28px;
  height: 28px;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #526a73;
  font-size: 20px;
  line-height: 28px;
}
.data-governance-filters { min-width: 0; max-width: 100%; display: flex; align-items: center; border: 1px solid #b9c9cf; background: #fff; overflow: hidden; }
.data-governance-filters button {
  min-width: 0;
  min-height: 32px;
  padding: 5px 9px;
  border: 0;
  border-right: 1px solid #cfdbdf;
  background: transparent;
  color: #365560;
  white-space: nowrap;
}
.data-governance-filters button:last-child { border-right: 0; }
.data-governance-filters button.active { background: #176f7c; color: #fff; }
.data-governance-filters button span { margin-left: 2px; font-variant-numeric: tabular-nums; }
.config-panel .data-governance-evidence-filter {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 6px;
  margin: 0;
  overflow: hidden;
  white-space: nowrap;
  color: #405d67;
}
.config-panel .data-governance-evidence-filter input {
  width: 16px;
  min-width: 16px;
  max-width: 16px;
  height: 16px;
  min-height: 16px;
  padding: 0;
  margin: 0;
  flex: 0 0 16px;
}
#dataGovernanceVisibleCount { min-width: 72px; text-align: right; color: #526a73; font-variant-numeric: tabular-nums; }
.data-governance-batch-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding-top: 1px;
}
.data-governance-batch-actions button { min-width: 118px; }
.data-quality-detail { padding: 12px; }
.data-quality-detail h4 { margin: 0 0 8px; }
.data-quality-detail ol { margin: 8px 0 0 22px; padding: 0; columns: 2; column-gap: 32px; }
.data-quality-unresolved { display: grid; grid-template-columns: repeat(6, minmax(120px, 1fr)); gap: 1px; background: #d5e0e4; margin-bottom: 14px; }
.data-quality-unresolved span { background: #f8fafb; padding: 9px; display: grid; gap: 3px; }
.data-governance-section { margin: 16px -12px -12px; border-top: 1px solid #d5e0e4; }
.data-governance-section h4 { min-height: 40px; padding: 10px 12px; display: flex; align-items: baseline; gap: 10px; background: #f4f7f8; }
.data-governance-section h4 small { color: #62757d; font-weight: 400; }
.data-governance-table-wrap { overflow-x: auto; }
.data-governance-table { width: 100%; min-width: 760px; border-collapse: collapse; table-layout: fixed; }
.data-governance-table th, .data-governance-table td { padding: 8px 10px; border-top: 1px solid #dbe3e6; border-right: 1px solid #e5eaec; text-align: left; vertical-align: middle; }
.data-governance-table th { position: sticky; top: 0; z-index: 1; background: #e8eff2; color: #244f60; font-weight: 600; }
.data-governance-table th.num, .data-governance-table td.num { text-align: right; }
.data-governance-table td b, .data-governance-table td small { display: block; }
.data-governance-table td small { margin-top: 2px; color: #62757d; }
.data-governance-table button { min-height: 30px; }
.data-governance-row:hover td { background: #f4fafb; }
.governance-row-select { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; cursor: pointer; }
.governance-row-select input { width: 16px; height: 16px; min-width: 16px; margin: 0; accent-color: #176f7c; }
.governance-row-select span { min-width: 0; }
.governance-batch-list { max-height: min(58vh, 610px); overflow: auto; border: 1px solid #c9d6db; background: #eef4f6; }
.governance-batch-item { display: grid; grid-template-columns: minmax(220px, 1.2fr) minmax(170px, .8fr) minmax(250px, 1fr); gap: 10px; padding: 10px 12px; border-bottom: 1px solid #d5e0e4; background: #fff; }
.governance-batch-item:last-child { border-bottom: 0; }
.governance-batch-item header { min-width: 0; display: grid; align-content: center; gap: 3px; }
.governance-batch-item header b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #244f60; }
.governance-batch-item header span { color: #62757d; font-size: 12px; }
.governance-batch-item label { min-width: 0; display: grid; align-content: center; gap: 4px; color: #49646e; font-size: 12px; }
.governance-batch-item input, .governance-batch-item select { width: 100%; min-width: 0; height: 34px; box-sizing: border-box; }
.governance-batch-reason { margin-top: 12px; }
.governance-status { display: inline-block; padding: 2px 6px; border: 1px solid #b9c9cf; background: #f7fafb; color: #3d5963; font-size: 12px; }
.governance-status.safe { border-color: #9abfb2; background: #edf8f4; color: #17624c; }
.governance-status.blocked { border-color: #d6b5ad; background: #fff4f1; color: #8c392b; }
.governance-empty { padding: 12px; color: #61727a; }
.governance-no-matches { margin: 12px 0 0; border: 1px solid #d4dfe3; background: #f8fafb; }
.governance-warning { display: grid; gap: 5px; margin: -14px -14px 14px; padding: 12px 14px; border-bottom: 1px solid #d8c270; background: #fff8df; color: #5d4810; }
.governance-warning b { color: #8d3a21; font-size: 16px; }
.governance-evidence { margin: -4px 0 14px; padding: 10px 12px; border: 1px solid #cbd8dd; background: #f6fafb; color: #365a67; line-height: 1.65; }
.governance-evidence > b { display: block; margin-bottom: 4px; color: #244f60; }
.governance-evidence-line { display: block; min-width: 0; }
.governance-evidence-button { min-height: 24px !important; margin-left: 6px; padding: 1px 7px; border-color: #8caeb8; background: #fff; color: #176f7c; font-size: 12px; white-space: nowrap; }
.governance-evidence-button:hover { border-color: #176f7c; background: #edf7f8; }

@media (max-width: 900px) {
  .accounting-close-panel > header { align-items: stretch; flex-direction: column; }
  .accounting-close-controls { display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; }
  .accounting-close-controls input,
  .accounting-close-controls button { width: 100%; }
  .accounting-close-status { min-width: 0; }
  .accounting-close-summary { grid-template-columns: 1fr 1fr; }
  .accounting-close-card { min-height: 76px; border-bottom: 1px solid #d5e0e4; }
  .accounting-close-finding { grid-template-columns: 52px minmax(0, 1fr); }
  .accounting-close-finding small { grid-column: 2; text-align: left; }
  .data-quality-summary { grid-template-columns: 1fr; }
  .data-quality-card { border-right: 0; border-bottom: 1px solid #d5e0e4; }
  .data-governance-evidence-summary { grid-template-columns: 1fr 1fr; }
  .governance-evidence-metric:nth-child(2) { border-right: 0; }
  .governance-evidence-metric:nth-child(-n+2) { border-bottom: 1px solid #d5e0e4; }
  .data-quality-unresolved { grid-template-columns: 1fr 1fr; }
  .data-quality-detail ol { columns: 1; }
  .data-governance-toolbar { grid-template-columns: minmax(0, 1fr) auto; overflow: hidden; }
  .data-governance-search, .data-governance-filters { grid-column: 1 / -1; }
  .data-governance-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .data-governance-filters button {
    width: 100%;
    padding: 5px 3px;
    border-bottom: 1px solid #cfdbdf;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .data-governance-evidence-filter { min-width: 0; white-space: normal; }
  .data-governance-batch-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .data-governance-batch-actions button { width: 100%; min-width: 0; }
  #exportDataGovernanceButton { grid-column: 1 / -1; }
  .data-governance-filters button:nth-last-child(-n+3) { border-bottom: 0; }
  #dataGovernanceVisibleCount { align-self: center; }
  .data-governance-section h4 { align-items: flex-start; flex-direction: column; gap: 3px; }
  .governance-batch-item { grid-template-columns: 1fr; }
  .governance-batch-item header b { white-space: normal; }
}
.runtime-monitor > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.runtime-monitor h3, .runtime-monitor h4, .runtime-monitor p { margin: 0; }
.runtime-monitor p { color: #6b7b82; font-size: 12px; }
.go-live-readiness { display: grid; grid-template-columns: minmax(190px, .55fr) minmax(260px, 1fr) auto; align-items: center; gap: 14px; margin-bottom: 10px; padding: 11px 13px; border: 1px solid #d3dde1; background: #fff; }
.go-live-readiness > div { display: grid; gap: 2px; }
.go-live-readiness span, .go-live-readiness small { color: #60737b; }
.go-live-readiness strong { font-size: 16px; }
.go-live-readiness p { line-height: 1.55; }
.go-live-readiness.healthy { border-left: 4px solid #1c8a5b; background: #f5fbf8; }
.go-live-readiness.attention { border-left: 4px solid #bd7514; background: #fffbf3; }
.go-live-readiness.critical { border-left: 4px solid #b83328; background: #fff7f5; }
.go-live-readiness.critical strong { color: #9f281f; }
.runtime-monitor-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.runtime-card { display: grid; gap: 3px; min-height: 78px; padding: 10px; border: 1px solid #d3dde1; background: #fff; }
.runtime-card span, .runtime-card small { color: #60737b; }
.runtime-card strong { font-size: 18px; }
.runtime-card.healthy { border-left: 3px solid #1c8a5b; }
.runtime-card.attention { border-left: 3px solid #c84b31; }
.runtime-card.critical { border-color: #b83328; border-left: 4px solid #b83328; background: #fff7f5; }
.runtime-card.critical strong { color: #9f281f; }
.alert-delivery-proof {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  padding: 8px 10px;
  border-left: 3px solid #9aa9af;
  background: #f3f6f7;
  color: #4d626b;
  font-size: 13px;
}
.alert-delivery-proof[data-state="verified"] { border-left-color: #1c8a5b; background: #edf8f2; color: #176d49; }
.alert-delivery-proof[data-state="failed"] { border-left-color: #b83328; background: #fff3f1; color: #9f281f; }
.alert-delivery-proof[data-state="untested"] { border-left-color: #c08020; background: #fff8e9; color: #77530f; }
.webhook-address-field { grid-column: 1 / -1; }
.inline-input-action { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.inline-input-action input { min-width: 0; width: 100%; }
.inline-input-action button { min-width: 88px; white-space: nowrap; }
.webhook-address-field small { display: block; margin-top: 5px; color: #607077; line-height: 1.45; }
.runtime-alerts { margin-top: 12px; }
.runtime-alert-row { display: grid; grid-template-columns: 160px minmax(0, 1fr) 80px; gap: 8px; padding: 7px 4px; border-bottom: 1px solid #e0e7ea; }
.runtime-alert-row time, .runtime-alert-row span { color: #687a82; }
.runtime-diagnostics { margin-top: 14px; padding-top: 12px; border-top: 1px solid #d5e0e4; }
.runtime-diagnostics > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.runtime-diagnostics > header div { min-width: 0; }
.runtime-diagnostics > header p { margin-top: 3px; }
.runtime-diagnostic-row { display: grid; grid-template-columns: 142px 190px minmax(180px, 1fr) 76px minmax(160px, 1.2fr); gap: 8px; align-items: center; min-height: 36px; padding: 6px 4px; border-bottom: 1px solid #e0e7ea; }
.runtime-diagnostic-row time, .runtime-diagnostic-row code, .runtime-diagnostic-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.runtime-diagnostic-row time, .runtime-diagnostic-row small { color: #687a82; }
.runtime-diagnostic-row code { color: #24566c; font-size: 12px; }
.runtime-diagnostic-row span { font-weight: 700; }
.runtime-diagnostic-row span.critical { color: #9f281f; }
.runtime-diagnostic-row span.attention { color: #9a5a13; }
.runtime-diagnostic-row span.slow { color: #246a83; }
.runtime-diagnostic-empty { margin: 0; padding: 10px 4px; color: #687a82; }

.statusbar {
  border-top-color: #c0cbcf;
  background: #e8edef;
  color: #3b4c53;
}
.statusbar .ok { color: var(--success); font-weight: 700; }

.toast {
  padding: 10px 14px;
  border-radius: 4px;
  background: #20343b;
  box-shadow: var(--shadow-md);
}
.modal { background: rgba(20, 38, 46, .32); backdrop-filter: blur(1px); }
.query-box,
.column-config-box,
.workflow-box {
  overflow: hidden;
  border-color: #6f8994;
  border-radius: 5px;
  box-shadow: var(--shadow-md);
}
.query-box header,
.column-config-box header,
.workflow-box > header {
  background: #e8f0f3;
  color: #173f4b;
}
.query-box header { height: 38px; }
.query-box header button,
.column-config-box header button,
.workflow-box > header button { color: #385761; }
.query-box fieldset {
  border-color: #c4d0d5;
  border-radius: 4px;
  background: #fafcfc;
}
.workflow-body { background: #fff; }
.workflow-table th { background: #e2eaed; color: #244f60; font-weight: 700; }
.workflow-box > footer,
.column-config-box footer { background: #f5f8f9; }

.print-panel {
  width: 176px;
  padding: 10px;
  border-color: #9cabb2;
  border-radius: 4px;
  background: #fff;
  box-shadow: var(--shadow-md);
}
.print-panel button,
.print-panel select { width: 154px; }
.print-panel button {
  border-color: #aab8be;
  border-radius: 3px;
  background: #f3f6f7;
}
.print-panel button:hover { background: #e3f1f3; color: #075e68; }
.print-preview { grid-template-rows: 48px minmax(0, 1fr); background: #2c3337; }
.print-preview header { border-bottom-color: #bcc7cc; background: #f5f7f8; }
.print-preview header button,
.editor-toolbar button {
  min-height: 30px;
  border-color: #a8b6bc;
  border-radius: 3px;
  background: #fff;
}
.print-preview header button:hover,
.editor-toolbar button:hover { background: #e7f2f4; color: #075e68; }
.preview-stage { padding-top: 22px; background: #343b3f; }
.print-paper { box-shadow: 0 2px 16px rgba(0,0,0,.35); }

.template-editor {
  grid-template-rows: 46px 40px minmax(0, 1fr);
  background: #dfe5e8;
}
.template-editor header,
.editor-toolbar { background: #f4f7f8; }
.template-editor header b { color: #183e49; font-weight: 700; }
.editor-toolbar {
  gap: 6px;
  padding: 5px 10px;
  border-bottom-color: #aebbc1;
}
.template-palette,
.template-properties { background: #f8fafb; }
.template-pane-title {
  background: #e5ecef;
  color: #153f4b;
}
.template-palette-block,
.template-token-buttons button {
  border-color: #adbdc4;
  border-radius: 3px;
}
.template-palette-block:hover,
.template-token-buttons button:hover { border-color: #4c929d; background: #edf7f8; }
.template-workbench { background: #c8d0d4; }
.template-ruler { position: absolute; }
.template-properties summary { background: #eaf0f2; }
.row-context {
  border-color: #92a4ac;
  border-radius: 3px;
  background: #fff;
  box-shadow: var(--shadow-md);
}
.row-context button:hover {
  outline: 0;
  background: #dceff2;
  color: #084f58;
}

@media (max-width: 1350px) {
  .topnav { gap: 12px; }
  .shortcut {
    justify-content: flex-start;
    gap: 14px;
    padding-right: 440px;
  }
  .template-designer { grid-template-columns: 200px minmax(480px, 1fr) 330px; }
  .template-paper-stage .print-paper { zoom: .68; }
}

.row-context {
  position: fixed;
  z-index: 1500;
  width: 240px;
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px);
  overflow-y: auto;
  padding: 4px 0;
  border: 1px solid #9aa7b0;
  background: #fbf7ff;
  box-shadow: 2px 2px 6px rgba(0,0,0,.22);
}
.row-context.hidden { display: none; }
.row-context button.hidden { display: none; }
.smart-picker {
  position: fixed;
  z-index: 1200;
  max-height: 346px;
  overflow-y: auto;
  padding: 5px;
  border: 1px solid #9aafb8;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(24, 48, 58, .24);
}
.smart-picker.hidden { display: none; }
.smart-picker button {
  display: grid;
  width: 100%;
  min-height: 42px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 7px 9px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #173f4b;
  text-align: left;
  cursor: pointer;
}
.smart-picker button:hover,
.smart-picker button[aria-selected="true"] { background: #e2f1f4; }
.smart-picker button b {
  min-width: 0;
  overflow: hidden;
  color: #173f4b;
  font-size: 14px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.smart-picker button small {
  max-width: 180px;
  overflow: hidden;
  color: #54717c;
  font-size: 12px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.row-context button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 26px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: #111;
  font-size: 16px;
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
}
.row-context button:hover {
  background: #d4e8ec;
  outline: 1px solid #6e8aa6;
}
.row-context span {
  margin-left: 16px;
  color: #111;
}
.row-context {
  border-color: #92a4ac;
  border-radius: 3px;
  background: #fff;
  box-shadow: var(--shadow-md);
}
.row-context button { min-height: 30px; color: #1f2a30; font-size: 14px; }
.row-context button:hover {
  outline: 0;
  background: #dceff2;
  color: #084f58;
}
.row-context span { color: #52636b; }
.doc-grid tr.context-row-active > td { background: #dff1f3 !important; }

@media (max-width: 700px) {
  #rowContextMenu {
    width: min(280px, calc(100vw - 16px));
    max-height: min(68vh, 520px);
  }
  #rowContextMenu button { min-height: 42px; padding: 5px 12px; }
}

@media print {
  html,
  body {
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
  }
  body > :not(#printPreviewModal) { display: none !important; }
  #printPreviewModal.print-preview {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
  }
  #printPreviewModal > header { display: none !important; }
  #printPreviewModal .preview-stage {
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
  }
  #printPaper {
    position: static !important;
    left: auto !important;
    top: auto !important;
    box-sizing: border-box !important;
    display: block !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    zoom: 1 !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
  #printPaper .print-sheet {
    box-sizing: border-box;
    width: var(--paper-width, 210mm);
    height: var(--paper-height, 297mm);
    min-height: var(--paper-height, 297mm);
    padding: var(--paper-margin-top, 9mm) var(--paper-margin-right, 9mm) var(--paper-margin-bottom, 8mm) var(--paper-margin-left, 9mm);
    overflow: hidden;
    break-after: page;
    page-break-after: always;
    box-shadow: none;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  #printPaper .paper-layout {
    position: relative !important;
    left: var(--calibration-x, 0) !important;
    top: var(--calibration-y, 0) !important;
    transform: none !important;
    filter: none !important;
  }
  #printPaper[data-print-profile="needle"] .print-sheet,
  #printPaper[data-print-profile="needle"] .print-sheet * {
    font-family: SimSun, "宋体", serif !important;
    font-synthesis: weight !important;
    text-shadow: none !important;
    filter: none !important;
  }
  #printPaper[data-print-profile="needle"] .paper-table,
  #printPaper[data-print-profile="needle"] .paper-meta,
  #printPaper[data-print-profile="needle"] .paper-debt,
  #printPaper[data-print-profile="needle"] .paper-note,
  #printPaper[data-print-profile="needle"] .paper-address,
  #printPaper[data-print-profile="needle"] .paper-sign {
    color: #000 !important;
    font-weight: 600 !important;
    text-rendering: optimizeSpeed;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  #printPaper .print-sheet:last-child { break-after: auto; page-break-after: auto; }
  .paper-overflow { box-shadow: none !important; }
  .paper-overflow::after, .paper-zone-label { display: none !important; }
}

@media (max-width: 900px) {
  body { font-size: 13px; overflow: hidden; }
  input, select, button { min-height: 34px; }
  .dropdown-menu {
    left: 6px !important;
    right: 6px;
    width: auto;
    max-height: calc(100vh - 12px);
    overflow-y: auto;
  }
  .dropdown-menu .menu-item:focus-within > .submenu {
    display: block;
  }
  .dropdown-menu .submenu {
    position: static;
    width: auto;
    margin: 2px 6px 4px 28px;
    box-shadow: none;
  }
  .login-gate { grid-template-columns: 1fr; grid-template-rows: 128px 1fr 44px; }
  .login-hero { grid-column: 1; padding: 18px; align-items: center; }
  .login-brand { font-size: 24px; }
  .login-hero p { display: none; }
  .login-card {
    grid-column: 1;
    align-self: start;
    width: calc(100% - 36px);
    min-width: 0;
    min-height: auto;
    margin: 18px;
    padding: 18px;
    border: 1px solid #c8d1d6;
  }
  .login-card label { grid-template-columns: 60px minmax(0, 1fr); }
  .login-card input { width: 100%; min-width: 0; }
  .login-tabs button { font-size: 18px; }
  #loginSubmit { height: 48px; font-size: 22px; }
  .desktop { min-width: 0; height: 100dvh; grid-template-rows: auto 32px minmax(0, 1fr) 24px; }
  .topbar {
    grid-template-columns: 1fr;
    grid-template-rows: 46px 42px 34px;
    min-height: 0;
  }
  .brand { grid-row: auto; padding: 8px 14px 0; font-size: 23px; align-items: center; }
  .topnav, .shortcut {
    grid-column: auto;
    overflow-x: auto;
    padding: 4px 10px;
    justify-content: flex-start;
    gap: 12px;
    scrollbar-width: thin;
    min-height: 0;
  }
  .topnav button, .shortcut button { min-height: 28px; }
  .shortcut { display: none; }
  .auth-status {
    position: static;
    min-width: 0;
    padding: 2px 8px 4px;
    justify-content: flex-end;
    flex-wrap: nowrap;
  }
  .auth-status #currentUserLabel {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .auth-status button { min-width: 72px; height: 28px; min-height: 28px; }
  .window-tools { display: none; }
  .tabbar { overflow-x: auto; white-space: nowrap; }
  .tab { min-width: 88px; }
  .workarea { grid-template-columns: 1fr; grid-template-rows: 54px minmax(0, 1fr); min-height: 0; }
  .workarea:has(.settings-view.active) {
    grid-template-columns: 1fr;
    grid-template-rows: 54px minmax(0, 1fr);
  }
  .rightbar { display: none; }
  .side { display: flex; overflow-x: auto; width: 100%; height: 54px; }
  .side button { min-width: 68px; height: 54px; font-size: 12px; border-right: 1px solid rgba(255,255,255,.18); }
  .side button span { font-size: 18px; }
  .content { min-width: 0; grid-template-rows: auto minmax(0, 1fr); overflow: auto; }
  .toolbar { display: grid; gap: 8px; height: auto; padding: 8px; }
  .search { grid-template-columns: 1fr 56px 56px; }
  #documentsView { padding: 8px; }
  #documentsView .grid-head {
    justify-content: flex-start;
    gap: 6px;
    height: auto;
    min-height: 42px;
    overflow-x: auto;
    padding: 0 0 6px;
    scrollbar-width: thin;
  }
  #documentsView .grid-head > * { flex: 0 0 auto; }
  #documentsView .grid-head button { min-width: 78px; padding: 4px 9px; }
  #documentsView .table-wrap { max-height: none; }
  .module-cards { grid-template-columns: repeat(2, minmax(96px, 1fr)); gap: 18px; padding: 28px 18px; }
  .module-card { justify-self: center; }
  .document-form { display: block; height: auto; min-height: 100%; padding-bottom: 82px; }
  .doc-head { display: grid; gap: 8px; padding: 12px; }
  .doc-head h1 { font-size: 26px; margin: 0; }
  .doc-meta, .doc-fields, .doc-bottom, .arap-head, .arap-body { display: block; }
  .doc-fields { padding: 0 12px 10px; }
  .doc-fields label, .doc-meta label, .doc-bottom label { display: grid; grid-template-columns: 76px 1fr; margin-bottom: 8px; }
  .doc-grid-wrap, .finance-grid-wrap { max-height: 46vh; overflow: auto; }
  .doc-grid { min-width: 1180px; }
  .finance-grid { min-width: 680px; }
  .doc-grid input, .doc-grid select { min-height: 36px; font-size: 14px; }
  .doc-bottom { padding: 10px 12px; }
  .mobile-qty-stepper.active { display: grid; grid-template-columns: repeat(2, 56px) minmax(72px, 1fr) repeat(2, 56px); gap: 6px; margin: 8px 0 12px; }
  .mobile-qty-stepper button { height: 44px; min-height: 44px; border-color: #8ba6b1; background: #fff; color: #075c70; font-weight: 700; font-variant-numeric: tabular-nums; }
  .mobile-qty-stepper output { display: grid; place-items: center; min-width: 72px; height: 44px; border: 1px solid #88a8b4; background: #f4fbfc; color: #092f3a; font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
  .doc-actions { position: sticky; bottom: 0; z-index: 5; display: flex; gap: 8px; overflow-x: auto; padding: 8px; background: #fff; border-top: 1px solid var(--line); }
  .doc-actions .primary { min-width: 108px; height: 36px; }
  .line-assist { font-size: 12px; min-height: 34px; }
  .doc-actions button { display: none; }
  .doc-actions button[type="submit"], .doc-actions #postDocumentButton, .doc-actions #shareDocumentButton, .doc-actions #mobileMoreButton { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 0; }
  .doc-actions #mobileMoreButton { flex: 0 0 54px; }
  .arap-head { padding: 12px; }
  .arap-head h1 { font-size: 24px; margin-bottom: 10px; }
  .arap-head label { display: block; margin-bottom: 8px; }
  .arap-body { border-top: 1px solid #999; }
  .tree { display: none; }
  .arap-table table { width: 760px; }
  .view-actions { display: flex; overflow-x: auto; padding: 8px; }
  .view-actions button { min-width: 86px; }
  .workflow-box { width: calc(100vw - 12px); max-height: calc(100vh - 12px); }
  .workflow-body { padding: 8px; }
  .workflow-form { grid-template-columns: 1fr; gap: 8px; }
  .workflow-table { min-width: 760px; }
  .document-version-table { min-width: 980px; }
  .statement-balance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .statement-flow-summary { grid-template-columns: 1fr; }
  .statement-flow-summary section { border-right: 0; border-bottom: 1px solid #d3dde1; }
  .statement-flow-summary section:last-child { border-bottom: 0; }
  .statement-list-filters { align-items: stretch; flex-wrap: nowrap; overflow-x: auto; }
  .statement-list-filters label, .statement-list-filters button { flex: 0 0 auto; }
  .statement-list-filters > span { display: none; }
  .statement-detail-actions { align-items: stretch; flex-wrap: wrap; }
  .statement-detail-actions span { flex: 1 0 100%; }
  .statement-data-notice { grid-template-columns: 1fr; }
  .invoice-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .statement-range-actions { overflow-x: auto; white-space: nowrap; }
  .statement-range-actions > * { flex: 0 0 auto; }
  .statement-range-notice { grid-template-columns: 1fr; }
  .statement-preview-table { max-height: 46vh; }
  .shortage-settings { grid-template-columns: 1fr; }
  .shortage-alert { align-items: flex-start; flex-direction: column; }
  .shortage-table { min-width: 900px; }
  .workflow-box > footer { grid-template-columns: 1fr auto auto; }
  .settings-view { overflow: auto; }
  .config-tabs { overflow-x: auto; }
  .config-panel { padding: 12px; }
  #config-company.active,
  .security-config:not(.session-management),
  .password-change {
    grid-template-columns: 1fr !important;
  }
  #config-company > label,
  .security-config > label {
    grid-template-columns: 116px minmax(0, 1fr);
  }
  .config-panel label, .user-admin-form { min-width: 0; }
  .security-config { margin: 0 0 12px; padding: 12px; }
  .runtime-monitor-grid { grid-template-columns: 1fr; }
  .go-live-readiness { grid-template-columns: 1fr; gap: 7px; }
  .runtime-alert-row { grid-template-columns: 1fr; gap: 2px; }
  .runtime-diagnostics > header { align-items: flex-start; }
  .runtime-diagnostic-row { grid-template-columns: 1fr auto; gap: 3px 8px; padding: 9px 4px; }
  .runtime-diagnostic-row time, .runtime-diagnostic-row code, .runtime-diagnostic-row b, .runtime-diagnostic-row small { grid-column: 1; }
  .runtime-diagnostic-row span { grid-column: 2; grid-row: 1 / span 2; }
  .session-item { grid-template-columns: 1fr; }
  .user-admin-form input, .user-admin-form select, .user-admin-form button { width: 100%; margin-bottom: 8px; }
  .user-wrap, .audit-wrap, .backup-wrap { margin: 0 0 12px; max-width: none; }
  .query-box,
  .column-config-box {
    width: calc(100vw - 12px);
    max-width: none;
    max-height: calc(100dvh - 12px);
  }
  .query-box fieldset { grid-template-columns: 1fr; }
  .template-editor { min-width: 0; }
  .template-designer {
    grid-template-columns: 180px minmax(620px, 1fr) 280px;
    min-width: 1080px;
  }
  .statusbar { grid-template-columns: 90px 1fr 100px; }
  .statusbar span:nth-child(2), .statusbar span:nth-child(3) { display: none; }
}

@media (max-width: 520px) {
  .brand { font-size: 22px; }
  .invoice-detail-grid { grid-template-columns: 1fr; }
  .invoice-detail-actions { align-items: stretch; flex-direction: column; }
  .invoice-detail-actions button { width: 100%; }
  .topnav button, .shortcut button { font-size: 13px; }
  .toolbar b { font-size: 16px; }
  .toolbar span { display: none; }
  .search { grid-template-columns: 1fr 50px 50px; }
  .login-gate { grid-template-rows: 112px minmax(0, 1fr) 36px; }
  .login-hero { padding: 14px 18px; }
  .login-brand { gap: 12px; font-size: 23px; }
  .login-brand span { font-size: 22px; }
  .login-card {
    width: calc(100% - 24px);
    max-width: calc(100vw - 24px);
    justify-self: center;
    margin: 12px 0;
    padding: 14px;
    gap: 13px;
  }
  .login-card label {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  .login-card input,
  #loginSubmit { max-width: 100%; }
  .login-tabs { height: 40px; }
  .login-tabs button { font-size: 19px; }
  #loginSubmit { margin-top: 4px; }
  .login-card footer { justify-content: flex-start; gap: 14px; }
  .doc-fields label, .doc-meta label, .doc-bottom label { grid-template-columns: 68px 1fr; }
  .doc-head h1 { font-size: 24px; }
  .doc-grid-wrap {
    max-height: none;
    overflow: visible;
    border-top: 0;
    border-bottom: 0;
    padding: 0 10px 10px;
  }
  .doc-grid {
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0 8px;
  }
  .doc-grid thead { display: none; }
  .doc-grid tbody { display: block; }
  .doc-grid tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 10px;
    padding: 10px;
    border: 1px solid #c4d3d9;
    border-left: 3px solid var(--teal);
    background: #fff;
    box-shadow: 0 1px 2px rgba(8, 57, 69, .08);
  }
  .doc-grid tr.mobile-empty-line { display: none; }
  .doc-grid td {
    display: grid;
    min-width: 0;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    min-height: 36px;
    padding: 0;
    border: 0;
  }
  .doc-grid td::before { content: attr(data-mobile-label); color: #5f7782; font-size: 12px; }
  .doc-grid td:first-child { display: flex; grid-column: 1 / -1; justify-content: space-between; min-height: 30px; color: var(--teal-dark); font-weight: 700; }
  .doc-grid td:first-child::before { content: "明细行"; }
  .mobile-line-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid #c38a8a;
    background: #fff;
    color: #8a3434;
    font-size: 12px;
  }
  .doc-grid td:nth-child(2), .doc-grid td:nth-child(3) { grid-column: auto; }
  .doc-grid td:nth-child(2)::before, .doc-grid td:nth-child(3)::before { font-weight: 700; }
  .doc-grid td input, .doc-grid td select { width: 100%; min-width: 0; height: 36px; border: 1px solid #b9cbd1; background: #fff; }
  .doc-grid td input[readonly] { background: #f4f7f8; }
  .print-preview, .template-editor { inset: 0; }
  .template-editor header, .editor-toolbar { overflow-x: auto; }
  .template-grid { grid-template-columns: 1fr; }
  #config-company > label,
  .security-config > label {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  .statusbar { grid-template-columns: 1fr 1fr; }
  .statusbar span:nth-child(4) { display: none; }
  .statusbar span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.statement-source-link {
  color: #075f73;
  cursor: pointer;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.statement-source-link:hover { color: #00424f; }

/* Commercial usability pass v91 */
:root {
  --teal: #0b747c;
  --teal-dark: #075b62;
  --blue: #166b9a;
  --blue-dark: #0f557c;
  --amber: #b77618;
  --success: #28764d;
  --danger: #b23c3c;
  --ink: #18272d;
  --muted: #5d6f77;
  --line: #d2dce0;
  --line-dark: #a5b3b9;
  --canvas: #f3f5f6;
  --focus-ring: #1684ac;
}

@media screen {
  body { color: var(--ink); background: var(--canvas); }
  button { font-weight: 500; }
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
  }

  .login-gate {
    grid-template-rows: 132px minmax(0, 1fr) 64px;
    grid-template-columns: minmax(24px, 1fr) minmax(420px, 500px) minmax(24px, 1fr);
    background: #eef4f5;
  }
  .login-hero {
    justify-content: center;
    gap: 24px;
    padding: 0 24px;
    background: #0b747c;
    box-shadow: inset 0 -1px rgba(0, 0, 0, .14);
  }
  .login-brand { gap: 20px; font-size: 28px; }
  .login-brand span { font-size: 20px; font-weight: 600; }
  .login-hero p { font-size: 16px; font-weight: 500; opacity: .9; }
  .login-card {
    gap: 16px;
    min-height: 0;
    padding: 24px 44px 22px;
    border-color: #bdcbd0;
    border-radius: 6px;
    box-shadow: 0 14px 38px rgba(22, 48, 57, .16);
  }
  .login-tabs button { font-size: 20px; }
  .login-tabs button.active { color: var(--blue); font-weight: 700; }
  .login-card input {
    height: 42px;
    border: 1px solid #b9c8ce;
    border-radius: 3px;
    background: #fff;
    font-size: 16px;
  }
  #loginSubmit { height: 48px; margin-top: 4px; font-size: 21px; }

  .desktop {
    min-width: 1024px;
    grid-template-rows: 88px 35px minmax(0, 1fr) 25px;
  }
  .topbar {
    grid-template-columns: 196px minmax(0, 1fr) auto;
    grid-template-rows: 52px 36px;
    min-height: 88px;
    background: #0b747c;
    border-bottom-color: #07565d;
  }
  .brand {
    grid-column: 1;
    grid-row: 1 / 3;
    align-items: center;
    padding: 0 18px;
    font-size: 24px;
    white-space: nowrap;
  }
  .topnav {
    grid-column: 2;
    grid-row: 1;
    align-items: center;
    gap: 4px;
    padding: 7px 6px 5px;
  }
  .topnav button,
  .shortcut button {
    min-height: 34px;
    padding: 5px 9px;
    border-radius: 3px;
    font-size: 14px;
  }
  .topnav button::before { color: rgba(255, 255, 255, .76); }
  .topnav button.active,
  .shortcut button.active {
    background: rgba(255, 255, 255, .16);
    box-shadow: inset 0 -2px #fff;
  }
  .shortcut {
    grid-column: 2 / 4;
    grid-row: 2;
    justify-content: flex-end;
    gap: 3px;
    min-width: 0;
    padding: 0 12px 3px;
  }
  .shortcut button { min-height: 30px; font-size: 13px; }
  .auth-status {
    position: static;
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
    max-width: 440px;
    padding: 8px 12px 6px 4px;
    gap: 6px;
    white-space: nowrap;
  }
  .auth-status #currentUserLabel {
    min-width: 0;
    max-width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .auth-status button { height: 30px; min-height: 30px; }
  .window-tools { display: none; }

  .tabbar { min-width: 0; padding-left: 4px; background: #e1eaed; }
  .tab {
    height: 34px;
    min-width: 92px;
    padding: 0 10px;
    border-radius: 2px 2px 0 0;
  }
  .tab.active { border-top: 3px solid var(--teal); }
  .tab .close-tab { margin-left: 8px; }

  .workarea { grid-template-columns: 82px minmax(0, 1fr) 212px; }
  .side { background: #126d75; }
  .side button { height: 64px; padding: 5px 2px; }
  .side button.active {
    color: var(--teal-dark);
    background: #fff;
    box-shadow: inset 4px 0 #d18a22;
  }
  .side span { font-size: 20px; line-height: 21px; }
  .side b { margin-top: 3px; font-size: 13px; }

  .content { grid-template-rows: 48px minmax(0, 1fr); }
  .toolbar { padding: 0 12px 0 14px; background: #f8fafb; }
  .toolbar > div:first-child {
    display: flex;
    min-width: 0;
    align-items: baseline;
  }
  .toolbar b { flex: 0 0 auto; font-size: 16px; }
  .toolbar span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .search { grid-template-columns: minmax(210px, 290px) 60px 60px; }
  .search input {
    height: 32px;
    border: 1px solid #adbec5;
    background: #fff;
  }

  .primary,
  .secondary,
  .ghost,
  .view-actions button,
  .settings-actions button,
  .query-box footer button,
  .workflow-box > footer button,
  .column-config-box footer button,
  .decision-box footer button {
    min-height: 32px;
    padding: 4px 13px;
    border-radius: 3px;
    box-shadow: none;
  }
  .primary {
    border: 1px solid var(--blue-dark);
    background: var(--blue);
    color: #fff;
  }
  .primary:hover { background: var(--blue-dark); }
  .secondary,
  .query-box footer .secondary,
  .decision-box footer .secondary {
    border: 1px solid #9dafb7;
    background: #fff;
    color: #2e4a56;
  }
  .secondary:hover,
  .query-box footer .secondary:hover,
  .decision-box footer .secondary:hover { border-color: #658691; background: #edf4f6; color: #173f4a; }
  .ghost {
    border: 1px solid transparent;
    background: transparent;
    color: #3f5862;
  }
  .ghost:hover { border-color: #b8c6cc; background: #eef3f5; }
  .primary.danger {
    border-color: #963434;
    background: #fff;
    color: #9a3030;
  }
  .primary.danger:hover { background: #a93737; color: #fff; }

  .view { padding: 12px; }
  #homeView { background: #f7f9fa; }
  .module-cards {
    grid-template-columns: repeat(auto-fit, minmax(148px, 176px));
    align-content: start;
    justify-content: start;
    gap: 12px;
    padding: 20px;
  }
  .module-card {
    width: 100%;
    height: 88px;
    grid-template-columns: 42px minmax(0, 1fr);
    justify-content: stretch;
    gap: 10px;
    padding: 12px;
    border-color: #b5c6cc;
    border-radius: 5px;
    background: #fff;
    color: #26434d;
    text-align: left;
  }
  .module-card span { margin: 0; font-size: 28px; text-align: center; }
  .module-card b { font-size: 15px; }
  .module-card:hover,
  .module-card.active {
    border-color: #6d9fa6;
    background: #f0f8f9;
    box-shadow: 0 4px 12px rgba(24, 70, 79, .12);
  }

  .rightbar { padding-top: 8px; background: #fbfcfc; }
  .rightbar h3 { margin: 0; padding: 7px 14px 12px; font-size: 15px; }
  .rightbar button { min-height: 38px; padding: 0 14px; }

  .grid-head { align-items: center; gap: 6px; }
  .grid-head > span:first-child {
    margin-right: 4px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
  .table-wrap { background: #fff; }
  th { height: 34px; background: #e5ecef; }
  td { height: 34px; }
  td.num,
  th.num { font-variant-numeric: tabular-nums; }

  .document-view { padding: 10px; }
  .document-form { border-color: #bdcbd0; border-radius: 4px; }
  .doc-head { min-height: 56px; padding: 9px 16px; }
  .doc-head h1 { font-size: 25px; }
  .doc-meta { gap: 26px; }
  .doc-fields {
    gap: 7px 24px;
    padding: 10px 16px 13px;
    border-bottom: 1px solid #d7e0e3;
    background: #fbfcfc;
  }
  .doc-fields input,
  .doc-fields select,
  .doc-meta input,
  .doc-meta select,
  .doc-bottom input {
    border-bottom-color: #aab9c0;
  }
  .doc-grid th { height: 35px; background: #dfe8ec; }
  .doc-grid td { height: 36px; }
  .doc-grid tbody tr:focus-within td { background: #fffbea; }
  .doc-grid input,
  .doc-grid select { padding: 4px 6px; }
  .line-assist {
    min-height: 32px;
    padding: 6px 10px;
    border-left: 3px solid #5a9ca6;
    background: #f0f8f9;
    color: #355760;
  }
  .doc-bottom { min-height: 72px; padding: 8px 8px 7px; }
  .doc-total b { font-variant-numeric: tabular-nums; }
  .doc-actions {
    min-height: 54px;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-top-color: #cbd6da;
    background: #f7f9fa;
  }
  .doc-actions button { height: 34px; min-width: 92px; }
  .doc-actions #newDocumentButton,
  .doc-actions .legacy-copy-button { margin-right: auto; }
  .doc-actions #postDocumentButton { min-width: 116px; font-weight: 700; }
  .doc-actions [data-open="home"] { border-color: transparent; }

  .statusbar {
    min-height: 25px;
    padding: 0 8px;
    background: #e9eef0;
    color: #40535b;
  }

  .modal { background: rgba(15, 34, 42, .38); backdrop-filter: blur(2px); }
  .query-box,
  .column-config-box,
  .workflow-box,
  .decision-box {
    overflow: hidden;
    border: 1px solid #708994;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 18px 52px rgba(16, 39, 49, .24);
  }
  .query-box { width: min(680px, calc(100vw - 24px)); height: auto; max-height: calc(100vh - 24px); }
  .query-box header,
  .column-config-box header,
  .workflow-box > header,
  .decision-box > header {
    background: #e8f0f2;
    color: #173f49;
  }
  .query-box fieldset { margin: 18px 24px 0; padding: 20px; gap: 20px 28px; }
  .query-box label { font-size: 14px; }
  .query-box footer { padding: 20px 24px 22px; }

  .decision-box {
    width: min(520px, calc(100vw - 24px));
    display: grid;
    grid-template-rows: 44px auto 58px;
  }
  #decisionModal { z-index: 1300; }
  .decision-box > header {
    display: grid;
    grid-template-columns: 1fr 44px;
    align-items: center;
    padding-left: 15px;
    border-bottom: 1px solid #cbd7db;
  }
  .decision-box > header button {
    height: 42px;
    border: 0;
    background: transparent;
    color: #39535d;
    font-size: 22px;
  }
  .decision-body { display: grid; gap: 16px; padding: 20px 22px; }
  .decision-body p { margin: 0; color: #263b43; line-height: 1.7; }
  .decision-reason { display: grid; gap: 7px; color: #334f5a; }
  .decision-reason textarea {
    width: 100%;
    min-height: 78px;
    resize: vertical;
    padding: 9px 10px;
    border: 1px solid #9fb2ba;
    border-radius: 3px;
    color: var(--ink);
    background: #fff;
    font: inherit;
  }
  .decision-reason small { color: var(--muted); }
  .decision-box > footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 14px;
    border-top: 1px solid #d5dfe2;
    background: #f7f9fa;
  }
  .decision-box > footer button { min-width: 92px; }

  .smart-picker {
    border-color: #9db0b8;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(21, 47, 57, .2);
  }
  .smart-picker button { border-bottom-color: #e1e7ea; }
  .smart-picker button[aria-selected="true"] { box-shadow: inset 3px 0 var(--teal); }

  .toast {
    z-index: 1400;
    left: 50%;
    bottom: 42px;
    min-width: 260px;
    max-width: min(680px, calc(100vw - 28px));
    padding: 11px 15px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-left: 4px solid #8fb7c2;
    border-radius: 4px;
    background: #243b44;
    color: #fff;
    line-height: 1.55;
    text-align: left;
  }
  .toast[data-tone="success"] { border-left-color: #55b27c; background: #214d39; }
  .toast[data-tone="warning"] { border-left-color: #e4aa3e; background: #5b471d; }
  .toast[data-tone="error"] { border-left-color: #e27474; background: #642e2e; }
  .toast button { color: #fff; }

  .app-busy {
    position: fixed;
    z-index: 1500;
    top: 10px;
    left: 50%;
    display: grid;
    grid-template-columns: 20px auto;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 5px 12px;
    transform: translateX(-50%);
    border: 1px solid #87a6b0;
    border-radius: 4px;
    background: #fff;
    color: #26434d;
    box-shadow: 0 8px 24px rgba(15, 42, 52, .2);
    font-size: 13px;
  }
  .app-busy.hidden { display: none; }
  .app-busy > span {
    width: 16px;
    height: 16px;
    border: 2px solid #bad0d5;
    border-top-color: var(--teal);
    border-radius: 50%;
    animation: busy-spin .75s linear infinite;
  }
  @keyframes busy-spin { to { transform: rotate(360deg); } }

  body:has(.login-gate:not(.hidden)) .app-busy {
    top: auto;
    bottom: max(14px, env(safe-area-inset-bottom));
  }
}

@media screen and (max-width: 1180px) and (min-width: 901px) {
  .desktop { min-width: 980px; }
  .topbar { grid-template-columns: 176px minmax(0, 1fr) auto; }
  .brand { padding: 0 14px; font-size: 21px; }
  .topnav button { padding-inline: 6px; font-size: 13px; }
  .auth-status #currentUserLabel { max-width: 150px; }
  .workarea { grid-template-columns: 76px minmax(0, 1fr) 196px; }
  .side button { height: 62px; }
}

@media screen and (max-width: 900px) {
  .desktop {
    min-width: 0;
    height: 100dvh;
    grid-template-rows: 88px 34px minmax(0, 1fr) 25px;
  }
  .topbar {
    grid-template-columns: minmax(150px, 1fr) auto;
    grid-template-rows: 44px 44px;
    min-height: 88px;
  }
  .brand {
    grid-column: 1;
    grid-row: 1;
    padding: 0 12px;
    font-size: 21px;
  }
  .auth-status {
    grid-column: 2;
    grid-row: 1;
    max-width: 250px;
    padding: 5px 8px 4px 0;
  }
  .auth-status #currentUserLabel { max-width: 120px; }
  .auth-status button { min-width: 60px; padding-inline: 7px; }
  .topnav {
    grid-column: 1 / 3;
    grid-row: 2;
    gap: 3px;
    padding: 4px 8px 6px;
    overflow-x: auto;
  }
  .topnav button { flex: 0 0 auto; min-height: 32px; }
  .shortcut { display: none; }
  .workarea,
  .workarea:has(.settings-view.active) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 52px minmax(0, 1fr);
  }
  .rightbar { display: none; }
  .side { height: 52px; }
  .side button { min-width: 66px; height: 52px; }
  .side span { display: none; }
  .side b { margin: 0; }
  .content { grid-template-rows: auto minmax(0, 1fr); }
  .toolbar { gap: 7px; padding: 7px 8px; }
  .toolbar > div:first-child { min-height: 24px; }
  .search { grid-template-columns: minmax(0, 1fr) 56px 56px; }
  .view { padding: 8px; }
  .module-cards {
    grid-template-columns: repeat(2, minmax(132px, 1fr));
    gap: 10px;
    padding: 12px;
  }
  .module-card { max-width: none; height: 76px; }
  .document-view { padding: 6px; }
  .document-form { padding-bottom: 72px; }
  .doc-head { padding: 10px 12px; }
  .doc-head h1 { font-size: 23px; }
  .doc-actions {
    position: sticky;
    bottom: 0;
    z-index: 6;
    min-height: 58px;
    padding: 8px;
    background: #fff;
    box-shadow: 0 -4px 14px rgba(23, 49, 59, .1);
  }
  .doc-actions #newDocumentButton,
  .doc-actions .legacy-copy-button { margin-right: 0; }
  .doc-actions button[type="submit"],
  .doc-actions #postDocumentButton,
  .doc-actions #mobileMoreButton { min-width: 0; height: 40px; }
  .decision-box { width: calc(100vw - 16px); }
  .query-box { width: calc(100vw - 16px); overflow-y: auto; }
  .query-box fieldset { margin: 12px 12px 0; padding: 14px; gap: 12px; }
  .query-box footer { padding: 14px 12px; }
  .app-busy { top: 7px; }
  .table-pager button { width: 40px; min-width: 40px; min-height: 40px; }
  .table-pager { min-height: 42px; }
}

@media screen and (max-width: 520px) {
  .login-gate {
    min-height: 100dvh;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 96px minmax(0, 1fr) 32px;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .login-hero { padding: 12px; }
  .login-brand { flex-direction: column; gap: 2px; font-size: 22px; }
  .login-brand span { font-size: 14px; }
  .login-card {
    grid-column: 1;
    width: calc(100% - 20px);
    max-width: 480px;
    justify-self: center;
    max-height: calc(100dvh - 138px);
    margin: 10px 0;
    padding: 16px;
    overflow-y: auto;
  }
  .login-card input,
  .login-password-control button { min-height: 46px; }
  .login-card footer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 12px; }
  .auth-status #currentUserLabel { display: none; }
  .auth-status #adminHomeButton { display: none; }
  .auth-status { max-width: none; }
  .topnav button { font-size: 12px; }
  .topnav button::before { display: none; }
  .toolbar > div:first-child { display: block; }
  .toolbar span { display: none; }
  .module-cards { grid-template-columns: 1fr 1fr; padding: 10px; }
  .module-card { grid-template-columns: 32px minmax(0, 1fr); padding: 10px; }
  .module-card span { font-size: 23px; }
  .module-card b { font-size: 14px; }
  .decision-body { padding: 16px; }
  .toast { bottom: 34px; min-width: 0; width: calc(100vw - 20px); }
  .app-busy { top: 6px; font-size: 12px; }
}

/* Mobile document preview and one-tap image sharing v93 */
@media screen and (max-width: 760px) {
  .print-preview {
    grid-template-rows: auto minmax(0, 1fr);
    background: #30383c;
  }
  .print-preview header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(72px, auto));
    gap: 7px;
    min-height: 0;
    padding: max(8px, env(safe-area-inset-top)) 8px 8px;
    overflow: visible;
  }
  .print-preview header b { margin: 0; align-self: center; }
  .print-preview-status {
    grid-column: 2 / 4;
    justify-self: end;
    max-width: 150px;
  }
  #previewClose { grid-column: 4; grid-row: 1; }
  .preview-template-control {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
  }
  .preview-template-control select { flex: 1; width: auto; min-width: 0; height: 38px; }
  #previewShareImage { grid-column: 1; grid-row: 3; }
  #previewSaveImage { grid-column: 2; grid-row: 3; }
  #previewPrintNow { grid-column: 3 / 5; grid-row: 3; }
  .print-preview header button { min-width: 0; height: 40px; }
  .preview-stage {
    display: block;
    padding: 10px 6px calc(24px + env(safe-area-inset-bottom));
  }
  .preview-stage #printPaper { margin: 0 auto; transform-origin: top center; }
  .print-panel {
    left: 8px !important;
    right: 8px;
    top: auto !important;
    bottom: calc(8px + env(safe-area-inset-bottom));
    width: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px;
  }
  .print-panel button,
  .print-panel label,
  .print-panel select { width: 100%; margin: 0; }
  .print-panel button { height: 42px; text-align: center; }
  .print-panel label { grid-column: 1 / -1; }
  .print-panel select { height: 38px; margin-top: 4px; }
}

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

/* Commercial navigation, status and print-preview usability v102 */
.preview-zoom-control {
  display: inline-grid;
  grid-template-columns: 34px 56px 34px;
  align-items: center;
}
.preview-zoom-control button {
  min-width: 34px !important;
  padding: 0 5px;
  border-radius: 0 !important;
  font-variant-numeric: tabular-nums;
}
.preview-zoom-control button:first-child { border-radius: 3px 0 0 3px !important; }
.preview-zoom-control button:last-child { border-radius: 0 3px 3px 0 !important; }
.preview-zoom-control button + button { margin-left: -1px; }
#previewZoomFit { font-size: 12px; }

.tab:focus-visible { position: relative; z-index: 1; }

@media screen and (min-width: 901px) {
  .statusbar { grid-template-columns: 150px minmax(220px, 1fr) 160px minmax(180px, 260px) 120px; }
  .statusbar span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media screen and (max-width: 900px) {
  .desktop { grid-template-rows: 48px 34px minmax(0, 1fr) 25px; }
  .topbar {
    grid-template-rows: 48px;
    min-height: 48px;
  }
  .topnav { display: none !important; }
  .brand,
  .auth-status { grid-row: 1; }
  .tenant-provision-admin > header,
  .registration-admin > header { grid-template-columns: 1fr; align-items: stretch; }
  .tenant-provision-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .registration-admin-filters { grid-template-columns: minmax(0, 1fr) 120px 72px; }
}

@media screen and (max-width: 760px) {
  .preview-zoom-control {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: center;
  }
  #previewShareImage { grid-row: 4; }
  #previewSaveImage { grid-row: 4; }
  #previewPrintNow { grid-row: 4; }
  .registration-request-modal { padding: 8px; }
  .registration-request-dialog { width: 100%; max-height: calc(100dvh - 16px); }
  .registration-request-dialog > header { padding: 16px 12px 12px; }
  .registration-request-dialog h2 { font-size: 19px; }
  .registration-request-fields { grid-template-columns: minmax(0, 1fr); gap: 13px; padding: 14px 12px; }
  .registration-request-wide { grid-column: 1; }
  .registration-request-fields input { min-height: 46px; font-size: 16px; }
  .registration-request-dialog > footer { grid-template-columns: 1fr 1fr; padding: 12px; }
  .registration-request-dialog > footer span { grid-column: 1 / -1; }
  .registration-request-dialog > footer button { min-height: 44px; }
  .tenant-provision-form { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .tenant-provision-actions { align-items: stretch; flex-wrap: wrap; }
  .tenant-provision-actions span { flex: 1 0 100%; }
  .tenant-provision-actions button { flex: 1 1 140px; }
  .registration-admin-filters { grid-template-columns: minmax(0, 1fr) 112px; }
  .registration-admin-filters button { grid-column: 1 / -1; min-height: 40px; }
}

@media screen and (max-width: 520px) {
  .login-card footer #openRegistrationRequest { grid-column: 1 / -1; min-height: 34px; text-align: center; }
}

/* P55 premium industrial workspace */
:root {
  --teal: #0a7276;
  --teal-dark: #07575b;
  --blue: #176b8b;
  --blue-dark: #10546f;
  --amber: #c4872b;
  --success: #2d7652;
  --danger: #b4493f;
  --ink: #182526;
  --muted: #647375;
  --line: #d6dfdd;
  --line-dark: #aebbb8;
  --surface: #ffffff;
  --canvas: #f2f5f4;
  --head: #e8eeec;
  --focus: #e8f5f4;
  --focus-ring: #16828a;
  --nav: #183b3c;
  --nav-soft: #25494a;
  --warm-soft: #fff8e8;
  --shadow-sm: 0 1px 2px rgba(19, 43, 43, .08), 0 5px 16px rgba(19, 43, 43, .05);
  --shadow-md: 0 18px 46px rgba(15, 34, 34, .2);
}

@media screen {
  html { color-scheme: light; }
  body {
    font-family: "Microsoft YaHei UI", "PingFang SC", "Noto Sans CJK SC", "Segoe UI", sans-serif;
    color: var(--ink);
    background: var(--canvas);
    letter-spacing: 0;
  }

  button,
  input,
  select,
  textarea { letter-spacing: 0; }

  button { transition: border-color .14s ease, background-color .14s ease, color .14s ease, box-shadow .14s ease; }

  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible {
    outline: 3px solid rgba(22, 130, 138, .2);
    outline-offset: 1px;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  select,
  textarea {
    border: 1px solid #bfcbc8;
    border-radius: 3px;
    background: #fff;
    color: var(--ink);
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
  select:hover,
  textarea:hover { border-color: #8fa3a0; }

  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
  select:focus,
  textarea:focus {
    border-color: var(--focus-ring);
    background: #fff;
  }

  input:disabled,
  select:disabled,
  textarea:disabled {
    background: #eef1f0;
    color: #7b8786;
    opacity: 1;
  }

  .desktop {
    min-width: 1024px;
    grid-template-rows: 78px 38px minmax(0, 1fr) 26px;
    background: var(--canvas);
  }

  .topbar {
    grid-template-columns: 190px minmax(0, 1fr) auto;
    grid-template-rows: 44px 34px;
    min-height: 78px;
    background: var(--nav);
    border-bottom: 1px solid #0d292a;
    box-shadow: 0 2px 8px rgba(11, 31, 31, .16);
  }

  .brand {
    grid-column: 1;
    grid-row: 1 / 3;
    align-items: center;
    align-content: center;
    gap: 8px;
    padding: 0 18px;
    color: #fff;
    white-space: nowrap;
  }

  .brand strong { font-size: 23px; font-weight: 750; }
  .brand span {
    padding: 2px 6px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 3px;
    color: #d8e7e4;
    font-size: 11px;
    font-weight: 600;
  }

  .topnav {
    grid-column: 2;
    grid-row: 1;
    gap: 2px;
    padding: 5px 4px;
  }

  .topnav button,
  .shortcut button {
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 3px;
    color: #e8f0ee;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
  }

  .topnav button::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin: 0 7px 2px 0;
    border: 1px solid rgba(255, 255, 255, .62);
    background: transparent;
  }

  .shortcut button::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    margin: 0 7px 2px 0;
    border-radius: 50%;
    background: #c7d9d5;
  }

  .topnav button:hover,
  .shortcut button:hover { background: rgba(255, 255, 255, .09); color: #fff; }

  .topnav button.active,
  .shortcut button.active {
    border-color: rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .13);
    color: #fff;
    box-shadow: inset 0 -2px var(--amber);
    font-weight: 700;
    text-decoration: none;
  }

  .topnav button.active::before { border-color: var(--amber); background: var(--amber); }

  .shortcut {
    grid-column: 2 / 4;
    grid-row: 2;
    gap: 0;
    padding: 0 10px 2px;
  }

  .shortcut button { min-height: 28px; padding-block: 3px; color: #cbdcda; font-size: 12px; }

  .auth-status {
    position: static;
    grid-column: 3;
    grid-row: 1;
    max-width: 430px;
    gap: 6px;
    padding: 7px 10px 5px 4px;
    color: #e7efed;
    white-space: nowrap;
  }

  .auth-status #currentUserLabel {
    min-width: 0;
    max-width: 260px;
    overflow: hidden;
    color: #d8e5e2;
    text-overflow: ellipsis;
  }

  .auth-status button,
  .auth-status #adminHomeButton {
    height: 29px;
    min-height: 29px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, .36);
    border-radius: 3px;
    background: transparent;
    color: #fff;
  }

  .auth-status #adminHomeButton {
    border-color: #d8e8e4;
    background: #f7fbfa;
    color: #164749;
  }

  .auth-status button:hover { border-color: #fff; background: rgba(255, 255, 255, .1); }
  .auth-status #adminHomeButton:hover { background: #e9f2f0; }

  .tabbar {
    align-items: stretch;
    gap: 0;
    min-width: 0;
    padding: 4px 6px 0;
    overflow-x: auto;
    border-bottom: 1px solid #becac7;
    background: #e8eeec;
    scrollbar-width: thin;
  }

  .tab {
    position: relative;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 33px;
    min-width: 94px;
    padding: 0 10px;
    border: 0;
    border-right: 1px solid #ced8d5;
    border-radius: 0;
    background: transparent;
    color: #4d5f5f;
    white-space: nowrap;
  }

  .tab:first-child { border-left: 1px solid #ced8d5; }
  .tab:hover { background: rgba(255, 255, 255, .58); color: #1d3b3b; }
  .tab.active {
    border-top: 0;
    background: #fff;
    color: #173d3e;
    box-shadow: inset 0 3px var(--amber);
    font-weight: 700;
  }

  .tab .close-tab {
    width: 18px;
    height: 18px;
    margin-left: 8px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #738180;
    font-size: 15px;
    line-height: 18px;
  }

  .tab .close-tab:hover { background: #f5e3e1; color: #a13c35; }

  .workarea {
    grid-template-columns: 76px minmax(0, 1fr) 208px;
    border-top: 0;
    background: var(--canvas);
  }

  .side {
    align-content: start;
    padding-top: 6px;
    border-right: 1px solid #243f40;
    background: #203f40;
  }

  .side button {
    position: relative;
    height: 61px;
    padding: 7px 2px 6px;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    color: #d9e6e3;
    background: transparent;
    font-weight: 600;
  }

  .side button:hover:not(.active) { background: rgba(255, 255, 255, .07); color: #fff; }
  .side button.active {
    color: #173d3e;
    background: #fff;
    box-shadow: inset 4px 0 var(--amber);
  }

  .side button.active::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    bottom: 0;
    width: 1px;
    background: #fff;
  }

  .side span { font-size: 19px; line-height: 20px; font-weight: 500; }
  .side b { margin-top: 4px; font-size: 12px; }

  .content {
    grid-template-rows: 50px minmax(0, 1fr);
    border-right: 0;
    background: #fff;
  }

  .toolbar {
    gap: 14px;
    padding: 0 12px 0 16px;
    border-bottom: 1px solid var(--line);
    background: #fbfcfc;
  }

  .toolbar b { color: #183a3a; font-size: 16px; font-weight: 700; }
  .toolbar span { color: #71807f; }

  .search { grid-template-columns: minmax(220px, 300px) 58px 58px; gap: 7px; }
  .search input { height: 34px; padding-inline: 10px; border-color: #b9c6c3; }

  .search button,
  .grid-head button,
  .view-actions button,
  .settings-actions button,
  .query-box footer button,
  .workflow-box > footer button,
  .column-config-box footer button,
  .registration-admin-filters button,
  .registration-admin-table button {
    min-height: 34px;
    padding: 4px 12px;
    border: 1px solid #9dafac;
    border-radius: 3px;
    background: #fff;
    color: #2a494a;
    box-shadow: none;
    font-weight: 600;
  }

  .search button,
  .grid-head button.active,
  .registration-admin-filters button,
  .registration-admin-table button {
    border-color: var(--blue-dark);
    background: var(--blue);
    color: #fff;
  }

  .search button:hover,
  .grid-head button.active:hover,
  .registration-admin-filters button:hover,
  .registration-admin-table button:hover { background: var(--blue-dark); }

  .primary,
  .secondary,
  .ghost,
  .doc-actions button,
  .admin-tools button,
  .user-admin-form button,
  .security-config > button,
  #config-company > button {
    min-height: 34px;
    padding: 5px 13px;
    border-radius: 3px;
    box-shadow: none;
    font-weight: 600;
  }

  .primary,
  .admin-tools button,
  .user-admin-form button,
  .security-config > button,
  #config-company > button {
    border: 1px solid var(--blue-dark);
    background: var(--blue);
    color: #fff;
  }

  .primary:hover,
  .admin-tools button:hover,
  .user-admin-form button:hover,
  .security-config > button:hover,
  #config-company > button:hover { background: var(--blue-dark); }

  .secondary {
    border: 1px solid #9dafac;
    background: #fff;
    color: #284849;
  }

  .secondary:hover { border-color: #657d79; background: #f1f5f4; color: #142f30; }
  .ghost { border: 1px solid transparent; background: transparent; color: #536665; }
  .ghost:hover { border-color: #c4cecc; background: #edf2f0; color: #263f3f; }
  .primary.danger { border-color: #bd8c87; background: #fff; color: #9b3f37; }
  .primary.danger:hover { border-color: #a13e36; background: #a9473f; color: #fff; }

  .view { padding: 14px; background: #fff; }
  #homeView { background: var(--canvas); }

  .module-cards {
    grid-template-columns: repeat(auto-fit, minmax(168px, 196px));
    justify-content: start;
    gap: 12px;
    padding: 22px;
  }

  .module-card {
    width: 100%;
    height: 86px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #c6d0ce;
    border-radius: 5px;
    background: #fff;
    color: #294748;
    box-shadow: 0 1px 1px rgba(19, 43, 43, .04);
    text-align: left;
  }

  .module-card span { height: auto; color: #176d72; font-size: 27px; line-height: 1; text-align: center; }
  .module-card b { font-size: 15px; font-weight: 650; }
  .module-card:hover,
  .module-card.active {
    border-color: #769c98;
    background: #f7fbfa;
    color: #173b3c;
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
  }

  .rightbar {
    padding: 7px 0;
    border-left: 1px solid var(--line);
    background: #f8faf9;
  }

  .rightbar h3 {
    margin: 0 12px;
    padding: 9px 8px 11px 11px;
    border-bottom: 1px solid #cad4d2;
    color: #274747;
    font-size: 14px;
  }

  .rightbar h3::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 13px;
    margin: 0 8px -2px 0;
    background: var(--amber);
  }

  .rightbar button {
    min-height: 38px;
    padding: 0 16px;
    border: 0;
    border-bottom: 1px solid #e1e6e4;
    background: transparent;
    color: #4c5e5d;
  }

  .rightbar button::before { color: #9a6d2c; }
  .rightbar button:hover { background: #edf3f1; color: #174849; }

  .grid-head {
    height: auto;
    min-height: 42px;
    gap: 6px;
    padding: 0 0 8px;
    color: var(--muted);
  }

  .grid-head > span:first-child { font-weight: 650; }

  .table-wrap {
    border: 1px solid #c6d0ce;
    border-radius: 3px;
    background: #fff;
    box-shadow: none;
  }

  table { color: #253333; }
  th,
  td {
    height: 34px;
    padding: 6px 9px;
    border-right-color: #e0e6e4;
    border-bottom-color: #dce3e1;
  }

  th {
    background: var(--head);
    color: #304a49;
    font-weight: 700;
    box-shadow: inset 0 -1px #c1ceca;
  }

  tbody tr:nth-child(even) td { background: #fafcfc; }
  tbody tr:hover td,
  tr[data-open-doc]:hover td,
  tr[data-view-statement]:hover td { background: #edf6f4; }
  tbody tr.selected td { background: #eaf4f2; }
  tbody tr.selected td:first-child { box-shadow: inset 3px 0 var(--amber); }
  td.num,
  th.num { font-variant-numeric: tabular-nums; }

  .document-view { padding: 12px; background: var(--canvas); }
  .document-form {
    overflow: hidden;
    border: 1px solid #c2cecb;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(21, 44, 44, .06);
  }

  .doc-head {
    min-height: 58px;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #d8e0de;
    background: #fff;
  }

  .doc-head h1 { color: #173536; font-size: 25px; font-weight: 750; }
  .doc-meta { grid-template-columns: 250px 250px; gap: 16px; }
  .doc-fields {
    gap: 9px 22px;
    padding: 12px 16px 14px;
    border-bottom: 1px solid #d8e0de;
    background: #f8faf9;
  }

  .doc-fields label,
  .doc-meta label,
  .doc-bottom label {
    align-items: center;
    color: #405b5a;
    font-size: 13px;
  }

  .doc-fields input,
  .doc-fields select,
  .doc-meta input,
  .doc-meta select,
  .doc-bottom input {
    height: 34px;
    padding: 4px 8px;
    border: 1px solid #b8c6c3;
    border-radius: 3px;
    background: #fff;
  }

  .doc-grid-wrap,
  .finance-grid-wrap {
    border-top: 0;
    border-bottom: 1px solid #c6d0ce;
    background: #fff;
  }

  .doc-grid th {
    height: 36px;
    background: #e5ecea;
    color: #284c4c;
    font-size: 14px;
    font-weight: 700;
  }

  .doc-grid td { height: 37px; border-color: #d9e1df; background: #fff; }
  .doc-grid tbody tr:nth-child(even) td { background: #fafcfc; }
  .doc-grid tbody tr:hover td { background: #f1f7f5; }
  .doc-grid tbody tr:focus-within td { background: var(--warm-soft); }
  .doc-grid tbody tr:focus-within td:first-child { box-shadow: inset 3px 0 var(--amber); }

  .doc-grid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .doc-grid select {
    height: 36px;
    padding: 4px 7px;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
  }

  .doc-grid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
  .doc-grid select:hover { border: 0 !important; }
  .doc-grid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
  .doc-grid select:focus {
    border: 0 !important;
    background: #fffdf4;
    outline: 2px solid var(--focus-ring);
    outline-offset: -2px;
  }

  .doc-grid td:first-child { background: #f3f6f5; color: #596a69; }
  .line-assist {
    min-height: 34px;
    border: 1px solid #c4d5d2;
    border-left: 3px solid #4f9995;
    border-radius: 3px;
    background: #f3f9f8;
    color: #365654;
  }

  .doc-bottom {
    min-height: 76px;
    padding: 9px 10px;
    border-top: 0;
    background: #f8faf9;
  }

  .doc-bottom button { border: 1px solid #9dafac; border-radius: 3px; background: #fff; color: #294949; }
  .doc-bottom button:hover { background: #edf3f1; }
  .doc-total { color: #5d706e; }
  .doc-total input { border: 1px solid #b9c6c3; background: #fff; }
  .doc-total b { color: #173637; font-size: 19px; font-weight: 750; }

  .doc-actions {
    min-height: 56px;
    gap: 7px;
    padding: 9px 12px;
    border-top: 1px solid #cbd5d2;
    background: #f4f7f6;
  }

  .doc-actions button { height: 36px; min-width: 92px; }
  .doc-actions #postDocumentButton { min-width: 118px; border-color: #07575b; background: #0a7276; }
  .doc-actions #postDocumentButton:hover { background: #07575b; }

  .legacy-document-notice {
    border-color: #e0c277;
    border-left-color: var(--amber);
    border-radius: 3px;
    background: #fffaf0;
  }

  .arap-view { background: #fff; }
  .arap-head { border-bottom: 1px solid #d3dcda; background: #f7f9f8; }
  .arap-head h1 { color: #213f40; font-size: 25px; font-weight: 750; }
  .tree { border-right-color: #d1d9d7; background: #f5f8f7; }
  .view-actions { border-top-color: #cbd5d2; background: #f4f7f6; }

  .config-tabs {
    gap: 0;
    height: 42px;
    padding: 5px 10px 0;
    border-bottom: 1px solid #bcc9c6;
    background: #e8eeec;
  }

  .config-tabs button {
    min-width: 148px;
    height: 36px;
    border: 0;
    border-right: 1px solid #ccd6d3;
    border-radius: 0;
    background: transparent;
    color: #526462;
  }

  .config-tabs button:first-child { border-left: 1px solid #ccd6d3; }
  .config-tabs button:hover { background: rgba(255, 255, 255, .58); }
  .config-tabs button.active {
    border-top: 0;
    background: #fff;
    color: #183f40;
    box-shadow: inset 0 3px var(--amber);
    font-weight: 700;
  }

  .settings-view { grid-template-rows: 42px minmax(0, 1fr) 52px; background: #fff; }
  .config-panel { padding: 22px 26px 26px; background: #fff; }
  .config-panel input,
  .config-panel select { height: 34px; border-color: #b8c6c3; }

  .security-config,
  .runtime-monitor,
  .data-quality {
    max-width: 1220px;
    margin: 0 0 18px;
    padding: 18px 0;
    border: 0;
    border-bottom: 1px solid #d8e0de;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  .security-config > h3 {
    padding: 0 0 8px 10px;
    border-bottom: 1px solid #d8e0de;
    border-left: 3px solid var(--amber);
    color: #214748;
    font-size: 15px;
  }

  .admin-tools,
  .user-admin-form {
    max-width: 1220px;
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid #ccd6d3;
    border-radius: 3px;
    background: #f5f8f7;
    box-shadow: none;
  }

  .registration-admin {
    margin-bottom: 18px;
    border-color: #c8d3d0;
    border-radius: 3px;
    box-shadow: none;
  }

  .registration-admin > header { background: #f4f7f6; }
  .registration-admin h3 { color: #214849; }
  .runtime-monitor-grid { gap: 10px; }
  .runtime-card {
    min-height: 84px;
    border-color: #d0dad7;
    border-radius: 3px;
    background: #fafcfc;
  }

  .report-stats { gap: 12px; max-width: 1080px; }
  .report-stats article {
    min-height: 96px;
    border: 1px solid #cbd6d3;
    border-left: 4px solid var(--teal);
    border-radius: 4px;
    background: #fff;
    box-shadow: var(--shadow-sm);
  }

  .report-stats article:nth-child(2n) { border-left-color: var(--blue); }
  .report-stats article:nth-child(3n) { border-left-color: var(--amber); }

  .dropdown-menu,
  .submenu {
    padding: 5px;
    border: 1px solid #9faeab;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 38, 38, .18);
  }

  .dropdown-menu::before,
  .submenu::before { display: none; }
  .dropdown-menu button { min-height: 30px; padding: 4px 28px 4px 10px; border-radius: 2px; color: #243b3b; }
  .dropdown-menu button:hover { outline: 0; background: #edf4f2; color: #174849; }
  .menu-sep { margin: 5px 4px; background: #d8e0de; }

  .modal { background: rgba(20, 36, 36, .48); backdrop-filter: blur(2px); }
  .query-box,
  .column-config-box,
  .workflow-box,
  .decision-box {
    border-color: #8b9e9a;
    border-radius: 6px;
    background: #fff;
    box-shadow: var(--shadow-md);
  }

  .query-box header,
  .column-config-box header,
  .workflow-box > header,
  .decision-box > header {
    min-height: 44px;
    border-bottom: 1px solid #cad5d2;
    background: #f0f4f3;
    color: #203f40;
  }

  .workflow-body { background: #fff; }
  .workflow-table th { background: #e8eeec; color: #294b4b; }
  .workflow-box > footer,
  .column-config-box footer,
  .decision-box > footer { background: #f4f7f6; }

  .statement-detail-actions button,
  .statement-view-switch button {
    min-height: 33px;
    padding: 4px 12px;
    border: 1px solid #9dafac;
    border-radius: 3px;
    background: #fff;
    color: #294949;
    font-weight: 600;
  }

  .statement-detail-actions button:hover,
  .statement-view-switch button:hover:not(:disabled) { border-color: #657d79; background: #edf3f1; }
  .statement-view-switch button + button { margin-left: -1px; border-left: 1px solid #9dafac; }
  .statement-view-switch button[aria-pressed="true"] {
    border-color: var(--teal-dark);
    background: var(--teal);
    color: #fff;
  }

  .login-message { color: #667775; }
  .login-message[data-tone="error"] { color: var(--danger); }
  .login-message[data-tone="info"] { color: #56716e; }

  .smart-picker {
    overflow: hidden;
    border: 1px solid #91a7a3;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(20, 43, 43, .2);
  }

  .smart-picker button { border-bottom-color: #e2e8e6; }
  .smart-picker button:hover,
  .smart-picker button[aria-selected="true"] { background: #eef6f4; }
  .smart-picker button[aria-selected="true"] { box-shadow: inset 3px 0 var(--amber); }

  .toast {
    border: 1px solid rgba(255, 255, 255, .16);
    border-left: 4px solid #86b0aa;
    border-radius: 4px;
    background: #243b3b;
    box-shadow: var(--shadow-md);
  }

  .statusbar {
    min-height: 26px;
    border-top: 1px solid #c5cfcc;
    background: #e9eeec;
    color: #536361;
  }

  .statusbar span { height: 25px; padding: 4px 9px; border-right-color: #cbd4d2; }
  .statusbar .ok { color: var(--success); }

  .login-gate {
    grid-template-columns: minmax(340px, 40vw) minmax(480px, 1fr);
    grid-template-rows: minmax(0, 1fr);
    background: #f2f5f4;
  }

  .login-hero {
    grid-column: 1;
    grid-row: 1;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 24px;
    padding: 64px;
    background: var(--nav);
    box-shadow: inset -1px 0 rgba(0, 0, 0, .16);
  }

  .login-brand { align-items: flex-start; flex-direction: column; gap: 8px; }
  .login-brand strong { font-size: 34px; font-weight: 750; }
  .login-brand span {
    padding: 4px 8px;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 3px;
    color: #d6e4e1;
    font-size: 14px;
    font-weight: 600;
  }

  .login-hero p { max-width: 300px; color: #c9d9d6; font-size: 16px; font-weight: 400; line-height: 1.8; }

  .login-card {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    justify-self: center;
    width: min(440px, calc(100% - 48px));
    min-height: 0;
    gap: 16px;
    padding: 30px 34px 26px;
    border: 1px solid #c7d1ce;
    border-radius: 7px;
    background: #fff;
    box-shadow: var(--shadow-sm);
  }

  .login-tabs { height: 44px; border-bottom: 1px solid #d9e1df; }
  .login-tabs button { color: #6a7876; font-size: 20px; }
  .login-tabs button:first-child { border-right: 0; }
  .login-tabs button.active { color: #174849; }
  .login-card label { grid-template-columns: 1fr; gap: 7px; color: #415a58; }
  .login-card input { height: 44px; border-color: #b8c5c2; border-radius: 3px; font-size: 16px; }
  .login-password-control button { height: 44px; border-color: #b8c5c2; background: #f4f7f6; color: #245253; }
  #loginSubmit {
    height: 48px;
    margin-top: 2px;
    border: 1px solid #07575b;
    border-radius: 3px;
    background: #0a7276;
    font-size: 20px;
  }

  #loginSubmit:hover { background: #07575b; }
  .login-card footer { gap: 12px; color: #5b7471; font-size: 12px; }
  .login-card footer button { color: #176b6f; text-decoration: none; font-weight: 700; }

  .registration-request-modal { background: rgba(20, 36, 36, .5); backdrop-filter: blur(2px); }
  .registration-request-dialog { border-color: #8fa19e; border-radius: 7px; box-shadow: var(--shadow-md); }
  .registration-request-dialog > header { border-bottom-color: #d3ddda; background: #f2f6f5; }
  .registration-request-dialog h2 { color: #214849; }
  .registration-request-fields input,
  .registration-request-fields textarea { border-color: #b9c6c3; }
  .registration-request-dialog > footer { background: #f4f7f6; }
}

@media screen and (max-width: 1180px) and (min-width: 901px) {
  .desktop { min-width: 980px; }
  .topbar { grid-template-columns: 172px minmax(0, 1fr) auto; }
  .brand { padding-inline: 14px; }
  .brand strong { font-size: 20px; }
  .topnav button { padding-inline: 7px; font-size: 12px; }
  .auth-status #currentUserLabel { max-width: 140px; }
  .workarea { grid-template-columns: 72px minmax(0, 1fr) 190px; }
}

@media screen and (max-width: 900px) {
  .desktop {
    min-width: 0;
    height: 100dvh;
    grid-template-rows: 54px 38px minmax(0, 1fr) 25px;
  }

  .topbar {
    grid-template-columns: minmax(150px, 1fr) auto;
    grid-template-rows: 54px;
    min-height: 54px;
  }

  .brand {
    grid-column: 1;
    grid-row: 1;
    flex-direction: row;
    padding: 0 12px;
  }

  .brand strong { font-size: 20px; }
  .brand span { font-size: 10px; }
  .topnav,
  .shortcut { display: none !important; }

  .auth-status {
    grid-column: 2;
    grid-row: 1;
    padding: 7px 8px 7px 0;
  }

  .auth-status #currentUserLabel,
  .auth-status #adminHomeButton { display: none; }
  .auth-status button { min-width: 58px; height: 36px; }

  .tabbar { height: 38px; padding: 3px 4px 0; }
  .tab { height: 34px; min-width: 92px; }

  .workarea,
  .workarea:has(.settings-view.active) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 50px minmax(0, 1fr);
  }

  .side {
    display: flex;
    width: 100%;
    height: 50px;
    padding: 0;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid #c5cfcc;
    background: #fff;
    scrollbar-width: none;
  }

  .side::-webkit-scrollbar { display: none; }
  .side button {
    flex: 1 0 64px;
    min-width: 64px;
    height: 49px;
    padding: 0 6px;
    border-right: 1px solid #e0e6e4;
    border-bottom: 0;
    color: #4c605e;
  }

  .side button:hover:not(.active) { background: #f1f5f4; color: #1d4343; }
  .side button.active {
    color: #174849;
    background: #eef5f3;
    box-shadow: inset 0 -3px var(--amber);
  }

  .side button.active::after { display: none; }
  .side span { display: none; }
  .side b { margin: 0; font-size: 13px; }

  .content { grid-template-rows: auto minmax(0, 1fr); overflow: hidden; }
  .toolbar {
    display: grid;
    gap: 8px;
    padding: 8px;
    background: #fff;
  }

  .toolbar > div:first-child { min-height: 22px; }
  .search { grid-template-columns: minmax(0, 1fr) 56px 56px; }
  .search input,
  .search button { height: 38px; }
  .view { padding: 8px; }
  .rightbar { display: none; }

  .document-view { padding: 6px; background: var(--canvas); }
  .document-form { border-radius: 4px; padding-bottom: 68px; }
  .doc-head { display: grid; gap: 10px; padding: 12px; }
  .doc-head h1 { font-size: 23px; }
  .doc-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .doc-fields { display: grid; grid-template-columns: 1fr; gap: 7px; padding: 11px 12px 13px; }
  .doc-fields label,
  .doc-meta label,
  .doc-bottom label { display: grid; grid-template-columns: 80px minmax(0, 1fr); margin: 0; }

  .doc-fields input,
  .doc-fields select,
  .doc-meta input,
  .doc-meta select,
  .doc-bottom input { height: 40px; }

  .doc-grid-wrap,
  .finance-grid-wrap { max-height: 48vh; }
  .doc-bottom { display: block; padding: 10px 12px; }
  .line-assist { margin-bottom: 10px; }

  .doc-actions {
    position: sticky;
    bottom: 0;
    z-index: 8;
    min-height: 58px;
    padding: 8px;
    background: rgba(249, 251, 250, .98);
    box-shadow: 0 -8px 22px rgba(20, 42, 42, .12);
  }

  .doc-actions button[type="submit"],
  .doc-actions #postDocumentButton,
  .doc-actions #shareDocumentButton,
  .doc-actions #mobileMoreButton { height: 42px; }

  .module-cards { grid-template-columns: repeat(2, minmax(130px, 1fr)); gap: 10px; padding: 12px; }
  .module-card { height: 76px; }
  .settings-view { overflow: auto; }
  .config-panel { padding: 14px; }
  .security-config,
  .runtime-monitor,
  .data-quality { padding: 14px 0; }
  .registration-admin > header { grid-template-columns: 1fr; align-items: stretch; }
  .registration-admin-filters { grid-template-columns: minmax(0, 1fr) 120px 72px; }

  .login-gate {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 112px minmax(0, 1fr);
    min-height: 100dvh;
  }

  .login-hero {
    grid-column: 1;
    grid-row: 1;
    align-items: center;
    justify-content: center;
    padding: 18px;
  }

  .login-brand { align-items: center; gap: 4px; }
  .login-brand strong { font-size: 25px; }
  .login-brand span { font-size: 12px; }
  .login-hero p { display: none; }
  .login-card {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    width: calc(100% - 24px);
    max-width: 480px;
    margin: 14px 0;
    padding: 20px;
  }
}

@media screen and (max-width: 520px) {
  .brand span { display: none; }
  .tab { min-width: 86px; padding-inline: 8px; }
  .toolbar b { font-size: 15px; }
  .toolbar span { display: none; }
  .search { grid-template-columns: minmax(0, 1fr) 52px 52px; }

  .document-view { padding: 0; }
  .document-form { border-width: 0; border-radius: 0; box-shadow: none; }
  .doc-head { padding: 12px 14px; }
  .doc-head h1 { font-size: 22px; }
  .doc-meta { grid-template-columns: 1fr; }
  .doc-fields { padding: 12px 14px 14px; }
  .doc-fields label,
  .doc-meta label,
  .doc-bottom label { grid-template-columns: 78px minmax(0, 1fr); gap: 6px; }

  .doc-grid-wrap,
  .finance-grid-wrap {
    max-height: none;
    padding: 4px 8px 10px;
    overflow: visible;
    background: #f2f5f4;
  }

  .doc-grid {
    border-collapse: separate;
    border-spacing: 0 8px;
  }

  .doc-grid tr {
    gap: 8px 10px;
    padding: 11px;
    border: 1px solid #c3d0cd;
    border-left: 3px solid #6b9e99;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(22, 46, 46, .07);
  }

  .doc-grid tr:focus-within { border-left-color: var(--amber); background: #fffdf7; }
  .doc-grid td,
  .doc-grid tbody tr:nth-child(even) td,
  .doc-grid tbody tr:hover td,
  .doc-grid tbody tr:focus-within td { background: transparent; }
  .doc-grid td::before { color: #667a77; }
  .doc-grid td:first-child { color: #244d4d; background: transparent; }
  .doc-grid td input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .doc-grid td select {
    height: 40px;
    border: 1px solid #b9c8c5 !important;
    border-radius: 3px;
    background: #fff;
  }

  .doc-grid td input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
  .doc-grid td select:hover { border: 1px solid #8fa3a0 !important; }
  .mobile-line-delete { border-radius: 3px; }

  .finance-doc .doc-fields { grid-template-columns: 1fr; }
  .document-view-active .toolbar { display: none; }
  .document-view-active:not(.finance-doc):not(.mobile-document-details-open) .mobile-secondary-field { display: none; }
  .mobile-document-details-toggle {
    display: block;
    width: 100%;
    min-height: 40px;
    border: 1px solid #9dafac;
    border-radius: 3px;
    background: #fff;
    color: #294949;
    font-weight: 650;
  }
  .finance-doc .mobile-document-details-toggle { display: none; }
  .finance-doc .document-form { display: flex; flex-direction: column; }
  .finance-doc .doc-head { order: 1; }
  .finance-doc .legacy-document-notice { order: 2; }
  .finance-doc .doc-fields { order: 3; }
  .finance-doc .doc-bottom { display: contents; }
  .finance-doc .finance-account-field {
    order: 4;
    margin: 10px 14px 2px;
  }
  .finance-doc .finance-grid-wrap { order: 5; }
  .finance-doc .line-assist { order: 6; margin: 0 12px 10px; }
  .finance-doc .finance-amount-field { order: 7; margin: 0 14px 9px; }
  .finance-doc #addLineButton { order: 8; margin: 0 12px 10px; }
  .finance-doc .doc-actions { order: 9; }
  .finance-doc .finance-grid { width: 100%; min-width: 0; }
  .finance-doc .finance-grid tr { grid-template-columns: 1fr; }
  .finance-doc .finance-grid td { grid-template-columns: 82px minmax(0, 1fr); }
  .finance-doc .finance-grid td:first-child { grid-column: 1; }
  .finance-doc .finance-grid td:first-child::before { content: "科目明细"; }
  .finance-doc .finance-grid td[data-mobile-label="科目编码"],
  .finance-doc .handler-field,
  .finance-doc .department-field,
  .finance-doc .summary-field { display: none; }
  .finance-doc .finance-account-field,
  .finance-doc .finance-amount-field { width: 100%; }
  .finance-doc #addLineButton { width: auto; min-height: 40px; }
  .finance-doc .doc-actions #shareDocumentButton { display: none; }
  .finance-doc .doc-actions #settleButton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    order: 2;
  }
  .finance-doc .doc-actions #mobileMoreButton { order: 3; }

  .line-assist { margin-bottom: 10px; }
  .mobile-qty-stepper.active { grid-template-columns: 48px 48px minmax(64px, 1fr) 48px 48px; gap: 5px; }
  .mobile-qty-stepper button,
  .mobile-qty-stepper output { height: 42px; min-height: 42px; border-radius: 3px; }
  .doc-actions { gap: 6px; }
  .doc-actions button[type="submit"],
  .doc-actions #postDocumentButton,
  .doc-actions #shareDocumentButton { min-width: 0; padding-inline: 7px; font-size: 13px; }
  .doc-actions #mobileMoreButton { flex-basis: 50px; padding-inline: 6px; }

  .config-tabs { padding-inline: 5px; overflow-x: auto; }
  .config-tabs button { min-width: 128px; }
  .registration-admin-filters { grid-template-columns: minmax(0, 1fr) 112px; }
  .registration-admin-filters button { grid-column: 1 / -1; }

  .login-gate { grid-template-rows: 102px minmax(0, 1fr); }
  .login-card {
    width: calc(100% - 20px);
    margin: 10px 0;
    padding: 18px 16px;
    gap: 14px;
  }

  .login-tabs { height: 40px; }
  .login-tabs button { font-size: 19px; }
  .login-card input,
  .login-password-control button { height: 46px; }
  .login-card footer { grid-template-columns: 1fr 1fr; gap: 8px; }
  .login-card footer #openRegistrationRequest { grid-column: 1 / -1; min-height: 38px; text-align: center; }
}

/* P62 native GDI text printing for dot-matrix printers */
.native-print-control {
  position: relative;
  min-width: 0;
  color: #38535b;
  font-size: 12px;
}
.native-print-control.hidden,
.native-print-control .hidden { display: none !important; }
.native-print-control summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid #a5b3b8;
  border-radius: 3px;
  background: #fff;
  color: #42555c;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.native-print-control summary::-webkit-details-marker { display: none; }
.native-print-settings {
  position: absolute;
  z-index: 30;
  top: calc(100% + 7px);
  right: 0;
  display: grid;
  gap: 9px;
  width: min(340px, 80vw);
  padding: 12px;
  border: 1px solid #9aabb1;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(28, 46, 52, .2);
}
.native-print-settings label { display: grid; gap: 4px; }
.native-print-control select {
  width: 100%;
  height: 30px;
  border: 1px solid #8fa3aa;
  border-radius: 3px;
  background: #fff;
  color: #153c46;
}
.native-print-control a {
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid #9a7c37;
  border-radius: 3px;
  background: #fff8e5;
  color: #704d00;
  text-decoration: none;
}
#nativePrintBridgeStatus[data-state="available"] {
  color: #17653d;
  font-weight: 700;
}
#nativePrintBridgeStatus[data-state="unavailable"] { color: #a23b2c; }
#previewPrintNow.primary {
  border-color: #0c6c77;
  background: #0b7d88;
  color: #fff;
  font-weight: 700;
}
#previewBrowserPrint { color: #42555c; }

@media screen and (max-width: 760px) {
  .print-preview header { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .print-preview header > b { grid-column: 1; grid-row: 1; }
  .print-preview-status { grid-column: 2 / 4; grid-row: 1; }
  #previewClose { grid-column: 4; grid-row: 1; }
  .preview-template-control { grid-column: 1 / -1; grid-row: 2; }
  .native-print-control {
    grid-column: 1 / -1;
    grid-row: 5;
    width: 100%;
  }
  .native-print-control summary { width: 100%; min-height: 38px; }
  .native-print-settings { position: static; width: 100%; margin-top: 6px; box-shadow: none; }
  .native-print-control select { width: 100%; min-width: 0; height: 38px; }
  .native-print-control a { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; }
  .preview-zoom-control { grid-column: 1 / 4; grid-row: 3; justify-self: stretch; }
  #previewEditTemplate {
    grid-column: 4;
    grid-row: 3;
    min-width: 0;
    padding-inline: 3px;
    white-space: nowrap;
    font-size: 12px;
  }
  #previewShareImage { grid-column: 1 / 3; grid-row: 4; }
  #previewSaveImage { grid-column: 3; grid-row: 4; }
  #previewPrintNow { grid-column: 4; grid-row: 4; }
}

@media screen and (max-width: 520px) {
  .preview-stage {
    min-width: 0;
    text-align: center;
    touch-action: pan-x pan-y pinch-zoom;
  }
  .preview-stage #printPaper {
    display: inline-grid;
    vertical-align: top;
  }
  .template-seal-setting { grid-template-columns: 1fr; }
  .template-seal-setting > strong,
  .template-seal-setting small { grid-column: 1; }
  .template-seal-upload { grid-template-columns: 1fr; }
  .template-seal-preview { justify-content: space-between; }
}

/* Smart history filters */
.history-smart-filter {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 180px)) auto minmax(0, 1fr);
  align-items: end;
  gap: 8px;
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid #c7d2cf;
  border-radius: 4px;
  background: #f7faf9;
}
.history-smart-filter label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  color: #405755;
  font-size: 12px;
  white-space: nowrap;
}
.history-smart-filter select {
  width: 100%;
  height: 32px;
  border: 1px solid #aebdb9;
  border-radius: 3px;
  background: #fff;
  color: #253f3e;
}
.history-smart-filter > button {
  min-height: 32px;
  padding: 4px 13px;
  border: 1px solid #9dafac;
  border-radius: 3px;
  background: #fff;
  color: #294949;
  font-weight: 600;
}
.history-filter-chips {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 0;
}
.history-filter-chips:empty { display: none; }
.history-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 27px;
  padding: 3px 7px 3px 9px;
  border: 1px solid #a9c4c0;
  border-radius: 3px;
  background: #edf6f4;
  color: #285b57;
  font-size: 12px;
}
.history-filter-chip button {
  width: 20px;
  min-width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #55706e;
  font-size: 16px;
  line-height: 18px;
}
.history-smart-notice {
  justify-self: end;
  align-self: center;
  color: #8a5b16;
  font-size: 12px;
}
.history-empty button {
  margin-left: 8px;
  min-height: 28px;
  padding: 3px 10px;
  border: 1px solid #9dafac;
  border-radius: 3px;
  background: #fff;
  color: #285b57;
  font-weight: 600;
}
.query-box select {
  border: 1px solid #aeb8bf;
  background: #fff;
}

@media screen and (max-width: 900px) {
  .statement-product-table .workflow-table {
    width: 1320px;
    min-width: 1320px;
  }
  .history-smart-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    padding: 9px;
  }
  .history-smart-filter label { grid-template-columns: 48px minmax(0, 1fr); }
  .history-smart-filter > button { width: 100%; }
  .history-filter-chips,
  .history-smart-notice { grid-column: 1 / -1; }
  .history-smart-notice { justify-self: start; }
}

@media screen and (max-width: 520px) {
  .history-smart-filter { grid-template-columns: 1fr; }
  .history-filter-chips,
  .history-smart-notice { grid-column: 1; }
}