/*
 * Clean-room ERP UI implementation.
 * Figma source: vuK5fQOFJ1Fx7nhFsyli7a, node 1:1696 (1920 × 1080).
 * No legacy theme stylesheet is loaded with this file.
 */
:root {
  --ui-accent: #277f75;
  --ui-accent-soft: #e4f3ef;
  --ui-canvas: #f6f6f6;
  --ui-nav: #f2f2f4;
  --ui-panel: #fff;
  --ui-text: #2d2d2d;
  --ui-title: #171717;
  --ui-muted: #9299a7;
  --ui-line: #e1e9ec;
  --ui-control-line: #c6cfe0;
  --ui-danger: #ee6c6c;
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-control-height: 34px;
  --ui-page-radius: 10px;
  --ui-tab-top: 10px;
  --ui-tab-height: 40px;
  --ui-shell-gap: 6px;
  --ui-shell-content-padding: 12px;
  --ui-main-top: calc(var(--ui-tab-top) + var(--ui-tab-height) + var(--ui-shell-gap));
}

* { box-sizing: border-box; }
html, body { margin: 0; min-width: 1024px; min-height: 100%; }
body.erp-figma {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  background: var(--ui-canvas);
  color: var(--ui-text);
  font: 14px/1.45 "Microsoft YaHei", "PingFang SC", "Noto Sans SC", sans-serif;
}
button, input, select, textarea, summary { font: inherit; }
button, summary { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .48; }
[hidden] { display: none !important; }

