/* Design Engineers — shared operational UI. The portal never opts into de-ui.
   Legacy themes are intentionally unchanged. !important bridges their existing
   declarations; new components should use these semantic tokens directly.
   Keep the billing copy identical (verified by test_design_engineers_ui.py). */
/* Layered important rules outrank the older unlayered important rules,
   regardless of page-specific selector depth, without changing the portal. */
@layer de-system {
body.de-ui:not(.v2-portal) {
  --de-ink: #1d304a;
  --de-muted: #52647c;
  --de-primary: #1769d2;
  --de-primary-hover: #0e56b3;
  --de-soft: #edf4fe;
  --de-canvas: #f5f7fa;
  --de-surface: #ffffff;
  --de-line: #dbe3ed;
  --de-control-line: #acbcd0;
  --de-danger: #b42338;
  --de-success: #16704b;
  --de-warning: #875707;
  --de-radius: 12px;
  --de-control-radius: 8px;
  --de-font: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --v2-font: var(--de-font);
  --v2-ink: var(--de-ink);
  --v2-ink-2: var(--de-ink);
  --v2-muted: var(--de-muted);
  --v2-accent: var(--de-primary);
  --v2-radius: var(--de-radius);
  --v2-radius-sm: var(--de-control-radius);
  --v2-shadow: none;
  --v2-shadow-hover: none;
  margin: 0;
  color: var(--de-ink) !important;
  background: var(--de-canvas) !important;
  font-family: var(--de-font) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-shadow: none !important;
}
body.de-ui *, body.de-ui *::before, body.de-ui *::after { box-sizing: border-box; }
/* Typography is inherited at every UI node, not just the body and controls.
   Keep original document typography inside document preview surfaces. */
body.de-ui :where(*):not(:where(.archive-doc-table, .archive-doc-table *, .word-preview, .word-preview *, .original-document-preview, .original-document-preview *, .total-report-grid, .total-report-grid *)) {
  font-family: var(--de-font) !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: normal !important;
}
body.de-ui :where(strong, b) { font-weight: 600 !important; }
body.de-ui :is(summary, .tools-summary, .plan-chip) { font-size: 14px !important; font-weight: 600 !important; }
body.de-ui :is(small, .tools-summary-meta, .list-meta, .lnrq-app-version) { font-size: 13px !important; font-weight: 400 !important; }
body.de-ui ::selection { color: #113d79; background: #dceafe; }
body.de-ui :is(input, textarea) { caret-color: var(--de-primary); }
body.de-ui :is(a, button, input, select, textarea, summary) { font-family: var(--de-font) !important; }
body.de-ui :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--de-primary-hover) !important;
  outline-offset: 3px !important;
  transition: none !important;
}
body.de-ui a { text-underline-offset: 3px; }
body.de-ui :is(h1, h2, h3, h4):not(:where(.archive-doc-table *, .word-preview *, .original-document-preview *)) {
  color: var(--de-ink) !important; letter-spacing: 0 !important;
  line-height: 1.4 !important; text-shadow: none !important; overflow-wrap: anywhere;
}
body.de-ui h1 { font-size: 26px !important; font-weight: 700 !important; }
body.de-ui h2 { font-size: 20px !important; font-weight: 600 !important; }
body.de-ui h3 { font-size: 18px !important; font-weight: 600 !important; }
body.de-ui h4 { font-size: 16px !important; font-weight: 600 !important; }
body.de-ui :is(.muted, .hint, .sub, .subtitle, .help, .help-text, .clean-subtitle, .resident-hero p, .page-head p) {
  color: var(--de-muted) !important; font-size: 14px !important;
  font-weight: 400 !important; line-height: 1.6 !important; opacity: 1;
}
body.de-ui :is(.content, .content-shell, .clean-wrap, .standalone-shell, .resident-shell, .window, .wrap) { min-width: 0; }
body.de-ui :is(.content, .clean-wrap, .standalone-shell, .resident-shell, .window, .wrap) {
  padding: 24px clamp(16px, 2.5vw, 40px) 48px !important;
}
body.de-ui > .page, body.de-resident-landing > .shell {
  width: 100% !important; max-width: 1680px !important; margin-inline: auto !important;
  padding: 24px clamp(16px, 2.5vw, 40px) 48px !important;
}
body.de-ui :is(.page-head, .clean-topbar, .standalone-top, .resident-hero, .inspection-hero, .page-header) {
  min-height: 0 !important; gap: 16px !important; padding: 20px !important;
  margin-bottom: 20px !important; border: 1px solid var(--de-line) !important;
  border-radius: var(--de-radius) !important; background: var(--de-surface) !important;
  box-shadow: none !important; backdrop-filter: none !important; animation: none !important; transform: none !important;
}
body.de-ui :is(.page-head, .standalone-top, .resident-hero, .page-header) > div { min-width: 0; }
body.de-ui :is(.page-head, .standalone-top, .resident-hero, .page-header) :is(h1, h2) { margin: 0 !important; }
body.de-ui :is(.page-head, .standalone-top, .resident-hero, .page-header) p { margin: 8px 0 0 !important; }
body.de-ui .compact-head > div:first-child { display: block !important; }
body.de-ui :is(.panel, .card-panel, .section-card, .content-card, .table-card, .resident-card) {
  min-width: 0; padding: 20px !important; border: 1px solid var(--de-line) !important;
  border-radius: var(--de-radius) !important; background: var(--de-surface) !important;
  box-shadow: none !important; backdrop-filter: none !important;
  transform: none !important; animation: none !important;
}
body.de-ui :is(.panel-head, .section-head, .card-head) {
  gap: 12px !important; margin-bottom: 16px !important; padding-bottom: 12px !important;
  border-bottom: 1px solid var(--de-line) !important;
}
body.de-ui :is(.panel-head, .section-head, .card-head) :is(h2, h3) { padding: 0 !important; border: 0 !important; margin: 0 !important; }
/* A subtitle <p> under a panel-head heading defaults to the browser's normal
   14px top/bottom paragraph margin, which reads as a big dead gap under a
   short one-line subtitle (worst on a panel like "信息不完整提醒" that has no
   content below the head at all). Tighten it to a small top gap only. */
