:root {
  color-scheme: light;
  --font-sans: "Microsoft YaHei UI", "PingFang SC", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  /* Enterprise typography roles: Web stays dense; mobile scales for field use. */
  --type-web-page-title: 20px;
  --type-web-section-title: 16px;
  --type-web-body: 14px;
  --type-web-label: 13px;
  --type-web-meta: 12px;
  --type-mobile-page-title: 20px;
  --type-mobile-section-title: 17px;
  --type-mobile-body: 15px;
  --type-mobile-label: 14px;
  --type-mobile-meta: 12px;
  --line-compact: 1.35;
  --line-body: 1.6;

  --el-color-primary: #1769aa;
  --el-color-primary-light-3: #5b94c2;
  --el-color-primary-light-5: #8fb5d4;
  --el-color-primary-light-7: #bfd5e7;
  --el-color-primary-light-8: #d9e7f2;
  --el-color-primary-light-9: #edf4f9;
  --el-color-primary-dark-2: #12558f;
  --el-color-success: #16a34a;
  --el-color-success-light-9: #edf9f0;
  --el-color-warning: #d97706;
  --el-color-warning-light-9: #fff7e8;
  --el-color-danger: #dc2626;
  --el-color-danger-light-9: #fff1f1;
  --el-color-info: #64748b;
  --el-color-info-light-9: #f1f5f9;

  /* Construction-domain accent is semantic, never a competing primary action. */
  --color-construction-accent: #c65d0e;
  --color-construction-accent-soft: #fff4e8;

  --el-text-color-primary: #172033;
  --el-text-color-regular: #475467;
  --el-text-color-secondary: #667085;
  --el-text-color-placeholder: #98a2b3;
  --el-text-color-disabled: #b4bdc9;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f3f6fa;
  --el-bg-color-overlay: #ffffff;
  --el-fill-color: #f2f5f9;
  --el-fill-color-light: #f7f9fc;
  --el-fill-color-lighter: #fafbfc;
  --el-fill-color-extra-light: #fcfdff;
  --el-fill-color-dark: #e8edf4;
  --el-fill-color-blank: #ffffff;
  --el-border-color: #d9e1ec;
  --el-border-color-light: #e4e9f0;
  --el-border-color-lighter: #edf1f5;
  --el-border-color-extra-light: #f3f5f8;
  --el-border-color-dark: #c7d0dc;
  --el-border-color-darker: #adb8c7;

  --color-shell: #0b1f3a;
  --color-shell-elevated: #102a4c;
  --color-shell-hover: #17375f;
  --color-shell-muted: #91a4bd;
  --color-mask: rgb(9 18 33 / 58%);
  --color-focus: #1769aa;
  --focus-ring: 0 0 0 3px rgb(23 105 170 / 18%);
  --selection-bg: #d9e7f2;

  --status-business: #1769aa;
  --status-approval: #7c3aed;
  --status-sync: #0f766e;
  --status-ai: #0369a1;
  --status-document: #475569;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  --radius-compact: 4px;
  --radius-base: 6px;
  --radius-card: 8px;
  --radius-panel: 12px;
  --radius-round: 999px;

  --shadow-card: 0 1px 2px rgb(16 24 40 / 5%);
  --shadow-hover: 0 6px 18px rgb(16 24 40 / 9%);
  --shadow-overlay: 0 14px 40px rgb(16 24 40 / 16%);
  --shadow-mobile-nav: 0 -4px 16px rgb(16 24 40 / 8%);

  --control-height-sm: 24px;
  --control-height: 32px;
  --control-height-lg: 40px;
  --web-target-min: 32px;
  --touch-target: 44px;
  --touch-target-android: 48px;
  --icon-size-sm: 16px;
  --icon-size: 20px;
  --icon-size-lg: 24px;

  --web-header-height: 56px;
  --web-sidebar-width: 224px;
  --web-sidebar-collapsed-width: 72px;
  --web-page-padding: 24px;
  --web-page-padding-compact: 20px;
  --mobile-canvas-width: 390px;
  --mobile-header-height: 48px;
  --mobile-bottom-nav-height: 60px;
  --screen-header-height: 72px;

  --motion-fast: 120ms;
  --motion-base: 180ms;
  --motion-slow: 220ms;
  --ease-enter: cubic-bezier(.16, 1, .3, 1);
  --ease-exit: cubic-bezier(.4, 0, 1, 1);

  --z-base: 0;
  --z-sticky: 10;
  --z-dropdown: 20;
  --z-overlay: 30;
  --z-dialog: 40;
  --z-notification: 50;
  --z-review: 60;

  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  min-height: 100%;
  font-family: var(--font-sans);
  color: var(--el-text-color-primary);
  background: var(--el-bg-color-page);
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 320px;
  min-height: 100%;
  margin: 0;
  color: var(--el-text-color-primary);
  font: 14px/1.5 var(--font-sans);
  background: var(--el-bg-color-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.is-modal-open,
body.is-drawer-open,
body.is-sheet-open {
  overflow: hidden;
  overscroll-behavior: none;
}

button,
input,
select,
textarea {
  margin: 0;
  color: inherit;
  font: inherit;
}

button,
[role="button"],
a,
label[for],
select,
summary {
  touch-action: manipulation;
}

button,
[role="button"],
a[href],
select,
summary {
  cursor: pointer;
}

button:disabled,
[role="button"][aria-disabled="true"],
select:disabled {
  cursor: not-allowed;
}

a {
  color: var(--el-color-primary);
  text-decoration: none;
}

a:hover {
  color: var(--el-color-primary-light-3);
}

img,
svg {
  display: block;
  max-width: 100%;
}

svg {
  flex: 0 0 auto;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

::selection {
  color: var(--el-text-color-primary);
  background: var(--selection-bg);
}

:where(button, [role="button"], a[href], input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
}

:where(button, [role="button"], a[href], input, select, textarea, summary, [tabindex]):focus:not(:focus-visible) {
  outline: none;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.u-hidden,
[hidden] {
  display: none !important;
}

.u-num,
.is-numeric,
[data-numeric] {
  font-variant-numeric: tabular-nums lining-nums;
}

.u-truncate {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.u-clamp-2 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.u-scrollbar {
  scrollbar-color: #bdc7d5 transparent;
  scrollbar-width: thin;
}

.u-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.u-scrollbar::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: var(--radius-round);
  background: #bdc7d5;
  background-clip: padding-box;
}

.u-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}

.el-icon,
[data-icon] > svg,
svg[data-icon] {
  width: 1em;
  height: 1em;
  overflow: visible;
  color: currentColor;
  stroke-width: 1.75;
}

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

@media (forced-colors: active) {
  :root {
    --focus-ring: 0 0 0 3px CanvasText;
  }

  .el-icon,
  svg[data-icon] {
    forced-color-adjust: auto;
  }
}