/* Figma 1:1697 / 1:1698 — fixed 244px navigation shell. */
.sidebar {
  position: fixed;
  z-index: 300;
  left: 10px;
  top: 10px;
  width: 244px;
  height: calc(100vh - 20px);
  min-height: 620px;
  overflow: visible;
  border-radius: 16px;
  background: #fff;
}
.brand {
  position: absolute;
  left: 10px;
  top: 12px;
  width: 224px;
  height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.brand::before {
  content: "";
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #f2f2f4 url("/figma-assets/brand.png") center/40px 40px no-repeat;
}
.brand strong { color: var(--ui-title); font-size: 20px; font-weight: 600; white-space: nowrap; }
.brand small { display: none; }
#nav {
  position: absolute;
  left: 10px;
  top: 68px;
  width: 224px;
  bottom: 84px;
  height: auto;
  padding: 10px;
  overflow: auto;
  border-radius: 16px;
  background: var(--ui-nav);
  scrollbar-width: none;
}
#nav::-webkit-scrollbar { display: none; }
.menu-search-row, .nav-controls, .mega-menu, .nav-collapsed-label { display: none !important; }
.nav-module { position: relative; width: 204px; height: 45px; margin: 0 0 10px; }
.nav-module.menu-open { height: auto; }
.nav-module.menu-open > .nav-btn {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--ui-nav);
  box-shadow: 0 1px 0 rgba(216,221,223,.9);
}
.nav-btn {
  width: 204px;
  height: 45px;
  padding: 12px 10px;
  display: grid;
  grid-template-columns: 20px minmax(0,1fr) 16px;
  gap: 8px;
  align-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #040404;
  text-align: left;
}
.nav-btn:hover { background: rgba(255,255,255,.7); }
.nav-module.active > .nav-btn { color: var(--ui-accent); font-weight: 600; }
.nav-icon { width: 20px; height: 20px; fill: #7f8798; background: none !important; }
.nav-icon path { display: block; }
#nav > .nav-module:nth-child(2) .nav-icon { background: url("/figma-assets/nav-1.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(3) .nav-icon { background: url("/figma-assets/nav-2.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(4) .nav-icon { background: url("/figma-assets/nav-3.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(5) .nav-icon { background: url("/figma-assets/nav-4.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(6) .nav-icon { background: url("/figma-assets/nav-5.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(7) .nav-icon { background: url("/figma-assets/nav-6.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(8) .nav-icon { background: url("/figma-assets/nav-7.png") center/20px 20px no-repeat; }
#nav > .nav-module:nth-child(9) .nav-icon { background: url("/figma-assets/nav-8.png") center/20px 20px no-repeat; }
.nav-module.active .nav-icon { fill: var(--ui-accent); }
.nav-label { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.nav-chevron { color: #7f8798; font-size: 20px; transform-origin: center; }
.nav-module.menu-open .nav-chevron { transform: rotate(90deg); }
.figma-nav-branch {
  width: 204px;
  height: auto;
  margin-top: 8px;
  padding-left: 20px;
  display: grid;
  grid-template-columns: 6px 172px;
  gap: 6px;
}
.figma-nav-branch + * { min-width: 0; }
.figma-nav-rail { border-left: 1px solid #d8dddf; }
.figma-nav-children { display: flex; flex-direction: column; gap: 12px; }
.figma-nav-group { min-width: 0; }
.figma-nav-group h3 {
  margin: 0 0 4px;
  padding: 0 10px;
  color: #77808e;
  font-size: 11px;
  font-weight: 600;
  line-height: 20px;
}
.figma-nav-group-items { display: flex; flex-direction: column; gap: 2px; }
.figma-nav-child {
  width: 172px;
  min-height: 32px;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #626b79;
  text-align: left;
}
.figma-nav-child:hover { background: rgba(255,255,255,.72); color: #2f3946; }
.figma-nav-child i { width: 4px; height: 4px; flex: 0 0 4px; border-radius: 50%; background: currentColor; }
.figma-nav-child span { overflow: hidden; font-size: 13px; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; }
.figma-nav-child.active { background: var(--ui-accent); color: rgba(255,255,255,.97); }
.figma-nav-all { position: relative; width: 172px; }
.figma-nav-all > summary {
  width: 172px;
  height: 38px;
  padding: 0 12px 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px dashed #cbd5d3;
  border-radius: 8px;
  background: rgba(255,255,255,.55);
  color: #697482;
  font-size: 13px;
  list-style: none;
  cursor: pointer;
}
.figma-nav-all > summary::-webkit-details-marker { display: none; }
.figma-nav-all[open] > summary { border-color: var(--ui-accent); color: var(--ui-accent); }
.figma-nav-all[open] > summary i { transform: rotate(90deg); }
.figma-nav-all-panel {
  position: fixed;
  z-index: 980;
  left: 226px;
  top: 72px;
  width: 620px;
  max-height: 780px;
  overflow: auto;
  padding: 16px;
  border: 1px solid #d6dfdd;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(22,52,47,.18);
}
.figma-nav-all-panel header { height: 44px; margin: -4px 0 12px; padding: 0 4px 10px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--ui-line); }
.figma-nav-all-panel header strong { color: var(--ui-title); font-size: 16px; }
.figma-nav-all-panel header span { color: var(--ui-muted); font-size: 12px; }
.figma-nav-all-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.figma-nav-all-grid section { min-width: 0; padding: 10px; border: 1px solid #e3e8e7; border-radius: 8px; background: #fafbfb; }
.figma-nav-all-grid h3 { margin: 0 0 7px; color: #697482; font-size: 12px; font-weight: 600; }
.figma-nav-all-grid button { width: 100%; min-height: 32px; padding: 6px 9px; border: 0; border-radius: 5px; background: transparent; color: var(--ui-text); font-size: 12px; text-align: left; }
.figma-nav-all-grid button:hover { background: #e8f3f1; color: var(--ui-accent); }
.figma-nav-all-grid button.active { background: var(--ui-accent); color: #fff; }
.figma-user-card {
  position: absolute;
  left: 16px;
  top: auto;
  bottom: 20px;
  width: 212px;
  height: 48px;
  display: block;
}
.figma-user-card > summary { width: 212px; height: 48px; display: grid; grid-template-columns: 48px minmax(0,1fr) 46px 12px; gap: 8px; align-items: center; list-style: none; }
.figma-user-card > summary::-webkit-details-marker { display: none; }
.figma-user-avatar { width: 48px; height: 48px; overflow: hidden; display: grid; place-items: end center; border-radius: 8px; background: #e3e5e1; color: transparent; font-weight: 700; }
.figma-user-avatar img, .figma-user-avatar svg { width: 46px; height: 43px; display: block; }
.figma-user-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.figma-user-copy strong { color: #222; font-size: 15px; }
.figma-user-copy small { overflow: hidden; color: #959aaa; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.figma-user-more { color: #7f8798; }
.figma-user-menu { position: absolute; z-index: 920; right: 0; bottom: 56px; width: 212px; padding: 8px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; box-shadow: 0 8px 28px rgba(25,50,45,.14); }
.figma-user-menu button { width: 100%; height: 34px; padding: 0 10px; border: 0; background: transparent; color: var(--ui-text); text-align: left; }
.figma-nav-mode-title { padding: 3px 8px 7px; color: var(--ui-muted); font-size: 11px; }
.figma-nav-mode-switch { margin-bottom: 6px; padding: 3px; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; border-radius: 8px; background: #f1f4f3; }
.figma-user-menu .figma-nav-mode-switch button { height: 30px; padding: 0; border-radius: 6px; text-align: center; }
.figma-user-menu .figma-nav-mode-switch button.active { background: #fff; color: var(--ui-accent); font-weight: 600; box-shadow: 0 1px 4px rgba(35,67,62,.12); }

/* Figma 1:2166 — tabs. */
.tabbar-wrap {
  position: fixed;
  z-index: 260;
  left: 274px;
  top: var(--ui-tab-top);
  right: 340px;
  width: auto;
  height: var(--ui-tab-height);
  overflow: hidden;
}
#tabbar { height: var(--ui-tab-height); display: flex; gap: 10px; align-items: flex-start; overflow: hidden; }
#tabbar::-webkit-scrollbar { display: none; }
.tab-pages { min-width: 0; display: flex; gap: 14px; overflow: hidden; }
.page-tab {
  width: 140px;
  min-width: 140px;
  height: var(--ui-tab-height);
  display: grid;
  grid-template-columns: minmax(0,1fr) 28px;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  background: #fff;
  color: #70788a;
}
.page-tab.active { background: var(--ui-accent); color: #fff; }
.tab-title, .tab-close { border: 0; background: transparent; color: inherit; }
.tab-title { min-width: 0; padding: 0 0 0 16px; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.tab-close { padding: 0; font-size: 18px; }
.tab-tools { height: 40px; margin-left: auto; display: flex; flex: 0 0 62px; gap: 6px; align-items: center; background: var(--ui-canvas); }
.tab-scroll-control { width: 16px; height: 20px; padding: 0; border: 0; background: transparent; color: #758093; font-size: 16px; }
.tab-more-menu { position: relative; }
.tab-more-menu > summary { width: 18px; height: 20px; display: grid; place-items: center; border-radius: 0; background: transparent; color: #758093; list-style: none; }
.tab-more-list { position: fixed; z-index: 900; top: 50px; right: 340px; width: 120px; padding: 6px; border-radius: 8px; background: #fff; box-shadow: 0 8px 28px rgba(25,50,45,.14); }
.tab-more-list button { width: 100%; height: 34px; border: 0; background: transparent; }

/* Top-right controls from Figma 1:2151–1:2223. */
.topbar { display: none; }
.company-switch, .top-links > span, .operator-session > span, .operator-session strong, .operator-session em { display: none; }
.operator-session { display: flex; gap: 8px; }
.operator-session button {
  width: 34px;
  height: 34px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 10px;
  background: var(--ui-accent);
  color: transparent;
}
.operator-session button::before { display: grid; place-items: center; color: #fff; font-size: 15px; }
.operator-session button[data-change-password]::before { content: "锁"; }
.operator-session button[data-auth-logout]::before { content: "退"; }

.figma-global-tools {
  position: fixed;
  z-index: 280;
  right: 0;
  left: auto;
  top: 7px;
  width: 200px;
  height: 43px;
}
.figma-global-tools button { font-family: "Microsoft YaHei", sans-serif; }
.figma-alarm { position: absolute; left: 0; top: 7px; width: 108px; height: 34px; padding: 0 24px; display: grid; place-items: center; border: 0; border-radius: 17px 10px 10px 17px; background: var(--ui-accent); color: #fff; }
.figma-alarm > span { position: absolute; left: 8px; top: 7px; width: 20px; height: 20px; display: grid; place-items: center; overflow: hidden; color: transparent; background: url("/figma-assets/alarm.png") center/20px 20px no-repeat; }
.figma-alarm b { font-size: 14px; font-weight: 400; }
.figma-alarm em { position: absolute; right: -2px; top: -8px; min-width: 16px; height: 16px; padding: 0 3px; display: grid; place-items: center; border: 2px solid #fff; border-radius: 12px; background: #fc4545; color: #fff; font: normal 11px/1 DIN, sans-serif; }
.figma-tool { position: absolute; top: 6px; width: 34px; height: 34px; padding: 0; display: grid; place-items: center; border: 1px solid transparent; border-radius: 10px; background: var(--ui-accent); color: #fff; cursor: pointer; }
.figma-tool svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.figma-tool::after {
  content: attr(data-tooltip);
  position: absolute;
  top: 40px;
  right: 0;
  min-width: max-content;
  padding: 5px 8px;
  visibility: hidden;
  border-radius: 5px;
  background: #263330;
  color: #fff;
  font-size: 11px;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-2px);
  transition: opacity .12s ease, transform .12s ease;
}
.figma-tool:hover::after,
.figma-tool:focus-visible::after { visibility: visible; opacity: 1; transform: translateY(0); }
.figma-tool:focus-visible { outline: 2px solid #73b9af; outline-offset: 2px; }
.figma-tool-bell { left: 116px; }
.figma-tool-bell { border-color: #c7ded9; background: #e7f2f0; color: var(--ui-accent); }
.figma-tool-inbox { left: 158px; }
.figma-tool-inbox::after { right: 0; }
body.nav-mode-daily .figma-tool-bell,
body.nav-mode-daily .figma-tool-inbox { display: none; }
.figma-language { width: 46px; height: 24px; padding: 2px; display: grid; grid-template-columns: 20px 20px; border-radius: 7px; background: #f1f3f3; }
.figma-language b, .figma-language i { display: grid; place-items: center; border-radius: 10px; font: normal 12px/1 "Microsoft YaHei", sans-serif; }
.figma-language b { background: var(--ui-accent); color: #fff; }
.figma-language i { background: #dce6e5; color: #6c7a78; }

/* Figma 1:1823 — fixed content canvas. */
.main {
  position: fixed;
  left: 274px;
  top: var(--ui-main-top);
  right: 20px;
  bottom: 20px;
  width: auto;
  height: auto;
  min-height: 0;
  overflow: hidden;
}
#view, .page-workspace, .page-body { width: 100%; height: 100%; min-width: 0; min-height: 0; }
.figma-template-layout, .figma-document-workbench {
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 303px minmax(0,1fr);
  gap: 20px;
}
.figma-template-layout.no-secondary-navigation { grid-template-columns: minmax(0,1fr); }
.figma-template-secondary, .figma-template-main,
.figma-workbench-sidebar, .figma-workbench-main {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 16px;
  background: #fff;
}

/* Figma 1:1824 — searchable secondary tree. */
.figma-template-secondary { padding: 16px; display: flex; flex-direction: column; }
.figma-template-search {
  width: 271px;
  height: 36px;
  padding: 0 16px;
  display: grid;
  grid-template-columns: 18px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--ui-control-line);
  border-radius: 6px;
  color: #a0b5c4;
}
.figma-template-search input { width: 100%; height: 34px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ui-text); }
.figma-template-tree { flex: 1; min-height: 0; margin-top: 16px; overflow: auto; scrollbar-width: none; }
.figma-template-tree::-webkit-scrollbar { display: none; }
.figma-template-group { width: 271px; margin: 0 0 14px; overflow: hidden; border: 1px solid var(--ui-control-line); border-radius: 6px; }
.figma-template-group > summary { height: 48px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; font-weight: 600; list-style: none; }
.figma-template-group > summary::-webkit-details-marker { display: none; }
.figma-template-group > summary i { color: #7f8798; font-style: normal; }
.figma-template-group-items { padding: 0 14px 10px; display: flex; flex-direction: column; gap: 2px; }
.figma-template-group:first-of-type .figma-template-item:nth-child(n+4) { display: none; }
.figma-template-item { width: 243px; height: 39px; padding: 0 20px; border: 0; border-radius: 6px; background: transparent; color: #667286; text-align: left; }
.figma-template-item:hover { background: #f4f7fc; color: var(--ui-accent); }
.figma-template-item.active { border: 1px solid var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent); }

/* Main panel composition. */
.figma-template-main, .figma-workbench-main { position: relative; padding: var(--ui-shell-content-padding); }
.page-head { height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.figma-template-main > .page-head .toolbar {
  min-width: 0;
  display: flex;
  flex: 1;
  justify-content: flex-end;
}
.figma-template-main > .page-head .toolbar-group.secondary.right { margin-left: 0; }
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head {
  height: 42px;
  gap: 32px;
}
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .page-title { flex: 0 0 auto; }
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar {
  min-width: 0;
  display: flex;
  flex: 1;
  justify-content: flex-end;
  gap: 6px;
  overflow: visible;
}
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar-group { min-width: 0; gap: 6px; flex-wrap: nowrap; }
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar button,
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar .export-link,
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar-menu > summary {
  min-width: 0;
  height: 30px;
  padding: 0 9px;
  border-radius: 7px;
  font-size: 12px;
}
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-head .toolbar-check { height: 30px; font-size: 12px; }
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main > .page-body { height: calc(100% - 58px); margin-top: 16px; }
.page-title { min-width: 0; }
.page-title h1 { position: relative; margin: 0; padding-left: 12px; color: var(--ui-title); font-size: 16px; font-weight: 600; white-space: nowrap; }
.page-title h1::before { content: ""; position: absolute; left: 0; top: 2px; width: 4px; height: 18px; border-radius: 2px; background: var(--ui-accent); }
.page-title p { display: none; }
.page-guide-strip {
  width: 100%;
  height: 38px;
  min-height: 38px;
  margin-top: 6px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  gap: 18px;
  overflow: hidden;
  border: 1px solid #dce9e6;
  border-radius: 8px;
  background: #f6faf9;
  color: #64716f;
  font-size: 11px;
  white-space: nowrap;
}
.page-guide-strip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.page-guide-strip > span b { margin-right: 6px; color: var(--ui-accent); font-weight: 600; }
.page-flow-route { height: 28px; margin-left: auto; display: flex; flex: 0 0 auto; align-items: center; gap: 3px; }
.page-flow-route button { height: 28px; padding: 0 8px; display: flex; align-items: center; gap: 5px; border: 0; border-radius: 6px; background: transparent; color: #74817f; font-size: 11px; }
.page-flow-route button + button::before { content: "›"; margin-left: -8px; margin-right: 2px; color: #a8b7b4; }
.page-flow-route button b { width: 17px; height: 17px; display: grid; place-items: center; border: 1px solid #b9ccc8; border-radius: 50%; color: #6e817d; font: 600 10px/1 DIN, sans-serif; }
.page-flow-route button:hover { background: #eaf4f2; color: var(--ui-accent); }
.page-flow-route button.active { background: var(--ui-accent); color: #fff; }
.page-flow-route button.active b { border-color: rgba(255,255,255,.7); color: #fff; }
.figma-template-main:has(> .page-guide-strip) > .page-body { height: calc(100% - 84px); margin-top: 6px; }
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main:has(> .page-guide-strip) > .page-body { height: calc(100% - 92px); margin-top: 6px; }
.figma-template-main > .page-body { height: calc(100% - 50px); margin-top: 16px; overflow: auto; }
.figma-template-main .erp-filter-panel { display: none; }
.figma-template-main .customer-foundation-page { display: block; }
.figma-template-main .customer-foundation-side { display: none; }
.figma-template-main [data-erp-grid] { width: max-content !important; min-width: 100% !important; table-layout: fixed; }
.figma-template-main [data-erp-grid] col:first-child { width: 72px !important; }
.figma-template-main [data-erp-grid] col:last-child { width: 160px !important; }
.figma-template-main [data-erp-grid] col:nth-child(n+7):not(:last-child),
.figma-template-main [data-erp-grid] th:nth-child(n+7):not(:last-child),
.figma-template-main [data-erp-grid] td:nth-child(n+7):not(:last-child) { display: none; }
.figma-template-main [data-grid-table-key="sales.orders.detail"] [data-erp-grid] {
  width: max-content !important;
  min-width: 2680px !important;
  table-layout: fixed;
}
.figma-template-main [data-grid-table-key="sales.orders.detail"] [data-erp-grid] col:nth-child(n),
.figma-template-main [data-grid-table-key="sales.orders.detail"] [data-erp-grid] th:nth-child(n),
.figma-template-main [data-grid-table-key="sales.orders.detail"] [data-erp-grid] td:nth-child(n) {
  display: table-cell;
}
.figma-template-main [data-grid-table-key="sales.orders"] [data-erp-grid] col:nth-child(n),
.figma-template-main [data-grid-table-key="sales.orders"] [data-erp-grid] th:nth-child(n),
.figma-template-main [data-grid-table-key="sales.orders"] [data-erp-grid] td:nth-child(n) {
  display: table-cell;
}
.figma-template-main [data-grid-table-key="sales.orders.detail"] td[data-document-rowspan] {
  vertical-align: middle;
  padding-top: 0;
}
.sales-status-pair { display: grid; gap: 2px; align-content: center; }
.sales-status-line { min-width: 0; display: flex; align-items: center; gap: 5px; line-height: 17px; white-space: nowrap; }
.sales-status-line small { color: #9aa2ad; font-size: 10px; font-weight: 400; }
.sales-status-line b { color: var(--ui-accent); font-size: 12px; font-weight: 500; }
.sales-status-line.warn b { color: var(--ui-danger); }
.figma-sales-orders-shell .page-body { overflow: hidden; }
.figma-sales-orders-shell .board, .figma-sales-orders-shell .board-body, .figma-sales-orders-shell .document-grid-outer { width: 100%; height: 100%; }
.figma-sales-orders-shell .document-grid-outer { margin: 0; }
.figma-sales-orders-shell .grid-shell { height: 100%; }
.board, .workbench-page, .config-list-page, .document-edit-page, .voucher-detail-page, .detail-card, .summary-card { border: 0; border-radius: 0; background: #fff; box-shadow: none; }
.board-title { min-height: 36px; display: flex; align-items: center; justify-content: space-between; color: var(--ui-title); font-weight: 600; }
.figma-template-main .board-title { display: none; }
.board-body { padding: 0; }

.figma-template-main .metric-strip {
  min-width: 0;
  min-height: 70px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fff;
}
.figma-template-main .metric-strip > div { min-width: 0; padding: 11px 14px; display: grid; align-content: center; gap: 4px; border-left: 1px solid var(--ui-line); }
.figma-template-main .metric-strip > div:first-child { border-left: 0; }
.figma-template-main .metric-strip span { color: #7b8491; font-size: 11px; white-space: nowrap; }
.figma-template-main .metric-strip strong { overflow: hidden; color: #27313b; font-size: 18px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }

/* Shared segmented filters used by platform, import and queue pages. */
.status-tabs {
  min-width: 0;
  min-height: 40px;
  padding: 4px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  overflow-x: auto;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #f7f9fa;
  scrollbar-width: thin;
}
.status-tab {
  height: 30px;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #657083;
  font-size: 12px;
}
.status-tab b { min-width: 18px; color: #9098a4; font-size: 11px; font-weight: 500; text-align: center; }
.status-tab:hover { border-color: #ccd9d7; background: #fff; color: var(--ui-accent); }
.status-tab.active { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.status-tab.active b { color: #fff; }
.filterbar { min-height: 38px; display: flex; align-items: center; gap: 10px; color: #657083; font-size: 12px; }
.filterbar select { height: 32px; min-width: 150px; padding: 0 28px 0 9px; border: 1px solid var(--ui-control-line); border-radius: 6px; background: #fff; color: var(--ui-text); }
.filter-chips { min-width: 0; display: flex; align-items: center; gap: 3px; overflow-x: auto; }
.filter-chips button { height: 28px; padding: 0 8px; display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; border: 1px solid #d6dfe1; border-radius: 6px; background: #fff; color: #667180; font-size: 11px; }
.filter-chips button b { color: #9299a7; font-size: 10px; font-weight: 500; }
.filter-chips button.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent); }
.filter-chips button.active b { color: var(--ui-accent); }

/* Platform authorization uses a real rail instead of raw browser buttons. */
.page-workspace[data-page-kind="PlatformAuthLayout"] .figma-template-main > .page-body { overflow: hidden; }
.platform-auth-layout { height: 100%; min-width: 0; min-height: 0; display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 14px; }
.platform-auth-sidebar {
  min-width: 0;
  padding: 12px;
  overflow: auto;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #f8f9fa;
}
.platform-auth-title { margin: 0 0 8px; color: #7b8491; font-size: 12px; font-weight: 600; }
.platform-auth-list { display: grid; gap: 4px; }
.platform-auth-list button {
  min-height: 38px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #596474;
  text-align: left;
}
.platform-auth-list button:hover { border-color: #d4dfdd; background: #fff; }
.platform-auth-list button.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent); }
.platform-auth-list button b { min-width: 20px; font-size: 12px; font-weight: 600; text-align: center; }
.platform-auth-list button em { min-width: 18px; height: 18px; display: grid; place-items: center; border-radius: 9px; background: #fff0f0; color: var(--ui-danger); font-size: 10px; font-style: normal; }
.platform-auth-main { min-width: 0; min-height: 0; overflow: hidden; }
.platform-auth-main > .board, .platform-auth-main > .board > .board-body { height: 100%; min-height: 0; }
.platform-auth-main > .board > .board-body { display: flex; flex-direction: column; }
.platform-auth-main .erp-filter-panel { width: 100%; padding: 10px 12px; display: block; flex: 0 0 auto; border: 1px solid var(--ui-line); border-radius: 9px; background: #fbfcfc; }
.platform-auth-main .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.platform-auth-main .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(3, minmax(160px, 1fr)); gap: 8px 12px; }
.platform-auth-main .erp-filter-field { margin: 0; grid-template-columns: 72px minmax(0, 1fr); }
.platform-auth-main .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.platform-auth-main .grid-shell { flex: 1; }
.platform-auth-main [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.platform-auth-main [data-erp-grid] col:nth-child(n),
.platform-auth-main [data-erp-grid] th:nth-child(n),
.platform-auth-main [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

/* Customer and carrier foundations share a searchable master-data frame. */
.page-workspace[data-page-kind="BasicDataListPageWithQuery"] .figma-template-main > .page-body { overflow: hidden; }
.customer-foundation-page,
.carrier-foundation-page {
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: grid !important;
  grid-template-columns: 224px minmax(0, 1fr);
  gap: 14px;
}
.figma-template-main .customer-foundation-side,
.carrier-foundation-side {
  min-width: 0;
  padding: 12px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #f8f9fa;
}
.customer-foundation-search,
.carrier-foundation-search {
  height: 36px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  border: 1px solid #d5dddf;
  border-radius: 7px;
  background: #fff;
  color: #7c8591;
  font-size: 12px;
}
.customer-foundation-tree,
.carrier-foundation-tree { margin-top: 10px; display: grid; gap: 4px; }
.customer-foundation-tree-item,
.carrier-foundation-tree-item {
  min-height: 40px;
  padding: 7px 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #5f6977;
}
.customer-foundation-tree-item strong,
.carrier-foundation-tree-item strong { font-size: 12px; font-weight: 500; }
.customer-foundation-tree-item span,
.carrier-foundation-tree-item span { color: #9098a4; font-size: 11px; }
.customer-foundation-tree-item.active,
.carrier-foundation-tree-item.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent); }
.customer-foundation-boundary,
.carrier-foundation-boundary { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--ui-line); color: #9299a7; font-size: 10px; }
.customer-foundation-board,
.carrier-foundation-board { height: 100%; min-width: 0; min-height: 0; overflow: hidden; }
.customer-foundation-board > .board-body,
.carrier-foundation-board > .board-body { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.customer-party-tabs { min-height: 38px; padding: 4px; display: flex; flex: 0 0 auto; align-items: center; gap: 3px; border: 1px solid var(--ui-line); border-radius: 8px; background: #f7f9fa; }
.customer-party-tab { height: 28px; padding: 0 11px; display: inline-flex; align-items: center; border-radius: 6px; color: #8a929d; font-size: 12px; }
.customer-party-tab.active { background: var(--ui-accent); color: #fff; }
.customer-party-tab.disabled { opacity: .55; }
.customer-foundation-board .erp-filter-panel,
.carrier-foundation-board .erp-filter-panel {
  width: 100%;
  margin-top: 8px;
  padding: 10px 12px;
  display: block;
  flex: 0 0 auto;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fbfcfc;
}
.customer-foundation-board .erp-filter-content,
.carrier-foundation-board .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.customer-foundation-board .erp-filter-grid,
.carrier-foundation-board .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(2, minmax(220px, 1fr)); gap: 8px 12px; }
.customer-foundation-board .erp-filter-field,
.carrier-foundation-board .erp-filter-field { margin: 0; }
.customer-foundation-board .erp-filter-tools,
.carrier-foundation-board .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.customer-foundation-board .grid-shell,
.carrier-foundation-board .grid-shell { flex: 1; margin-top: 8px; }
.customer-foundation-board [data-erp-grid],
.carrier-foundation-board [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.customer-foundation-board [data-erp-grid] col:nth-child(n),
.customer-foundation-board [data-erp-grid] th:nth-child(n),
.customer-foundation-board [data-erp-grid] td:nth-child(n),
.carrier-foundation-board [data-erp-grid] col:nth-child(n),
.carrier-foundation-board [data-erp-grid] th:nth-child(n),
.carrier-foundation-board [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) { height: 100%; min-width: 0; min-height: 0; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) > .basic-data-board,
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) > .basic-data-board > .board-body {
  height: 100%;
  min-width: 0;
  min-height: 0;
}
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) > .basic-data-board > .board-body { display: flex; flex-direction: column; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .erp-filter-panel {
  width: 100%;
  padding: 10px 12px;
  display: block;
  flex: 0 0 auto;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fbfcfc;
}
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .erp-filter-grid {
  min-width: 0;
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: 8px 12px;
}
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .erp-filter-field { margin: 0; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) .grid-shell { flex: 1; margin-top: 8px; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) [data-erp-grid] col:nth-child(n),
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) [data-erp-grid] th:nth-child(n),
.basic-data-list-page:not(.customer-foundation-page):not(.carrier-foundation-page) [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

/* Standard one-board lists: visible query strip plus a complete horizontally scrollable grid. */
.figma-template-main > .page-body > .board.list-board:only-child,
.figma-template-main > .page-body > .board.list-board:only-child > .board-body {
  height: 100%;
  min-width: 0;
  min-height: 0;
}
.figma-template-main > .page-body > .board.list-board:only-child > .board-body { display: flex; flex-direction: column; }
.figma-template-main > .page-body > .board.list-board:only-child .erp-filter-panel {
  width: 100%;
  padding: 10px 12px;
  display: block;
  flex: 0 0 auto;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fbfcfc;
}
.figma-template-main > .page-body > .board.list-board:only-child .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.figma-template-main > .page-body > .board.list-board:only-child .erp-filter-grid {
  min-width: 0;
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 8px 12px;
}
.figma-template-main > .page-body > .board.list-board:only-child .erp-filter-field { margin: 0; }
.figma-template-main > .page-body > .board.list-board:only-child .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.figma-template-main > .page-body > .board.list-board:only-child .grid-shell { flex: 1; margin-top: 8px; }
.figma-template-main > .page-body > .board.list-board:only-child [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.figma-template-main > .page-body > .board.list-board:only-child [data-erp-grid] col:nth-child(n),
.figma-template-main > .page-body > .board.list-board:only-child [data-erp-grid] th:nth-child(n),
.figma-template-main > .page-body > .board.list-board:only-child [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

/* Configuration and system-master lists use the same complete grid contract. */
.page-workspace[data-page-kind="ConfigListPage"] .figma-template-main > .page-body,
.page-workspace[data-page-kind="SystemMasterPage"] .figma-template-main > .page-body,
.page-workspace[data-page-kind="TreeDataListPage"] .figma-template-main > .page-body { overflow: hidden; }
.config-list-page,
.system-master-page { height: 100%; min-width: 0; min-height: 0; }
.config-list-page { display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 10px; }
.config-list-head {
  min-height: 52px;
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fbfcfc;
}
.config-list-head > div:first-child { min-width: 0; display: grid; gap: 2px; }
.config-list-head strong { color: #27313b; font-size: 13px; }
.config-list-head span { overflow: hidden; color: #858e9a; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.config-help-links { display: flex; align-items: center; gap: 6px; }
.config-help-links button { height: 30px; padding: 0 9px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; color: var(--ui-accent); font-size: 11px; }
.config-list-body { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.config-list-body .erp-filter-panel,
.system-master-page .erp-filter-panel {
  width: 100%;
  padding: 10px 12px;
  display: block;
  flex: 0 0 auto;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fbfcfc;
}
.config-list-body .erp-filter-content,
.system-master-page .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.config-list-body .erp-filter-grid,
.system-master-page .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 8px 12px; }
.config-list-body .erp-filter-field,
.system-master-page .erp-filter-field { margin: 0; }
.config-list-body .erp-filter-tools,
.system-master-page .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.config-list-body .grid-shell { flex: 1; margin-top: 8px; }
.system-master-page { display: flex; flex-direction: column; gap: 8px; }
.system-master-page > .metric-strip { flex: 0 0 auto; }
.system-master-board, .system-master-board > .board-body { min-height: 0; }
.system-master-board { flex: 1; }
.system-master-board > .board-body { height: 100%; display: flex; flex-direction: column; }
.system-master-board .grid-shell { flex: 1; margin-top: 8px; }
.config-list-body [data-erp-grid], .system-master-board [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.config-list-body [data-erp-grid] col:nth-child(n), .config-list-body [data-erp-grid] th:nth-child(n), .config-list-body [data-erp-grid] td:nth-child(n),
.system-master-board [data-erp-grid] col:nth-child(n), .system-master-board [data-erp-grid] th:nth-child(n), .system-master-board [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

/* Platform catalog: keep live Qoo10 counts readable and quarantine legacy demo mappings. */
.platform-mapping-reconciliation {
  flex: 0 0 auto;
  min-height: 68px;
  margin-top: 8px;
  padding: 8px;
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr)) minmax(300px, 2fr);
  gap: 8px;
  align-items: stretch;
  border: 1px solid #d8e7e4;
  border-radius: 9px;
  background: #f7fbfa;
}
.platform-mapping-reconciliation > i { display: none; }
.platform-mapping-reconciliation > div {
  min-width: 0;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-radius: 7px;
  background: #fff;
}
.platform-mapping-reconciliation span { color: #77838d; font-size: 11px; white-space: nowrap; }
.platform-mapping-reconciliation strong { color: #26343b; font-size: 22px; line-height: 1; font-variant-numeric: tabular-nums; }
.platform-mapping-reconciliation .matched strong { color: var(--ui-accent); }
.platform-mapping-reconciliation .unmatched strong { color: #d0644f; }
.platform-mapping-reconciliation .catalog-split {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  background: transparent;
  padding: 0;
}
.platform-mapping-reconciliation .catalog-split span {
  min-width: 0;
  padding: 8px 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 7px;
  background: #e8f3f0;
  color: #397166;
  text-overflow: ellipsis;
}
.platform-mapping-reconciliation .catalog-split span:nth-child(n+2) { background: #fff0ec; color: #a55644; }
.platform-product-cell { min-width: 0; display: flex; align-items: center; gap: 8px; }
.platform-product-cell > div { min-width: 0; display: grid; gap: 2px; }
.platform-product-cell strong, .platform-product-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.platform-product-cell small { color: #8a949e; font-size: 10px; }
.platform-product-thumb { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 6px; object-fit: cover; background: #edf3f2; }
.platform-product-thumb-empty { display: grid; place-items: center; color: var(--ui-accent); font-size: 11px; }
.platform-invalid-mapping-board {
  flex: 0 0 auto;
  margin-top: 8px;
  border: 1px solid #efd8cf;
  border-radius: 8px;
  background: #fffaf8;
}
.platform-invalid-mapping-board > summary {
  min-height: 44px;
  padding: 7px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  list-style: none;
  color: #824b3f;
}
.platform-invalid-mapping-board > summary::-webkit-details-marker { display: none; }
.platform-invalid-mapping-board > summary span { min-width: 0; display: flex; align-items: baseline; gap: 10px; }
.platform-invalid-mapping-board > summary strong { white-space: nowrap; }
.platform-invalid-mapping-board > summary small { overflow: hidden; color: #9b766e; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.platform-invalid-mapping-board > summary b { flex: 0 0 auto; color: var(--ui-accent); font-size: 11px; font-weight: 500; }
.platform-invalid-mapping-board[open] > summary b::before { content: "收起"; font-size: 0; }
.platform-invalid-mapping-content { padding: 0 8px 8px; }
.platform-invalid-mapping-content .grid-shell { height: 300px; margin-top: 0; }
.platform-local-product { min-width: 220px; display: grid; gap: 2px; line-height: 1.35; }
.platform-local-product strong { color: #303b43; }
.platform-local-product span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.platform-local-product small { color: #8a949e; font-size: 10px; }
.product-catalog-code { min-width: 0; display: flex; align-items: center; gap: 8px; }
.product-catalog-code img,
.product-catalog-image-empty { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 6px; background: #eef3f2; }
.product-catalog-code img { object-fit: contain; }
.product-catalog-image-empty { display: grid; place-items: center; color: var(--ui-accent); font-size: 10px; }
.product-catalog-code strong { overflow: hidden; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.product-detail-image { display: flex; align-items: center; gap: 10px; }
.product-detail-image img { width: 72px; height: 72px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; object-fit: contain; }
.product-detail-image span { color: #74808a; font-size: 11px; }
@media (max-width: 1280px) {
  .platform-mapping-reconciliation { grid-template-columns: repeat(3, minmax(100px, 1fr)); }
  .platform-mapping-reconciliation .catalog-split { grid-column: 1 / -1; }
}

.page-workspace[data-page-kind="LogListPage"] .figma-template-main > .page-body {
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 70px minmax(0, 1fr);
  gap: 10px;
}
.page-workspace[data-page-kind="LogListPage"] .page-body > .list-board,
.page-workspace[data-page-kind="LogListPage"] .page-body > .list-board > .board-body { min-height: 0; }
.page-workspace[data-page-kind="LogListPage"] .page-body > .list-board > .board-body { height: 100%; display: flex; flex-direction: column; }
.page-workspace[data-page-kind="LogListPage"] .erp-filter-panel { width: 100%; padding: 10px 12px; display: block; flex: 0 0 auto; border: 1px solid var(--ui-line); border-radius: 9px; background: #fbfcfc; }
.page-workspace[data-page-kind="LogListPage"] .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.page-workspace[data-page-kind="LogListPage"] .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 8px 12px; }
.page-workspace[data-page-kind="LogListPage"] .erp-filter-field { margin: 0; }
.page-workspace[data-page-kind="LogListPage"] .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.page-workspace[data-page-kind="LogListPage"] .grid-shell { flex: 1; margin-top: 8px; }
.page-workspace[data-page-kind="LogListPage"] [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.page-workspace[data-page-kind="LogListPage"] [data-erp-grid] col:nth-child(n),
.page-workspace[data-page-kind="LogListPage"] [data-erp-grid] th:nth-child(n),
.page-workspace[data-page-kind="LogListPage"] [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

.page-workspace[data-page-kind="SystemDiagnosticsPage"] .figma-template-main > .page-body {
  overflow-x: hidden;
  overflow-y: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
  align-content: start;
  gap: 10px;
}
.page-workspace[data-page-kind="SystemDiagnosticsPage"] .page-body > .metric-strip { grid-column: 1; }
.page-workspace[data-page-kind="SystemDiagnosticsPage"] .page-body > .board {
  min-width: 0;
  min-height: 220px;
  display: grid;
  grid-template-rows: 42px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
}
.figma-template-main .page-workspace[data-page-kind="SystemDiagnosticsPage"] .board-title,
.page-workspace[data-page-kind="SystemDiagnosticsPage"] .figma-template-main .board-title {
  min-height: 42px;
  padding: 0 12px;
  display: flex;
  border-bottom: 1px solid var(--ui-line);
  background: #fbfcfc;
  font-size: 13px;
}
.page-workspace[data-page-kind="SystemDiagnosticsPage"] .board-body { min-height: 0; overflow: hidden; }
.page-workspace[data-page-kind="SystemDiagnosticsPage"] .grid-shell { min-height: 170px; }
.page-workspace[data-page-kind="SystemDiagnosticsPage"] [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.page-workspace[data-page-kind="SystemDiagnosticsPage"] [data-erp-grid] col:nth-child(n),
.page-workspace[data-page-kind="SystemDiagnosticsPage"] [data-erp-grid] th:nth-child(n),
.page-workspace[data-page-kind="SystemDiagnosticsPage"] [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

.page-workspace[data-page-kind="ShipmentSyncPage"] .figma-template-main > .page-body {
  overflow: hidden;
  display: grid;
  grid-template-rows: 112px minmax(0, 1fr);
  gap: 10px;
}
.page-workspace[data-page-kind="ShipmentSyncPage"] .page-body > .board { min-width: 0; min-height: 0; overflow: hidden; border: 1px solid var(--ui-line); border-radius: 9px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .page-body > .board:first-child { display: grid; grid-template-rows: 36px minmax(0, 1fr); }
.page-workspace[data-page-kind="ShipmentSyncPage"] .page-body > .board:last-child { min-height: 0; display: grid; grid-template-rows: 36px minmax(0, 1fr); }
.page-workspace[data-page-kind="ShipmentSyncPage"] .page-body > .board:last-child > .board-body { height: auto; min-height: 0; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .page-body > .board:last-child > .board-body { display: flex; flex-direction: column; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .board-title { min-height: 36px; padding: 0 12px; display: flex; border-bottom: 1px solid var(--ui-line); background: #fbfcfc; font-size: 13px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .work-queue-grid { height: 100%; padding: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .todo { min-height: 58px; padding: 8px 11px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-content: center; gap: 1px 6px; border: 1px solid #e1e8e8; border-radius: 7px; background: #fbfcfc; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .todo strong { grid-row: 1 / span 2; margin-right: 3px; color: var(--ui-accent); font-size: 20px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .todo span { margin: 0; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .erp-filter-panel { width: 100%; padding: 10px 12px; display: block; flex: 0 0 auto; border-bottom: 1px solid var(--ui-line); }
.page-workspace[data-page-kind="ShipmentSyncPage"] .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 8px 12px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .erp-filter-field { margin: 0; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.page-workspace[data-page-kind="ShipmentSyncPage"] .grid-shell { flex: 1; }
.page-workspace[data-page-kind="ShipmentSyncPage"] [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.page-workspace[data-page-kind="ShipmentSyncPage"] [data-erp-grid] col:nth-child(n),
.page-workspace[data-page-kind="ShipmentSyncPage"] [data-erp-grid] th:nth-child(n),
.page-workspace[data-page-kind="ShipmentSyncPage"] [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

.page-workspace[data-ui-template="query-list"][data-page-kind="ShipmentSyncPage"] .figma-template-main > .page-body {
  height: auto;
  min-height: 0;
  margin-top: 8px;
  flex: 1 1 auto;
}

.page-workspace[data-page-kind="SystemDiagnosticsPage"]:has([data-grid-table-key="sync.realApi"]) .page-body > .list-board {
  min-height: 520px;
}

/* Product catalog keeps category browsing, filters and grid in one frame. */
.tree-data-list-page { height: 100%; min-width: 0; min-height: 0; display: grid; grid-template-columns: 224px minmax(0, 1fr); gap: 14px; }
.side-filter-panel { min-width: 0; padding: 12px; overflow: auto; border: 1px solid var(--ui-line); border-radius: 10px; background: #f8f9fa; }
.side-filter-title { margin-bottom: 8px; color: #7b8491; font-size: 12px; font-weight: 600; }
.side-filter-panel button { width: 100%; min-height: 42px; padding: 7px 9px; display: grid; gap: 2px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #5f6977; text-align: left; }
.side-filter-panel button strong { font-size: 12px; font-weight: 500; }
.side-filter-panel button span { overflow: hidden; color: #9299a7; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.side-filter-panel button:hover { border-color: #d4dfdd; background: #fff; }
.side-filter-panel button.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); color: var(--ui-accent); }
.tree-data-board, .tree-data-board > .board-body { height: 100%; min-width: 0; min-height: 0; }
.tree-data-board > .board-body { display: flex; flex-direction: column; }
.tree-data-board .erp-filter-panel { width: 100%; padding: 10px 12px; display: block; flex: 0 0 auto; border: 1px solid var(--ui-line); border-radius: 9px; background: #fbfcfc; }
.tree-data-board .erp-filter-content { display: flex; align-items: end; gap: 12px; }
.tree-data-board .erp-filter-grid { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 8px 12px; }
.tree-data-board .erp-filter-field { margin: 0; }
.tree-data-board .erp-filter-tools { width: 190px; flex: 0 0 190px; }
.tree-data-board .grid-shell { flex: 1; margin-top: 8px; }
.tree-data-board [data-erp-grid] { width: max-content !important; min-width: 100% !important; }
.tree-data-board [data-erp-grid] col:nth-child(n), .tree-data-board [data-erp-grid] th:nth-child(n), .tree-data-board [data-erp-grid] td:nth-child(n) { display: table-cell !important; }

/* Sync workbench: a dense daily control surface, not a vertical report stack. */
.page-workspace[data-page-kind="WorkbenchPage"] .figma-template-main > .page-body {
  height: calc(100% - 50px);
  overflow: hidden;
}
.page-workspace[data-page-kind="WorkbenchPage"] .workbench-page {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: 48px 72px minmax(0, 1fr);
  gap: 10px;
  background: transparent;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-rail {
  min-width: 0;
  padding: 5px 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
  border: 1px solid #d8e7e3;
  border-radius: 9px;
  background: #f7fbfa;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-rail-label {
  flex: none;
  padding-left: 4px;
  color: #58706a;
  font-size: 12px;
  font-weight: 700;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-options {
  min-width: 0;
  display: flex;
  align-items: stretch;
  gap: 5px;
  overflow-x: auto;
}
.page-workspace[data-page-kind="WorkbenchPage"] button.sync-platform-option {
  min-width: 86px;
  min-height: 34px;
  padding: 3px 9px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 0;
  border: 1px solid #dce5e3;
  border-radius: 7px;
  background: #fff;
  color: #4d5e5a;
  box-shadow: none;
}
.page-workspace[data-page-kind="WorkbenchPage"] button.sync-platform-option strong {
  font-size: 12px;
  line-height: 15px;
}
.page-workspace[data-page-kind="WorkbenchPage"] button.sync-platform-option small {
  color: #8a9995;
  font-size: 9px;
  line-height: 12px;
}
.page-workspace[data-page-kind="WorkbenchPage"] button.sync-platform-option.active {
  border-color: #278a7f;
  background: #278a7f;
  color: #fff;
}
.page-workspace[data-page-kind="WorkbenchPage"] button.sync-platform-option.active small { color: #d8f1ed; }
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-scope-note {
  margin-left: auto;
  flex: none;
  color: #74847f;
  font-size: 11px;
  white-space: nowrap;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-empty {
  min-height: 250px;
  padding: 48px 24px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  color: #657671;
  text-align: center;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-empty strong {
  color: #253531;
  font-size: 16px;
}
.page-workspace[data-page-kind="WorkbenchPage"] .sync-platform-empty span {
  max-width: 520px;
  line-height: 1.7;
}
.workbench-summary-strip { min-width: 0; }
.workbench-summary-strip .metric-strip {
  height: 72px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #fff;
}
.workbench-summary-strip .metric-strip > div {
  min-width: 0;
  padding: 12px 16px;
  display: grid;
  align-content: center;
  gap: 4px;
  border-left: 1px solid var(--ui-line);
}
.workbench-summary-strip .metric-strip > div:first-child { border-left: 0; }
.workbench-summary-strip .metric-strip span {
  color: #7b8491;
  font-size: 12px;
  white-space: nowrap;
}
.workbench-summary-strip .metric-strip strong {
  overflow: hidden;
  color: var(--ui-title);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workbench-summary-strip .metric-strip > div:nth-child(n+3) strong { color: var(--ui-accent); }
.workbench-main-grid {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 356px;
  gap: 14px;
}
.workbench-primary, .workbench-side-stack,
.workbench-primary > .board, .workbench-primary > .board > .board-body {
  min-width: 0;
  min-height: 0;
}
.workbench-primary > .board {
  height: 100%;
  display: grid;
  grid-template-rows: 42px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
}
.figma-template-main .workbench-page .board-title {
  min-height: 42px;
  padding: 0 14px;
  display: flex;
  border-bottom: 1px solid var(--ui-line);
  background: #fbfcfc;
  font-size: 14px;
}
.workbench-primary .grid-shell { height: 100%; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] {
  width: 100% !important;
  min-width: 960px !important;
  table-layout: fixed;
}
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(1) { width: 118px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(2) { width: 94px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(3) { width: 230px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(4) { width: 245px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(5) { width: 235px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] [data-erp-grid] col:nth-child(6) { width: 154px !important; }
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] th,
.workbench-primary [data-grid-table-key="sync.workbenchSummary"] td { padding-right: 12px; padding-left: 12px; }
.workbench-side-stack {
  display: grid;
  grid-template-rows: minmax(280px, .95fr) minmax(270px, 1.05fr);
  gap: 14px;
  overflow: hidden;
}
.workbench-side-stack:has(.sync-recent-list > .sync-panel-empty) {
  grid-template-rows: 126px minmax(0, 1fr);
}
.workbench-side-stack > div, .workbench-side-stack .board, .workbench-side-stack .board-body { min-height: 0; }
.workbench-side-stack .board {
  height: 100%;
  display: grid;
  grid-template-rows: 42px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
}
.sync-panel-link {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-accent);
  font-size: 12px;
}
.sync-recent-list, .sync-shortcut-list { height: 100%; min-height: 0; overflow: auto; scrollbar-width: thin; }
.sync-recent-item {
  position: relative;
  padding: 11px 72px 11px 14px;
  border-bottom: 1px solid var(--ui-line);
}
.sync-recent-item:last-child { border-bottom: 0; }
.sync-recent-heading, .sync-recent-meta { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sync-recent-heading strong { overflow: hidden; color: #27313b; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.sync-recent-heading .status { min-height: 20px; padding: 2px 7px; flex: 0 0 auto; font-size: 11px; }
.sync-recent-meta { margin-top: 3px; justify-content: flex-start; color: #9299a7; font-size: 11px; }
.sync-recent-meta time { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sync-recent-item p { margin: 5px 0 0; overflow: hidden; color: #687382; font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.sync-recent-item > button {
  position: absolute;
  right: 14px;
  bottom: 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-accent);
  font-size: 12px;
}
.sync-panel-empty { padding: 28px 14px; color: var(--ui-muted); text-align: center; }
.sync-shortcut-item {
  width: 100%;
  min-height: 58px;
  padding: 9px 12px 9px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  gap: 10px;
  align-items: center;
  border: 0;
  border-bottom: 1px solid var(--ui-line);
  background: #fff;
  color: var(--ui-text);
  text-align: left;
}
.sync-shortcut-item:last-child { border-bottom: 0; }
.sync-shortcut-item:hover { background: #f5faf8; }
.sync-shortcut-item span { min-width: 0; display: grid; gap: 2px; }
.sync-shortcut-item strong { color: #27313b; font-size: 13px; font-weight: 600; }
.sync-shortcut-item small { overflow: hidden; color: #8a929d; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.sync-shortcut-item i { color: #91aaa7; font-size: 22px; font-style: normal; text-align: center; }

@media (max-width: 1580px) {
  .workbench-main-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  .workbench-summary-strip .metric-strip > div { padding-right: 12px; padding-left: 12px; }
}

/* Reports use one focused analysis at a time instead of stacking every table. */
.report-page {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
}
.figma-template-main .report-page > .report-filter-board {
  display: block;
}
.figma-template-main .report-page > .board:first-child .board-body {
  padding: 12px 16px;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #fbfcfc;
}
.figma-template-main .report-page > .board:first-child .erp-filter-panel {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px 14px;
}
.report-page-blocks {
  min-width: 0;
  min-height: 0;
}

/* Business overview: two financial outcomes, then operational signals and drill-downs. */
.report-page[data-report-view="overview"] {
  height: 100%;
  grid-template-rows: auto minmax(0, 1fr);
}
.report-page[data-report-view="overview"] .report-page-blocks { overflow: auto; }
.report-overview-dashboard { min-width: 0; display: grid; gap: 14px; }
.report-overview-kpi-panel,
.report-overview-directory {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #fff;
}
.report-overview-kpis {
  min-width: 0;
  min-height: 194px;
  padding: 12px;
  display: grid;
  grid-template-columns: 480px minmax(0, 1fr);
  gap: 12px;
}
.report-overview-core { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.report-overview-hero {
  min-width: 0;
  padding: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 0;
  border-radius: 8px;
  background: var(--ui-accent);
  color: #fff;
  text-align: left;
}
.report-overview-hero.secondary { background: #edf5f3; color: #1d5f58; }
.report-overview-hero span { font-size: 12px; opacity: .82; }
.report-overview-hero strong { margin-top: 10px; font-size: 26px; font-weight: 600; line-height: 1.1; letter-spacing: -.5px; white-space: nowrap; }
.report-overview-hero small { margin-top: 22px; font-size: 11px; opacity: .82; }
.report-overview-signals { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.report-overview-signal {
  min-width: 0;
  padding: 12px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-content: center;
  gap: 4px 8px;
  border: 1px solid #e2e8e8;
  border-radius: 8px;
  background: #fbfcfc;
  color: var(--ui-text);
  text-align: left;
}
.report-overview-signal:hover { border-color: #a8cbc6; background: #f5faf8; }
.report-overview-signal span { overflow: hidden; color: #697380; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.report-overview-signal strong { color: #27313b; font-size: 18px; font-weight: 600; }
.report-overview-signal small { grid-column: 1 / -1; overflow: hidden; color: #9aa1aa; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.report-overview-signal.alert strong { color: #9a6a1f; }
.report-overview-signal.danger { border-color: #f0d2d2; background: #fff8f8; }
.report-overview-signal.danger strong { color: var(--ui-danger); }
.report-overview-section-head {
  min-height: 48px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--ui-line);
  background: #fbfcfc;
}
.report-overview-section-head > div { min-width: 0; display: flex; align-items: baseline; gap: 10px; }
.report-overview-section-head strong { color: var(--ui-title); font-size: 14px; }
.report-overview-section-head span, .report-overview-section-head small { color: #8a929d; font-size: 11px; }
.report-overview-entry-grid { min-width: 0; padding: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.report-overview-entry {
  min-width: 0;
  min-height: 86px;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22px;
  gap: 5px 10px;
  align-items: center;
  border: 0;
  border-right: 1px solid var(--ui-line);
  border-bottom: 1px solid var(--ui-line);
  background: #fff;
  color: var(--ui-text);
  text-align: left;
}
.report-overview-entry:nth-child(3n) { border-right: 0; }
.report-overview-entry:nth-last-child(-n+3) { border-bottom: 0; }
.report-overview-entry:hover { background: #f5faf8; }
.report-overview-entry-copy { min-width: 0; display: grid; gap: 3px; }
.report-overview-entry-copy strong { color: #27313b; font-size: 14px; font-weight: 600; }
.report-overview-entry-copy small { overflow: hidden; color: #818a96; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.report-overview-entry-focus { min-width: 0; overflow: hidden; color: var(--ui-accent); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.report-overview-entry i { grid-column: 2; grid-row: 1 / span 2; color: #91aaa7; font-size: 22px; font-style: normal; text-align: center; }
@media (max-width: 1580px) {
  .report-overview-kpis { grid-template-columns: 420px minmax(0, 1fr); }
  .report-overview-signals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-overview-entry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-overview-entry:nth-child(3n) { border-right: 1px solid var(--ui-line); }
  .report-overview-entry:nth-child(2n) { border-right: 0; }
  .report-overview-entry:nth-last-child(-n+3) { border-bottom: 1px solid var(--ui-line); }
  .report-overview-entry:nth-last-child(-n+2) { border-bottom: 0; }
}
.report-view-switcher {
  min-height: 46px;
  padding: 6px;
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  border: 1px solid var(--ui-line);
  border-radius: 10px 10px 0 0;
  background: #f7f9fa;
  scrollbar-width: thin;
}
.report-view-tab {
  height: 32px;
  padding: 0 14px;
  flex: 0 0 auto;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #667085;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}
.report-view-tab:hover {
  border-color: #cddbd8;
  background: #fff;
  color: var(--ui-accent);
}
.report-view-tab.active {
  border-color: var(--ui-accent);
  background: var(--ui-accent);
  color: #fff;
}
.report-view-tab:focus-visible {
  outline: 2px solid #82c8bf;
  outline-offset: 2px;
}
.report-active-panel {
  min-width: 0;
  min-height: 320px;
  border: 1px solid var(--ui-line);
  border-top: 0;
  border-radius: 0 0 10px 10px;
  background: #fff;
}
.report-section-panel {
  min-width: 0;
}
.report-section-panel[hidden] {
  display: none !important;
}
.figma-template-main .report-focused-board > .board-title {
  min-height: 48px;
  padding: 0 16px;
  display: flex;
  border-bottom: 1px solid var(--ui-line);
  font-size: 15px;
}
.report-focused-board > .board-body {
  min-width: 0;
  padding: 0 16px 16px;
  overflow-x: auto;
}
.report-page:not([data-report-view="overview"]) { height: 100%; min-height: 0; }
.report-page:not([data-report-view="overview"]) .report-page-blocks,
.report-page:not([data-report-view="overview"]) .report-active-panel,
.report-page:not([data-report-view="overview"]) .report-section-panel,
.report-page:not([data-report-view="overview"]) .report-focused-board { height: 100%; min-height: 0; }
.report-page:not([data-report-view="overview"]) .report-page-blocks {
  display: grid;
  grid-template-rows: 46px minmax(0, 1fr);
  overflow: hidden;
}
.report-page:not([data-report-view="overview"]) .report-active-panel { overflow: hidden; }
.report-page:not([data-report-view="overview"]) .report-section-panel:not([hidden]) { display: block; }
.report-page:not([data-report-view="overview"]) .report-focused-board {
  display: grid;
  grid-template-rows: 48px minmax(0, 1fr);
}
.report-page:not([data-report-view="overview"]) .report-focused-board > .board-body { min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.report-page:not([data-report-view="overview"]) .report-focused-board > .board-body > div { min-height: 0; display: flex; flex: 1; flex-direction: column; }
.report-page:not([data-report-view="overview"]) .report-focused-board .grid-shell { height: auto; flex: 1; }
.report-page[data-report-view="qoo10"] .report-view-switcher { padding-right: 10px; padding-left: 10px; gap: 6px; }
.report-page[data-report-view="qoo10"] .report-view-tab { min-width: 92px; justify-content: center; }

/* Command hierarchy: primary 34px, secondary text controls, danger red. */
.toolbar { min-width: 0; display: flex; align-items: center; gap: 8px; overflow: visible; scrollbar-width: none; }
.sales-detail-row > td[data-document-rowspan="control"] {
  vertical-align: middle;
  background: #fff;
}
.toolbar::-webkit-scrollbar { display: none; }
.toolbar-group { display: flex; gap: 8px; align-items: center; }
.toolbar button, .toolbar .export-link, .drawer-form > button[type="submit"] {
  min-width: 34px;
  height: 34px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
  color: #566071;
  text-decoration: none;
  white-space: nowrap;
}
.toolbar .primary > button:first-child, .toolbar > button:first-child, .drawer-form > button[type="submit"] { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.toolbar button.danger { color: var(--ui-danger); }
.toolbar-check { height: 34px; display: flex; align-items: center; gap: 6px; color: #566071; white-space: nowrap; }
.toolbar-check input, td input[type="checkbox"], th input[type="checkbox"], .grid-row-selector input { width: 16px; height: 16px; accent-color: var(--ui-accent); }
.grid-row-selector input {
  appearance: none;
  display: inline-grid;
  place-content: center;
  border: 1.5px solid #7f8e9b;
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
}
.grid-row-selector input::before {
  width: 8px;
  height: 4px;
  content: "";
  transform: rotate(-45deg) scale(0);
  transform-origin: center;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
}
.grid-row-selector input:checked,
.grid-row-selector input:indeterminate { border-color: var(--ui-accent); background: var(--ui-accent); }
.grid-row-selector input:checked::before { transform: rotate(-45deg) scale(1); }
.toolbar-check input {
  position: relative;
  margin: 0;
  appearance: none;
  border: 1px solid #9ba8b5;
  border-radius: 3px;
  background: #fff;
}
.toolbar-check input:checked { border-color: var(--ui-accent); background: var(--ui-accent); }
.toolbar-check input:checked::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
[data-grid-control-columns="serial-select"] th[data-document-control-header],
[data-grid-control-columns="serial-select"] td:has(> .grid-row-number),
[data-grid-control-columns="serial-select"] td:has(> .grid-row-selector) {
  padding-right: 0;
  padding-left: 0;
  text-align: center;
  overflow: visible;
  text-overflow: clip;
}
[data-grid-control-columns="serial-select"] .grid-control-title,
[data-grid-control-columns="serial-select"] .grid-row-number {
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}
[data-grid-control-columns="serial-select"] .grid-row-selector { width: 100%; }
[data-grid-control-columns="serial-select"] .grid-select-all {
  width: 100%;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
[data-grid-control-columns="serial-select"] .grid-select-all input { margin: 0; cursor: pointer; }
details.toolbar-menu, details.print-template-menu, details.tab-more-menu { position: relative; }
details.toolbar-menu > summary, details.print-template-menu > summary { height: 34px; padding: 0 14px; display: flex; align-items: center; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; color: #566071; list-style: none; }
.toolbar-menu-list, .print-template-list { position: absolute; z-index: 800; top: 40px; right: 0; min-width: 160px; padding: 6px; border-radius: 8px; background: #fff; box-shadow: 0 8px 28px rgba(25,50,45,.14); }
.toolbar-menu-list button, .toolbar-menu-list a, .print-template-list button { width: 100%; height: 34px; padding: 0 10px; border: 0; background: transparent; color: var(--ui-text); text-align: left; }

.erp-filter-field input, .erp-filter-field select, .drawer-form input, .drawer-form select, .drawer-form textarea {
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--ui-control-line);
  border-radius: 6px;
  outline: 0;
  background: #fff;
  color: var(--ui-text);
}
.erp-filter-field { margin-bottom: 12px; display: grid; grid-template-columns: 84px minmax(0,1fr); gap: 10px; align-items: center; }
.erp-filter-field > span { color: #566071; font-size: 12px; font-weight: 600; }
.date-field { grid-template-columns: 1fr !important; }
.date-control { min-width: 0; }
.date-shortcuts { display: flex; flex-wrap: wrap; gap: 4px; }
.date-shortcuts button { height: 26px; padding: 0 6px; border: 0; border-radius: 6px; background: transparent; color: #657083; }
.date-shortcuts button.active { background: var(--ui-accent-soft); color: var(--ui-accent); }
.date-control em { display: block; margin-top: 6px; color: var(--ui-muted); font-size: 12px; font-style: normal; }
.table-wrap, .compact-table-wrap { min-width: 0; min-height: 0; overflow: auto; isolation: isolate; }

/* Tables: exact 44px header / 56px row. */
table { border-collapse: collapse; table-layout: fixed; }
th { height: 44px; padding: 0 16px; border-bottom: 1px solid var(--ui-line); background: #f7f7f7; color: var(--ui-muted); font-size: 14px; font-weight: 400; text-align: left; white-space: nowrap; }
td { height: 56px; padding: 0 16px; border-bottom: 1px solid var(--ui-line); background: #fff; color: var(--ui-text); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
tbody tr:hover td { background: #fafcfc; }
td button { padding: 0; border: 0; background: transparent; color: var(--ui-accent); }
.sticky-action { position: sticky; right: 0; z-index: 3; }
.table-wrap .sticky-col,
.compact-table-wrap .sticky-col,
.detail-table-wrap .sticky-col,
.stocktake-detail-table-wrap .sticky-col {
  position: sticky;
  z-index: 4;
  box-sizing: border-box;
  background: #fff;
  background-clip: padding-box;
}
.has-sticky-columns { border-collapse: separate; border-spacing: 0; }
.table-wrap thead .sticky-col,
.compact-table-wrap thead .sticky-col,
.detail-table-wrap thead .sticky-col,
.stocktake-detail-table-wrap thead .sticky-col { background: #f7f8f8; }
.table-wrap tbody tr:hover .sticky-col,
.compact-table-wrap tbody tr:hover .sticky-col,
.detail-table-wrap tbody tr:hover .sticky-col,
.stocktake-detail-table-wrap tbody tr:hover .sticky-col { background: #fafcfc; }
.table-wrap .sticky-left-edge,
.compact-table-wrap .sticky-left-edge,
.detail-table-wrap .sticky-left-edge,
.stocktake-detail-table-wrap .sticky-left-edge { box-shadow: 8px 0 12px -12px rgba(28, 54, 50, .45); }
.table-wrap .sticky-right-edge,
.compact-table-wrap .sticky-right-edge,
.detail-table-wrap .sticky-right-edge,
.stocktake-detail-table-wrap .sticky-right-edge { box-shadow: -8px 0 12px -12px rgba(28, 54, 50, .45); }
.table-wrap thead th,
.compact-table-wrap thead th,
.detail-table-wrap thead th,
.stocktake-detail-table-wrap thead th {
  position: sticky;
  z-index: 6;
  top: 0;
  background: #f7f8f8;
  box-shadow: 0 1px 0 var(--ui-line);
}
.table-wrap thead th.sticky-col,
.table-wrap thead th.sticky-action,
.compact-table-wrap thead th.sticky-col,
.compact-table-wrap thead th.sticky-action,
.detail-table-wrap thead th.sticky-col,
.detail-table-wrap thead th.sticky-action,
.stocktake-detail-table-wrap thead th.sticky-col,
.stocktake-detail-table-wrap thead th.sticky-action { z-index: 20; }
.grid-shell, .document-grid-outer { height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.grid-viewport { flex: 1; }
.grid-bottom-dock, .table-footer, .grid-statebar { height: 48px; min-height: 48px; display: flex; align-items: center; justify-content: flex-end; border-top: 1px solid var(--ui-line); background: #fff; }
.grid-statebar-main { display: flex; gap: 20px; padding: 0 16px; color: #697284; }
.grid-pagination { padding: 0 16px; display: flex; align-items: center; gap: 8px; color: #596474; font-size: 12px; }
.table-page-size-label { display: none; }
.table-page-prefix, .table-page-suffix, .table-page-total { color: #596474; font-size: 12px; white-space: nowrap; }
.table-page-size-control { position: relative; min-width: 68px; height: 28px; }
.table-page-size-control > summary {
  min-width: 68px;
  height: 28px;
  padding: 0 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #c9d2dc;
  border-radius: 6px;
  background: #fff;
  color: #303b49;
  font-weight: 600;
  list-style: none;
}
.table-page-size-control > summary::after { content: "条/页"; margin-left: 4px; color: #596474; font-size: 12px; }
.table-page-size-control > summary::-webkit-details-marker { display: none; }
.table-page-size-menu { position: absolute; z-index: 700; right: 0; bottom: 34px; width: 68px; padding: 5px; border: 1px solid #d6dde5; border-radius: 7px; background: #fff; box-shadow: 0 8px 24px rgba(25,50,45,.14); }
.table-page-size-control:not([open]) > .table-page-size-menu { display: none; }
.table-page-nav { display: flex; align-items: center; gap: 4px; }
.table-page-input-wrap { width: 36px; height: 28px; display: inline-flex; align-items: center; justify-content: center; }
.table-page-input { width: 36px; height: 28px; padding: 0 4px; border: 1px solid #c9d2dc; border-radius: 6px; background: #fff; color: #303b49; font-size: 12px; font-weight: 600; text-align: center; }
.table-page-input:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 2px rgba(39,127,117,.12); outline: 0; }
.table-page-input-text { display: none; }
.pager-btn { width: 28px; height: 28px; padding: 0; display: inline-grid; place-items: center; border: 1px solid #d7dee5; border-radius: 6px; background: #fff; color: #405063; }
.pager-btn:not(:disabled):hover { border-color: var(--ui-accent); color: var(--ui-accent); background: #f1f8f7; }
.pager-btn:disabled { border-color: #e4e8ec; background: #f5f6f7; color: #a8b0ba; opacity: 1; }
.pager-btn.active { background: var(--ui-accent); color: #fff; }
.pager-icon { display: block; font-family: Arial, sans-serif; font-size: 18px; font-weight: 600; line-height: 1; transform: translateY(-1px); }
.pager-icon-first, .pager-icon-last { font-size: 15px; letter-spacing: -1px; }
.table-page-size-menu { display: flex; flex-direction: column; gap: 2px; }
.table-page-size-option { width: 100%; min-width: 28px; height: 28px; padding: 0 6px; border: 0; border-radius: 5px; background: #fff; color: #34406d; text-align: center; }
.table-page-size-option:hover { background: #edf5f4; color: var(--ui-accent); }
.table-page-size-option.active { background: var(--ui-accent); color: #fff; }
.figma-sales-orders-shell .table-footer { width: 100%; }
.figma-sales-orders-shell .grid-statebar-main,
.figma-sales-orders-shell .table-page-size-label,
.figma-sales-orders-shell .table-page-prefix,
.figma-sales-orders-shell .table-page-suffix { display: none; }
.figma-sales-orders-shell .grid-pagination { height: 28px; display: flex; align-items: center; gap: 6px; }
.figma-sales-orders-shell .table-page-total { order: 1; color: #606266; font-size: 12px; }
.figma-sales-orders-shell .table-page-nav-before { order: 2; display: flex; gap: 3px; }
.figma-sales-orders-shell .table-page-input-wrap { order: 3; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; background: var(--ui-accent); color: #fff; }
.figma-sales-orders-shell .table-page-input { display: none; }
.figma-sales-orders-shell .table-page-input-text { display: block; color: #fff; }
.figma-sales-orders-shell .table-page-nav-after { order: 4; display: flex; gap: 3px; }
.figma-sales-orders-shell .table-page-size-control { position: relative; order: 5; width: 90px; height: 28px; }
.figma-sales-orders-shell .table-page-size-control > summary { width: 90px; height: 28px; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; border-radius: 6px; background: var(--ui-accent); color: #fff; list-style: none; }
.figma-sales-orders-shell .table-page-size-control > summary::after { content: "条/页"; margin-left: 4px; color: #fff; font-size: 12px; }
.figma-sales-orders-shell .table-page-size-menu { position: absolute; right: 0; bottom: 34px; z-index: 700; width: 90px; padding: 5px; border-radius: 6px; background: #fff; box-shadow: 0 8px 24px rgba(25,50,45,.14); }
.figma-sales-orders-shell .table-page-size-control:not([open]) .table-page-size-menu { display: none; }
.status, .badge { display: inline-flex; min-height: 24px; padding: 3px 8px; align-items: center; border-radius: 12px; background: var(--ui-accent-soft); color: var(--ui-accent); }
.status.danger, .badge.danger { background: #fff0f0; color: var(--ui-danger); }

/* Shipping workbench. */
.figma-shipping-shell .page-head { position: absolute; z-index: 4; top: 16px; right: 16px; left: 339px; background: #fff; }
.figma-shipping-shell .page-title { display: block; }
.page-workspace.figma-shipping-shell { position: relative; width: 100%; height: 100%; }
.figma-shipping-shell > .page-body { position: absolute; inset: 0; width: 100%; height: 100%; }
.figma-shipping-shell .board, .figma-shipping-shell .board-body { width: 100%; height: 100%; }
.figma-shipping-shell .board-title { display: none; }
.figma-workbench-sidebar { padding: 16px; overflow: auto; }
.figma-workbench-main { display: flex; flex-direction: column; }
.sales-workbench-status-strip { width: 271px; margin: 52px 0 16px; display: flex; flex-direction: column; gap: 10px; }
.sales-workbench-status-strip::before { content: "订单状态"; font-weight: 600; }
.sales-workbench-status-strip button { width: 271px; min-height: 40px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; border: 0; border-radius: 6px; background: transparent; color: var(--ui-text); }
.sales-workbench-status-strip button.active { background: var(--ui-accent-soft); color: var(--ui-accent); }
.erp-filter-panel { width: 271px; border-top: 1px solid var(--ui-line); padding-top: 16px; }
.erp-filter-tools { display: grid; grid-template-columns: 1.35fr 1fr; gap: 8px; }
.erp-filter-tools button {
  height: 34px;
  min-width: 0;
  padding: 0 8px;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: #fff;
  color: #566071;
}
.erp-filter-tools button:first-child { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.filter-toggle-bar { margin-top: 8px; }
.filter-toggle { width: 100%; height: 32px; border: 0; border-radius: 7px; background: #f4f7fc; color: #657083; }
.erp-filter-panel.collapsed [data-filter-extra="true"] { display: none !important; }
.filter-toggle:hover,
.filter-toggle:focus-visible { background: #e9f1ef; color: var(--ui-accent); }
.table-sort { padding: 0; border: 0; background: transparent; color: inherit; font-weight: inherit; }
.figma-workbench-main .sales-workbench-result-strip {
  height: 34px;
  margin-top: 52px;
  display: flex;
  flex: 0 0 34px;
  align-items: center;
  justify-content: space-between;
  color: var(--ui-muted);
  font-size: 13px;
}
.figma-workbench-main .sales-workbench-result-strip strong { margin: 0 4px; color: var(--ui-title); font-weight: 600; }
.figma-workbench-main .sales-workbench-result-side { color: var(--ui-accent); }
.figma-workbench-main .document-grid-outer { flex: 1; min-height: 0; margin-top: 8px; }

/* Reusable cards/forms without legacy borders. */
.work-queue-grid, .flow-grid, .kpi-grid, .summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.todo, .flow, .kpi, .summary-card { min-height: 84px; padding: 14px 16px; border: 0; border-radius: 9px; background: #f7f7f7; color: var(--ui-text); text-align: left; }
.todo:hover, .flow:hover { background: var(--ui-accent-soft); color: var(--ui-accent); }
.todo strong { display: block; font-size: 20px; }
.todo span, .flow span { display: block; margin-top: 4px; color: var(--ui-muted); }
.erp-filter-panel .filter-actions { display: flex; gap: 8px; }

/* Report filters stay compact and horizontal; list-page filters keep their own layout. */
.figma-template-main .report-page > .board:first-child .erp-filter-panel {
  width: 100%;
  padding-top: 0;
  border-top: 0;
}
.figma-template-main .report-page > .board:first-child .erp-filter-content {
  width: 100%;
  display: flex;
  align-items: end;
  gap: 14px;
}
.figma-template-main .report-page > .board:first-child .erp-filter-grid {
  min-width: 0;
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: minmax(280px, 1.35fr) minmax(130px, .55fr) minmax(180px, .75fr);
  gap: 10px;
  align-items: end;
}
.figma-template-main .report-page > .board:first-child .erp-filter-field {
  min-width: 0;
  margin-bottom: 0;
}
.figma-template-main .report-page > .board:first-child .erp-filter-tools {
  width: 144px;
  flex: 0 0 144px;
}
.platform-order-channel-bar {
  min-height: 52px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
}
.platform-order-channel-bar .erp-filter-field {
  width: 260px;
  margin: 0;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.platform-order-channel-bar .erp-filter-field > span { color: var(--ui-muted); font-size: 12px; }
.platform-order-channel-bar .erp-filter-field select { height: 34px; }
.platform-order-channel-bar > span { color: var(--ui-muted); font-size: 12px; }
.platform-order-compact-summary {
  min-height: 44px;
  padding: 6px 12px;
  display: flex;
  align-items: center;
  gap: 0;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
}
.platform-order-compact-summary > span {
  min-width: 92px;
  padding: 0 14px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  border-right: 1px solid var(--ui-line);
}
.platform-order-compact-summary > span:first-child { padding-left: 0; }
.platform-order-compact-summary small { color: var(--ui-muted); font-size: 11px; white-space: nowrap; }
.platform-order-compact-summary b { color: var(--ui-title); font-size: 17px; font-variant-numeric: tabular-nums; }
.platform-order-compact-summary em { margin-left: auto; color: var(--ui-muted); font-size: 11px; font-style: normal; white-space: nowrap; }
.mercari-shipping-workbench {
  min-height: 64px;
  padding: 10px 12px;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 190px) minmax(170px, 220px) auto auto;
  align-items: end;
  gap: 10px;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #f8fbfa;
}
.mercari-shipping-workbench-copy { align-self: center; display: grid; gap: 3px; }
.mercari-shipping-workbench-copy strong { color: var(--ui-title); font-size: 14px; }
.mercari-shipping-workbench-copy span { color: var(--ui-muted); font-size: 12px; }
.mercari-shipping-workbench button { min-height: 34px; white-space: nowrap; }
.mercari-shipping-code { min-width: 220px; display: grid; grid-template-columns: repeat(2, minmax(88px, auto)); gap: 4px 12px; }
.mercari-shipping-code > span { display: grid; gap: 1px; }
.mercari-shipping-code small { color: var(--ui-muted); font-size: 10px; }
.mercari-shipping-code code { color: var(--ui-title); font: 650 12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .02em; }
.mercari-shipping-code em { grid-column: 1 / -1; color: var(--ui-muted); font-size: 10px; font-style: normal; }
.mercari-shipping-code.missing { display: flex; flex-direction: column; gap: 2px; }
.mercari-shipping-code.missing b { color: var(--ui-title); font-size: 12px; }
@media (max-width: 1180px) {
  .platform-order-compact-summary { overflow-x: auto; }
  .platform-order-compact-summary em { padding-left: 14px; }
  .mercari-shipping-workbench { grid-template-columns: minmax(240px, 1fr) minmax(140px, 1fr) minmax(160px, 1fr); }
  .mercari-shipping-workbench-copy { grid-column: 1 / -1; }
}
.document-edit-page, .voucher-detail-page { height: 100%; padding: 16px; overflow: auto; }
.document-edit-main { max-width: 100%; }
.document-edit-form { display: grid; gap: 16px; }
.document-edit-section { padding: 16px; border-radius: 10px; background: #f7f7f7; }
.document-edit-section-title { margin-bottom: 14px; display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.document-edit-section-title strong { color: var(--ui-title); font-size: 15px; }
.document-edit-section-title span { color: var(--ui-muted); font-size: 12px; }
.document-edit-fields { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.document-edit-fields > label { min-width: 0; display: grid; gap: 6px; color: #566071; font-size: 12px; font-weight: 600; }
.document-edit-fields input, .document-edit-fields select, .document-edit-fields textarea {
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--ui-control-line);
  border-radius: 6px;
  background: #fff;
  color: var(--ui-text);
}
.line-items-field { grid-column: 1 / -1; min-width: 0; }
.line-items-field-head { margin-bottom: 8px; display: flex; align-items: center; justify-content: space-between; }
.line-items-field-head button, .line-remove { height: 32px; padding: 0 12px; border: 1px solid var(--ui-line); border-radius: 7px; background: #fff; color: var(--ui-accent); }
.line-items-field > textarea { display: none; }
.line-item-head, .line-item-row { display: grid; grid-template-columns: minmax(260px,1fr) 140px 160px 80px; gap: 8px; align-items: center; }
.line-item-head { height: 34px; padding: 0 10px; border-radius: 6px 6px 0 0; background: #eef1f1; color: var(--ui-muted); }
.line-item-row { padding-top: 8px; }
.line-items-help { margin: 8px 0 0; color: var(--ui-muted); font-size: 12px; }
.document-edit-actions { position: sticky; bottom: -16px; padding: 12px 0; display: flex; justify-content: flex-end; gap: 8px; background: #fff; }
.document-edit-actions button { height: 34px; padding: 0 16px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; color: #566071; }
.document-edit-actions button:first-child { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }

/* Sales order edit: compact voucher form with clear hierarchy and a visible check action. */
.document-edit-page[data-document-edit-page="sales.edit"] { padding: 12px 16px 72px; background: #f5f6f6; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-form { gap: 12px; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-section { padding: 14px 16px 16px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-section-title { margin-bottom: 12px; align-items: flex-start; flex-direction: column; justify-content: flex-start; gap: 3px; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-section-title strong { padding-left: 8px; border-left: 3px solid var(--ui-accent); }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-section-title span { max-width: 100%; line-height: 1.5; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-fields { gap: 10px 14px; }
.document-edit-page[data-document-edit-page="sales.edit"] [data-field-name="address1"],
.document-edit-page[data-document-edit-page="sales.edit"] [data-field-name="address2"] { grid-column: span 2; }
.document-edit-page[data-document-edit-page="sales.edit"] [data-field-name="note"] { grid-column: span 2; }
.document-edit-page[data-document-edit-page="sales.edit"] input[readonly] { background: #f1f3f3; color: #6f7877; }
.sales-edit-item-summary .detail-table { min-width: 1270px; }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-actions { position: sticky; z-index: 20; bottom: 0; min-height: 56px; margin: 0 -16px -72px; padding: 10px 16px; align-items: center; border-top: 1px solid var(--ui-line); background: rgba(255,255,255,.98); box-shadow: 0 -5px 18px rgba(25,50,45,.08); }
.document-edit-page[data-document-edit-page="sales.edit"] .document-edit-actions button { min-width: 88px; height: 36px; }
.detail-list, .form-grid, .drawer-form { display: grid; gap: 14px; }
.detail-list > div { display: grid; grid-template-columns: 140px minmax(0,1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--ui-line); }
.detail-list dt { color: var(--ui-muted); }
.detail-list dd { margin: 0; }

/* Table operation cells: compact type, readable spacing, and a real overflow menu. */
.row-actions {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  vertical-align: middle;
}
.row-actions > button,
.row-actions > .table-action {
  width: auto;
  min-width: 0;
  min-height: 22px;
  height: 22px;
  padding: 0 3px;
  border: 0;
  background: transparent;
  color: var(--ui-accent);
  font-size: 12px;
  font-weight: 500;
  line-height: 22px;
  white-space: nowrap;
}
.row-actions > button.danger { color: var(--ui-danger); }

.store-precheck-actions .row-actions {
  gap: 10px;
  flex-wrap: wrap;
}

.store-precheck-actions .row-actions > button:first-child {
  min-height: 36px;
  padding: 0 18px;
  border-color: var(--ui-primary, #278b80);
  background: var(--ui-primary, #278b80);
  color: #fff;
  font-weight: 700;
}
.compact-actions { position: relative; flex-wrap: nowrap; gap: 8px; overflow: visible; }
.row-more { position: relative; }
.row-more[open] { z-index: 1100; }
.grid-shell td:has(.row-more[open]) {
  z-index: 1300 !important;
  overflow: visible !important;
  text-overflow: clip;
}
.row-more:not([open]) .row-more-list { display: none; }
.row-more > summary {
  min-height: 22px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--ui-line);
  border-radius: 5px;
  background: #fff;
  color: #657083;
  font-size: 12px;
  line-height: 20px;
  list-style: none;
  white-space: nowrap;
}
.row-more > summary::-webkit-details-marker { display: none; }
.row-more-list {
  position: absolute;
  z-index: 1200;
  top: calc(100% + 4px);
  right: 0;
  width: 128px;
  padding: 5px;
  display: grid;
  gap: 2px;
  border: 1px solid var(--ui-line);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(25,50,45,.14);
}
.row-more-fixed-position .row-more-list { z-index: 1200; }
.row-more-list button {
  width: 100%;
  min-height: 28px;
  padding: 0 9px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #566071;
  font-size: 12px;
  text-align: left;
}
.row-more-list button:hover { background: var(--ui-accent-soft); color: var(--ui-accent); }

/* Shared voucher detail layout. The markup already has semantic sections; this
   turns those sections into the current Figma card/grid system. */
.voucher-detail-page {
  height: 100%;
  min-width: 0;
  padding: 0;
  overflow: auto;
  background: #f5f6f6;
}
.voucher-detail-main {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 10px;
  background: #fff;
}
.voucher-detail-title {
  min-height: 50px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--ui-line);
  background: #fbfcfc;
}
.voucher-detail-title strong { color: var(--ui-title); font-size: 15px; }
.voucher-detail-title span { color: #657083; font-size: 12px; }
.voucher-detail-section { min-width: 0; border-bottom: 1px solid var(--ui-line); background: #fff; }
.voucher-detail-section:last-child { border-bottom: 0; }
.voucher-detail-section-title,
.voucher-detail-related-title {
  min-height: 36px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--ui-line);
  background: #f7f8f8;
  color: #34413e;
  font-size: 13px;
  font-weight: 600;
}
.voucher-detail-list { margin: 0; gap: 0; }
.voucher-detail-head-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(220px,1fr));
}
.voucher-detail-amount-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px,1fr));
  background: #fcfdfd;
}
.voucher-detail-head-list > div,
.voucher-detail-amount-list > div {
  min-width: 0;
  min-height: 42px;
  padding: 7px 12px;
  display: grid;
  grid-template-columns: 92px minmax(0,1fr);
  align-items: center;
  gap: 8px;
  border-right: 1px solid #edf1f1;
  border-bottom: 1px solid #edf1f1;
}
.voucher-detail-head-list dt,
.voucher-detail-amount-list dt { color: #7b8795; font-size: 12px; font-weight: 600; }
.voucher-detail-head-list dd,
.voucher-detail-amount-list dd {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #2f3937;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.voucher-detail-related-list { display: grid; }
.voucher-detail-related-item { min-width: 0; border-bottom: 1px solid var(--ui-line); }
.voucher-detail-related-item:last-child { border-bottom: 0; }
.voucher-detail-related-body { min-width: 0; padding: 12px 16px 16px; overflow-x: auto; }
.voucher-detail-related-body > .row-actions { padding: 2px 0; }
.detail-table-wrap { min-width: 0; max-width: 100%; overflow: auto; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; }
.detail-table { width: max-content; min-width: 100%; table-layout: fixed; }
.detail-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  height: 38px;
  padding: 0 12px;
  background: #f6f8f8;
  color: #737e8d;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .01em;
}
.detail-table td {
  height: 42px;
  padding: 0 12px;
  color: #303a38;
  font-size: 12px;
  line-height: 1.35;
}
.detail-table th,
.detail-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.detail-table th[data-detail-column-kind="numeric"],
.detail-table td[data-detail-column-kind="numeric"] { text-align: right; font-variant-numeric: tabular-nums; }
.detail-table th[data-detail-column-kind="status"],
.detail-table td[data-detail-column-kind="status"] { text-align: center; }
.detail-table th[data-detail-column-kind="identifier"],
.detail-table td[data-detail-column-kind="identifier"] { font-variant-numeric: tabular-nums; }
.detail-table th[data-detail-column-kind="action"],
.detail-table td[data-detail-column-kind="action"] {
  position: sticky;
  z-index: 3;
  right: 0;
  background: #fff;
  box-shadow: -8px 0 12px -12px rgba(37,62,58,.55);
  text-align: left;
}
.detail-table th[data-detail-column-kind="action"] { z-index: 4; background: #f6f8f8; }
.detail-table td[data-detail-column-kind="action"] .row-actions { gap: 7px; flex-wrap: nowrap; }
.detail-table tbody tr:hover td[data-detail-column-kind="action"] { background: #fafcfc; }
.detail-table-empty-row td {
  height: 72px;
  color: #98a1ad;
  text-align: center !important;
}

/* Sales order / goods issue detail pages. */
.page-workspace[data-page-kind="VoucherDetailPage"]:has([data-sales-issue-detail-template="readonly-candidate"]) .page-head,
.page-workspace[data-page-kind="VoucherDetailPage"]:has([data-unified-voucher-detail="true"]) .page-head { display: none; }
.page-workspace[data-page-kind="VoucherDetailPage"]:has([data-sales-issue-detail-template="readonly-candidate"]) .page-body,
.page-workspace[data-page-kind="VoucherDetailPage"]:has([data-unified-voucher-detail="true"]) .page-body { height: 100%; margin-top: 0; }
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-sales-order-compact-edit]) .page-head { display: none; }
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-sales-order-compact-edit]) .page-body { height: 100%; margin-top: 0; }
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-sales-order-new-voucher]) .page-head,
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-purchase-order-new-voucher]) .page-head { display: none; }
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-sales-order-new-voucher]) .page-body,
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-purchase-order-new-voucher]) .page-body { height: 100%; margin-top: 0; }
.sales-issue-detail-page { position: relative; width: 100%; height: 100%; min-width: 0; padding: 0 0 58px; overflow-x: hidden; overflow-y: auto; background: #f5f6f6; }
.sales-issue-detail-container { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; }
.sales-issue-detail-head {
  min-height: 62px;
  padding: 12px 16px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--ui-line);
}
.sales-issue-title-block { min-width: 280px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; color: #657083; font-size: 12px; }
.sales-issue-title-block strong { width: 100%; color: var(--ui-title); font-size: 17px; }
.sales-issue-top-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.sales-issue-disabled-action,
.sales-issue-operation-trigger,
.sales-issue-operation-item {
  min-height: 26px;
  padding: 0 8px;
  border: 1px solid var(--ui-line);
  border-radius: 6px;
  background: #fff;
  color: #657083;
  font-size: 12px;
}
.sales-issue-operation { position: relative; }
.sales-issue-operation-menu { position: absolute; z-index: 30; top: 30px; right: 0; width: 150px; padding: 5px; display: grid; gap: 2px; border: 1px solid var(--ui-line); border-radius: 7px; background: #fff; box-shadow: 0 10px 28px rgba(25,50,45,.14); }
.sales-issue-operation-item { width: 100%; text-align: left; }
.sales-issue-status-chips { padding: 10px 16px 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.sales-issue-status-chips span { min-height: 24px; padding: 2px 9px; border-radius: 12px; background: #eef1f1; color: #657083; font-size: 12px; }
.sales-issue-status-chips span[data-sales-issue-status-chip="effective"] { background: var(--ui-accent-soft); color: var(--ui-accent); }
.sales-issue-status-chips span[data-sales-issue-status-chip="voided"] { background: #fff0f0; color: var(--ui-danger); }
.sales-issue-header-fields {
  margin: 12px 16px 0;
  display: grid;
  grid-template-columns: repeat(4,minmax(220px,1fr));
  border-top: 1px solid var(--ui-line);
  border-left: 1px solid var(--ui-line);
}
.sales-issue-field { min-width: 0; min-height: 42px; display: grid; grid-template-columns: 86px minmax(0,1fr); align-items: center; border-right: 1px solid var(--ui-line); border-bottom: 1px solid var(--ui-line); font-size: 12px; }
.sales-issue-field dt { padding: 0 8px; color: #7b8795; font-weight: 600; }
.sales-issue-field dd { min-width: 0; margin: 0; padding-right: 10px; overflow: hidden; color: #2f3937; text-overflow: ellipsis; white-space: nowrap; }
.sales-issue-line-section { margin: 16px 16px 0; }
.sales-issue-line-section .detail-table { min-width: 2200px; }
.sales-issue-yellow-subtotal { min-height: 42px; margin: 0 16px; padding: 0 14px; display: flex; align-items: center; gap: 28px; border: 1px solid #f0dec2; border-top: 0; background: #fff7e2; color: #5c4b28; font-size: 12px; }
.sales-issue-receipt-summary { margin: 18px 16px; border: 1px solid var(--ui-line); border-radius: 8px; overflow: hidden; }
.sales-issue-receipt-summary h3 { height: 36px; margin: 0; padding: 0 12px; display: flex; align-items: center; border-bottom: 1px solid var(--ui-line); background: #f7f8f8; font-size: 13px; }
.sales-issue-receipt-summary dl { margin: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.sales-issue-receipt-summary dl > div { min-height: 40px; padding: 0 10px; display: grid; grid-template-columns: 86px minmax(0,1fr); align-items: center; border-right: 1px solid var(--ui-line); border-bottom: 1px solid var(--ui-line); font-size: 12px; }
.sales-issue-receipt-summary dt { color: #7b8795; font-weight: 600; }
.sales-issue-receipt-summary dt,
.sales-issue-receipt-summary dd { margin: 0; }
.sales-issue-right-rail { display: none; }
.sales-issue-bottom-bar { position: sticky; left: 0; right: 0; bottom: 0; min-height: 48px; padding: 8px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--ui-line); background: rgba(255,255,255,.97); box-shadow: 0 -5px 18px rgba(25,50,45,.08); }
.sales-issue-bottom-note { color: #7b8795; font-size: 12px; }
.sales-issue-bottom-actions { display: flex; gap: 8px; }
.sales-issue-bottom-actions .sales-issue-disabled-action { min-width: 62px; height: 32px; }
.sales-issue-bottom-actions .sales-issue-disabled-action.primary { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }

/* Sales order details are intentionally compact: order, recipient, goods and totals only. */
.sales-order-compact-detail { padding-bottom: 0; }
.sales-order-compact-detail .sales-issue-detail-head { min-height: 56px; align-items: center; }
.sales-order-compact-detail .sales-issue-title-block { min-width: 0; }
.sales-order-compact-detail .sales-issue-title-block strong { width: auto; margin-right: 8px; }
.sales-order-detail-edit {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--ui-accent);
  border-radius: 6px;
  background: var(--ui-accent);
  color: #fff;
  font-size: 12px;
}
.sales-order-detail-edit:disabled { border-color: var(--ui-line); background: #eef1f1; color: #9aa3af; }
.sales-order-compact-detail .sales-issue-header-fields { grid-template-columns: repeat(4,minmax(180px,1fr)); }
.sales-order-compact-detail .sales-issue-line-section > h3 {
  height: 36px;
  margin: 0;
  padding: 0 12px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--ui-line);
  background: #f7f8f8;
  color: var(--ui-title);
  font-size: 13px;
}
.sales-order-recipient-summary {
  min-height: 58px;
  margin: 16px;
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
}
.sales-order-recipient-summary > div { min-width: 0; display: flex; align-items: center; gap: 12px; }
.sales-order-recipient-summary small { color: #7b8795; font-size: 12px; }
.sales-order-recipient-summary strong { color: var(--ui-title); font-size: 13px; }
.sales-order-recipient-summary span { min-width: 0; overflow: hidden; color: #7b8795; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.sales-order-recipient-summary button { height: 28px; padding: 0 10px; border: 1px solid var(--ui-accent); border-radius: 6px; background: #fff; color: var(--ui-accent); font-size: 12px; white-space: nowrap; }
.sales-order-compact-detail .sales-issue-line-section { margin: 16px; border: 1px solid var(--ui-line); border-radius: 8px; overflow: hidden; }
.sales-order-compact-detail .sales-issue-line-section .detail-table-wrap { border: 0; border-radius: 0; }
.sales-order-compact-detail .sales-issue-line-section .detail-table { width: 100%; min-width: 760px; }
.sales-order-compact-detail .sales-issue-receipt-summary dl { grid-template-columns: repeat(4,minmax(0,1fr)); }
.sales-order-edit-line-items { padding-bottom: 10px; background: #fff; }
.sales-order-edit-line-items .line-items-field-head { min-height: 36px; margin: 0; padding: 0 10px 0 12px; border-bottom: 1px solid var(--ui-line); background: #f7f8f8; }
.sales-order-edit-line-items .line-items-field-head > span { color: var(--ui-title); font-size: 13px; font-weight: 600; }
.sales-line-editor-actions { display: flex; align-items: center; gap: 6px; }
.sales-order-edit-line-items .line-items-field-head button { height: 28px; padding: 0 10px; border-radius: 6px; font-size: 12px; }
.sales-order-edit-line-items [data-line-add] { border-color: var(--ui-accent); background: #fff; color: var(--ui-accent); }
.sales-order-edit-line-items [data-sales-items-precheck] { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.sales-order-edit-line-items .line-item-head,
.sales-order-edit-line-items .line-item-row { grid-template-columns: minmax(280px,1fr) 110px 130px 72px; }
.sales-order-edit-line-items .line-item-head { height: 32px; margin: 0 10px; border-radius: 0; font-size: 12px; }
.sales-order-edit-line-items .line-item-rows { padding: 0 10px; }
.sales-order-edit-line-items .line-item-row { min-height: 38px; padding-top: 6px; }
.sales-order-edit-line-items .line-item-row select,
.sales-order-edit-line-items .line-item-row input { width: 100%; height: 30px; min-width: 0; padding: 0 8px; border: 1px solid #d9dfe6; border-radius: 5px; background: #fff; color: var(--ui-text); font-size: 12px; }
.sales-sku-search { position: relative; min-width: 0; }
.line-item-row > .shared-line-sku-search { width: 100%; min-width: 0; }
.line-item-row > .shared-line-sku-search input {
  width: 100%;
  height: 32px;
  min-width: 0;
  padding: 0 28px 0 9px;
  border: 1px solid #d9dfe6;
  border-radius: 6px;
  background: #fff;
  color: var(--ui-text);
  font-size: 12px;
}
.sku-reference-search { width: 100%; }
.sku-reference-search > input[type="search"] {
  width: 100%;
  height: 34px;
  padding: 0 28px 0 10px;
  border: 1px solid #d9dfe6;
  border-radius: 6px;
  background: #fff;
  color: var(--ui-text);
  font-size: 12px;
}
.sku-reference-search > input[type="search"]:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 2px rgba(39,127,117,.12); outline: 0; }
.sales-sku-search input[type="search"] { padding-right: 28px; }
.sales-sku-search input[type="search"]:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 2px rgba(39,127,117,.12); outline: 0; }
.sales-sku-search-results {
  position: absolute;
  z-index: 40;
  top: 34px;
  left: 0;
  width: min(440px,calc(100vw - 64px));
  max-height: 248px;
  overflow: auto;
  padding: 4px;
  border: 1px solid #cfd9d7;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(28,55,50,.14);
}
.sales-sku-search-results[data-floating="true"] {
  position: fixed;
  z-index: 2600;
  margin: 0;
}
.sales-sku-search-results[hidden] { display: none; }
.sales-sku-search-results button {
  width: 100%;
  min-height: 36px;
  padding: 5px 8px;
  display: grid;
  grid-template-columns: minmax(110px,auto) minmax(0,1fr);
  align-items: center;
  gap: 10px;
  border: 0;
  border-radius: 4px;
  background: #fff;
  color: var(--ui-text);
  text-align: left;
}
.sales-sku-search-results button:hover,
.sales-sku-search-results button[data-active="true"] { background: #e8f3f1; }
.sales-sku-search-results strong { color: var(--ui-accent); font-size: 12px; }
.sales-sku-search-results span { overflow: hidden; color: #65717e; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.sales-sku-search-empty { padding: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #89939f; font-size: 12px; }
.sales-sku-search-results .sales-sku-search-empty > button {
  width: auto;
  min-width: 112px;
  min-height: 30px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ui-accent);
  border-radius: 5px;
  background: #fff;
  color: var(--ui-accent);
  font-size: 12px;
  white-space: nowrap;
}
.sales-sku-search-results .sales-sku-search-empty > button:hover { background: #e8f3f1; }
.sales-order-edit-line-items .line-remove { height: 28px; padding: 0 8px; border-color: #edcaca; background: #fff; color: var(--ui-danger); font-size: 12px; }
.sales-order-edit-line-items .line-items-help { margin: 8px 12px 0; }
.sales-order-compact-form { position: relative; height: 100%; overflow: hidden; }
.sales-order-edit-actions { display: flex; align-items: center; gap: 8px; }
.sales-order-edit-actions button {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--ui-accent);
  border-radius: 6px;
  background: var(--ui-accent);
  color: #fff;
  font-size: 12px;
}
.sales-order-edit-actions button.ghost { background: #fff; color: var(--ui-accent); }
.sales-voucher-document-meta { min-width: 0; display: flex; align-items: center; gap: 24px; }
.sales-voucher-document-meta > label,
.sales-voucher-document-meta > div { min-width: 0; display: flex; align-items: center; gap: 9px; }
.sales-voucher-document-meta span { color: #56616f; font-size: 12px; font-weight: 600; white-space: nowrap; }
.sales-voucher-document-meta input { width: 138px; height: 30px; padding: 0 2px; border: 0; border-bottom: 1px solid #dce3e2; border-radius: 0; background: transparent; color: var(--ui-title); font-size: 13px; }
.sales-voucher-document-meta strong { min-width: 150px; color: var(--ui-title); font-size: 13px; font-weight: 600; white-space: nowrap; }
.sales-order-edit-grid {
  margin: 12px 16px 0;
  display: grid;
  grid-template-columns: minmax(300px,2fr) 150px 180px 150px minmax(200px,1.2fr) 160px;
  grid-template-areas: "customer channel warehouse payment external fulfillment";
  gap: 0 22px;
  border: 0;
}
.sales-order-edit-grid > label,
.sales-order-edit-grid > .voucher-master-field,
.sales-order-edit-readonly {
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 6px 2px 4px;
  display: grid;
  grid-template-columns: 72px minmax(0,1fr);
  align-items: center;
  gap: 6px;
  border-right: 0;
  border-bottom: 1px solid var(--ui-line);
}
.sales-order-edit-grid > [data-field-name="channel"] { grid-area: channel; }
.sales-order-edit-grid > .voucher-master-field { grid-area: customer; padding-right: 30px; }
.sales-order-edit-grid > [data-field-name="warehouseId"] { grid-area: warehouse; }
.sales-order-edit-grid > [data-field-name="channelOrderId"] { grid-area: external; }
.sales-order-edit-grid > [data-field-name="paymentStatus"] { grid-area: payment; }
.sales-order-edit-grid > .sales-order-edit-readonly { grid-area: fulfillment; }
.sales-order-edit-grid > .voucher-master-field > label { min-height: 0; display: grid; grid-template-columns: 72px minmax(0,1fr); align-items: center; gap: 6px; }
.sales-order-edit-grid > .voucher-master-field > .voucher-master-create { top: 8px; right: 0; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; font-size: 16px; letter-spacing: 1px; }
.sales-order-edit-grid > label > span,
.sales-order-edit-readonly > span { color: #7b8795; font-size: 12px; font-weight: 600; }
.sales-order-edit-grid input,
.sales-order-edit-grid select {
  width: 100%;
  height: 28px;
  min-width: 0;
  padding: 0 3px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #2f3937;
  font-size: 12px;
}
.sales-order-edit-grid input:focus,
.sales-order-edit-grid select:focus { outline: 0; box-shadow: inset 0 -2px 0 var(--ui-accent); }
.sales-order-edit-grid input[readonly] { border-color: transparent; background: transparent; padding-left: 0; }
.sales-order-edit-readonly b { color: #2f3937; font-size: 12px; font-weight: 500; }
.sales-order-edit-summary .sales-order-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
.sales-order-summary-grid > div,
.sales-order-summary-grid > label {
  min-height: 46px;
  margin: 0;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: 82px minmax(0,1fr);
  align-items: center;
  gap: 6px;
  border-right: 1px solid var(--ui-line);
  border-bottom: 1px solid var(--ui-line);
}
.sales-order-summary-grid span { color: #7b8795; font-size: 12px; font-weight: 600; }
.sales-order-summary-grid b { color: var(--ui-title); font-size: 13px; }
.sales-order-summary-grid input { width: 100%; height: 28px; padding: 0 8px; border: 1px solid #d9dfe6; border-radius: 5px; font-size: 12px; }
.sales-order-edit-recipient-drawer {
  position: absolute;
  z-index: 40;
  top: 0;
  right: -520px;
  width: 500px;
  height: 100%;
  display: grid;
  grid-template-rows: 64px minmax(0,1fr) 56px;
  border-left: 1px solid var(--ui-line);
  background: #fff;
  box-shadow: -12px 0 32px rgba(25,50,45,.16);
  visibility: hidden;
  pointer-events: none;
  transition: right .2s ease;
}
.sales-order-edit-recipient-drawer.open { right: 0; visibility: visible; pointer-events: auto; }
.sales-order-edit-recipient-drawer > header { padding: 0 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--ui-line); }
.sales-order-edit-recipient-drawer > header > div { display: grid; gap: 3px; }
.sales-order-edit-recipient-drawer > header strong { color: var(--ui-title); font-size: 16px; }
.sales-order-edit-recipient-drawer > header span { color: #7b8795; font-size: 12px; }
.sales-order-edit-recipient-drawer > header button { width: 30px; height: 30px; border: 0; border-radius: 6px; background: #f2f4f5; color: #657083; font-size: 20px; }
.sales-order-recipient-edit-fields { padding: 16px 18px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; align-content: start; overflow: auto; }
.sales-order-recipient-rule { grid-column: 1 / -1; margin: 0; padding: 9px 10px; border: 1px solid #cfe5df; border-radius: 6px; background: #f2f8f6; color: #49665f; font-size: 12px; line-height: 1.5; }
.sales-order-recipient-edit-fields label { min-width: 0; display: grid; gap: 6px; color: #657083; font-size: 12px; }
.sales-order-recipient-edit-fields label:nth-last-child(1),
.sales-order-recipient-edit-fields label:nth-last-child(2),
.sales-order-recipient-edit-fields label:nth-last-child(3) { grid-column: 1 / -1; }
.sales-order-recipient-edit-fields input { width: 100%; height: 32px; padding: 0 9px; border: 1px solid #d9dfe6; border-radius: 6px; font-size: 12px; }
.sales-order-edit-recipient-drawer > footer { padding: 10px 18px; display: flex; justify-content: flex-end; border-top: 1px solid var(--ui-line); }
.sales-order-edit-recipient-drawer > footer button { height: 32px; padding: 0 18px; border: 1px solid var(--ui-accent); border-radius: 6px; background: var(--ui-accent); color: #fff; font-size: 12px; }

/* New sales voucher: compact head, dominant detail grid, totals below. */
.sales-order-new-voucher { width: 100%; max-width: 100%; padding: 0; overflow-x: hidden; background: #f5f6f6; }
.sales-order-new-voucher .sales-issue-detail-container { min-height: 100%; border-radius: 0; }
.sales-order-new-voucher .sales-issue-detail-head { min-height: 54px; padding: 0 14px; }
.sales-order-new-head-grid {
  margin: 0;
  padding: 8px 20px 10px;
  display: grid;
  grid-template-columns: minmax(280px,1.05fr) 170px 220px 170px minmax(260px,1.3fr);
  grid-template-areas:
    "customer channel warehouse payment platform"
    "note note note note note";
  gap: 0 24px;
  border: 0;
  background: #fff;
}
.sales-order-new-head-grid > label,
.sales-order-new-head-grid > .voucher-master-field,
.sales-order-new-head-grid > .sales-order-auto-number {
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 6px 2px 4px;
  display: grid;
  grid-template-columns: 70px minmax(0,1fr);
  align-items: center;
  gap: 6px;
  border-right: 0;
  border-bottom: 1px solid var(--ui-line);
  color: #687483;
  font-size: 12px;
  font-weight: 600;
}
.sales-order-new-head-grid > .voucher-master-field { grid-area: customer; padding-right: 30px; }
.sales-order-new-head-grid > [data-field-name="channel"] { grid-area: channel; }
.sales-order-new-head-grid > [data-field-name="warehouseId"] { grid-area: warehouse; }
.sales-order-new-head-grid > [data-field-name="paymentStatus"] { grid-area: payment; }
.sales-order-new-head-grid > [data-field-name="channelOrderId"] { grid-area: platform; }
.sales-order-new-head-grid > [data-field-name="note"] { grid-area: note; }
.sales-order-new-head-grid > .voucher-master-field > label { min-height: 0; display: grid; grid-template-columns: 70px minmax(0,1fr); align-items: center; gap: 6px; }
.sales-order-new-head-grid > .voucher-master-field > .voucher-master-create { top: 8px; right: 0; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; color: var(--ui-accent); font-size: 16px; letter-spacing: 1px; }

.sales-order-auto-number {
  min-width: 0;
  display: grid;
  grid-template-columns: 70px minmax(0,1fr);
  align-items: center;
  gap: 6px;
}

.sales-order-auto-number > span {
  color: #536172;
  font-size: 12px;
  font-weight: 600;
}

.sales-order-auto-number > strong {
  min-height: 28px;
  display: flex;
  align-items: center;
  padding: 0 3px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #3d7069;
  font-size: 13px;
  font-weight: 600;
}
.sales-order-new-head-grid input,
.sales-order-new-head-grid select {
  width: 100%;
  height: 28px;
  min-width: 0;
  padding: 0 3px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ui-text);
  font-size: 12px;
}
.sales-order-new-head-grid input:focus,
.sales-order-new-head-grid select:focus { outline: 0; box-shadow: inset 0 -2px 0 var(--ui-accent); }
.sales-order-new-voucher .sales-order-recipient-summary { min-height: 44px; margin: 8px 14px; padding: 6px 10px; background: #f9fbfb; }
.sales-order-new-voucher [data-new-order-recipient-summary][data-complete="false"] { color: #b3483f; }
.sales-order-new-lines { min-width: 0; max-width: calc(100% - 28px); margin: 0 14px; overflow-x: auto; overflow-y: visible; overscroll-behavior-x: contain; border: 1px solid var(--ui-line); background: #fff; }
.sales-order-new-lines .sales-line-items { min-width: 1540px; }
.sales-line-items .line-items-field-head {
  min-height: 38px;
  margin: 0;
  padding: 0 10px 0 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--ui-line);
  background: #f7f8f8;
}
.sales-line-items .line-items-field-head > span { color: var(--ui-title); font-size: 13px; font-weight: 600; }
.sales-line-items .line-items-field-head small { margin-left: 10px; color: #7f8995; font-size: 11px; font-weight: 400; }
.sales-line-items .line-item-head,
.sales-line-items .line-item-row {
  display: grid;
  grid-template-columns: minmax(280px,1.5fr) 142px 126px 68px 90px 96px 74px 70px 92px 92px 104px 56px;
  gap: 6px;
  align-items: center;
}
.sales-line-items .line-item-head { min-height: 34px; padding: 0 10px; border-bottom: 1px solid var(--ui-line); border-radius: 0; background: #eef1f1; color: #6d7885; font-size: 11px; }
.sales-line-items .line-item-rows { padding: 0 10px; }
.sales-line-items .line-item-row { min-height: 44px; padding: 5px 0; border-bottom: 1px solid #edf0f1; }
.sales-line-items .line-item-row input { width: 100%; height: 30px; min-width: 0; padding: 0 7px; border: 1px solid #d9dfe6; border-radius: 5px; font-size: 12px; }
.sales-line-items .line-item-row output { min-width: 0; overflow: hidden; color: #3d4745; font-size: 12px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.sales-line-items .line-item-row [data-line-product-barcode],
.sales-line-items .line-item-row [data-line-product-code] { text-align: left; font-variant-numeric: tabular-nums; }
.sales-line-items .line-item-row [data-line-amount] { color: var(--ui-title); font-weight: 600; }
.sales-line-items .line-remove { height: 28px; padding: 0 7px; border-color: #edcaca; background: #fff; color: var(--ui-danger); font-size: 11px; }
.sales-line-items .line-items-help { margin: 7px 12px 9px; color: #7f8995; font-size: 11px; }
.sales-order-new-total {
  min-height: 72px;
  margin: 0 14px 14px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 28px;
  border: 1px solid var(--ui-line);
  border-top: 0;
  background: #fffdf8;
}
.sales-order-new-total > div { display: grid; gap: 4px; text-align: right; }
.sales-order-new-total span { color: #7a8490; font-size: 11px; }
.sales-order-new-total b { color: #37413f; font-size: 13px; font-weight: 600; }
.sales-order-new-grand-total { min-width: 142px; padding-left: 24px; border-left: 1px solid #ded7c7; }
.sales-order-new-grand-total strong { color: var(--ui-accent); font-size: 22px; letter-spacing: -.02em; }

/* New purchase voucher follows the same compact document hierarchy. */
.purchase-order-new-voucher .sales-issue-detail-container { min-height: 100%; }
.purchase-order-new-head-grid {
  margin: 0;
  padding: 8px 20px 10px;
  grid-template-columns: repeat(3,minmax(220px,1fr));
  gap: 0 28px;
  border: 0;
  background: #fff;
}
.purchase-order-new-head-grid > label,
.purchase-order-new-head-grid > .voucher-master-field {
  min-height: 48px;
  padding: 7px 4px 5px;
  border-right: 0;
  border-bottom: 1px solid #dfe5e4;
}
.purchase-order-new-head-grid > label {
  grid-template-columns: 82px minmax(0,1fr);
}
.purchase-order-new-head-grid input,
.purchase-order-new-head-grid select {
  height: 30px;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.purchase-order-new-head-grid input:focus,
.purchase-order-new-head-grid select:focus {
  box-shadow: inset 0 -2px 0 var(--ui-accent);
}
.purchase-order-new-head-grid > .sales-order-auto-number {
  min-height: 48px;
  padding: 7px 4px 5px;
  grid-template-columns: 82px minmax(0,1fr);
  align-items: center;
  gap: 6px;
  border-right: 0;
  border-bottom: 1px solid #dfe5e4;
}
.purchase-order-new-head-grid > .sales-order-auto-number > strong {
  min-height: 30px;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.purchase-order-new-lines { margin-top: 10px; }
.purchase-order-new-lines .purchase-line-items { width: 1760px; min-width: 1760px; overflow: visible; }
.purchase-order-new-lines .line-items-field-head {
  min-height: 38px;
  padding: 0 10px 0 12px;
  border-bottom: 1px solid var(--ui-line);
  background: #f7f8f8;
}
.purchase-order-new-lines .line-items-help { margin: 0; }
.purchase-order-new-total { min-height: 64px; }
.voucher-master-field { position: relative; min-width: 0; padding-right: 88px; border-right: 1px solid var(--ui-line); border-bottom: 1px solid var(--ui-line); }
.voucher-master-field > label { width: 100%; min-width: 0; border: 0 !important; }
.voucher-master-field > label > select,
.voucher-master-field > label > input { min-width: 0; }
.voucher-master-field > .voucher-master-create { position: absolute; z-index: 2; top: 6px; right: 6px; width: 76px; height: 28px; padding: 0 6px; border: 1px solid var(--ui-accent); border-radius: 6px; background: #fff; color: var(--ui-accent); font-size: 11px; white-space: nowrap; }
.purchase-order-new-head-grid > .voucher-master-field { padding-right: 38px; }
.purchase-order-new-head-grid > .voucher-master-field > .voucher-master-create {
  top: 10px;
  right: 3px;
  width: 30px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 18px;
  letter-spacing: 1px;
}

@media (max-width: 1500px) {
  .sales-order-compact-detail .sales-issue-header-fields { grid-template-columns: repeat(3,minmax(180px,1fr)); }
  .sales-order-compact-detail .sales-issue-receipt-summary dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-order-edit-grid { grid-template-columns: minmax(260px,2fr) 140px 165px 140px minmax(180px,1fr) 150px; gap: 0 14px; }
  .sales-order-edit-summary .sales-order-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-order-new-head-grid { grid-template-columns: minmax(240px,1fr) 150px 200px 150px minmax(230px,1.15fr); gap: 0 16px; }
}

/* Purchase and receipt details reuse the accepted voucher proportions with live actions. */
.unified-voucher-toolbar .row-actions { justify-content: flex-end; }
.unified-voucher-toolbar .row-actions > button {
  min-height: 28px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--ui-line);
  border-radius: 6px;
  background: #fff;
  color: var(--ui-accent);
  font-size: 12px;
}
.unified-voucher-line-section .detail-table { min-width: 1580px; }
.unified-voucher-related { margin: 18px 16px; display: grid; gap: 14px; }
.unified-voucher-related-item { min-width: 0; overflow: hidden; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; }
.unified-voucher-related-item > h3 { height: 36px; margin: 0; padding: 0 12px; display: flex; align-items: center; border-bottom: 1px solid var(--ui-line); background: #f7f8f8; color: var(--ui-title); font-size: 13px; }
.unified-voucher-related-item > div { min-width: 0; padding: 12px; overflow-x: auto; }
.unified-voucher-bottom-actions .row-actions { flex-wrap: nowrap; justify-content: flex-end; }
.unified-voucher-bottom-actions .row-actions > button {
  min-width: 72px;
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--ui-accent);
  border-radius: 7px;
  background: var(--ui-accent);
  color: #fff;
}
.unified-voucher-bottom-actions .row-actions > button.danger { border-color: #e25a5a; background: #fff; color: var(--ui-danger); }

@media (max-width: 1500px) {
  .voucher-detail-head-list,
  .voucher-detail-amount-list,
  .sales-issue-header-fields { grid-template-columns: repeat(3,minmax(210px,1fr)); }
  .sales-issue-receipt-summary dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Drawer, login and feedback are part of the new system too. */
.drawer { position: fixed; z-index: 1200; top: 0; right: -540px; width: 520px; height: 100vh; padding: 0; overflow: hidden; visibility: hidden; pointer-events: none; border-radius: 16px 0 0 16px; background: #fff; box-shadow: -12px 0 36px rgba(20,50,44,.14); transition: right .2s ease; }
.drawer.open { right: 0; visibility: visible; pointer-events: auto; }
.drawer.detail-wide { right: min(-940px, calc(-100vw + 300px)); width: min(920px, calc(100vw - 300px)); }
.drawer.detail-wide.open { right: 0; }
.drawer.detail-wide .detail-list dd { min-width: 0; overflow-x: auto; }
.drawer.detail-wide .detail-list table { min-width: 680px; }
.drawer.detail-wide.product-detail-drawer,
.drawer.detail-wide.inventory-balance-detail-drawer {
  right: min(-800px, calc(-100vw + 300px));
  width: min(780px, calc(100vw - 300px));
}
.drawer.detail-wide.product-detail-drawer.open,
.drawer.detail-wide.inventory-balance-detail-drawer.open { right: 0; }
.product-detail-drawer .detail-list,
.inventory-balance-detail-drawer .detail-list { gap: 0; }
.product-detail-drawer .detail-list > div,
.inventory-balance-detail-drawer .detail-list > div {
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 16px;
  padding: 16px 0;
}
.product-detail-drawer .detail-list dt,
.inventory-balance-detail-drawer .detail-list dt { padding-top: 3px; font-size: 12px; font-weight: 600; }
.product-detail-drawer .detail-list dd,
.inventory-balance-detail-drawer .detail-list dd { overflow: visible; }
.product-detail-overview { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 14px; align-items: center; }
.product-detail-overview > img,
.product-detail-image-empty { width: 72px; height: 72px; border: 1px solid var(--ui-line); border-radius: 10px; background: #f4f7f6; object-fit: contain; }
.product-detail-image-empty { display: grid; place-items: center; color: #8ca09d; font-size: 24px; }
.product-detail-overview small { color: var(--ui-accent); font-size: 12px; font-weight: 600; }
.product-detail-overview h3 { margin: 4px 0; color: var(--ui-title); font-size: 17px; line-height: 1.35; }
.product-detail-overview p { margin: 0; color: var(--ui-muted); font-size: 12px; }
.product-detail-fact-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 20px; }
.product-detail-fact-grid > div { min-width: 0; padding: 8px 10px; border-radius: 7px; background: #f7f9f9; }
.product-detail-fact-grid span { display: block; margin-bottom: 4px; color: var(--ui-muted); font-size: 11px; }
.product-detail-fact-grid strong { display: block; overflow: hidden; color: var(--ui-text); font-size: 13px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.product-detail-stock-grid { margin-top: 10px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.product-detail-stock-grid article { padding: 10px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; }
.product-detail-stock-grid article > strong,
.product-detail-stock-grid article > span { display: block; }
.product-detail-stock-grid article > span { margin-top: 2px; color: var(--ui-muted); font-size: 11px; }
.product-detail-stock-grid dl { margin: 9px 0 0; display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.product-detail-stock-grid dl > div { display: flex; justify-content: space-between; gap: 4px; font-size: 11px; }
.product-detail-stock-grid dt { padding: 0; font-weight: 400; }
.product-detail-stock-grid dd { margin: 0; font-weight: 600; }
.product-detail-related-settings { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.product-detail-related-settings article { padding: 12px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px 12px; border: 1px solid var(--ui-line); border-radius: 8px; }
.product-detail-related-settings article > span { color: var(--ui-muted); font-size: 12px; }
.product-detail-related-settings article > strong { color: var(--ui-title); font-size: 20px; }
.product-detail-related-settings article > button { grid-column: 1 / -1; justify-self: start; }
.product-detail-report-links .row-actions { gap: 8px; }
.product-detail-report-links .row-actions > button { height: 30px; padding: 0 10px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; }
.product-detail-empty { color: var(--ui-muted); font-size: 12px; }
.inventory-detail-overview { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.inventory-detail-overview small { color: var(--ui-accent); font-size: 12px; font-weight: 600; }
.inventory-detail-overview h3 { margin: 4px 0 0; color: var(--ui-title); font-size: 17px; }
.inventory-detail-balance-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.inventory-detail-balance-grid > div { padding: 12px; border-radius: 8px; background: #f4f7f6; }
.inventory-detail-balance-grid > div.available { background: var(--ui-accent-soft); }
.inventory-detail-balance-grid span,
.inventory-detail-balance-grid strong { display: block; }
.inventory-detail-balance-grid span { color: var(--ui-muted); font-size: 11px; }
.inventory-detail-balance-grid strong { margin-top: 4px; color: var(--ui-title); font-size: 20px; }
.inventory-detail-next-step { margin: 10px 0 0; padding: 9px 11px; border-left: 3px solid var(--ui-accent); background: #f7faf9; color: #53635f; font-size: 12px; }
.drawer:has(.line-items-field) {
  right: -1120px;
  width: min(1120px, calc(100vw - 320px));
}
.drawer.open:has(.line-items-field) { right: 0; }
.drawer-head { height: 64px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--ui-line); }
.drawer-head h2 { margin: 0; font-size: 18px; }
.drawer-head p { margin: 2px 0 0; color: var(--ui-muted); }
.drawer-head button { height: 34px; border: 0; border-radius: 8px; background: #f4f7fc; }
.drawer-form { height: calc(100% - 64px); padding: 20px; overflow: auto; align-content: start; }
.drawer-form label { display: grid; gap: 6px; }
.drawer-form textarea { min-height: 90px; padding-top: 8px; resize: vertical; }
.master-scope-field { display: grid; gap: 8px; }
.master-scope-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.master-scope-head > span { font-weight: 600; }
.master-scope-head > div { display: flex; gap: 6px; }
.master-scope-options { max-height: 220px; overflow: auto; display: grid; gap: 7px; padding: 8px; border: 1px solid var(--ui-control-line); border-radius: 8px; background: #f8faf9; }
.drawer-form .master-scope-option { min-height: 48px; padding: 8px 10px; display: flex; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid #e1e8e5; border-radius: 7px; background: #fff; cursor: pointer; }
.drawer-form .master-scope-option:has(input:checked) { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.drawer-form .master-scope-option input { width: 16px; height: 16px; margin: 0; padding: 0; }
.master-scope-option span { min-width: 0; display: grid; gap: 2px; }
.master-scope-option strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.master-scope-option small, .master-scope-help, .master-scope-empty { color: var(--ui-muted); font-size: 12px; }
.master-scope-help { margin: 0; }
.master-scope-empty { padding: 12px; text-align: center; }
.system-access-request-panel { margin-bottom: 18px; padding: 16px; border: 1px solid #e9c875; border-radius: 12px; background: #fffaf0; }
.system-access-request-panel .section-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.system-access-request-panel .section-title-row div { display: grid; gap: 4px; }
.system-access-request-panel .section-title-row small { color: #6f756f; }
.system-access-request-panel .count-badge { flex: 0 0 auto; padding: 5px 10px; border-radius: 999px; color: #7a5200; background: #ffedbd; font-weight: 700; }

@media (max-width: 900px) {
  .drawer.detail-wide { right: calc(-100vw + 12px); width: calc(100vw - 12px); }
}

/* Mobile warehouse picking — designed for PDA, phone and tablet touch operation. */
.mobile-task-page { display: none; }
.pda-picking-workspace { max-width: 760px; margin: 0 auto; overflow: hidden; background: #f3f4f4; color: #1f2927; }
.mobile-pick-header { position: sticky; z-index: 20; top: 0; height: 68px; padding: 0 18px; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; border-bottom: 1px solid #e4e7e6; background: #f7f8f8; }
.mobile-pick-header > strong { justify-self: center; font-size: 20px; }
.mobile-pick-header > span { color: #7b8582; font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; }
.mobile-back { width: 44px; height: 44px; padding: 0 3px 5px 0; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 8px 22px rgba(40,56,52,.10); color: #26312e; font-size: 38px; line-height: 1; }
.mobile-pick-main { height: calc(100% - 132px); overflow-y: auto; padding-bottom: 18px; }
.mobile-current-card { margin-bottom: 12px; padding: 16px; border-radius: 0 0 18px 18px; background: #fff; box-shadow: 0 8px 20px rgba(41,57,53,.10); }
.mobile-box-label { height: 32px; display: flex; align-items: center; justify-content: space-between; }
.mobile-box-label span { font-weight: 650; }
.mobile-box-label b { padding: 6px 12px; border-radius: 8px 8px 2px 8px; background: #f1cf64; color: #473b13; }
.mobile-current-product { min-height: 112px; display: grid; grid-template-columns: 86px minmax(0,1fr) auto; gap: 12px; align-items: center; }
.mobile-product-image { width: 86px; height: 86px; display: grid; place-items: center; overflow: hidden; border: 1px solid #e5e8e7; background: #f8faf9; }
.mobile-product-image img { width: 100%; height: 100%; object-fit: contain; }
.mobile-product-image span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 12px; background: #e1f1ee; color: var(--ui-accent); font-size: 24px; font-weight: 700; }
.mobile-current-product > div:nth-child(2) { min-width: 0; display: grid; gap: 8px; }
.mobile-current-product strong { font-size: 17px; line-height: 1.4; }
.mobile-current-product small { color: #66716e; font-size: 13px; }
.mobile-current-product em { padding: 8px 10px; border-radius: 8px; background: #d9e9fb; color: #25476a; font-style: normal; font-weight: 700; }
.mobile-pick-totals { display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px; border-top: 1px dashed #d9dddc; padding-top: 14px; }
.mobile-pick-totals > div { min-height: 58px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; border-radius: 8px; background: #edf5ff; font-size: 18px; font-weight: 700; }
.mobile-pick-totals > div:nth-child(2) { background: #f1f2f2; }
.mobile-pick-totals button { min-width: 62px; height: 38px; border: 0; border-radius: 6px; background: var(--ui-accent); color: #fff; font-weight: 700; }
.mobile-pick-totals > div b { color: #172420; font-size: 21px; }
.mobile-pick-quantity { margin-top: 12px; padding: 12px; border: 1px solid #d8e2df; border-radius: 12px; background: #f8fbfa; }
.mobile-pick-quantity-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 9px; }
.mobile-pick-quantity-head strong { font-size: 15px; }
.mobile-pick-quantity-head span { color: #65736f; font-size: 13px; }
.mobile-pick-quantity-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(112px, .7fr); gap: 10px; }
.mobile-quantity-stepper { min-width: 0; height: 48px; display: grid; grid-template-columns: 46px minmax(54px, 1fr) 46px; overflow: hidden; border: 1px solid #b9c9c5; border-radius: 9px; background: #fff; }
.mobile-quantity-stepper button { border: 0; background: #edf3f1; color: #1d4f48; font-size: 24px; font-weight: 700; }
.mobile-quantity-stepper input { width: 100%; min-width: 0; border: 0; border-inline: 1px solid #d7e0de; outline: 0; background: #fff; text-align: center; color: #172420; font-size: 21px; font-weight: 750; -moz-appearance: textfield; }
.mobile-quantity-stepper input::-webkit-inner-spin-button, .mobile-quantity-stepper input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.mobile-quantity-confirm { min-height: 48px; border: 0; border-radius: 9px; background: var(--ui-accent); color: #fff; font-size: 16px; font-weight: 750; }
.mobile-fill-remaining { width: 100%; min-height: 44px; margin-top: 8px; border: 1px solid #b9c9c5; border-radius: 8px; background: #fff; color: #315b54; font-weight: 650; }
.mobile-pick-quantity small { display: block; margin-top: 7px; color: #6b7774; line-height: 1.45; }
.mobile-task-progress-note { padding: 10px 2px 0; color: #71807c; font-size: 12px; text-align: right; }
.pending-detail-stack { display: grid; align-content: start; }
.pending-detail-stack > span { min-height: 38px; padding: 7px 0; display: flex; align-items: center; border-bottom: 1px solid #e7ecea; line-height: 1.35; }
.pending-detail-stack > span:last-child { border-bottom: 0; }
.pending-product-stack > span { justify-content: space-between; gap: 12px; }
.pending-product-stack b { min-width: 0; font-weight: 600; }
.pending-product-stack em { flex: 0 0 auto; padding: 2px 7px; border-radius: 4px; background: #e5f3f0; color: #257c70; font-size: 12px; font-style: normal; }
.pending-code-stack > span { color: #52615d; font: 12px/1.35 ui-monospace, SFMono-Regular, Menlo, monospace; }
.mobile-start-card, .mobile-result-card { margin: 12px; padding: 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-radius: 12px; background: #fff; }
.mobile-start-card button { min-width: 120px; height: 46px; border: 0; border-radius: 8px; background: var(--ui-accent); color: #fff; font-weight: 700; }
.mobile-result-card { display: grid; }
.mobile-result-card span { color: #6f7976; }
.mobile-scan-bar { padding: 10px 14px; background: #fff; }
.mobile-scan-bar form { height: 48px; display: grid; grid-template-columns: minmax(0,1fr) 52px; overflow: hidden; border: 1px solid #cfd6d4; border-radius: 24px; background: #fff; }
.mobile-scan-bar input { min-width: 0; padding: 0 18px; border: 0; outline: 0; font-size: 16px; }
.mobile-scan-bar button { border: 0; background: transparent; color: #42514d; font-size: 24px; }
.mobile-pick-tabs { height: 58px; display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid #dfe3e2; background: #fff; }
.mobile-pick-tabs button { position: relative; border: 0; background: transparent; color: #39423f; font-size: 16px; }
.mobile-pick-tabs button.active { color: var(--ui-accent); font-weight: 700; }
.mobile-pick-tabs button.active::after { content: ""; position: absolute; right: 14%; bottom: 0; left: 14%; height: 3px; border-radius: 3px 3px 0 0; background: var(--ui-accent); }
.mobile-pick-list { display: grid; gap: 1px; background: #e1e4e3; }
.mobile-pick-line { background: #fff; }
.mobile-pick-line { cursor: pointer; outline: 0; }
.mobile-pick-line.current { position: relative; box-shadow: inset 4px 0 0 var(--ui-accent); }
.mobile-pick-line:focus-visible { box-shadow: inset 0 0 0 2px var(--ui-accent); }
.mobile-location-strip { height: 30px; padding: 4px 16px; background: #dceafb; color: #34516e; font-size: 15px; font-weight: 700; }
.mobile-line-body { padding: 12px 16px 16px; display: grid; grid-template-columns: auto 1fr; gap: 6px 8px; }
.mobile-line-state { align-self: start; padding: 3px 7px; border-radius: 4px; background: #e2f4eb; color: #16805c; font-size: 13px; }
.mobile-line-body > strong { font-size: 16px; line-height: 1.45; }
.mobile-line-body > span, .mobile-line-body > small, .mobile-line-bottom { grid-column: 1 / -1; }
.mobile-line-body > span { color: #4d5855; font-size: 14px; }
.mobile-line-body > small { color: #8a9390; font-size: 12px; }
.mobile-line-bottom { min-height: 42px; display: flex; align-items: center; justify-content: space-between; }
.mobile-line-bottom b { min-width: 140px; padding: 7px 10px; border-radius: 5px; background: #eef0f2; color: #47514f; }
.mobile-line-bottom button { min-width: 88px; height: 42px; border: 1px solid var(--ui-accent); border-radius: 7px; background: #fff; color: var(--ui-accent); font-weight: 700; }
.mobile-list-empty, .mobile-task-empty { min-height: 260px; display: grid; place-content: center; gap: 8px; padding: 24px; color: #7b8582; text-align: center; }
.mobile-pick-footer { position: sticky; z-index: 30; bottom: 0; height: 64px; display: grid; grid-template-columns: 92px 1fr 1fr; background: #fff; box-shadow: 0 -5px 20px rgba(35,53,48,.10); }
.mobile-pick-footer button { min-width: 0; border: 0; border-left: 1px solid rgba(255,255,255,.4); font-size: 17px; font-weight: 750; }
.mobile-pick-footer .more { background: #fff; color: #3e4946; }
.mobile-pick-footer .save { background: #e9b944; color: #fff; }
.mobile-pick-footer .submit { background: var(--ui-accent); color: #fff; }
.mobile-pick-footer .submit.full { grid-column: 1 / -1; }

@media (max-width: 1180px) {
  html:has(body.pda-picking-active),
  html:has(body.pda-picking-active) body.pda-picking-active {
    width: 100%;
    min-width: 0 !important;
    overflow: hidden;
  }
  body.pda-picking-active .sidebar, body.pda-picking-active .tabbar-wrap, body.pda-picking-active .figma-global-tools, body.pda-picking-active .selection-tray { display: none !important; }
  body.pda-picking-active .main { inset: 0; width: 100%; height: 100vh; }
  .pda-picking-workspace { max-width: none; height: 100vh; border-radius: 0; }
  .mobile-task-page { height: 100%; display: flex; flex-direction: column; background: #f3f4f4; }
  .page-workspace:has(.mobile-task-page) .page-head, .page-workspace:has(.mobile-task-page) .page-guide-strip, .mobile-task-page + .board { display: none !important; }
  .page-workspace:has(.mobile-task-page) .figma-template-main { padding: 0; border-radius: 0; }
  .page-workspace:has(.mobile-task-page) .page-body { height: 100%; margin: 0; overflow: hidden; }
  .mobile-task-header { height: 64px; padding: 0 16px; display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; background: #f7f8f8; }
  .mobile-task-header button { width: 44px; height: 44px; border: 0; border-radius: 50%; background: #fff; font-size: 34px; }
  .mobile-task-header strong { justify-self: center; font-size: 20px; }
  .mobile-task-search { padding: 10px 14px; display: grid; grid-template-columns: 1fr 48px; gap: 8px; background: #fff; }
  .mobile-task-search input { height: 46px; padding: 0 18px; border: 1px solid #cfd5d3; border-radius: 23px; font-size: 16px; }
  .mobile-task-search button { border: 0; background: transparent; font-size: 24px; }
  .mobile-task-modes { display: grid; grid-template-columns: 1fr 1fr; background: #fff; }
  .mobile-task-modes button { height: 48px; border: 0; border-bottom: 3px solid transparent; background: #fff; font-size: 16px; }
  .mobile-task-modes button.active { border-color: var(--ui-accent); color: var(--ui-accent); font-weight: 700; }
  .mobile-task-tip { margin: 0; padding: 10px 18px; background: #fff9df; color: #756124; font-size: 13px; }
  .mobile-task-list { flex: 1; overflow-y: auto; background: #f3f4f4; }
  .mobile-task-card { min-height: 150px; padding: 18px 16px; display: grid; grid-template-columns: 46px minmax(0,1fr) 86px; gap: 10px; align-items: start; border-bottom: 1px solid #e1e4e3; background: #fff; }
  .mobile-task-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #e4f6f2; color: #21a28f; font-size: 22px; }
  .mobile-task-copy { display: grid; gap: 4px; }
  .mobile-task-copy strong { margin-bottom: 3px; font: 18px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; }
  .mobile-task-copy span { color: #68726f; font-size: 14px; }
  .mobile-task-card > button { align-self: center; height: 46px; border: 1px solid var(--ui-accent); border-radius: 7px; background: #fff; color: var(--ui-accent); font-size: 16px; font-weight: 700; }
}

.login-gate { position: fixed; z-index: 2000; inset: 0; display: grid; place-items: center; background: rgba(40,61,55,.16); backdrop-filter: blur(6px); }
.login-card { width: 380px; padding: 28px; display: grid; gap: 16px; border-radius: 18px; background: #fff; box-shadow: 0 24px 70px rgba(30,50,44,.18); }
.login-mark { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 12px; background: var(--ui-accent); color: #fff; font-weight: 700; }
.login-brand-row { display: flex; align-items: center; gap: 14px; }
.login-brand-row h1 { margin: 0; line-height: 1.15; }
.login-card h1, .login-card p { margin: 0; }
.login-card label { display: grid; gap: 6px; }
.login-card input { height: 40px; padding: 0 12px; border: 1px solid var(--ui-control-line); border-radius: 7px; }
.login-card button { height: 40px; border: 0; border-radius: 8px; background: var(--ui-accent); color: #fff; }
.password-login { display: grid; gap: 14px; }
.wecom-qr-login { display: grid; justify-items: center; gap: 8px; }
.wecom-qr-code { width: 100%; min-height: 370px; display: grid; place-items: center; overflow: hidden; color: var(--ui-muted); }
.wecom-qr-code iframe { width: 100% !important; min-width: 300px; height: 370px !important; border: 0; }
.login-card .login-mode-switch { width: auto; height: auto; padding: 6px 10px; background: transparent; color: var(--ui-accent); font-size: 13px; }
#toast { position: fixed; z-index: 2500; left: 50%; bottom: 28px; transform: translateX(-50%); padding: 10px 16px; border-radius: 8px; background: #25322f; color: #fff; opacity: 0; pointer-events: none; }
#toast.show { opacity: 1; }
.selection-tray { position: fixed; z-index: 1000; left: 294px; right: 40px; bottom: 30px; min-height: 52px; padding: 8px 14px; border-radius: 10px; background: #fff; box-shadow: 0 10px 32px rgba(20,50,44,.16); }

/* All editable document lines share one table-like rhythm; each workflow only
   changes the semantic column template required by its fields. */
.line-items-field {
  --line-editor-min-width: 720px;
  overflow-x: auto;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
}
.line-items-field .line-items-field-head {
  min-width: var(--line-editor-min-width);
  min-height: 38px;
  margin: 0;
  padding: 0 10px 0 12px;
  border-bottom: 1px solid var(--ui-line);
  background: #fff;
}
.line-items-field .line-item-head,
.line-items-field .line-item-rows { min-width: var(--line-editor-min-width); }
.line-items-field .line-item-head {
  position: sticky;
  z-index: 4;
  top: 0;
  height: 34px;
  padding: 0 8px;
  gap: 8px;
  border-radius: 0;
  background: #f6f8f8;
  color: #737e8d;
  font-size: 12px;
  font-weight: 600;
}
.line-items-field .line-item-head > span:not(:first-child) { text-align: center; }
.line-items-field .line-item-rows { display: grid; gap: 0; padding: 0 8px; }
.line-items-field .line-item-row {
  min-height: 42px;
  padding: 6px 0;
  gap: 8px;
  border-bottom: 1px solid #edf1f1;
}
.line-items-field .line-item-row:last-child { border-bottom: 0; }
.line-items-field .line-item-row input,
.line-items-field .line-item-row select { width: 100%; min-width: 0; height: 30px; font-size: 12px; }
.line-items-field .line-item-row input[type="number"] { text-align: right; font-variant-numeric: tabular-nums; }
.line-items-field .line-remove { width: 64px; height: 30px; padding: 0 8px; justify-self: end; }
.line-items-field .line-items-help {
  min-width: var(--line-editor-min-width);
  margin: 0;
  padding: 8px 12px 10px;
  border-top: 1px solid var(--ui-line);
  background: #fbfcfc;
}
.sku-scope-line-items,
.key-scope-line-items { --line-editor-min-width: 460px; }
.sku-scope-line-items .line-item-head,
.sku-scope-line-items .line-item-row,
.key-scope-line-items .line-item-head,
.key-scope-line-items .line-item-row { grid-template-columns: minmax(300px,1fr) 72px; }
.purchase-line-items { --line-editor-min-width: 1760px; }
.purchase-line-items .line-item-head,
.purchase-line-items .line-item-row { grid-template-columns: minmax(240px,1.5fr) 118px 110px minmax(200px,1.2fr) 110px 130px 78px 64px 108px 72px 100px 106px 112px 64px; }
.purchase-line-items .line-item-row output { min-width: 0; overflow: hidden; color: #46504e; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.purchase-line-items .line-item-row [data-line-tax-amount],
.purchase-line-items .line-item-row [data-line-net-unit-cost],
.purchase-line-items .line-item-row [data-line-amount] { text-align: right; font-variant-numeric: tabular-nums; }
.purchase-line-items .line-item-row [data-line-amount] { color: var(--ui-title); font-weight: 600; }
.line-editor-actions { display: flex; align-items: center; gap: 8px; }
.shipment-line-items { --line-editor-min-width: 780px; }
.shipment-line-items .line-item-head,
.shipment-line-items .line-item-row { grid-template-columns: minmax(280px,1fr) 110px 180px 72px; }
.stock-receipt-line-items { --line-editor-min-width: 1080px; }
.stock-receipt-line-items .line-item-head,
.stock-receipt-line-items .line-item-row { grid-template-columns: minmax(240px,1fr) 86px 110px 110px 130px 190px 72px; }
.purchase-receive-line-items,
.return-line-items { --line-editor-min-width: 940px; }
.purchase-receive-line-items .line-item-head,
.purchase-receive-line-items .line-item-row,
.return-line-items .line-item-head,
.return-line-items .line-item-row { grid-template-columns: minmax(240px,1fr) 100px 120px 130px 190px 72px; }
.stocktake-line-items { --line-editor-min-width: 900px; }
.stocktake-line-items .line-item-head,
.stocktake-line-items .line-item-row { grid-template-columns: minmax(240px,1fr) 110px minmax(170px,1fr) 190px 72px; }
.transfer-line-items { --line-editor-min-width: 1080px; }
.transfer-line-items .line-item-head,
.transfer-line-items .line-item-row { grid-template-columns: minmax(240px,1fr) 100px 190px 190px minmax(160px,1fr) 72px; }
.adjustment-line-items { --line-editor-min-width: 980px; }
.adjustment-line-items .line-item-head,
.adjustment-line-items .line-item-row { grid-template-columns: minmax(300px,1.4fr) 150px 210px minmax(220px,1fr) 72px; }
.bundle-component-line-items { --line-editor-min-width: 600px; }
.bundle-component-line-items .line-item-head,
.bundle-component-line-items .line-item-row { grid-template-columns: minmax(360px,1fr) 110px 72px; }

/* Page purpose occupies one deliberate row across every standard list/workbench. */
.page-workspace .figma-template-main:has(> .page-guide-strip) > .page-body {
  height: calc(100% - 84px);
  margin-top: 6px;
}
.page-workspace[data-page-kind="DocumentListPage"] .figma-template-main:has(> .page-guide-strip) > .page-body {
  height: calc(100% - 92px);
}

/* No alternative mobile/tablet UI is invented: smaller windows scroll the
   exact 1920 × 1080 Figma canvas. */
.pick-progress {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  min-width: 118px;
  vertical-align: middle;
}

.pick-progress > span {
  background: #e8efed;
  border-radius: 999px;
  display: block;
  height: 6px;
  overflow: hidden;
  width: 72px;
}

.pick-progress > span > i {
  background: #278a7f;
  border-radius: inherit;
  display: block;
  height: 100%;
}

.pick-progress > strong {
  color: #42526a;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* 2026-07 UI unification: keep standard query actions compact and make empty
   lists informative without introducing a second visual language. */
.figma-template-main .erp-filter-tools {
  width: 158px;
  flex: 0 0 158px;
  grid-template-columns: 1.35fr 1fr;
}

.figma-template-main .grid-shell .table-empty-row td:has(.document-empty-state) {
  height: 132px;
  padding: 0;
  vertical-align: middle;
  text-align: center;
  background: #fff;
}

.figma-template-main .grid-shell .document-empty-state {
  width: 100%;
  min-height: 132px;
  margin: 0;
  display: grid;
  place-content: center;
  gap: 0;
  color: var(--ui-muted);
  font-size: 13px;
  line-height: 20px;
  text-align: center;
}

.figma-template-main .grid-shell .document-empty-illustration {
  display: none;
}

.figma-template-main .grid-shell .document-empty-text {
  width: auto;
  height: auto;
  max-width: 520px;
  padding: 0 20px;
}

/*
 * Canonical Figma template contract.
 * Source: vuK5fQOFJ1Fx7nhFsyli7a / 1:1696.
 * Every business screen must declare exactly one of:
 * query-list, workbench, voucher, drawer, mobile-warehouse.
 */
.page-workspace[data-ui-template] { min-width: 0; min-height: 0; }
.page-workspace[data-ui-template] .figma-template-layout,
.page-workspace[data-ui-template] .figma-template-main { min-width: 0; min-height: 0; }

/* Query list: one title line, one compact action row, optional guide, filters, grid. */
.page-workspace[data-ui-template="query-list"] .figma-template-main {
  height: 100%;
  padding: 12px 16px 14px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ui-page-radius);
  background: var(--ui-panel);
}
.page-workspace[data-ui-template="query-list"] .page-head {
  min-height: 40px;
  flex: 0 0 auto;
  gap: 32px;
}
.page-workspace[data-ui-template="query-list"] .page-title h1 { font-size: 18px; line-height: 26px; }
.page-workspace[data-ui-template="query-list"] .page-body {
  height: auto;
  min-height: 0;
  margin-top: 8px;
  flex: 1 1 auto;
  overflow: hidden;
}
.page-workspace[data-ui-template="query-list"] .page-body > .board:only-child,
.page-workspace[data-ui-template="query-list"] .page-body > .board:only-child > .board-body,
.page-workspace[data-ui-template="query-list"] .page-body > [data-page-template],
.page-workspace[data-ui-template="query-list"] .page-body > [data-page-template] > .board,
.page-workspace[data-ui-template="query-list"] .page-body > [data-page-template] > .board > .board-body {
  height: 100%;
  min-height: 0;
}
.page-workspace[data-ui-template="query-list"] .list-board > .board-body,
.page-workspace[data-ui-template="query-list"] .basic-data-board > .board-body,
.page-workspace[data-ui-template="query-list"] .system-master-board > .board-body {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.page-workspace[data-ui-template="query-list"] .erp-filter-panel {
  width: 100%;
  margin: 0 0 8px;
  padding: 9px 10px;
  display: block;
  flex: 0 0 auto;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fbfcfc;
}
.page-workspace[data-ui-template="query-list"] .erp-filter-content { display: flex; align-items: end; gap: 10px; }
.page-workspace[data-ui-template="query-list"] .erp-filter-grid {
  min-width: 0;
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 8px 12px;
}
.page-workspace[data-ui-template="query-list"] .erp-filter-field { margin: 0; }
.page-workspace[data-ui-template="query-list"] .erp-filter-tools { width: 158px; flex: 0 0 158px; }
.page-workspace[data-ui-template="query-list"] .filter-toggle-bar { min-height: 24px; margin: 6px -10px -9px; }
.page-workspace[data-ui-template="query-list"] .filter-toggle { height: 24px; }
.page-workspace[data-ui-template="query-list"] .grid-shell { width: 100%; min-width: 0; min-height: 0; flex: 1 1 auto; overflow: hidden; }
.page-workspace[data-ui-template="query-list"] [data-erp-grid] { width: max-content; min-width: 100%; }
.page-workspace[data-ui-template="query-list"] .figma-template-main [data-erp-grid] col:nth-child(n),
.page-workspace[data-ui-template="query-list"] .figma-template-main [data-erp-grid] th:nth-child(n),
.page-workspace[data-ui-template="query-list"] .figma-template-main [data-erp-grid] td:nth-child(n) { display: table-cell; }
.page-workspace[data-ui-template="query-list"] .grid-summary-row .summary-grid-cell:has(> b)::before {
  content: attr(data-summary-cell) " ";
  color: var(--ui-muted);
  font-size: 11px;
  font-weight: 400;
}
.page-workspace[data-ui-template="query-list"] .grid-summary-row .summary-grid-cell > b { margin-left: 3px; white-space: nowrap; }
.page-workspace[data-ui-template="query-list"] .sales-domain-secondary-nav,
.page-workspace[data-ui-template="query-list"] .sales-domain-top { display: none; }

/* Workbench: summary across the top, operational work at left, context at right. */
.page-workspace[data-ui-template="workbench"] .figma-template-main {
  height: 100%;
  padding: 12px 16px 14px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ui-page-radius);
  background: var(--ui-panel);
}
.page-workspace[data-ui-template="workbench"] .page-body { min-height: 0; margin-top: 8px; flex: 1; overflow: auto; }
.page-workspace[data-ui-template="workbench"] .workbench-main-grid { grid-template-columns: minmax(0, 2fr) minmax(280px, .72fr); gap: 12px; }

/* Voucher: header and lines stay wide; secondary information never compresses the line grid. */
.page-workspace[data-ui-template="voucher"] .figma-template-main { height: 100%; padding: 0; overflow: hidden; background: #fff; }
.page-workspace[data-ui-template="voucher"] .page-head { min-height: 48px; padding: 8px 16px; border-bottom: 1px solid var(--ui-line); }
.page-workspace[data-ui-template="voucher"] .page-body { height: calc(100% - 48px); margin: 0; overflow: auto; }
.page-workspace[data-ui-template="voucher"] .document-edit-page,
.page-workspace[data-ui-template="voucher"] .voucher-detail-page,
.page-workspace[data-ui-template="voucher"] .sales-issue-detail-page { min-width: 980px; }
.page-workspace[data-ui-template="voucher"] .sales-issue-detail-page.sales-order-new-voucher { min-width: 0; }
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-purchase-order-new-voucher]) .page-body,
.page-workspace[data-page-kind="VoucherEditPage"]:has([data-sales-order-new-voucher]) .page-body { overflow-x: hidden; }

/* Drawers use one predictable width and never become a second full page. */
.drawer[data-ui-template="drawer"],
.detail-drawer[data-ui-template="drawer"] { width: min(680px, calc(100vw - 40px)); max-width: 680px; }
.drawer[data-ui-template="drawer"] .drawer-form { padding-bottom: 76px; }
.drawer[data-ui-template="drawer"] .drawer-form > button[type="submit"] {
  position: sticky;
  z-index: 8;
  bottom: 12px;
  width: 100%;
  min-height: 42px;
  margin-top: 14px;
  border: 0;
  border-radius: 8px;
  background: var(--ui-accent);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 8px 22px rgba(39,127,117,.22);
}
.drawer[data-ui-template="drawer"] .drawer-form[data-action="mercari.shippingSettings"] > button[type="submit"] {
  position: static;
  margin-top: 6px;
}

/* Platform sales-order generation: one compact decision surface, not a report. */
.drawer.platform-generation-check-drawer[data-ui-template="drawer"] {
  width: min(700px, calc(100vw - 40px));
  max-width: 700px;
}
.platform-generation-check-drawer .drawer-head {
  min-height: 70px;
  padding: 14px 18px;
}
.platform-generation-check-drawer .drawer-head h2 { font-size: 20px; letter-spacing: -.01em; }
.platform-generation-check-drawer .drawer-head p { color: #788782; font-size: 13px; }
.platform-generation-check-drawer .drawer-form {
  gap: 14px;
  padding: 16px 18px 24px;
  background: #f5f8f7;
}
.generation-check-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid #efd7d2;
  border-radius: 10px;
  background: #fff8f6;
}
.generation-check-summary > strong {
  flex: 0 0 auto;
  color: #b44a3b;
  font-size: 32px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.generation-check-summary > div { display: grid; gap: 2px; }
.generation-check-summary b { color: #3b4542; font-size: 15px; }
.generation-check-summary span { color: #71807b; font-size: 12px; }
.generation-check-sections { display: grid; gap: 10px; }
.generation-check-section {
  overflow: hidden;
  border: 1px solid #dce5e2;
  border-radius: 10px;
  background: #fff;
}
.generation-check-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border-bottom: 1px solid #e5ecea;
  background: #fbfcfc;
}
.generation-check-section > header > div { display: grid; gap: 2px; }
.generation-check-section > header strong { color: #33413d; font-size: 14px; }
.generation-check-section > header span { color: #7a8884; font-size: 11px; }
.generation-check-section > header em {
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f5e7e3;
  color: #a54839;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}
.generation-check-section[data-tone="warning"] > header em { background: #fff0cf; color: #986000; }
.generation-check-table-wrap { max-width: 100%; overflow-x: auto; }
.generation-check-table { width: 100%; border-collapse: collapse; table-layout: auto; font-size: 12px; }
.generation-check-table th {
  padding: 8px 12px;
  border-bottom: 1px solid #e7edeb;
  background: #f7f9f8;
  color: #73807c;
  text-align: left;
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}
.generation-check-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #edf1f0;
  color: #34413e;
  vertical-align: middle;
}
.generation-check-table tr:last-child td { border-bottom: 0; }
.generation-check-table td:last-child { width: 1%; white-space: nowrap; }
.generation-check-order { display: grid; gap: 2px; min-width: 118px; }
.generation-check-order small,
.generation-check-meta { display: block; color: #84908c; font-size: 10px; font-weight: 500; }
.generation-check-order strong { color: #2f3b38; font-size: 12px; font-variant-numeric: tabular-nums; }
.generation-check-problem { display: block; color: #9d493d; line-height: 1.4; }
.generation-check-shortage {
  display: inline-flex;
  min-width: 26px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: #fff0cf;
  color: #986000;
  font-weight: 700;
}

@media (max-width: 720px) {
  .drawer.platform-generation-check-drawer[data-ui-template="drawer"] { width: 100vw; max-width: 100vw; }
  .platform-generation-check-drawer .drawer-form { padding: 12px; }
  .generation-check-summary { padding: 12px; }
  .generation-check-table th,
  .generation-check-table td { padding: 8px 9px; }
}

/* PDA work: route is the dominant signal, desktop navigation stays out of the task. */
.page-workspace[data-ui-template="mobile-warehouse"] {
  width: min(560px, 100vw);
  height: 100vh;
  margin: 0 auto;
  overflow: hidden;
  background: #f4f5f5;
}
.page-workspace[data-ui-template="mobile-warehouse"] .mobile-location-strip {
  display: flex;
  align-items: center;
  gap: 8px;
}
.page-workspace[data-ui-template="mobile-warehouse"] .mobile-location-strip b {
  min-width: 26px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 5px;
  background: var(--ui-accent);
  color: #fff;
  font-size: 12px;
}

/* Product/category is a query scope, not a third permanent navigation rail. */
@media (max-width: 1440px) {
  .page-workspace[data-ui-template="query-list"] .tree-data-list-page,
  .page-workspace[data-ui-template="query-list"] .customer-foundation-page,
  .page-workspace[data-ui-template="query-list"] .carrier-foundation-page {
    grid-template-columns: 176px minmax(0, 1fr);
    gap: 10px;
  }
  .page-workspace[data-ui-template="query-list"] .erp-filter-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
}

@media (max-width: 1180px) {
  .page-workspace[data-ui-template="query-list"] .tree-data-list-page,
  .page-workspace[data-ui-template="query-list"] .customer-foundation-page,
  .page-workspace[data-ui-template="query-list"] .carrier-foundation-page { display: block; }
  .page-workspace[data-ui-template="query-list"] .tree-data-list-page > aside,
  .page-workspace[data-ui-template="query-list"] .customer-foundation-side,
  .page-workspace[data-ui-template="query-list"] .carrier-foundation-side { display: none; }
  .page-workspace[data-ui-template="query-list"] .erp-filter-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Sales receipt summary follows the open accounting layout: labels and amounts, not another table. */
.sales-order-compact-detail .sales-order-payment-summary {
  margin: 22px 16px 30px;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
.sales-order-compact-detail .sales-order-payment-summary h3 {
  height: 34px;
  padding: 0;
  border-top: 1px solid var(--ui-line);
  border-bottom: 0;
  background: transparent;
  font-size: 14px;
}
.sales-order-compact-detail .sales-order-payment-summary dl {
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  column-gap: 32px;
  padding-top: 5px;
}
.sales-order-compact-detail .sales-order-payment-summary dl > div {
  min-height: 43px;
  padding: 0;
  grid-template-columns: 92px minmax(0, 1fr);
  border: 0;
}
.sales-order-compact-detail .sales-order-payment-summary dd {
  color: var(--ui-title);
  font-size: 13px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.sales-order-compact-detail .sales-order-payment-summary .payment-due dd {
  color: var(--ui-danger);
}

/* Unified platform orders: the fixed workspace delegates vertical scrolling
   to the order grid so the all-platform result cannot clip its last rows and
   footer outside the visible page. */
.page-workspace[data-ui-template="query-list"] .platform-orders-page {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}
.page-workspace[data-ui-template="query-list"] .platform-orders-page > .platform-order-compact-summary {
  flex: 0 0 auto;
}
.page-workspace[data-ui-template="query-list"] .platform-orders-page > .document-list-board {
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.page-workspace[data-ui-template="query-list"] .platform-orders-page > .document-list-board > .board-body {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.page-workspace[data-ui-template="query-list"]
  .grid-shell[data-grid-table-key="sync.platformOrdersUnified"] > .grid-viewport {
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #9ebcb8 #edf3f2;
}
.page-workspace[data-ui-template="query-list"]
  .grid-shell[data-grid-table-key="sync.platformOrdersUnified"] > .grid-viewport::-webkit-scrollbar {
  display: block;
  width: 8px;
  height: 8px;
  background: #edf3f2;
}
.page-workspace[data-ui-template="query-list"]
  .grid-shell[data-grid-table-key="sync.platformOrdersUnified"] > .grid-viewport::-webkit-scrollbar-thumb {
  border: 2px solid #edf3f2;
  border-radius: 999px;
  background: #9ebcb8;
}

/* Selection belongs to the page command bar. Never float duplicate business
   actions over table rows or carry that surface into another page. */
#selectionTray,
.selection-tray { display: none !important; }
.toolbar-selection-status,
.toolbar-status {
  height: 28px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #c8ded9;
  border-radius: 6px;
  background: #edf7f4;
  color: #277f75;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}
.toolbar-clear-selection {
  height: 28px;
  padding: 0 9px;
  border: 0;
  background: transparent;
  color: #667672;
  font-size: 12px;
  white-space: nowrap;
}
.toolbar-clear-selection:hover { color: #277f75; background: #f1f6f5; }

/* One containment rule for every query grid: wide columns scroll inside the
   grid viewport and can never enlarge the page or board itself. */
.page-workspace[data-ui-template="query-list"] .page-body,
.page-workspace[data-ui-template="query-list"] .board,
.page-workspace[data-ui-template="query-list"] .board-body,
.page-workspace[data-ui-template="query-list"] .grid-shell,
.page-workspace[data-ui-template="query-list"] .grid-viewport {
  min-width: 0;
  max-width: 100%;
}

/* The base drawer is compact, while detail and line-edit drawers receive the
   width their content actually needs. These selectors intentionally come
   after the generic 680px rule so it cannot collapse large drawers again. */
.drawer[data-ui-template="drawer"] {
  min-width: 0;
}
.drawer.detail-wide[data-ui-template="drawer"] {
  width: min(920px, calc(100vw - 300px));
  max-width: 920px;
}
.drawer.detail-wide.product-detail-drawer[data-ui-template="drawer"],
.drawer.detail-wide.inventory-balance-detail-drawer[data-ui-template="drawer"] {
  width: min(780px, calc(100vw - 300px));
  max-width: 780px;
}
.drawer[data-ui-template="drawer"]:has(.line-items-field) {
  width: min(1120px, calc(100vw - 300px));
  max-width: 1120px;
}
.drawer[data-ui-template="drawer"] .drawer-form,
.drawer[data-ui-template="drawer"] .drawer-form > *,
.drawer[data-ui-template="drawer"] .form-section,
.drawer[data-ui-template="drawer"] .detail-list,
.drawer[data-ui-template="drawer"] .detail-list > div {
  min-width: 0;
  max-width: 100%;
}
.drawer[data-ui-template="drawer"] .line-items-field,
.drawer[data-ui-template="drawer"] .detail-table-wrap,
.drawer[data-ui-template="drawer"] .compact-table-wrap,
.drawer[data-ui-template="drawer"] .stocktake-detail-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow: auto;
}

/* Shared document printing: every business document uses the same paper,
   hierarchy and print-only surface. The accent stripe is the visual locator
   used by warehouse staff when several sheets are on the same desk. */
.drawer.detail-wide.print-preview-drawer[data-ui-template="drawer"] {
  width: min(1120px, calc(100vw - 300px));
  max-width: 1120px;
  background: #eef2f1;
}
.print-preview-drawer .drawer-form { padding: 16px 20px 36px; gap: 12px; }
.print-toolbar { position: sticky; z-index: 4; top: -16px; min-height: 52px; margin: -16px -20px 4px; padding: 10px 20px; display: flex; align-items: center; justify-content: flex-end; border-bottom: 1px solid var(--ui-line); background: rgba(255,255,255,.96); backdrop-filter: blur(10px); }
.print-toolbar button { height: 32px; padding: 0 22px; border: 1px solid var(--ui-accent); border-radius: 7px; background: var(--ui-accent); color: #fff; font-weight: 650; }
.print-sheet { width: 100%; max-width: 980px; margin: 0 auto; padding: 30px 34px 36px; border-top: 6px solid var(--ui-accent); border-radius: 3px; background: #fff; box-shadow: 0 14px 36px rgba(26,49,45,.12); color: #25302e; }
.print-doc-head { min-height: 58px; margin-bottom: 22px; padding-bottom: 14px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; border-bottom: 2px solid #31403d; }
.print-doc-head h3 { margin: 0 0 4px; color: #1f2d2a; font-size: 24px; letter-spacing: .02em; }
.print-doc-head p { margin: 0; color: #71807c; font-size: 12px; }
.print-doc-head > strong { color: #285f57; font-size: 13px; letter-spacing: .08em; white-space: nowrap; }
.print-doc-page + .print-doc-page { margin-top: 34px; padding-top: 34px; border-top: 2px dashed #9aa8a4; break-before: page; page-break-before: always; }
.print-doc-section { margin-top: 18px; break-inside: avoid; page-break-inside: avoid; }
.print-doc-section > h4 { margin: 0 0 8px; padding-left: 9px; border-left: 3px solid var(--ui-accent); color: #273633; font-size: 13px; line-height: 1.2; }
.print-doc-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.print-doc-meta { margin: 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid #cfd7d5; border-left: 1px solid #cfd7d5; }
.print-doc-meta > div { min-width: 0; min-height: 48px; padding: 7px 9px; border-right: 1px solid #cfd7d5; border-bottom: 1px solid #cfd7d5; }
.print-doc-meta dt { margin: 0 0 4px; color: #71807c; font-size: 10px; font-weight: 650; }
.print-doc-meta dd { margin: 0; overflow-wrap: anywhere; color: #27312f; font-size: 12px; line-height: 1.35; }
.print-doc-grid .print-doc-meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
.print-doc-table { width: 100%; border-collapse: collapse; table-layout: auto; font-size: 10px; }
.print-doc-table th { padding: 7px 6px; border: 1px solid #c7d0ce; background: #eef3f2; color: #52625e; font-weight: 700; text-align: left; white-space: nowrap; }
.print-doc-table td { padding: 7px 6px; border: 1px solid #d5dcda; vertical-align: top; line-height: 1.4; overflow-wrap: anywhere; }
.print-doc-summary { margin-top: 8px; padding: 9px 11px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 18px; border: 1px solid #ded7c6; background: #fffaf0; }
.print-doc-summary span { display: flex; gap: 7px; color: #2e3a37; font-size: 11px; }
.print-doc-summary b { color: #777165; font-weight: 600; }
.print-doc-sign { min-height: 68px; margin-top: 24px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; align-items: end; }
.print-doc-sign span { padding-bottom: 8px; border-bottom: 1px solid #7c8986; color: #56635f; font-size: 11px; }
.print-order-routing-list { display: grid; gap: 8px; }
.print-order-routing { padding: 10px 12px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: center; border: 1px solid #cfd8d5; background: #fbfcfc; }
.print-order-routing > div:first-child { min-width: 0; display: grid; gap: 3px; }
.print-order-routing b { color: #1f4f48; font-size: 13px; }
.print-order-routing span { color: #43514e; font-size: 11px; line-height: 1.35; }
.print-mercari-code { min-width: 260px; padding: 9px 11px; display: grid; grid-template-columns: minmax(0,1fr) 82px; gap: 12px; align-items: center; border: 1px solid #a9c8c2; background: #f2f8f6; }
.print-mercari-code > div { display: grid; gap: 2px; }
.print-mercari-code span { color: #53736d; font-size: 10px; font-weight: 700; }
.print-mercari-code strong { color: #173f39; font: 700 17px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .04em; }
.print-mercari-code small { color: #53645f; font: 11px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; }
.print-mercari-code img { width: 82px; height: 82px; object-fit: contain; image-rendering: pixelated; background: #fff; }
.print-mercari-code em { color: #9a5148; font-size: 11px; font-style: normal; }

@media print {
  @page { size: A4 portrait; margin: 10mm; }
  html, body { width: auto !important; height: auto !important; overflow: visible !important; background: #fff !important; }
  body * { visibility: hidden !important; }
  #drawer.print-preview-drawer,
  #drawer.print-preview-drawer * { visibility: visible !important; }
  #drawer.print-preview-drawer { position: absolute !important; inset: 0 auto auto 0 !important; width: 100% !important; max-width: none !important; height: auto !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: #fff !important; }
  #drawer.print-preview-drawer .drawer-head,
  #drawer.print-preview-drawer .print-toolbar { display: none !important; }
  #drawer.print-preview-drawer .drawer-form { height: auto !important; padding: 0 !important; overflow: visible !important; display: block !important; }
  .print-sheet { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border-top-width: 4px !important; box-shadow: none !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .print-doc-head { margin-top: 0; }
  .print-doc-section { break-inside: avoid; page-break-inside: avoid; }
  .print-doc-table thead { display: table-header-group; }
  .print-doc-table tr { break-inside: avoid; page-break-inside: avoid; }
}

/* Unified print center: same Figma ERP tokens, no parallel visual system. */
.drawer.detail-wide.print-template-designer-drawer[data-ui-template="drawer"] { width: calc(100vw - 16px); max-width: 1480px; border-radius: 12px 0 0 12px; }
.print-template-designer-drawer #drawerForm { height: calc(100vh - 64px); padding: 0; overflow: hidden; }
.print-template-editor { width: 100%; height: 100%; min-height: 0; display: grid; grid-template-columns: minmax(220px, 248px) minmax(340px, 1fr) minmax(280px, 310px); overflow: hidden; background: #f5f7f8; }
.print-editor-fields,.print-editor-settings { min-width: 0; min-height: 0; background: #fff; padding: 16px; overflow-x: hidden; overflow-y: auto; }
.print-editor-fields { border-right: 1px solid var(--line, #dfe6e8); }
.print-editor-settings { position: relative; border-left: 1px solid var(--line, #dfe6e8); display: flex; flex-direction: column; gap: 10px; padding-bottom: 76px; }
.print-editor-fields h3,.print-editor-settings h3 { margin: 0 0 12px; font-size: 16px; color: #18262d; }
.print-editor-fields > input { width: 100%; margin-bottom: 12px; }
.print-field-library { display: grid; gap: 6px; }
.print-field-library label { min-width: 0; display: flex; align-items: center; gap: 9px; padding: 8px; border: 1px solid transparent; border-radius: 6px; cursor: pointer; }
.print-field-library label:hover { background: #f1f8f6; border-color: #cfe3df; }
.print-field-library input[type="checkbox"] { width: 16px; height: 16px; min-width: 16px; margin: 0; padding: 0; flex: 0 0 16px; accent-color: var(--ui-accent); }
.print-field-library label span { min-width: 0; display: grid; gap: 2px; }
.print-field-library label b,.print-field-library label small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.print-field-library label b { font-size: 13px; font-weight: 600; }
.print-field-library label small { color: #8996a5; font-size: 11px; }
.print-editor-canvas { min-width: 0; min-height: 0; padding: 16px 20px; overflow: auto; }
.print-editor-canvas-head { display: flex; justify-content: space-between; margin-bottom: 14px; color: #667486; font-size: 13px; }
.print-editor-canvas-head strong { color: #1e2b33; font-size: 15px; }
.print-designer-paper { width: min(100%, 760px); min-height: 620px; margin: 0 auto; padding: 28px; background: #fff; border: 1px solid #dbe3e6; box-shadow: 0 12px 32px rgba(29,52,58,.08); }
.print-designer-paper.receipt { width: min(330px, 100%); min-height: 620px; padding: 18px 14px; }
.print-sample-head { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 2px solid #298b80; }
.print-sample-head strong { font-size: 20px; }.print-designer-paper.receipt .print-sample-head strong { font-size: 16px; }
.print-sample-head span { color: #7f8b99; font-size: 12px; }
.print-sample-field { display: grid; grid-template-columns: 130px 1fr; gap: 12px; min-height: 34px; align-items: center; border-bottom: 1px solid #edf0f2; }
.print-sample-field span { color: #7b8795; font-size: 12px; }.print-sample-field b { font-size: 13px; }
.print-sample-lines { display: grid; grid-template-columns: 1fr 2fr .5fr; margin-top: 16px; border: 1px solid #dfe5e8; }
.print-sample-lines > * { padding: 8px; border-right: 1px solid #dfe5e8; border-bottom: 1px solid #dfe5e8; font-size: 12px; }
.print-sample-lines > div { background: #f4f6f7; color: #728091; font-weight: 600; }

/* Purpose-built print samples. These are intentionally different documents:
   commercial slips, warehouse worksheets and thermal labels must not share one
   generic card layout. */
.print-sheet[data-template-sample="true"] > .print-doc-head { display: none; }
.print-sheet[data-template-sample="true"] { padding: 18px; border-top: 0; }
.print-sheet[data-template-sample="true"] .print-designer-paper { box-shadow: none; }
.print-designer-paper.landscape { width: min(100%, 920px); min-height: 500px; }
.print-designer-paper.waybill,.print-designer-paper.label { width: min(378px, 100%); min-height: 566px; padding: 12px; }
.print-designer-paper :where(h2,p,dl,dt,dd) { margin: 0; }
.print-designer-paper table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.print-designer-paper th,.print-designer-paper td { padding: 7px 6px; border: 1px solid #9aa3a1; text-align: left; vertical-align: top; font-size: 10px; line-height: 1.35; }
.print-designer-paper th { background: #263634; color: #fff; font-weight: 700; }

.sample-business-doc { min-height: 560px; display: flex; flex-direction: column; color: #17211f; }
.sample-business-doc > header { display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; gap: 20px; padding-bottom: 18px; border-bottom: 3px double #263634; }
.sample-doc-brand { display: grid; gap: 3px; font-weight: 750; color: #216f65; }.sample-doc-brand small { color: #687572; font-size: 9px; letter-spacing: .15em; }
.sample-business-doc h2 { text-align: center; font-size: 25px; letter-spacing: .2em; }.sample-business-doc h2 small { display: block; margin-top: 5px; color: #78837f; font-size: 8px; letter-spacing: .18em; }
.sample-doc-number { display: grid; grid-template-columns: auto 1fr; gap: 3px 8px; justify-self: end; font-size: 10px; }.sample-doc-number span { color: #78837f; }.sample-doc-number b { white-space: nowrap; }
.sample-doc-party { margin: 18px 0 16px; display: grid; grid-template-columns: 1.5fr 1fr; gap: 26px; }
.sample-doc-party > div { min-height: 68px; display: grid; align-content: start; gap: 5px; border-bottom: 1px solid #80908c; }.sample-doc-party small { color: #72807c; font-size: 9px; }.sample-doc-party strong { font-size: 15px; }.sample-doc-party span { font-size: 10px; line-height: 1.4; }
.sample-business-doc th:nth-child(1) { width: 6%; }.sample-business-doc th:nth-child(2) { width: 18%; }.sample-business-doc th:nth-child(3) { width: 30%; }.sample-business-doc th:nth-child(4) { width: 7%; }.sample-business-doc th:nth-child(n+5) { text-align: right; }
.sample-business-doc td:nth-child(n+4) { text-align: right; }.sample-business-doc.purchase th { background: #38536d; }
.sample-doc-bottom { margin-top: 14px; display: grid; grid-template-columns: 1fr 240px; gap: 30px; }.sample-doc-bottom > div { font-size: 10px; }.sample-doc-bottom > div p { margin-top: 7px; color: #52615e; }
.sample-doc-bottom dl { border-top: 1px solid #7f8c89; }.sample-doc-bottom dl div { min-height: 27px; padding: 5px 7px; display: flex; justify-content: space-between; border-bottom: 1px solid #c2cac8; font-size: 11px; }.sample-doc-bottom dl .total { background: #edf7f4; color: #174d46; font-size: 15px; font-weight: 750; }
.sample-business-doc > footer,.sample-warehouse-doc > footer,.sample-shipment-doc > footer { margin-top: auto; padding-top: 30px; display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; font-size: 10px; }

.sample-warehouse-doc { min-height: 500px; display: flex; flex-direction: column; color: #151a19; }
.sample-warehouse-doc > header { display: flex; align-items: end; justify-content: space-between; padding: 0 0 12px; border-bottom: 4px solid #17211f; }.sample-warehouse-doc header span { font-size: 9px; font-weight: 750; letter-spacing: .18em; }.sample-warehouse-doc header h2 { margin-top: 2px; font-size: 24px; }.sample-warehouse-doc header > b { padding: 7px 10px; border: 2px solid #17211f; font-size: 11px; }
.sample-task-strip { margin: 10px 0 14px; display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid #8c9693; }.sample-task-strip span { padding: 7px 8px; border-right: 1px solid #8c9693; font-size: 9px; font-weight: 650; }.sample-task-strip span:last-child { border-right: 0; }
.sample-picking th:nth-child(1) { width: 6%; }.sample-picking th:nth-child(2) { width: 15%; }.sample-picking th:nth-child(3) { width: 25%; }.sample-picking th:nth-child(5),.sample-picking th:nth-child(6) { width: 8%; text-align: center; }.sample-picking td:nth-child(1),.sample-picking td:nth-child(5),.sample-picking td:nth-child(6) { text-align: center; font-size: 14px; font-weight: 750; }
.sample-stocktake th:nth-child(1) { width: 12%; }.sample-stocktake th:nth-child(2) { width: 18%; }.sample-stocktake th:nth-child(3) { width: 25%; }.sample-stocktake th:nth-child(n+4):nth-child(-n+7),.sample-stocktake td:nth-child(n+4):nth-child(-n+7) { text-align: center; }

.sample-shipment-doc { min-height: 440px; display: flex; flex-direction: column; color: #17211f; }.sample-shipment-doc > header { display: flex; align-items: end; justify-content: space-between; padding-bottom: 11px; border-bottom: 3px solid #263634; }.sample-shipment-doc header span { color: #586762; font-size: 8px; letter-spacing: .18em; }.sample-shipment-doc header h2 { font-size: 23px; }.sample-shipment-doc header > strong { font: 700 12px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace; }
.sample-shipment-address { margin: 13px 0 10px; display: grid; grid-template-columns: 1.25fr 1fr; gap: 10px; }.sample-shipment-address > div { min-height: 82px; padding: 9px; display: grid; align-content: start; gap: 4px; border: 1px solid #a7b0ad; }.sample-shipment-address small { color: #6c7875; font-size: 8px; }.sample-shipment-address b { font-size: 13px; }.sample-shipment-address span { font-size: 9px; line-height: 1.4; }
.sample-order-links { margin-bottom: 10px; padding: 7px 9px; display: flex; gap: 24px; background: #edf3f2; font-size: 9px; }.sample-shipment-doc th:nth-child(2) { width: 43%; }.sample-shipment-doc td:nth-child(n+3),.sample-shipment-doc th:nth-child(n+3) { text-align: center; }.sample-shipment-note { margin-top: 10px; padding: 8px; border: 1px dashed #9da6a3; font-size: 9px; }

.sample-receipt { color: #0c0c0c; font: 11px/1.35 ui-monospace,SFMono-Regular,Menlo,"Noto Sans Mono CJK JP",monospace; }.sample-receipt header { padding-bottom: 9px; display: grid; text-align: center; gap: 2px; border-bottom: 1px dashed #111; }.sample-receipt header strong { font-size: 17px; letter-spacing: .08em; }.sample-receipt header span { font-size: 8px; }.sample-receipt-meta { padding: 7px 0; display: grid; gap: 2px; border-bottom: 1px dashed #555; font-size: 8px; }
.sample-receipt-items p { padding: 8px 0; display: grid; grid-template-columns: 1fr auto; gap: 3px 8px; border-bottom: 1px dashed #888; }.sample-receipt-items p b { grid-column: 1 / -1; font-size: 10px; }.sample-receipt-items p span,.sample-receipt-items p strong { font-size: 9px; }.sample-receipt-totals { padding: 8px 0; display: grid; gap: 4px; border-bottom: 1px dashed #111; }.sample-receipt-totals span,.sample-receipt-totals > strong { display: flex; justify-content: space-between; }.sample-receipt-totals > strong { padding: 5px 0; border-top: 2px solid #111; border-bottom: 2px solid #111; font-size: 14px; }.sample-receipt footer { padding-top: 9px; text-align: center; font-size: 8px; }

.sample-barcode { margin: 10px auto 0; display: grid; justify-items: center; gap: 4px; }.sample-barcode i { width: 82%; height: 48px; display: block; background: repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px,#111 4px 5px,transparent 5px 8px,#111 8px 11px,transparent 11px 13px); }.sample-barcode b { font: 700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .15em; }.sample-barcode.compact i { height: 28px; }.sample-barcode.compact b { font-size: 8px; }

.sample-waybill { min-height: 530px; display: grid; grid-template-rows: 1.55fr auto auto 1.35fr auto auto 54px; border: 1.5px solid #222; color: #111; background: #fff; }
.sample-waybill > * { border-bottom: 1px solid #767676; }
.sample-waybill > *:last-child { border-bottom: 0; }
.letterpack-address-block { display: grid; grid-template-columns: 86px 1fr; min-width: 0; }
.letterpack-address-block aside,.letterpack-name-row aside,.letterpack-phone-row aside { padding: 10px 8px; display: grid; align-content: start; gap: 2px; border-right: 1px solid #767676; }
.letterpack-address-block aside b,.letterpack-name-row aside b,.letterpack-phone-row aside b { font-size: 10px; }
.letterpack-address-block aside span,.letterpack-name-row aside span,.letterpack-phone-row aside span { font-size: 7px; color: #444; }
.letterpack-address-block > div { padding: 9px 12px; display: grid; align-content: center; gap: 7px; min-width: 0; }
.letterpack-address-block > div b { width: max-content; padding: 0 6px 4px; border-bottom: 1px dotted #777; font: 700 15px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .08em; }
.letterpack-address-block > div strong { padding-bottom: 4px; border-bottom: 1px dotted #aaa; font-size: 14px; line-height: 1.25; }
.letterpack-name-row { display: grid; grid-template-columns: 86px 1fr 35px; align-items: stretch; }
.letterpack-name-row > strong { padding: 11px 12px 7px; align-self: center; border-bottom: 1px dotted #888; font-size: 18px; }
.letterpack-name-row > b { display: grid; place-items: center; font-size: 13px; }
.letterpack-phone-row { display: grid; grid-template-columns: 86px 1fr; }
.letterpack-phone-row > strong { padding: 9px 12px; align-self: center; font: 700 13px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; }
.sample-waybill > footer { display: grid; place-items: center; padding: 10px; }
.sample-waybill > footer strong { font-size: 16px; letter-spacing: .04em; }

.print-sheet[data-template-sample="true"][data-print-layout="label"]:has(.sample-location-label) { width: min(var(--print-paper-width,100mm),100%); height: var(--print-paper-height,150mm); min-height: var(--print-paper-height,150mm); padding: 2mm; }
.print-designer-paper.label[data-sample-type="location_label"] { width: 100%; height: 100%; min-height: 0; padding: 5px; box-sizing: border-box; }
.sample-location-label { container-type: inline-size; width: 100%; max-width: 100%; height: 100%; min-height: 0; padding: clamp(5px,3cqw,12px); box-sizing: border-box; display: grid; grid-template-rows: auto minmax(0,1fr) auto minmax(42px,.7fr) auto; gap: clamp(2px,1.3cqw,5px); overflow: hidden; border: 2px solid #111; color: #111; background: #fff; }
.sample-location-label > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 5px; border-bottom: 2px solid #111; }
.sample-location-label > header span { min-width: 0; overflow: hidden; font-size: clamp(7px,3.2cqw,11px); font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.sample-location-label > header b { flex: 0 0 auto; padding: clamp(1px,.8cqw,3px) clamp(3px,1.5cqw,6px); border: 1px solid #111; font-size: clamp(6px,2.7cqw,9px); white-space: nowrap; }
.sample-location-label h2 { min-width: 0; max-width: 100%; align-self: center; overflow: hidden; white-space: nowrap; text-align: center; font: 850 clamp(24px,13cqw,52px)/1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .01em; }
.sample-location-label > p { min-width: 0; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(8px,4cqw,14px); font-weight: 750; }
.location-label-code-row { width: 100%; min-width: 0; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(34px,22cqw); align-items: center; gap: clamp(5px,3cqw,12px); overflow: hidden; }
.sample-location-label .sample-barcode { width: 100%; margin-top: 0; }
.sample-location-label .sample-barcode i { height: clamp(18px,9cqw,32px); }
.sample-location-label .sample-barcode b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(6px,2.8cqw,10px); }
.sample-location-qr { width: 100%; max-width: 78px; aspect-ratio: 1; justify-self: end; border: clamp(3px,1.6cqw,6px) solid #111; background: repeating-conic-gradient(#111 0 25%,#fff 0 50%) 0 0/clamp(7px,3.7cqw,14px) clamp(7px,3.7cqw,14px); box-shadow: inset 0 0 0 clamp(2px,1.3cqw,5px) #fff,inset 0 0 0 clamp(5px,2.4cqw,9px) #111; image-rendering: pixelated; }
.sample-location-label > footer { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 5px; padding-top: clamp(3px,1.8cqw,7px); overflow: hidden; border-top: 1px solid #777; font-size: clamp(6px,2.5cqw,10px); }
.sample-location-label > footer span,.sample-location-label > footer strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sample-location-label > footer strong { text-align: right; }

.print-sheet[data-template-sample="true"][data-print-layout="label"]:has(.sample-product-label) { width: min(60mm,100%); height: 40mm; min-height: 40mm; padding: 1.5mm; }
.print-designer-paper.label[data-sample-type="generic_label"] { width: 100%; height: 100%; min-height: 0; padding: 4px; box-sizing: border-box; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-product-label { min-height: 0; height: 100%; justify-content: initial; gap: 2px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-label-brand { padding-bottom: 2px; font-size: 6px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-product-label h2 { font-size: 10px; line-height: 1.15; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-product-label > p { font-size: 7px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-label-sku { grid-template-columns: 42px 1fr; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-label-sku > * { padding: 2px 3px; font-size: 6px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-barcode { margin-top: 1px; gap: 1px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-barcode i { height: 18px; }
.print-designer-paper.label[data-sample-type="generic_label"] .sample-barcode b,.print-designer-paper.label[data-sample-type="generic_label"] .sample-product-label footer { font-size: 6px; }

.sample-product-label { min-height: 520px; display: flex; flex-direction: column; justify-content: center; gap: 16px; color: #111; text-align: center; }.sample-label-brand { padding-bottom: 8px; border-bottom: 2px solid #111; font-size: 10px; font-weight: 750; letter-spacing: .14em; }.sample-product-label h2 { font-size: 22px; line-height: 1.45; }.sample-product-label > p { font-size: 13px; }.sample-label-sku { display: grid; grid-template-columns: 70px 1fr; border: 1px solid #111; text-align: left; }.sample-label-sku > * { padding: 7px; border-right: 1px solid #111; border-bottom: 1px solid #111; }.sample-label-sku > *:nth-last-child(-n+2) { border-bottom: 0; }.sample-label-sku span { font-size: 9px; }.sample-product-label footer { display: flex; justify-content: space-between; padding-top: 8px; border-top: 1px solid #111; font-size: 9px; }
.print-editor-settings > label,.print-station-form > label { display: grid; gap: 5px; font-size: 12px; color: #657385; }
.print-setting-inline { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.print-setting-inline > label { display: grid; gap: 5px; font-size: 12px; color: #657385; }
.print-check-label { grid-template-columns: auto 1fr !important; align-items: center; align-self: end; min-height: 40px; }
.print-selected-fields { display: grid; max-height: 210px; overflow: auto; border: 1px solid #dfe6e8; border-radius: 6px; background: #fafcfc; }
.print-selected-fields > div { display: grid; grid-template-columns: 22px 1fr 24px; align-items: center; gap: 4px; padding: 7px 8px; border-bottom: 1px solid #e8edef; background: #fff; color: #29373e; cursor: grab; }
.print-selected-fields > div.dragging { opacity: .45; }.print-selected-fields button { padding: 0; border: 0; background: transparent; color: #8794a2; }
.print-editor-settings > button[type="submit"] { position: sticky; z-index: 6; bottom: 0; width: 100%; min-height: 40px; margin-top: auto; border: 0; border-radius: 8px; background: var(--ui-accent); color: #fff; font-weight: 650; box-shadow: 0 8px 22px rgba(39,127,117,.22); }
.print-station-form { display: grid; gap: 14px; }.print-station-form textarea { min-height: 96px; }
.print-token-result { display: grid; gap: 14px; }.print-token-result strong { font-size: 20px; }.print-token-result textarea { min-height: 100px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.danger-note { color: #a43b32; background: #fff3f1; border: 1px solid #f0cbc6; padding: 10px; border-radius: 6px; }
.print-toolbar { display: flex; align-items: end; justify-content: flex-end; gap: 8px; position: sticky; top: 0; z-index: 5; padding: 10px 0; background: #fff; border-bottom: 1px solid #e2e8ea; }
.print-toolbar label { display: grid; gap: 3px; color: #758290; font-size: 11px; }.print-toolbar select { min-width: 150px; }.print-toolbar input { width: 64px; }
.print-sheet[data-print-layout="receipt"] { width: min(var(--print-paper-width, 80mm), 100%); padding: 4mm; margin: 18px auto; }
.receipt-print-block { font-size: 11px; color: #111; }.receipt-print-block header { display: grid; text-align: center; gap: 3px; padding-bottom: 8px; border-bottom: 1px dashed #444; }
.receipt-print-lines { margin: 8px 0; }.receipt-print-lines > div { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 6px 0; border-bottom: 1px dashed #aaa; }
.receipt-print-lines span { grid-column: 1 / -1; }.receipt-print-lines em { font-style: normal; }.receipt-print-total { display: grid; gap: 4px; padding: 8px 0; border-bottom: 1px dashed #444; }
.receipt-print-total span,.receipt-print-total > strong { display: flex; justify-content: space-between; }.receipt-print-block footer { display: grid; text-align: center; gap: 4px; padding-top: 10px; }
.print-sheet[data-print-layout="label"] { width: min(var(--print-paper-width, 100mm), 100%); min-height: 150mm; margin: 18px auto; padding: 6mm; }
.print-sheet[data-print-layout="receipt"] > .print-doc-head,.print-sheet[data-print-layout="label"] > .print-doc-head,.print-sheet[data-print-layout="waybill"] > .print-doc-head { display: none; }
.print-sheet[data-print-layout="label"]:has(.location-label-print-block) { min-height: var(--print-paper-height,150mm); padding: 2mm; }
.location-label-print-block { min-height: calc(var(--print-paper-height,150mm) - 4mm); padding: 3mm; gap: 2mm; }
.location-label-print-block h2 { font-size: clamp(24px,13cqw,52px); }
.location-label-print-block > p { font-size: clamp(8px,4cqw,14px); }
.location-label-print-block .sample-barcode { width: 100%; margin-top: 0; }
.location-label-print-block .sample-barcode i { height: 12mm; }
.product-label-print-block { min-height: 132mm; display: flex; flex-direction: column; justify-content: center; gap: 8mm; color: #111; }
.product-label-print-block header { display: grid; gap: 3mm; text-align: center; }
.product-label-print-block header strong { font-size: 22px; line-height: 1.35; }
.product-label-print-block header span { color: #555; font-size: 13px; }
.product-label-code { padding: 5mm 3mm; display: grid; gap: 2mm; border: 1px solid #222; text-align: center; }
.product-label-code span { font-size: 11px; color: #555; }.product-label-code b { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 22px; letter-spacing: .04em; }
.product-label-print-block p { margin: 0; text-align: center; font-size: 13px; }
.print-sheet[data-print-layout="label"]:has(.product-label-print-block) { min-height: 40mm; padding: 1.5mm; }
.product-label-print-block { min-height: 37mm; gap: 1.5mm; justify-content: initial; }
.product-label-print-block header { gap: .5mm; }
.product-label-print-block header strong { font-size: 10pt; line-height: 1.15; }
.product-label-print-block header span { font-size: 7pt; }
.product-label-print-block .product-label-code { padding: 1mm; gap: .5mm; }
.product-label-print-block .product-label-code span { font-size: 6pt; }
.product-label-print-block .product-label-code b { font-size: 10pt; }
.product-label-print-block .sample-barcode { margin: 0; gap: .5mm; }
.product-label-print-block .sample-barcode i { height: 7mm; }
.product-label-print-block .sample-barcode b { font-size: 6pt; }
.product-label-print-block p { font-size: 7pt; }
@media (max-width: 1050px) { .print-template-editor { grid-template-columns: 210px minmax(340px, 1fr); overflow: auto; }.print-editor-fields,.print-editor-canvas { min-height: 620px; }.print-editor-settings { grid-column: 1 / -1; overflow: visible; border-left: 0; border-top: 1px solid var(--line,#dfe6e8); display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }.print-editor-settings h3,.print-editor-settings > button { grid-column: 1 / -1; } }
@media (max-width: 760px) { .print-template-editor { display: block; }.print-editor-fields,.print-editor-settings,.print-editor-canvas { max-height: none; }.print-toolbar { align-items: stretch; flex-direction: column; }.print-toolbar label,.print-toolbar select,.print-toolbar input,.print-toolbar button { width: 100%; } }
@media print {
  .print-toolbar { display: none !important; }
  .print-sheet { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; border: 0 !important; }
  .receipt-print-block { width: 100%; }
}

/* Action feedback is a decision surface, not a data dump. Keep the outcome and
   next step visible; audit fields and wide tables stay available on demand. */
.drawer.detail-wide.action-result-drawer[data-ui-template="drawer"] {
  width: min(760px, calc(100vw - 300px));
  max-width: 760px;
}
.drawer.detail-wide.action-feedback-drawer[data-ui-template="drawer"] {
  width: min(760px, calc(100vw - 300px));
  max-width: 760px;
}
.action-result-drawer .drawer-form { gap: 16px; }
.action-result-hero {
  padding: 18px 20px;
  border: 1px solid #c9e2dc;
  border-left: 5px solid var(--ui-accent);
  border-radius: 10px;
  background: linear-gradient(135deg, #f2faf8 0%, #fff 82%);
}
.action-result-hero.warning { border-color: #ead9a6; border-left-color: #b98216; background: linear-gradient(135deg, #fff9e9 0%, #fff 82%); }
.action-result-hero.danger { border-color: #efc5c2; border-left-color: #c94a43; background: linear-gradient(135deg, #fff3f2 0%, #fff 82%); }
.action-result-kicker { color: #4a766f; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.action-result-hero.warning .action-result-kicker { color: #94630b; }
.action-result-hero.danger .action-result-kicker { color: #a53e38; }
.action-result-hero h3 { margin: 5px 0 4px; color: var(--ui-title); font-size: 20px; line-height: 1.35; }
.action-result-hero p { margin: 0; color: #667286; font-size: 13px; line-height: 1.6; }
.action-result-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; }
.action-result-metric { min-width: 0; padding: 11px 12px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; }
.action-result-metric span { display: block; margin-bottom: 4px; color: var(--ui-muted); font-size: 11px; }
.action-result-metric strong { display: block; overflow: hidden; color: var(--ui-title); font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.action-result-metric.success strong { color: #238579; }
.action-result-metric.danger strong { color: #c24740; }
.action-result-actions { padding: 12px 14px; border-radius: 8px; background: #f4f7f7; }
.action-result-actions .row-actions { justify-content: flex-start; }
.action-result-attention { padding: 14px; border: 1px solid #ead9a6; border-radius: 9px; background: #fffdf7; overflow: hidden; }
.action-result-attention h4 { margin: 0 0 10px; color: #704f13; font-size: 14px; }
.action-result-attention .detail-table-wrap { overflow: auto; }
.action-result-details { display: grid; gap: 8px; }
.detail-disclosure { border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; overflow: hidden; }
.detail-disclosure > summary { min-height: 44px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #4f5d6d; font-weight: 650; cursor: pointer; list-style: none; }
.detail-disclosure > summary::-webkit-details-marker { display: none; }
.detail-disclosure > summary::after { content: "+"; margin-left: auto; color: #77908b; font-size: 18px; font-weight: 400; }
.detail-disclosure[open] > summary::after { content: "−"; }
.detail-disclosure > summary small { margin-left: auto; color: var(--ui-muted); font-size: 11px; font-weight: 400; }
.detail-disclosure-body { padding: 0 14px 14px; overflow: auto; }
.detail-list-disclosure { display: block !important; padding: 8px 0 !important; }
.detail-list-disclosure > dd { width: 100%; }

/* Warehouse dispatch has one dominant action. Secondary work stays compact and
   optional flows live in the menu instead of competing for the whole header. */
.page-workspace:has([data-grid-table-key="shipments.pending"]) .page-head .toolbar-group.primary { gap: 6px; }
.page-workspace:has([data-grid-table-key="shipments.pending"]) .page-head .toolbar button,
.page-workspace:has([data-grid-table-key="shipments.pending"]) .page-head .toolbar-menu > summary {
  height: 30px;
  padding: 0 10px;
  border-radius: 7px;
  font-size: 12px;
}

@media (max-width: 1200px) {
  .drawer.detail-wide[data-ui-template="drawer"],
  .drawer.detail-wide.product-detail-drawer[data-ui-template="drawer"],
  .drawer.detail-wide.inventory-balance-detail-drawer[data-ui-template="drawer"],
  .drawer.detail-wide.action-result-drawer[data-ui-template="drawer"],
  .drawer.detail-wide.action-feedback-drawer[data-ui-template="drawer"],
  .drawer[data-ui-template="drawer"]:has(.line-items-field) {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
  }
}

/* Print preview must remain operable on phones and narrow warehouse terminals. */
.print-preview-drawer .print-toolbar {
  max-width: 100%;
  flex-wrap: wrap;
  overflow: visible;
}
.print-preview-drawer .drawer-form { container-type: inline-size; }
.print-preview-drawer .print-toolbar label { min-width: 0; }
.print-preview-drawer .print-toolbar select,
.print-preview-drawer .print-toolbar input { max-width: 100%; }

@media (max-width: 760px) {
  .drawer.detail-wide.print-preview-drawer[data-ui-template="drawer"] {
    width: 100vw;
    max-width: 100vw;
    border-radius: 0;
  }
  .print-preview-drawer .drawer-form { padding: 12px 10px 28px; }
  .print-preview-drawer .print-toolbar {
    position: static;
    top: auto;
    margin: -12px -10px 8px;
    padding: 10px;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    align-items: end;
    gap: 8px;
  }
  .print-preview-drawer .print-toolbar label:first-child { grid-column: 1 / -1; }
  .print-preview-drawer .print-toolbar label,
  .print-preview-drawer .print-toolbar select,
  .print-preview-drawer .print-toolbar input,
  .print-preview-drawer .print-toolbar button {
    width: 100%;
    min-width: 0;
  }
  .print-preview-drawer .print-toolbar button { padding-inline: 8px; }
  .print-preview-drawer .print-sheet { max-width: 100%; margin: 10px auto; }
}

@media (max-width: 480px) {
  .print-preview-drawer .print-toolbar { grid-template-columns: 1fr; }
  .print-preview-drawer .print-toolbar label:first-child { grid-column: auto; }
}

@container (max-width: 760px) {
  .print-preview-drawer .print-toolbar {
    position: static;
    top: auto;
    margin: -12px -10px 8px;
    padding: 10px;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    align-items: end;
    gap: 8px;
  }
  .print-preview-drawer .print-toolbar label:first-child { grid-column: 1 / -1; }
  .print-preview-drawer .print-toolbar label,
  .print-preview-drawer .print-toolbar select,
  .print-preview-drawer .print-toolbar input,
  .print-preview-drawer .print-toolbar button { width: 100%; min-width: 0; }
  .print-preview-drawer .print-toolbar button { padding-inline: 8px; }
  .print-preview-drawer .print-sheet { max-width: 100%; margin: 10px auto; }
}

@container (max-width: 480px) {
  .print-preview-drawer .print-toolbar { grid-template-columns: 1fr; }
  .print-preview-drawer .print-toolbar label:first-child { grid-column: auto; }
}