body.de-ui :is(.panel-head, .section-head, .card-head) > div > p { margin: 4px 0 0 !important; }
body.de-ui :is(.panel-head, .section-head, .card-head) :is(h2, h3)::before,
body.de-ui :is(.panel-head, .section-head, .card-head) :is(h2, h3)::after { display: none !important; }
body.de-ui :is(.grid2, .settings-home-grid, .auth-admin-grid, .topline, .triple, .quad) {
  align-items: start !important; gap: 20px !important;
}
body.de-ui :is(.grid2, .settings-home-grid, .auth-admin-grid, .topline, .triple, .quad) > .panel { margin-top: 0 !important; }

/* Headers and navigation: one hierarchy, no floating pill dock. */
body.de-ui .topbar.topbar, body.de-ui .topbar.topbar-compact {
  color: var(--de-ink) !important; background: var(--de-surface) !important;
  box-shadow: none !important; backdrop-filter: none !important;
  border-bottom-color: var(--de-line) !important; gap: 16px !important; animation: none !important;
}
/* The system header has two deliberate rows: context first, navigation second.
   This avoids hiding actions whenever a business module has a longer menu. */
@media (min-width: 901px) {
  body.de-ui .topbar.topbar-compact {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 10px 22px 12px !important;
  }
  body.de-ui .topbar.topbar-compact > .topbar-left {
    position: absolute !important;
    top: 10px !important;
    left: 50% !important;
    display: block !important;
    width: max-content !important;
    min-width: 0 !important;
    text-align: center !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
  }
  body.de-ui .topbar.topbar-compact .topbar-title-solo {
    display: block !important;
    width: max-content !important;
    max-width: min(60vw, 720px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  body.de-ui .topbar.topbar-compact .top-nav-header {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    padding: 36px 0 0 !important;
  }
  body.de-ui .topbar.topbar-compact .top-nav-action-form {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  body.de-ui .topbar.topbar-compact .topbar-time {
    position: absolute !important;
    top: 24px !important;
    right: 22px !important;
    width: auto !important;
    max-width: 240px !important;
    min-height: 0 !important;
    padding: 0 2px !important;
    color: var(--de-muted) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: .01em !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(-50%) !important;
  }
}
body.de-ui :is(.topbar-title-solo, .topbar-title, .topbar-module, .topbar > .topbar-left) {
  font-size: 20px !important; font-weight: 700 !important;
  letter-spacing: 0 !important; line-height: 1.4 !important;
}
body.de-ui :is(.topbar-time, .topbar-chip) {
  font-size: 14px !important; font-weight: 400 !important; color: var(--de-muted) !important;
  border-radius: var(--de-control-radius) !important; background: var(--de-surface) !important;
}
body.de-ui :is(.ui-workspace-tabs, .settings-section-nav, .resident-tabs, .inspection-tabs, .dock) {
  position: static !important; transform: none !important;
  width: 100% !important; max-width: 100% !important;
  display: flex !important; justify-content: flex-start !important;
  gap: 8px !important; margin: 0 0 20px !important; padding: 8px !important;
  overflow-x: auto !important; border: 1px solid var(--de-line) !important;
  border-radius: var(--de-radius) !important; background: var(--de-surface) !important;
  box-shadow: none !important; backdrop-filter: none !important;
}
body.de-ui :is(.top-nav, .topbar-nav) { gap: 8px !important; justify-content: flex-start !important; }

/* Every actionable control has readable labels and a consistent hit area. */
body.de-ui :is(button, .btn, .button, .compact-btn, .status-pill-btn, .ui-page-button, .top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab, .settlement-subnav a, a.back, a.home-btn, a.topbar-time) {
  display: inline-flex; align-items: center !important; justify-content: center !important;
  min-height: 44px !important; height: auto !important; min-width: 44px;
  padding: 9px 16px !important; gap: 6px; margin-top: 0;
  border: 1px solid var(--de-primary) !important; border-radius: var(--de-control-radius) !important;
  color: #fff !important; background: var(--de-primary) !important;
  font-size: 14px !important; font-weight: 600 !important; line-height: 1.5 !important;
  text-align: center; text-decoration: none !important; white-space: normal !important;
  box-shadow: none !important; text-shadow: none !important; transform: none !important;
  cursor: pointer; touch-action: manipulation;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 120ms cubic-bezier(.23,1,.32,1) !important;
}
body.de-ui :is(.btn-secondary, .btn-gray, .btn-outline, .secondary, .ghost, .subtle, .ui-page-button, .top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab, .settlement-subnav a, a.back, a.home-btn, a.topbar-time) {
  color: var(--de-ink) !important; background: var(--de-surface) !important; border-color: var(--de-control-line) !important;
}
body.de-ui :is(.top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab, .settlement-subnav a) {
  flex: 0 0 auto !important; width: auto !important;
  white-space: nowrap !important; min-width: 0 !important;
}
body.de-ui :is(.top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab, .settlement-subnav a).active {
  color: #fff !important; background: var(--de-primary) !important; border-color: var(--de-primary) !important;
}
body.de-ui :is(.btn-danger, .danger-btn, button.danger, .btn.danger) {
  color: #fff !important; background: var(--de-danger) !important; border-color: var(--de-danger) !important;
}
body.de-ui :is(button, .btn, .button, .top-nav-link):active:not(:disabled):not(:focus-visible):not([aria-disabled="true"]) { transform: scale(.97) !important; }
body.de-ui :is(button, .btn, .button, .top-nav-link):focus-visible { transform: none !important; transition: none !important; }
body.de-ui :is(button:disabled, .btn.disabled, .btn[aria-disabled="true"], .ui-page-button:disabled) {
  color: #607087 !important; background: #eef1f5 !important; border-color: var(--de-line) !important;
  opacity: 1 !important; cursor: not-allowed !important; transform: none !important; box-shadow: none !important;
}
body.de-ui :is(.actions, .filter-actions, .resident-actions, .standalone-actions, .top-actions, .backup-actions, .toolbar-wrap, .form-actions) {
  display: flex; flex-wrap: wrap !important; align-items: center; gap: 8px !important; min-width: 0;
}
body.de-ui :is(.actions, .top-actions, .form-actions) form { margin: 0; max-width: 100%; }
body.de-ui :is(input:not([type]), input[type="text"], input[type="search"], input[type="password"], input[type="number"], input[type="date"], input[type="month"], input[type="datetime-local"], input[type="email"], input[type="tel"], input[type="url"], select, textarea):not(:where(.archive-doc-table *)) {
  min-width: 0 !important; max-width: 100%; min-height: 44px !important;
  padding: 9px 12px !important; color: var(--de-ink) !important;
  background: var(--de-surface) !important; border: 1px solid var(--de-control-line) !important;
  border-radius: var(--de-control-radius) !important;
  font-size: 16px !important; font-weight: 400 !important; line-height: 1.5 !important;
  box-shadow: none !important;
}
body.de-ui textarea:not(:where(.archive-doc-table *)) { min-height: 100px !important; resize: vertical; }
body.de-ui :is(input, textarea)::placeholder { color: #637188 !important; opacity: 1; }
body.de-ui :is(input, select, textarea):disabled { background: #eef1f5 !important; color: var(--de-muted) !important; cursor: not-allowed; }
body.de-ui input[readonly] { background: #f5f7fa !important; }
body.de-ui :is(input[type="checkbox"], input[type="radio"]) {
  width: 18px !important; height: 18px !important; min-height: 18px !important;
  flex-shrink: 0; padding: 0 !important; accent-color: var(--de-primary);
}
body.de-ui input[type="file"] { width: 100%; max-width: 100%; font-size: 14px !important; color: var(--de-muted); }
body.de-ui input::file-selector-button { min-height: 40px; margin-right: 10px; padding: 8px 12px; border: 1px solid var(--de-control-line); border-radius: 8px; background: #fff; color: var(--de-ink); font: inherit; cursor: pointer; }
body.de-ui :is(.field, .form-item, .form-group, .form-field) { min-width: 0; }
body.de-ui :is(label, .field-label, .form-label) { color: var(--de-ink) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.5 !important; }
body.de-ui :is(.form-grid, .settings-grid, .settings-grid-3, .resident-filter-grid, .filter-grid) { gap: 16px !important; }
body.de-ui .field > span { display: block; margin-bottom: 6px; }
body.de-ui :is(.filter-bar, .toolbar, .filter) { gap: 12px !important; }
body.de-ui .focus-danger-box, body.de-ui :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--de-danger) !important; }

/* Tables retain their real table semantics and original business selectors. */
body.de-ui :is(.table-wrap, .table-scroll, .table-container, .resident-table-wrap, .system-log-table-wrap) {
  min-width: 0; max-width: 100%; overflow-x: auto !important;
  border-radius: var(--de-control-radius) !important;
  border-color: var(--de-line) !important; box-shadow: none !important;
  scrollbar-color: #9aabc0 #f2f5f9; scrollbar-width: thin;
}
body.de-ui table:not(:where(.archive-doc-table, .word-preview *, .original-document-preview *, .total-report-document *)) {
  font-family: var(--de-font) !important; font-variant-numeric: tabular-nums; color: var(--de-ink);
}
body.de-ui th:not(:where(.archive-doc-table *, .word-preview *, .original-document-preview *, .total-report-document *)) {
  height: 44px !important; padding: 10px 12px !important; color: var(--de-muted) !important;
  background: #f4f7fb !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.5 !important;
}
body.de-ui td:not(:where(.archive-doc-table *, .word-preview *, .original-document-preview *, .total-report-document *)) {
  height: 48px !important; padding: 10px 12px !important; color: var(--de-ink) !important;
  font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important;
}
body.de-ui td :is(button, .btn) { padding: 7px 12px !important; }
body.de-ui :is(.ui-table-pager, .pager-bar, .pagination, .pager-actions, .settings-pager) {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important;
  gap: 12px !important; padding: 12px 0 !important; font-size: 14px !important; color: var(--de-muted) !important;
}
body.de-ui :is(.badge, .pill, .tag, .status-badge, .status-pill) {
  padding: 3px 9px !important; border-radius: 6px !important;
  font-size: 13px !important; font-weight: 500 !important; line-height: 1.5 !important;
  color: #205a9e !important; border: 1px solid #c5d9f0 !important; background: var(--de-soft) !important; text-shadow: none !important;
}
body.de-ui :is(.badge, .pill, .tag, .status-badge):is(.success, .green, .done, .ok) { color: var(--de-success) !important; background: #edf8f2 !important; border-color: #b7ddc7 !important; }
body.de-ui :is(.badge, .pill, .tag, .status-badge):is(.warn, .gold, .pending) { color: var(--de-warning) !important; background: #fff7e6 !important; border-color: #e6d1a4 !important; }
body.de-ui :is(.badge, .pill, .tag, .status-badge):is(.danger, .red, .error) { color: var(--de-danger) !important; background: #fff0f2 !important; border-color: #e9bdc4 !important; }
body.de-ui :is(.notice, .flash, .readonly-tip, .archive-preview-note, .assist-note) {
  border-radius: var(--de-control-radius) !important; padding: 12px 16px !important; font-size: 14px !important;
  font-weight: 400 !important; box-shadow: none !important;
}
body.de-ui :is(.flash-error, .notice.error, .flash.danger) { color: var(--de-danger) !important; border-color: #e9bdc4 !important; background: #fff0f2 !important; }
body.de-ui .flash-success { color: var(--de-success) !important; border-color: #b7ddc7 !important; background: #edf8f2 !important; }
body.de-ui :is(.empty, .empty-state, .archive-empty) { color: var(--de-muted) !important; font-size: 14px !important; line-height: 1.6 !important; }
body.de-ui :is(.modal-content, .dialog-panel, .batch-modal-card) {
  width: min(880px, calc(100vw - 32px)); max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 48px); overflow-y: auto;
  border-radius: 12px !important; padding: 24px !important;
  background: var(--de-surface) !important; color: var(--de-ink) !important;
  box-shadow: 0 20px 60px rgb(20 35 58 / 20%) !important;
}
body.de-ui :is(.cards, .stats, .stat-grid, .summary-grid, .metric-grid) { box-shadow: none !important; }
body.de-ui :is(.stat, .stat-card, .metric, .summary) { min-width: 0; box-shadow: none !important; text-shadow: none !important; }
body.de-ui :is(.stat, .stat-card, .metric, .summary) :is(strong, .value) { font-size: 28px !important; line-height: 1.2 !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
body.de-ui :is(.stat, .stat-card, .metric, .summary) :is(.label, span) { font-size: 14px !important; font-weight: 400 !important; color: var(--de-muted) !important; }

/* Standalone resident / inspection workspaces use the same visual vocabulary. */
body.de-ui :is(.resident-type-card, .resident-rule-card, .resident-stat-card, .settings-tool-links a, .subsection-card, .entry) {
  color: var(--de-ink) !important; background: var(--de-surface) !important;
  border: 1px solid var(--de-line) !important; border-radius: var(--de-radius) !important;
  box-shadow: none !important; transform: none !important; text-decoration: none;
}
body.de-ui :is(.resident-type-card, .entry) { padding: 20px !important; }
body.de-ui :is(.resident-count, .entry .count) { color: var(--de-ink) !important; font-size: 30px !important; font-weight: 700 !important; }
body.de-resident-landing :is(.hero, .nav), body.de-inspection .hero, body.de-resident-detail .top, body.de-archive-preview .top {
  color: var(--de-ink) !important; background: var(--de-surface) !important;
  padding: 20px !important; margin-bottom: 20px !important; border: 1px solid var(--de-line) !important;
  border-radius: var(--de-radius) !important; box-shadow: none !important; backdrop-filter: none !important;
}
body.de-resident-landing .nav { display: flex; gap: 8px; flex-wrap: wrap; }
body.de-resident-landing .nav a { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 14px; color: var(--de-primary-hover); background: var(--de-soft); border-radius: 8px; font-size: 14px; font-weight: 600; }
body.de-resident-landing .eyebrow { display: none !important; }
body.de-resident-landing :is(.hero p, .hero em, .step span) { color: var(--de-muted) !important; font-size: 14px !important; font-weight: 400 !important; }
body.de-resident-landing :is(.hero strong, .step b) { color: var(--de-ink) !important; text-shadow: none !important; }
body.de-resident-landing .hero-stats { margin-top: 20px; }
body.de-resident-landing .cards { gap: 16px !important; border: 0 !important; padding: 0 !important; background: transparent !important; }
body.de-inspection .hero::before, body.de-inspection .hero::after,
body.de-inspection .radar::before, body.de-inspection .radar::after,
body.de-inspection .command-card::after { display: none !important; }
body.de-inspection .hero-grid { grid-template-columns: minmax(0, 1fr) 180px !important; gap: 24px !important; }
body.de-inspection :is(.holo-card, .radar) { min-height: 0 !important; height: auto !important; padding: 12px !important; background: #f4f7fb !important; border: 0 !important; border-radius: 8px !important; box-shadow: none !important; animation: none !important; }
body.de-inspection .radar strong { color: var(--de-primary-hover) !important; font-size: 32px !important; font-weight: 700 !important; text-shadow: none !important; }
body.de-inspection .radar span { color: var(--de-muted) !important; font-size: 14px !important; font-weight: 400 !important; }
body.de-inspection .eyebrow { color: var(--de-muted) !important; background: transparent !important; border: 0 !important; padding: 0 !important; font-size: 14px !important; letter-spacing: 0 !important; }
body.de-inspection .hero h1 { margin: 6px 0 12px !important; }
body.de-inspection :is(.command-card, .mission-card, .status-tile, .target-card, .detail-tile, .plan-card, .step, .target-core) {
  padding: 16px !important; color: var(--de-ink) !important; background: #f8fafc !important;
  border: 1px solid var(--de-line) !important; border-radius: 8px !important;
  box-shadow: none !important; backdrop-filter: none !important; transform: none !important;
}
body.de-inspection :is(.command-card, .mission-card, .status-tile, .target-card, .detail-tile, .plan-card, .target-core) :is(strong, b) { color: var(--de-ink) !important; font-size: 28px !important; font-weight: 700 !important; text-shadow: none !important; }
body.de-inspection :is(.command-card, .status-tile, .target-card, .detail-tile, .plan-card, .target-core) > span { color: var(--de-muted) !important; font-size: 14px !important; font-weight: 400 !important; }
body.de-inspection :is(.command-grid, .command-strip) { gap: 12px !important; }
body.de-inspection .detail-tile { min-height: 96px !important; }
body.de-inspection .section-head h2 { font-size: 20px !important; }
body.de-inspection .target-board { gap: 20px !important; }
body.de-inspection :is(.command-card, .detail-tile).warn { border-color: #e6d1a4 !important; background: #fffaf0 !important; }
body.de-resident-detail .layout { gap: 20px !important; }
body.de-resident-detail .top { display: flex; gap: 20px; align-items: center; justify-content: space-between; }
body.de-resident-detail .top p { color: var(--de-muted) !important; font-size: 14px !important; }
body.de-archives .shell { border: 0 !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; }
body.de-archives .topbar { padding: 20px !important; border: 1px solid var(--de-line) !important; border-radius: 12px !important; margin-bottom: 20px; }
body.de-archives .archive-doc-table textarea { font-family: inherit !important; }
body.de-ui .lnrq-app-version { box-shadow: none; font-weight: 500; }
body.de-ui.de-billing-tool { height: auto !important; min-height: 100dvh; overflow: auto !important; }
body.de-billing-tool main { gap: 16px; padding: 20px !important; }
body.de-billing-tool .controls { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; align-items: end !important; }
body.de-billing-tool .controls .wide { grid-column: auto !important; }
body.de-billing-tool .controls .actions { grid-column: 1 / -1; }
body.de-billing-tool .path-input { display: flex; min-width: 0; gap: 8px; }
body.de-billing-tool .path-input input { flex: 1; width: 0; }
body.de-billing-tool .toolbar { display: flex; flex-wrap: wrap; gap: 12px; }
body.de-billing-tool .toolbar input { flex: 1 1 200px; }
body.de-billing-tool :is(.table-panel, .table-wrap, .validation-table-wrap, .total-report-table-wrap) { overflow: auto; max-width: 100%; min-height: 140px; }
body.de-billing-tool :is(.total-report-toolbar, .total-report-editor, .total-report-source, .total-report-months, .total-report-document) { border-color: var(--de-line) !important; border-radius: 12px !important; box-shadow: none !important; }
body.de-billing-tool .total-report-eyebrow { display: none; }

/* Login is included; the system-home portal is not. */
body.de-ui.v2-login .brand-title { font-size: clamp(28px, 3vw, 44px) !important; line-height: 1.4 !important; letter-spacing: 0 !important; }
body.de-ui.v2-login .login-card { background: #fff !important; border-radius: 12px !important; box-shadow: none !important; backdrop-filter: none !important; }
body.de-ui.v2-login .login-card::before { display: none !important; }
body.de-ui.v2-login .signal-card { box-shadow: none !important; }
body.de-ui.v2-login h1 { font-size: 26px !important; }

@media (hover: hover) and (pointer: fine) {
  body.de-ui :is(button, .btn, .button, .compact-btn):hover:not(:disabled):not([aria-disabled="true"]) { background: var(--de-primary-hover) !important; border-color: var(--de-primary-hover) !important; }
  body.de-ui :is(.btn-secondary, .secondary, .ghost, .subtle, .ui-page-button, .top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab, .settlement-subnav a):hover:not(:disabled):not(.active) { color: var(--de-primary-hover) !important; background: var(--de-soft) !important; border-color: #83a5d0 !important; }
  body.de-ui :is(.btn-danger, .danger-btn, button.danger):hover:not(:disabled) { background: #941e30 !important; border-color: #941e30 !important; }
}
/* Individual legacy surfaces that do not use the common panel class. */
body.de-ui :is(.plan-hero, .metric-card, .overview-card, .overview-tile, .summary-card, .settlement-card, .settlement-group, .detail-choice) {
  color: var(--de-ink) !important; background: #fff !important;
  border: 1px solid var(--de-line) !important; border-radius: 12px !important;
  box-shadow: none !important; backdrop-filter: none !important; transform: none !important;
}
body.de-ui .plan-hero { padding: 20px !important; gap: 16px !important; }
body.de-ui :is(.metric-title, .metric-note, .stat-label, .overview-label, .settlement-group p, .settlement-menu p, .billing-choice span, .detail-choice span) {
  color: var(--de-muted) !important; font-size: 14px !important; font-weight: 400 !important;
}
body.de-ui :is(.metric-value, .stat-value) { color: var(--de-ink) !important; font-size: 28px !important; font-weight: 700 !important; }
body.de-ui .overview-card > strong { font-size: 28px !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
body.de-ui .overview-card > span { font-size: 14px !important; font-weight: 400 !important; }
body.de-ui :is(.ui-pane-active, .settings-pane.active) { animation: none !important; }
body.de-ui .settings-pane-two > .panel { margin-top: 0 !important; }
body.de-ui :is(.top-nav-link, .btn, button)::before,
body.de-ui :is(.top-nav-link, .btn, button)::after { box-shadow: none !important; }
body.de-ui .settlement-group nav a, body.de-ui .settlement-menu-head > a {
  min-height: 44px !important; padding: 10px 14px !important;
  border-color: var(--de-control-line) !important; border-radius: 8px !important;
  font-size: 14px !important; color: var(--de-ink) !important; box-shadow: none !important;
}
body.de-ui :is(.settlement-group nav a strong, .billing-choice strong, .detail-choice strong) { font-weight: 600 !important; }
body.de-ui :is(.billing-choice-primary strong, .billing-choice b, .detail-choice b, .settlement-group nav a b) { color: var(--de-primary-hover) !important; }
body.de-ui .billing-choice-primary { background: var(--de-soft) !important; }
body.de-ui .settlement-group-title > span { display: none !important; }
body.de-ui :is(.grid-2, .grid-3) { align-items: start !important; gap: 20px !important; }
body.de-ui :is(.grid-2, .grid-3) > .panel { margin-top: 0 !important; }
body.de-ui .mobile-simplify-toggle { min-width: max-content !important; max-width: 100% !important; white-space: nowrap !important; flex-shrink: 0 !important; }
body.de-ui [hidden] { display: none !important; }
/* A fixed-height legacy grid must not squeeze the list after controls grow. */
body.de-ui.page-users, body.de-ui.page-users :is(.content-shell, .content, .users-page) { height: auto !important; overflow: visible !important; }
body.de-ui.page-users { min-height: 100dvh; }
body.de-ui .users-page .users-list-panel { flex: 0 0 auto !important; grid-template-rows: auto auto auto !important; }
body.de-ui .users-page .users-list-panel .table-wrap { height: auto !important; max-height: 65vh !important; }

@media (max-width: 1100px) {
  body.de-inspection :is(.command-grid, .command-strip) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body.de-ui :is(.topbar-time, .topbar-chip) { min-width: 0 !important; }
  body.de-ui .topbar .topbar-time:not(a) { display: none !important; }
  body.de-billing-tool .controls { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
/* Desktop density: one compact rhythm shared by every operational page. */
@media (min-width: 901px) {
  body.de-ui:not(.v2-portal) { font-size: 14px !important; }
  body.de-ui :is(.content, .clean-wrap, .standalone-shell, .resident-shell, .window, .wrap),
  body.de-ui > .page, body.de-resident-landing > .shell {
    padding: 12px 18px 24px !important;
  }
  body.de-ui :is(.page-head, .clean-topbar, .standalone-top, .resident-hero, .inspection-hero, .page-header),
  body.de-resident-detail .top {
    min-height: 52px !important; padding: 10px 14px !important;
    margin-bottom: 10px !important; gap: 10px !important;
  }
  body.de-ui h1 { font-size: 22px !important; }
  body.de-ui h2 { font-size: 17px !important; }
  body.de-ui h3 { font-size: 15px !important; }
  body.de-ui :is(.muted, .hint, .sub, .subtitle, .help, .help-text, .clean-subtitle, .resident-hero p, .page-head p),
  body.de-resident-detail .top p { font-size: 13px !important; line-height: 1.5 !important; }
  body.de-ui :is(.panel, .card-panel, .section-card, .content-card, .table-card, .resident-card) {
    padding: 12px 14px !important; border-radius: 10px !important; margin: 0 !important;
  }
  body.de-ui :is(.panel-head, .section-head, .card-head) {
    gap: 8px !important; margin-bottom: 10px !important; padding-bottom: 8px !important;
  }
  body.de-ui :is(.grid2, .settings-home-grid, .auth-admin-grid, .topline, .triple, .quad,
    .grid-2, .grid-3, .content-stack, .side) { gap: 10px !important; }
  body.de-ui :is(button, .btn, .button, .compact-btn, .status-pill-btn, .ui-page-button,
    .top-nav-link, .topbar-nav a, .settings-section-tab, .ui-workspace-tab,
    .settlement-subnav a, a.back, a.home-btn, a.topbar-time) {
    min-height: 36px !important; min-width: 36px; padding: 6px 12px !important;
    font-size: 13px !important;
  }
  body.de-ui :is(input:not([type]), input[type="text"], input[type="search"], input[type="password"],
    input[type="number"], input[type="date"], input[type="month"], input[type="datetime-local"],
    input[type="email"], input[type="tel"], input[type="url"], select, textarea):not(:where(.archive-doc-table *)) {
    min-height: 36px !important; padding: 6px 10px !important; font-size: 14px !important;
  }
  body.de-ui :is(.stat, .stat-card, .metric, .summary) :is(strong, .value),
  body.de-ui :is(.metric-value, .stat-value), body.de-ui .overview-card > strong {
    font-size: 23px !important;
  }
  body.de-ui :is(.stat, .stat-card, .metric, .summary) :is(.label, span),
  body.de-ui .overview-card > span { font-size: 13px !important; }
  body.de-ui :is(th, td) { padding: 7px 10px !important; font-size: 13px !important; }
  body.de-resident-detail .layout { grid-template-columns: 230px minmax(0, 1fr) !important; gap: 10px !important; }
  body.de-resident-detail .side { top: 74px !important; }
  body.de-resident-detail :is(.overview-grid, .stat-grid, .rank-list) { gap: 8px !important; }
  body.de-resident-detail :is(.overview-card, .stat) { padding: 9px 10px !important; border-radius: 8px !important; }
  body.de-resident-detail .overview-grid { margin-bottom: 8px !important; }
  body.de-resident-detail .rank-box { border-radius: 8px !important; }
  body.de-resident-detail .rank-box h3 { padding: 8px 10px !important; }
  body.de-resident-detail .rank-box p { padding: 7px 10px !important; font-size: 13px !important; }
  body.de-resident-detail .filter-grid { gap: 8px !important; }
  body.de-resident-detail .filter-grid label { gap: 4px !important; font-size: 13px !important; }
  body.de-resident-detail .badge { min-height: 26px !important; padding: 3px 8px !important; font-size: 12px !important; }
  body.de-resident-detail .table-wrap.dense :is(th, td) { height: 42px !important; padding: 6px 10px !important; }
  body.de-resident-detail .click-num {
    display: inline-flex !important; flex-direction: row !important; justify-content: center !important;
    min-width: 48px !important; min-height: 24px !important; height: 24px !important;
    padding: 0 9px !important; border-radius: 999px !important; box-shadow: none !important;
  }
}
@media (max-width: 760px) {
  body.de-ui :is(.content, .clean-wrap, .standalone-shell, .resident-shell, .window, .wrap),
  body.de-ui > .page, body.de-resident-landing > .shell { padding: 16px 12px 40px !important; }
  body.de-ui :is(.page-head, .standalone-top, .resident-hero, .page-header) { flex-direction: column !important; align-items: stretch !important; padding: 16px !important; }
  body.de-ui :is(.panel, .card-panel, .section-card, .content-card, .resident-card) { padding: 16px !important; }
  body.de-ui h1 { font-size: 24px !important; }
  body.de-ui :is(.grid2, .settings-grid-3, .auth-admin-grid, .form-grid, .settings-home-grid, .topline, .triple) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
  body.de-ui :is(.grid-2, .grid-3, .settings-pane-two) { grid-template-columns: minmax(0, 1fr) !important; }
  body.de-ui :is(.settings-grid, .resident-filter-grid, .filter-grid) { grid-template-columns: minmax(0, 1fr) !important; }
  body.de-ui :is(.filter-bar, .filter) { flex-wrap: wrap !important; }
  body.de-ui :is(.filter-bar, .filter) > :is(label, input, select) { min-width: 0 !important; max-width: 100%; }
  body.de-ui :is(.actions, .standalone-actions, .top-actions, .filter-actions) { flex-direction: row !important; width: 100%; }
  body.de-ui :is(.ui-table-pager, .pager-bar, .pagination, .pager-actions) { justify-content: flex-start !important; }
  body.de-ui :is(.ui-workspace-tabs, .settings-section-nav) { border-radius: 8px !important; }
  body.de-ui .ui-workspace-tab { min-width: 0 !important; }
  body.de-inspection .hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.de-inspection :is(.command-grid, .command-strip, .quad, .target-grid, .detail-card-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  body.de-inspection .target-board, body.de-resident-detail .layout, body.de-resident-landing :is(.cards, .command) { grid-template-columns: minmax(0, 1fr) !important; }
  body.de-resident-detail .top { flex-direction: column; align-items: stretch; }
  body.de-inspection .hero { padding: 16px !important; }
  body.de-billing-tool .controls { grid-template-columns: minmax(0, 1fr) !important; }
  body.de-billing-tool main { padding: 12px !important; }
  body.de-ui .batch-modal-card { padding: 16px !important; max-height: calc(100dvh - 24px); }
  body.de-ui .users-page .users-list-panel .table-wrap { max-height: none !important; }
  /* Preserve a real, scrollable table rather than overlapping legacy cards. */
  body.de-ui .users-page .table-wrap table { display: table !important; min-width: 1100px !important; width: 100% !important; }
  body.de-ui .users-page .table-wrap thead { display: table-header-group !important; }
  body.de-ui .users-page .table-wrap tbody { display: table-row-group !important; }
  body.de-ui .users-page .table-wrap tr { display: table-row !important; }
  body.de-ui .users-page .table-wrap :is(th, td) { display: table-cell !important; width: auto !important; position: static !important; text-align: left !important; }
  body.de-ui .users-page .table-wrap td::before { display: none !important; }
  body.de-ui .pager-actions > :is(.btn, button) { flex: 0 0 auto !important; width: auto !important; }
  body.de-ui .pager-actions > .per-page-form { flex-basis: 100% !important; }
}
@media (max-width: 900px) {
  body.de-ui .topbar.topbar-compact {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
  }
  body.de-ui .topbar.topbar-compact > .topbar-left,
  body.de-ui .topbar.topbar-compact .topbar-title-solo {
    width: 100% !important;
    text-align: center !important;
  }
  body.de-ui .topbar.topbar-compact .top-nav-header {
    justify-content: center !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.de-ui, body.de-ui *, body.de-ui *::before, body.de-ui *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}
@media print {
  body.de-ui { background: #fff !important; }
  body.de-ui :is(.lnrq-app-version, .ui-table-pager, .ajax-loading-bar, .ajax-toast-stack) { display: none !important; }
  body.de-ui :is(.table-wrap, .table-scroll, .table-container) { max-height: none !important; overflow: visible !important; }
}
} /* de-system */

/* Global clean mode: business pages keep fields, actions and result messages,
   while nonessential explanatory copy is deliberately removed. */
body.de-ui :is(
  .daily-intro, .daily-photo-help, .report-note, .metric-note, .focus-note,
  .mini-note, .readonly-tip, .hint, .section-note, .template-help,
  .permission-note, .assist-note, .archive-preview-note, .new-stats-note,
  .brand-subtitle, .subtitle, .footnote, .resident-import-check
) { display: none !important; }

body.de-ui :is(.panel-head, .section-head, .page-head, .section-title) > div > p,
body.de-ui :is(.panel-head, .section-head, .page-head, .section-title) > p,
body.de-ui .panel-head .muted,
body.de-ui .section-head .muted { display: none !important; }