/* Dispatch and management keep the page still; their lists own the scrolling. */
html:has(:is(#dispatchView, #managementView):not([hidden])),
body:has(:is(#dispatchView, #managementView):not([hidden])) {
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
  scrollbar-gutter: auto;
}
.app-shell:has(:is(#dispatchView, #managementView):not([hidden])) {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  padding: max(16px, env(safe-area-inset-top)) clamp(16px, 3vw, 54px) calc(98px + env(safe-area-inset-bottom));
  overflow: hidden;
}
.app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar {
  flex: 0 0 auto;
  min-width: 0;
  margin-bottom: 12px;
}
.app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar > div:first-child { min-width: 0; }
:is(#dispatchView, #managementView):not([hidden]) {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  gap: 12px;
  padding: 1px 1px 3px;
  overflow: hidden;
}
:is(#dispatchView, #managementView) [hidden] { display: none !important; }

#dispatchView > .en-toolbar { flex: 0 0 auto; flex-wrap: nowrap; gap: 10px; }
#dispatchPeriod { max-width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
#dispatchPeriod::-webkit-scrollbar { display: none; }
#dispatchSearchButton { flex: 0 0 auto; }
#dispatchMetrics { flex: 0 0 auto; min-width: 0; gap: 10px; padding-bottom: 2px; }
#dispatchMetrics > .en-metric {
  display: flex;
  min-width: 0;
  min-height: 96px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 5px;
  padding: 12px 14px;
  text-align: left;
  font: inherit;
  cursor: var(--site-cursor-default, default);
}
#dispatchMetrics > .en-metric b { grid-area: auto; align-self: auto; font-size: 28px; }
#dispatchMetrics > .en-metric > span { grid-area: auto; font-size: 12px; }

#dispatchMemberDirectory,
#managementMemberDirectory {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  gap: 10px;
  padding: 15px;
  overflow: hidden;
}
:is(#dispatchMemberDirectory, #managementMemberDirectory) > :is(.en-page-head, .en-toolbar, .en-directory-count, .en-directory-search) { flex: 0 0 auto; min-width: 0; margin: 0; }
#dispatchMemberGrid,
#managementMemberGrid {
  display: grid;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  align-content: start;
  align-items: stretch;
  grid-auto-rows: max-content;
  gap: 12px;
  margin: 0;
  padding: 2px 5px 5px 2px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--blue-300) transparent;
}
#dispatchMemberGrid { grid-template-columns: repeat(auto-fill, minmax(205px, 1fr)); }
#managementMemberGrid { align-items: start; }
.en-dispatch-member-card {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 106px;
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid var(--glass-line);
  border-radius: 16px;
  color: var(--blue-900);
  background: var(--surface-control);
  box-shadow: inset 0 1px 0 var(--en-highlight);
  font: inherit;
  text-align: left;
  cursor: var(--site-cursor-pointer, pointer);
}
.en-dispatch-member-card:hover { background: var(--surface-primary); border-color: var(--blue-300); }
.en-dispatch-member-card:focus-visible { outline: 2px solid var(--blue-500); outline-offset: -3px; }
.en-dispatch-member-card:has(.en-dispatch-member-open:focus-visible) { outline: 2px solid var(--blue-500); outline-offset: -3px; }
/* Keep the order button's hit area anchored to the whole card, including during a press. */
.en-dispatch-member-card > .en-dispatch-member-identity { position: static; z-index: auto; }
.en-dispatch-member-card .en-dispatch-member-open { position: static; display: block; width: 100%; padding: 0; border: 0; background: transparent; box-shadow: none; color: inherit; font: inherit; text-align: left; cursor: var(--site-cursor-pointer, pointer); pointer-events: auto; }
.en-dispatch-member-open::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.en-dispatch-member-card .en-dispatch-member-open.pressing { transform: none !important; box-shadow: none !important; }
.en-dispatch-member-card .en-dispatch-member-open:disabled { cursor: default; }
.en-dispatch-member-card > :is(.en-avatar, .en-dispatch-member-identity) { pointer-events: none; }
.en-dispatch-member-card button[data-member-work-type] { position: relative; z-index: 2; pointer-events: auto; }
.en-dispatch-member-card > :is(div, .en-dispatch-member-identity) { flex: 1; min-width: 0; }
.en-dispatch-member-card .en-avatar { flex: 0 0 44px; align-self: flex-start; }
.en-dispatch-member-card strong { display: block; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.en-dispatch-member-card code { display: block; margin-top: 4px; color: var(--en-muted); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.en-dispatch-member-card .en-dispatch-member-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.en-dispatch-member-role-line { display: flex; align-items: center; gap: 5px; min-width: 0; margin-top: 3px; }
.en-dispatch-member-role-line > * { flex: 0 0 auto; }
.en-dispatch-member-card .en-dispatch-original-name { flex: 0 1 auto; min-width: 0; color: var(--en-muted); font-size: 11px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.en-dispatch-member-card .en-pill { margin-top: 5px; padding: 2px 6px; font-size: 10px; }
.en-dispatch-member-role-line .en-pill { margin-top: 0; }
#memberDirectorySearchPanel { padding: 10px; gap: 9px; }
#memberDirectorySearchPanel > input { min-width: 0; }
#memberDirectoryCount { min-height: 0; font-size: 11px; }

#managementMemberOrders {
  --en-orders-gap: 10px;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  gap: var(--en-orders-gap);
  padding: 15px;
  overflow: hidden;
}
#managementMemberOrders > :is(.en-page-head, .en-toolbar, .en-member-search, .en-deletion-selection) { flex: 0 0 auto; min-width: 0; margin: 0; }
#managementMemberOrders > .en-page-head { position: relative; z-index: 5; flex-wrap: nowrap; align-items: center; }
#memberOrderBulkSelection { max-height: 34vh; overflow: auto; }
#memberOrderBulkSelection .en-member-selection-hint { flex-basis: 100%; font-size: 11px; }
#memberOrderSelectionMenu { right: -40px; }
#managementMemberOrders > .en-page-head > div:first-child { flex: 1; min-width: 0; }
#managementMemberOrders .en-page-head h3 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
#managementMemberOrders .en-page-head .en-subtitle { margin-top: 3px !important; }
#managementMemberOrders .en-page-head > .en-inline-actions { flex: 0 0 auto; flex-wrap: nowrap; gap: 3px; }
#managementMemberOrders .en-member-search .en-input { min-height: 36px; padding-block: 7px; font-size: 12px; }
.en-member-toolbar .en-all-orders-button[aria-pressed="true"] { color: var(--blue-700); border-color: var(--blue-300); background: var(--surface-primary); box-shadow: inset 0 1px 0 var(--en-highlight); }
.en-enterprise-range-button.is-active { color: var(--blue-700); background: var(--ice-strong); }
.en-enterprise-range-caption { min-width: 0; color: var(--en-muted); font-size: 11px; overflow-wrap: anywhere; }
.en-enterprise-order-range .en-field { min-width: 0; }
#managementMemberOrders > .en-enterprise-orders-toolbar { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; align-items: center; gap: 4px 12px; margin-bottom: calc(-1 * var(--en-orders-gap)); }
.en-enterprise-orders-toolbar > #memberOrderPeriod { grid-column: 1; grid-row: 1; }
.en-enterprise-orders-toolbar > .en-enterprise-statistics-viewport { grid-column: 2; grid-row: 1; align-self: end; }
.en-enterprise-orders-toolbar > .en-enterprise-order-scope { grid-column: 3; grid-row: 1; }
.en-enterprise-statistics-viewport { flex: 0 0 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.en-enterprise-statistics-viewport::-webkit-scrollbar { display: none; }
.en-enterprise-statistics-viewport:focus-visible { outline: 2px solid var(--blue-300); outline-offset: -2px; border-radius: 12px; }
.en-enterprise-statistics-track { padding: 3px 0 0; overflow: hidden; }
.en-enterprise-order-statistics.glass { box-sizing: border-box; min-width: 0; padding: 4px 0; border: 1px solid var(--en-line); border-bottom: 0; border-radius: 14px 14px 0 0; background: var(--surface-table-head); box-shadow: inset 0 1px 0 var(--en-highlight); }
.en-enterprise-order-statistics table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 12px; font-variant-numeric: tabular-nums; text-align: center; }
.en-enterprise-order-statistics th, .en-enterprise-order-statistics td { padding: 5px 6px; line-height: 1.4; overflow-wrap: anywhere; }
.en-enterprise-order-statistics th { color: var(--en-muted); font-weight: 500; }
.en-enterprise-order-statistics tr > :first-child { padding-inline: 0; }
.en-enterprise-order-statistics td { color: var(--blue-700); font-weight: 650; }
.en-enterprise-order-statistics tbody tr + tr > * { border-top: 1px solid var(--en-line); }
.en-enterprise-order-scope { display: flex; flex: 0 1 auto; flex-direction: column; align-items: flex-end; gap: 6px; max-width: 100%; }
.en-enterprise-order-scope .en-enterprise-range-caption { text-align: right; }
@media (max-width: 1200px) {
  .en-enterprise-orders-toolbar > .en-enterprise-statistics-viewport { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 700px) {
  #managementMemberOrders > .en-enterprise-orders-toolbar { gap: 4px; }
  .en-enterprise-order-statistics table { font-size: 11px; }
  .en-enterprise-order-statistics th, .en-enterprise-order-statistics td { padding: 4px 6px; }
  .en-enterprise-orders-toolbar .en-enterprise-order-scope { grid-column: 1 / -1; grid-row: 2; width: 100%; flex-direction: row; align-items: center; justify-content: space-between; }
  .en-enterprise-orders-toolbar > .en-enterprise-statistics-viewport { grid-row: 3; }
  .en-enterprise-order-scope .en-enterprise-range-caption { text-align: left; }
}
#memberOrderResults,
#dispatchOrderResults {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
:is(#memberOrderResults, #dispatchOrderResults) > .en-table-wrap {
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
  overflow: auto;
  overscroll-behavior: contain;
}
:is(#memberOrderResults, #dispatchOrderResults) > .en-empty { flex: 1; min-height: 0; overflow: auto; padding: 18px 12px; }
:is(#memberOrderResults, #dispatchOrderResults) .en-table th { top: 0; }

/* On short phones the filters and statistics scroll so the order list stays usable. */
@media (max-width: 700px) and (max-height: 740px) {
  #managementMemberOrders:has(#enterpriseOrderStatistics) { overflow-y: auto; overscroll-behavior: contain; }
  #managementMemberOrders:has(#enterpriseOrderStatistics) #memberOrderResults { min-height: 280px; flex-shrink: 0; }
  #managementMemberOrders:has(#enterpriseOrderStatistics) #memberOrderResults > .en-table-wrap { min-height: 200px; }
}

/* This full-height records dialog is separate from create/edit and settings dialogs. */
#enterpriseModal:has(.en-dispatch-orders-dialog) { align-items: center; padding: 16px 50px; }
#enterpriseModal .en-dispatch-orders-dialog {
  width: 100%;
  height: min(860px, calc(100dvh - 32px));
  max-height: calc(100dvh - 32px);
  min-height: 0;
  overflow: hidden;
}
#enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head { flex: 0 0 auto; min-width: 0; gap: 10px; padding: 15px 20px 12px; }
#enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head h2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 19px !important; }
#enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head > div { min-width: 0; }
#enterpriseModal .en-dispatch-record-title { display: flex; min-width: 0; align-items: center; gap: 14px; }
#enterpriseModal .en-dispatch-record-title h2 { min-width: 0; flex: 0 1 auto; }
#enterpriseModal .en-dispatch-record-title .en-button { flex: 0 0 auto; width: auto; min-height: 34px; padding: 7px 13px; border-radius: 11px; white-space: nowrap; }
#dispatchMemberCreateOrder[hidden] { display: none !important; }
#enterpriseModal .en-dispatch-orders-dialog > .en-dialog-body { display: flex; flex: 1 1 0; min-width: 0; min-height: 0; gap: 0; padding: 14px 20px 18px; overflow: hidden; }
#dispatchOrdersPanel { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; gap: 10px; overflow: hidden; }
#dispatchOrdersPanel [hidden] { display: none !important; }
#dispatchOrdersPanel > :is(.en-toolbar, .en-page-head, .en-status, .en-deletion-selection) { flex: 0 0 auto; min-width: 0; margin: 0; }
#dispatchOrdersPanel .en-dispatch-record-actions { flex: 0 0 auto; flex-wrap: nowrap; margin-left: auto; }
#dispatchOrdersPanel .en-dispatch-record-actions > * { flex: 0 0 auto; }
#dispatchOrdersPanel .en-delete-menu { left: 0; right: auto; }
#dispatchOrdersPanel > .en-toolbar { flex-wrap: nowrap; }
#dispatchOrderPeriod { min-width: 0; overflow-x: auto; scrollbar-width: none; }
#dispatchOrderPeriod::-webkit-scrollbar { display: none; }
#dispatchOrderPeriod button { flex: 0 0 auto; }
#dispatchOrderSearchButton { flex: 0 0 auto; }
#dispatchOrderSearchButton { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
#dispatchOrderSearchButton .en-dispatch-search-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.en-dispatch-record-range { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: center; min-width: 0; gap: 8px 14px; }
.en-dispatch-record-income { display: flex; flex-wrap: wrap; align-items: center; min-width: 0; gap: 6px 12px; font-variant-numeric: tabular-nums; }
.en-dispatch-record-income > span { display: inline-flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 4px 7px; min-width: 0; padding: 6px 10px; border: 1px solid var(--glass-line); border-radius: 11px; color: var(--blue-800); background: var(--surface-control); font-size: 12px; }
.en-dispatch-record-income strong { color: var(--blue-700); font-size: 15px; font-weight: 780; white-space: nowrap; }
.en-dispatch-record-counts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 8px 12px; border: 1px solid var(--glass-line); border-radius: 12px; color: var(--blue-800); background: var(--surface-control); font-size: 12px; font-variant-numeric: tabular-nums; }
.en-dispatch-record-counts > span { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.en-dispatch-record-counts strong { color: var(--blue-700); font-size: 15px; font-weight: 780; }
@media (min-width: 1101px) {
  #dispatchOrdersPanel[data-record-mode="sent"] .en-dispatch-record-range,
  #dispatchOrdersPanel .en-dispatch-record-counts { flex-wrap: nowrap; }
}
#dispatchOrdersPanel > .en-toolbar { align-items: center; }
#dispatchOrderSearchButton { margin-left: 0; }
#dispatchOrderResults :is(.order-dispatcher-id, .en-person-id) { display: none; }
#dispatchOrderResults .en-order-amount { white-space: nowrap; }
#dispatchOrderResults .en-order-amount :is(.en-field-value, .en-field-readonly) { max-width: none; white-space: nowrap; overflow-wrap: normal; }
#dispatchOrderSummary { display: grid; flex: 0 0 auto; min-width: 0; max-height: 150px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; overflow: hidden; }
#dispatchOrderSummary > * { min-width: 0; min-height: 0; padding: 10px 12px; overflow: auto; border: 1px solid var(--glass-line); border-radius: 13px; background: var(--surface-control); scrollbar-width: thin; scrollbar-color: var(--blue-300) transparent; }
#dispatchMemberGoal .en-member-goal-values { display: flex; flex-wrap: wrap; min-height: 0; gap: 4px 14px; text-align: left; }
#dispatchMemberGoal .en-goal-value { font-size: 19px; }
#dispatchMemberGoal .en-goal-progress { width: auto; flex: 0 1 auto; font-size: 17px; }
#dispatchMemberGoal .en-member-goal-note { grid-area: auto; font-size: 12px; }
#dispatchMemberGoal .en-member-goal-note-preview { -webkit-line-clamp: 2; }
#dispatchMemberUnfinished { display: flex; align-items: center; justify-content: center; text-align: center; }
#dispatchMemberUnfinished .en-unfinished-total { justify-content: center; text-align: center; }
#dispatchMemberUnfinished .en-unfinished-total .en-unfinished-count { justify-content: center; text-align: center; }
#dispatchMemberUnfinished .en-unfinished-dates { max-height: 98px; }
#dispatchMemberUnfinished .en-unfinished-date-row { padding-block: 4px; }
#dispatchMemberUnfinished .en-unfinished-date { font-size: 12px; }
#dispatchMemberUnfinished .en-unfinished-count { font-size: 12px; }
#dispatchMemberUnfinished .en-unfinished-count strong { font-size: 20px; }
#dispatchOrderFilters { display: grid; flex: 0 0 auto; min-width: 0; grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr) minmax(180px, 1.4fr) auto; align-items: end; gap: 8px; }
#dispatchOrderFilters > * { min-width: 0; }
#dispatchOrderFilters > .en-field { gap: 4px; }
#dispatchOrderFilters > .en-field > span { font-size: 11px; }
#dispatchOrderFilters > .en-status { grid-column: 1 / -1; margin: 0; }
#dispatchOrderFilters > .en-status:empty { display: none; }
#dispatchOrderFilters :is(.en-input, .en-select-trigger, .en-button) { min-height: 36px; padding-block: 7px; font-size: 12px; }
#dispatchOrderFilters input[type="search"] { flex: 1 1 180px; width: auto; min-width: 0; }
#dispatchOrderFilters .en-select-shell { min-width: 0; max-width: 100%; }
#dispatchOrderFilters .en-segmented { min-width: 0; max-width: 100%; overflow-x: auto; }
#dispatchOrderFilters .en-segmented button { min-height: 30px; padding: 5px 10px; }
#dispatchOrdersTotals { display: flex; flex: 0 0 auto; min-width: 0; max-width: 100%; align-items: center; gap: 6px 16px; padding-top: 3px; overflow-x: auto; overflow-y: hidden; white-space: nowrap; color: var(--en-muted); font-size: 12px; scrollbar-width: thin; }
#dispatchOrdersTotals strong { color: var(--blue-700); }

@media (max-width: 700px) {
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) {
    height: 100dvh;
    min-height: 0;
    max-height: 100dvh;
    padding: max(10px, env(safe-area-inset-top)) 10px calc(91px + env(safe-area-inset-bottom));
    overflow: hidden;
  }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar { flex-wrap: nowrap; gap: 7px; margin-bottom: 8px; }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar h1 { overflow: hidden; font-size: 20px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar .eyebrow { margin-bottom: 2px; font-size: 8px; }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar .user-control { flex: 0 0 auto; min-height: 36px; padding: 2px 4px; }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar .avatar { width: 30px; height: 30px; font-size: 11px; }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar .icon-button { width: 32px; height: 32px; flex-basis: 32px; }
  .topbar.en-unified-header #enterpriseContextBar > .en-context-picker { grid-column: 1; grid-row: 1; width: 100%; min-width: 0; }
  .topbar.en-unified-header #enterpriseContextBar .en-context-picker > label { display: none; }
  .topbar.en-unified-header #enterpriseContextBar .en-context-picker .en-select-trigger { min-height: 44px; padding-block: 5px; font-size: 11px; }
  .topbar.en-unified-header #enterpriseContextBar > #enterpriseLicenseStatus { grid-column: 2; grid-row: 1; width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .topbar.en-unified-header #enterpriseContextBar #enterpriseLicenseStatus .el-license-status { width: max-content; min-height: 30px; flex-wrap: nowrap; padding: 3px 5px; gap: 6px; font-size: 10px; white-space: nowrap; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 4px; width: 100%; margin: 0; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions > .en-member-toolbar { grid-column: 1 / -1; grid-row: 1; justify-self: stretch; flex-wrap: wrap; gap: 4px; }
  .topbar.en-unified-header #enterpriseContextBar .en-member-toolbar > .icon-button { width: 32px; height: 32px; min-width: 32px; min-height: 32px; flex: 0 0 32px; }
  .topbar.en-unified-header #enterpriseContextBar .en-member-toolbar > .en-button { min-height: 32px; padding: 5px 7px; font-size: 10px; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions > .en-segmented { grid-column: 1; grid-row: 2; justify-self: start; min-width: 0; margin: 0; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions > .en-context-role { grid-column: 2; grid-row: 2; justify-self: end; white-space: nowrap; font-size: 8px; padding-inline: 4px; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions > #enterpriseAccountShortcut { grid-column: 3; grid-row: 2; justify-self: end; min-height: 28px; padding: 3px; font-size: 9px; }
  .topbar.en-unified-header #enterpriseContextBar .en-inline-actions .en-segmented button { min-height: 27px; padding: 4px 5px; font-size: 9px; }
  :is(#dispatchView, #managementView):not([hidden]) { flex: 1 1 0; gap: 8px; min-height: 0; overflow: hidden; }
  #dispatchView > .en-toolbar { gap: 5px; }
  #dispatchPeriod { flex: 1 1 0; padding: 3px; }
  #dispatchPeriod button { flex: 1 0 auto; min-height: 30px; padding: 5px 9px; font-size: 11px; }
  #dispatchView #dispatchMemberDirectory > .en-page-head { flex-wrap: nowrap; gap: 6px; }
  #dispatchMemberDirectory > .en-page-head > div:first-child { min-width: 0; }
  #dispatchMemberDirectory > .en-page-head h3 { font-size: 14px; }
  #dispatchMemberDirectory > .en-page-head .en-subtitle { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  #dispatchMemberDirectory > .en-page-head .en-inline-actions { flex-wrap: nowrap; flex: 0 0 auto; gap: 4px; }
  #dispatchMemberDirectory > .en-page-head .en-button { min-height: 31px; padding: 5px 7px; font-size: 11px; }
  #dispatchMetrics { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(126px, 1fr); gap: 8px; overflow-x: auto; overflow-y: hidden; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--blue-300) transparent; }
  #dispatchMetrics > .en-metric { grid-column: auto; grid-row: auto; min-height: 85px; gap: 4px; padding: 10px 12px; border-radius: 15px; }
  #dispatchMetrics > .en-metric label { font-size: 10px; }
  #dispatchMetrics > .en-metric b { grid-area: auto; font-size: 24px; }
  #dispatchMetrics > .en-metric > span { grid-area: auto; font-size: 11px; }
  #dispatchMetrics > .en-metric b small, #dispatchMetrics > .en-metric > span small { font-size: 9px; }
  #dispatchMemberDirectory, #managementMemberDirectory, #managementMemberOrders { gap: 8px; padding: 10px; border-radius: 18px; }
  #managementMemberOrders { --en-orders-gap: 8px; }
  #managementMemberDirectory { padding-inline: 0; }
  #dispatchMemberGrid, #managementMemberGrid { grid-template-columns: minmax(0, 1fr); gap: 8px; padding-right: 3px; }
  .en-dispatch-member-card { min-height: 98px; gap: 10px; padding: 11px; border-radius: 13px; }
  #memberDirectorySearchPanel { grid-template-columns: 76px minmax(0, 1fr) auto; align-items: end; gap: 5px; padding: 8px; border-radius: 12px; }
  #memberDirectorySearchPanel :is(.en-input, .en-select-trigger) { min-height: 35px; padding-block: 6px; font-size: 12px; }
  #memberDirectorySearchPanel label { grid-column: 1; gap: 3px; }
  #memberDirectorySearchPanel #clearMemberDirectorySearch { min-height: 35px; padding-inline: 4px; }
  #memberDirectorySearchPanel label > span { font-size: 10px; }
  #managementMemberOrders .en-page-head h3 { font-size: 14px; }
  #managementMemberOrders .en-page-head .en-subtitle { font-size: 10px; }
  #managementMemberOrders .en-page-head > .en-inline-actions .icon-button { width: 32px; height: 32px; }
  #managementMemberOrders #closeMemberOrders { min-height: 31px; padding: 5px 7px; font-size: 11px; }
  #memberOrderPeriod { width: 100%; padding: 3px; }
  #memberOrderPeriod button { min-height: 30px; padding: 5px 8px; font-size: 11px; }
  #managementMemberOrders .en-member-search { gap: 5px; }
  #managementMemberOrders .en-member-search .en-button { min-height: 34px; padding-inline: 7px; font-size: 11px; }
  #enterpriseModal:has(.en-dispatch-orders-dialog) { align-items: center; padding: 8px; }
  #enterpriseModal .en-dispatch-orders-dialog { width: 100%; height: calc(100dvh - 16px - env(safe-area-inset-bottom)); max-height: calc(100dvh - 16px - env(safe-area-inset-bottom)); border-radius: 20px; }
  #enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head { padding: 11px 12px 9px; }
  #enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head .en-eyebrow { font-size: 8px; }
  #enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head h2 { font-size: 16px !important; }
  #enterpriseModal .en-dispatch-orders-dialog > .en-dialog-head .icon-button { width: 32px; height: 32px; flex-basis: 32px; }
  #enterpriseModal .en-dispatch-orders-dialog > .en-dialog-body { padding: 10px 11px 12px; }
  #dispatchOrdersPanel { gap: 8px; }
  #dispatchOrderSummary { max-height: 128px; gap: 7px; }
  #dispatchOrderSummary > * { padding: 7px 8px; border-radius: 11px; }
  #dispatchMemberGoal .en-goal-value, #dispatchMemberGoal .en-goal-progress { font-size: 14px; line-height: 1.35; }
  #dispatchMemberGoal .en-member-goal-values { gap: 3px 7px; }
  #dispatchMemberGoal .en-member-goal-note { font-size: 11px; }
  #dispatchMemberUnfinished .en-unfinished-dates { max-height: 102px; }
  #dispatchMemberUnfinished .en-unfinished-date-row { grid-template-columns: minmax(0, 1fr); gap: 1px; padding-block: 3px; }
  #dispatchMemberUnfinished .en-unfinished-date { font-size: 12px; }
  #dispatchMemberUnfinished .en-unfinished-count { text-align: left; font-size: 12px; line-height: 1.3; }
  #dispatchMemberUnfinished .en-unfinished-count strong { min-width: 22px; font-size: 20px; }
  #dispatchOrderFilters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  #dispatchOrderFilters > .en-field:nth-child(3) { grid-column: 1; }
  #dispatchOrderFilters > .en-inline-actions { grid-column: 2; flex-wrap: nowrap; gap: 4px; }
  #dispatchOrderFilters > .en-inline-actions .en-button { padding-inline: 6px; }
  #dispatchOrderFilters .en-member-combobox-input { padding-right: 35px; }
  #dispatchOrderFilters .en-member-combobox-toggle { width: 30px; }
  #dispatchOrderFilters :is(.en-input, .en-select-trigger, .en-button) { min-height: 34px; padding-block: 6px; font-size: 11px; }
  #dispatchOrderFilters input[type="search"] { flex-basis: 100%; width: 100%; }
  #dispatchOrderFilters .en-segmented { padding: 3px; }
  #dispatchOrderFilters .en-segmented button { min-height: 28px; padding: 4px 8px; font-size: 10px; }
  #dispatchOrdersTotals { gap: 6px 12px; font-size: 10px; }
  #dispatchOrdersPanel .en-dispatch-record-actions { gap: 5px; }
  #dispatchOrdersPanel .en-dispatch-record-actions .en-button { min-height: 30px; padding: 5px 7px; font-size: 11px; }
  #dispatchOrderPeriod { padding: 3px; }
  #dispatchOrderPeriod button { min-height: 29px; padding: 5px 7px; font-size: 10px; }
  #dispatchOrderSearchButton { min-height: 31px; padding: 5px 8px; font-size: 11px; }
  #dispatchOrdersPanel > .en-toolbar { flex-direction: column; align-items: stretch; gap: 7px; }
  .en-dispatch-record-range { flex: 0 0 auto; gap: 7px; }
  #dispatchOrderPeriod { max-width: 100%; }
  #dispatchOrdersPanel .en-dispatch-record-actions { align-self: flex-end; }
  .en-dispatch-record-income { gap: 6px; }
  .en-dispatch-record-income > span { padding: 5px 7px; font-size: 11px; }
  .en-dispatch-record-income strong { font-size: 13px; }
  .en-dispatch-record-counts { gap: 5px 10px; padding: 7px 9px; font-size: 11px; }
  .en-dispatch-record-counts strong { font-size: 13px; }
  :is(#dispatchOrderResults, #memberOrderResults) .en-table th, :is(#dispatchOrderResults, #memberOrderResults) .en-table td { padding: 10px; }
}

@media (max-width: 370px), (max-height: 680px) {
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) { padding-top: max(8px, env(safe-area-inset-top)); }
  .app-shell:has(:is(#dispatchView, #managementView):not([hidden])) > .topbar { margin-bottom: 6px; }
  :is(#dispatchView, #managementView):not([hidden]) { gap: 6px; }
  #dispatchMetrics > .en-metric { min-height: 76px; padding-block: 8px; }
  #dispatchMetrics > .en-metric b { font-size: 22px; }
  #dispatchOrderSummary { max-height: 108px; }
  #dispatchMemberUnfinished .en-unfinished-dates { max-height: 82px; }
  #dispatchOrdersPanel { gap: 6px; }
}

/* One shared top row for workspace context, notifications and profile settings. */
.app-shell > .topbar.en-unified-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.topbar.en-unified-header > #enterpriseContextBar {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  margin: 0;
}
.topbar.en-unified-header > .en-header-actions {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
}
.topbar.en-unified-header .user-name {
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar.en-unified-header #enterpriseContextBar > .en-inline-actions { flex-wrap: wrap; max-width: 100%; }

@media (max-width: 700px) {
  .app-shell > .topbar.en-unified-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid var(--glass-line);
    border-radius: 17px;
    background: var(--surface-control);
    box-shadow: inset 0 1px 0 var(--en-highlight);
  }
  .topbar.en-unified-header > #enterpriseContextBar { display: contents; overflow: visible; }
  .topbar.en-unified-header > #enterpriseContextBar::before { content: none; }
  .topbar.en-unified-header #enterpriseContextBar > .en-context-picker { min-width: 0; max-width: 100%; }
  .topbar.en-unified-header #enterpriseContextBar .en-context-picker > .en-select-shell,
  .topbar.en-unified-header #enterpriseContextBar .en-context-picker > select { width: 100%; min-width: 0; max-width: 100%; }
  .topbar.en-unified-header > .en-header-actions { gap: 4px; }
  .topbar.en-unified-header .en-header-actions #enterpriseNotificationButton { width: 32px; height: 36px; flex-basis: 32px; }
  .topbar.en-unified-header .en-header-actions #settingsButton { min-height: 36px; padding: 2px 4px; }
  .topbar.en-unified-header .en-header-actions .avatar { width: 28px; height: 28px; font-size: 11px; }
  .topbar.en-unified-header .en-header-actions .user-name { display: none; }
  .topbar.en-unified-header .en-header-actions .icon-button { width: 28px; height: 28px; flex-basis: 28px; }
  .topbar.en-unified-header #enterpriseContextBar > #enterpriseLicenseStatus { grid-column: 1 / -1; grid-row: 2; }
  .topbar.en-unified-header #enterpriseContextBar > .en-inline-actions { grid-row: 3; }
  .topbar.en-unified-header:has(#enterpriseLicenseStatus[hidden]) #enterpriseContextBar > .en-inline-actions { grid-row: 2; }
}

/* Statistics: a central money-and-orders chart, with the refund trend at lower left. */
#analyticsView.active {
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: max-content max-content 108px minmax(600px, 1fr);
  grid-template-areas: none; gap: 14px; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 3px 2px 10px;
  --analytics-line: color-mix(in srgb, var(--blue-300) 25%, transparent);
  --analytics-shadow: 0 8px 26px color-mix(in srgb, var(--blue-900) 5%, transparent), inset 0 1px 0 rgba(255,255,255,.9);
}
#analyticsView > .analytics-intro { grid-area: auto; min-height: 30px; align-items: center; gap: 14px; margin: 0; }
#analyticsView .analytics-intro > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 15px; }
#analyticsView .analytics-intro h2 { margin: 0; font-size: 19px; line-height: 1.5; letter-spacing: -.04em; font-weight: 800; }
#analyticsView .analytics-intro p { margin: 0; color: var(--en-muted); font-size: 11px; line-height: 1.6; }
#analyticsView .analytics-live-label { font-size: 10px; padding: 5px 9px; border-color: var(--analytics-line); background: var(--surface-control); }
#analyticsView .analytics-summary-row {
  grid-area: auto; display: flex; align-items: center; min-width: 0; min-height: 56px; padding: 6px 9px; border-radius: 19px;
  border: 1px solid var(--glass-line); background: color-mix(in srgb, var(--surface-control) 80%, transparent); box-shadow: inset 0 1px 0 #fff9;
}
#analyticsView .analytics-top-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; width: 100%; min-width: 0; margin: 0; }
#analyticsView .analytics-time-controls { display: flex; align-items: center; gap: 8px; min-width: 0; }
#analyticsView .analytics-range-segment { width: max-content; max-width: 100%; min-height: 42px; padding: 3px; border-radius: 13px; background: var(--surface-tint); }
#analyticsView .analytics-range-segment .segment-button { min-height: 36px; font-size: 12px; padding-inline: 14px; }
#analyticsView .analytics-range-segment .liquid-pill { border-radius: 10px; }
#analyticsView .analytics-date-range-button { flex: 0 0 40px; width: 40px; height: 40px; border: 1px solid var(--glass-line); border-radius: 12px; background: var(--surface-control); }
#analyticsView .analytics-date-range-button.active { color: var(--blue-600); border-color: var(--blue-300); background: var(--surface-table-head); }
#analyticsView .analytics-date-range-button svg { width: 18px; height: 18px; }
#analyticsView #analyticsMemberButton { max-width: 240px; min-height: 40px; border-radius: 12px; }
#analyticsView #analyticsMemberButton > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#analyticsView #analyticsTypesButton { min-height: 40px; border-radius: 12px; }
#analyticsView .analytics-date-range-label { margin: 0 4px 0 auto; color: var(--en-muted); font-size: 11px; line-height: 1.5; text-align: right; overflow-wrap: anywhere; }
#analyticsView .analytics-date-range-label[hidden], #analyticsView .liquid-pill[hidden] { display: none; }
#analyticsView > .analytics-metrics { grid-area: auto; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); height: 108px; gap: 12px; margin: 0; }
#analyticsView .analytics-metric {
  position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 0;
  padding: 13px 18px; overflow: hidden; border: 1px solid var(--glass-line); border-radius: 20px;
  background: linear-gradient(125deg, var(--surface-control), color-mix(in srgb, var(--surface-control) 78%, transparent));
  box-shadow: var(--analytics-shadow); transition: border-color .2s, box-shadow .2s; --metric-tint: var(--blue-600);
}
#analyticsView .analytics-metric[data-analytics-metric] { grid-area: auto; grid-column: auto; }
#analyticsView .analytics-metric[data-analytics-metric="netAmount"] { --metric-tint: #137bd1; background: linear-gradient(125deg, #f5fcffbf, #a3d4f54a); }
#analyticsView .analytics-metric[data-analytics-metric="dealCount"] { --metric-tint: #269c9c; }
#analyticsView .analytics-metric[data-analytics-metric="refundAmount"] { --metric-tint: #e58b64; }
#analyticsView .analytics-metric[data-analytics-metric="refundCount"] { --metric-tint: #d8a451; }
#analyticsView .analytics-metric[data-analytics-metric="averagePrice"] { --metric-tint: #8075bd; }
#analyticsView .analytics-metric::before { content: ''; position: absolute; top: 16px; right: 18px; width: 7px; height: 7px; border-radius: 50%; background: var(--metric-tint); box-shadow: 0 0 0 5px color-mix(in srgb, var(--metric-tint) 9%, transparent); }
#analyticsView .analytics-metric::after { content: ''; position: absolute; z-index: -1; width: 100px; height: 100px; right: -42px; bottom: -65px; border-radius: 50%; background: color-mix(in srgb, var(--metric-tint) 8%, transparent); }
#analyticsView .analytics-metric-label { font-size: 12px; line-height: 1.5; color: var(--en-muted); font-weight: 700; }
#analyticsView .analytics-metric-value { display: block; width: 100%; min-width: 0; margin: 3px 0 2px; font-size: clamp(22px, 2vw, 32px); line-height: 1.25; color: var(--blue-900); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
#analyticsView .analytics-metric-note { display: block; flex: 0 0 auto; min-height: 15px; font-size: 10px; line-height: 1.5; color: var(--en-muted); white-space: normal; }
#analyticsView > .analytics-grid { grid-area: auto; display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,2fr) minmax(0,.95fr); grid-template-rows: repeat(12,minmax(0,1fr)); grid-template-areas: none; gap: 14px; min-height: 600px; }
#analyticsView .analytics-grid > .analytics-card {
  display: flex; flex-direction: column; grid-column: auto; min-width: 0; min-height: 0; height: auto; padding: 18px; overflow: hidden;
  border: 1px solid var(--glass-line); border-radius: 23px; background: linear-gradient(140deg, color-mix(in srgb, var(--surface-control) 95%, transparent), var(--surface-primary));
  box-shadow: var(--analytics-shadow); transition: box-shadow .25s ease; transform: none;
}
#analyticsView .analytics-grid > .analytics-card:hover { transform: none; box-shadow: 0 10px 30px color-mix(in srgb, var(--blue-900) 8%, transparent), inset 0 1px 0 white; }
#analyticsView #settlementTrendCard { grid-area: 1 / 2 / 13 / 3; padding: 21px; background: linear-gradient(145deg, #f6fcffe8, var(--surface-primary)); border-color: #fff; box-shadow: 0 14px 38px color-mix(in srgb, var(--blue-900) 9%, transparent), inset 0 1px 0 white; }
#analyticsView #sourceMixCard { grid-area: 1 / 1 / 9 / 2; }
#analyticsView #refundTrendCard { grid-area: 9 / 1 / 13 / 2; padding: 15px 16px; }
#analyticsView #pipelineCard { grid-area: 1 / 3 / 7 / 4; }
#analyticsView #efficiencyCard { grid-area: 7 / 3 / 13 / 4; }
#analyticsView .analytics-card-head { flex: 0 0 auto; align-items: flex-start; gap: 8px; margin: 0 0 14px; }
#analyticsView .analytics-card-head h3 { margin: 0; font-size: 15px; line-height: 1.5; letter-spacing: -.02em; color: var(--blue-900); }
#analyticsView #settlementTrendCard .analytics-card-head h3 { font-size: 18px; }
#analyticsView .analytics-card-note { margin: 4px 0 0; color: var(--en-muted); font-size: 10px; line-height: 1.5; }
#analyticsView .analytics-mode-switch { display: flex; flex-shrink: 0; gap: 2px; padding: 3px; border: 1px solid var(--analytics-line); border-radius: 11px; background: var(--surface-control); }
#analyticsView .analytics-mode-switch button { border: 0; border-radius: 8px; background: transparent; color: var(--en-muted); font: inherit; font-size: 11px; min-height: 30px; padding: 5px 9px; cursor: pointer; }
#analyticsView .analytics-mode-switch button[aria-pressed="true"] { background: var(--blue-600); color: white; box-shadow: 0 3px 8px #137bd130; }
#analyticsView .analytics-trend-legend { display: flex; flex-wrap: wrap; gap: 3px 15px; margin: 0 0 8px; flex: 0 0 auto; }
#analyticsView .analytics-trend-legend button { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 7px; background: none; min-height: 27px; padding: 3px 0; font: inherit; font-size: 11px; color: var(--en-ink); cursor: pointer; transition: opacity .2s; }
#analyticsView .analytics-trend-legend button[aria-pressed="false"] { opacity: .35; }
#analyticsView .analytics-trend-legend i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
#analyticsView .analytics-trend-plot { position: relative; width: 100%; flex: 1 1 0; min-height: 240px; height: auto; margin: 4px 0 0; }
#analyticsView .analytics-trend-plot svg { display: block; width: 100%; height: 100%; min-height: 0; max-height: none; overflow: visible; }
#analyticsView .analytics-trend-line { fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; filter: drop-shadow(0 2px 3px #236da718); }
#analyticsView .analytics-refund-line { stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
#analyticsView [data-series-hidden="true"] { opacity: 0; pointer-events: none; }
#analyticsView #settlementTrendCard .analytics-axis-label,
#analyticsView #settlementTrendCard .analytics-axis-left,
#analyticsView #settlementTrendCard .analytics-axis-right { font-family: inherit; font-size: 11px; fill: var(--en-muted); }
#analyticsView #settlementTrendCard [data-axis-unit="count"] { text-anchor: start; }
#analyticsView #settlementTrendCard [data-axis-unit="money"] { text-anchor: end; }
#analyticsView .analytics-axis-label[text-anchor="end"] { text-anchor: end; }
#analyticsView .analytics-axis-label[text-anchor="start"] { text-anchor: start; }
#analyticsView .analytics-grid-line { stroke: var(--analytics-line); stroke-dasharray: 3 6; }
#analyticsView .analytics-bucket-target:focus { outline: none; fill: #1677d20b; }
#analyticsView .analytics-timeline { display: grid; grid-template-columns: 1fr; gap: 6px; flex: 0 0 auto; font-size: 10px; color: var(--en-muted); margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--analytics-line); }
#analyticsView .analytics-timeline label { display: flex; justify-content: space-between; gap: 8px; }
#analyticsView .analytics-timeline input { width: 100%; margin: 0; height: 18px; accent-color: var(--blue-600); }
#analyticsView #analyticsTimelineValue { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px 12px; line-height: 1.6; }
#analyticsView .analytics-timeline-stat { display: flex; align-items: center; gap: 5px; min-width: 0; font-size: 10px; }
#analyticsView .analytics-timeline-stat > span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
#analyticsView .analytics-timeline-stat i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; flex: 0 0 5px; }
#analyticsView .analytics-timeline-stat b { margin-left: auto; color: var(--blue-900); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#analyticsView #sourceMixCard .analytics-card-head { margin-bottom: 10px; }
#analyticsView .analytics-source-overview { flex: 0 0 auto; display: flex; justify-content: center; padding: 0 0 10px; }
#analyticsView .analytics-source-ring-wrap { position: relative; width: 128px; height: 128px; }
#analyticsView .analytics-source-ring-wrap svg { display: block; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 4px 5px #1c659415); }
#analyticsView .analytics-source-ring-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; pointer-events: none; text-align: center; padding: 18px; }
#analyticsView .analytics-source-ring-center strong { font-size: 21px; line-height: 1.3; color: var(--blue-900); letter-spacing: -.04em; }
#analyticsView .analytics-source-ring-center span { font-size: 11px; color: var(--en-muted); }
#analyticsView .analytics-source-ring-center small { font-size: 10px; color: var(--en-muted); }
#analyticsView .analytics-source-table { flex: 1 1 0; min-height: 0; overflow: auto; scrollbar-width: thin; }
#analyticsView .analytics-source-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(70px,1fr) minmax(64px,.8fr); align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--analytics-line); font-size: 11px; }
#analyticsView .analytics-source-head { position: sticky; top: 0; z-index: 1; font-size: 9px; color: var(--en-muted); padding: 5px 0 9px; background: var(--surface-table-head); border-radius: 5px; }
#analyticsView .analytics-source-row > span:not(:first-child) { text-align: right; }
#analyticsView .analytics-source-row b { font-size: 11px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#analyticsView .analytics-source-row small { display: block; color: var(--en-muted); font-size: 10px; margin-top: 3px; }
#analyticsView .analytics-source-name { overflow-wrap: anywhere; min-width: 0; }
#analyticsView .analytics-source-name > i:not(.analytics-source-dot) { display: block; width: var(--source-share); height: 3px; margin-top: 5px; background: var(--blue-300); border-radius: 3px; }
#analyticsView .analytics-source-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 5px; vertical-align: middle; background: var(--source-color); }
#analyticsView .analytics-source-share { display: block; margin-top: 4px; font-size: 10px; color: var(--en-muted); }
#analyticsView .analytics-delivery-distribution { display: flex; flex: 0 0 auto; gap: 3px; width: 100%; height: 8px; margin: 0 0 12px; border-radius: 5px; overflow: hidden; background: var(--surface-tint); }
#analyticsView .analytics-delivery-distribution > * { height: 100%; border-radius: 2px; min-width: 0; }
#analyticsView .analytics-delivery-stages { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0 0 14px; flex: 0 0 auto; }
#analyticsView .analytics-delivery-stages span { display: flex; align-items: center; gap: 4px; font-size: 10px; line-height: 1.5; }
#analyticsView .analytics-delivery-stages span i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; flex: 0 0 5px; }
#analyticsView .analytics-delivery-stages strong { display: block; font-size: 24px; margin: 5px 0; line-height: 1.2; font-variant-numeric: tabular-nums; }
#analyticsView .analytics-delivery-stages small, #analyticsView .analytics-workload-totals small { font-size: 10px; font-weight: 400; color: var(--en-muted); }
#analyticsView .analytics-delivery-track:not(.analytics-delivery-distribution) { display: none; }
#analyticsView .analytics-settlement-values { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; border-top: 1px solid var(--analytics-line); padding-top: 11px; margin-top: auto; }
#analyticsView .analytics-settlement-values span, #analyticsView .analytics-workload-totals span { display: block; font-size: 10px; color: var(--en-muted); margin-bottom: 6px; line-height: 1.5; }
#analyticsView .analytics-settlement-values strong { font-size: 13px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#analyticsView .analytics-workload-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin: 0 0 12px; flex: 0 0 auto; }
#analyticsView .analytics-workload-totals strong { font-size: 25px; font-variant-numeric: tabular-nums; }
#analyticsView .analytics-workload-list { flex: 1 1 0; min-height: 0; overflow: auto; scrollbar-width: thin; }
#analyticsView .analytics-workload-row { padding: 8px 0; border-top: 1px solid var(--analytics-line); }
#analyticsView .analytics-workload-row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 6px; font-size: 10px; line-height: 1.5; }
#analyticsView .analytics-workload-row-head > span:first-child { min-width: 0; overflow-wrap: anywhere; }
#analyticsView .analytics-workload-row-head > span:last-child { flex: 0 0 auto; color: var(--en-muted); }
#analyticsView .analytics-workload-track { position: relative; height: 5px; overflow: hidden; background: var(--surface-tint); border-radius: 5px; }
#analyticsView .analytics-workload-track > * { display: block; position: absolute; top: 0; left: 0; height: 100%; background: linear-gradient(90deg,#77b5e5,#2581c8); border-radius: inherit; }
#analyticsView .analytics-workload-track > .analytics-workload-total-fill { background: #b9d7ed; }
#analyticsView #refundTrendCard .analytics-card-head { margin-bottom: 5px; }
#analyticsView #refundTrendCard .analytics-card-note { display: none; }
#analyticsView .analytics-refund-legend { display: flex; gap: 14px; flex: 0 0 auto; margin-bottom: 6px; font-size: 11px; color: var(--en-muted); }
#analyticsView .analytics-refund-legend span { display: inline-flex; gap: 5px; align-items: center; }
#analyticsView .analytics-refund-legend i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; }
#analyticsView .analytics-refund-plot { position: relative; flex: 1 1 0; min-height: 100px; width: 100%; height: auto; margin: 0; }
#analyticsView .analytics-refund-plot svg { display: block; width: 100%; height: 100%; min-height: 0; max-height: none; overflow: visible; }
#analyticsView #refundTrendCard .analytics-axis-label { font-family: inherit; font-size: 11px; fill: var(--en-muted); }
#analyticsView .analytics-empty { display: grid; place-content: center; flex: 1 1 auto; min-height: 130px; margin: 0; color: var(--en-muted); font-size: 12px; text-align: center; }
.analytics-type-choice { display: flex; align-items: center; gap: 10px; padding: 10px 0; font-size: 14px; overflow-wrap: anywhere; }
.analytics-type-choice input { width: 18px; height: 18px; flex: 0 0 18px; accent-color: var(--blue-600); }
#analyticsTypesOptions { max-height: 45dvh; overflow: auto; border-top: 1px solid var(--glass-line); margin-top: 7px; }
.en-dialog.analytics-date-range-dialog { position: fixed; width: min(560px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); margin: auto; padding: 0; color: var(--en-ink); font-size: 14px; line-height: 1.5; }
.analytics-date-range-dialog:not([open]) { display: none; }
.analytics-date-range-dialog::backdrop { background: var(--theme-backdrop); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); }
.analytics-date-range-dialog .en-dialog-head > div { min-width: 0; }
.analytics-date-range-dialog .en-dialog-head > .icon-button { flex-shrink: 0; }
.analytics-date-range-dialog .en-dialog-actions > #analyticsDateRangeClear { margin-right: auto; }
@media (min-width: 1200px) and (max-height: 980px) {
  #analyticsView.active { grid-template-rows: max-content max-content 100px minmax(520px,1fr); gap: 12px; }
  #analyticsView > .analytics-intro { min-height: 24px; }
  #analyticsView .analytics-summary-row { min-height: 50px; padding-block: 3px; }
  #analyticsView > .analytics-metrics { height: 100px; }
  #analyticsView > .analytics-grid { min-height: 520px; grid-template-rows: repeat(10,minmax(0,1fr)); }
  #analyticsView #settlementTrendCard { grid-area: 1 / 2 / 11 / 3; padding: 16px 20px; }
  #analyticsView #sourceMixCard { grid-area: 1 / 1 / 7 / 2; padding: 14px 17px; }
  #analyticsView #refundTrendCard { grid-area: 7 / 1 / 11 / 2; }
  #analyticsView #pipelineCard { grid-area: 1 / 3 / 6 / 4; }
  #analyticsView #efficiencyCard { grid-area: 6 / 3 / 11 / 4; }
  #analyticsView #sourceMixCard .analytics-card-head { margin-bottom: 5px; }
  #analyticsView .analytics-source-overview { padding-bottom: 5px; }
  #analyticsView .analytics-source-ring-wrap { width: 94px; height: 94px; }
  #analyticsView .analytics-source-ring-center { gap: 2px; padding: 12px; }
  #analyticsView .analytics-source-ring-center strong { font-size: 16px; }
  #analyticsView .analytics-source-ring-center span { font-size: 10px; }
  #analyticsView .analytics-source-ring-center small { display: none; }
  #analyticsView .analytics-source-row { padding-block: 5px; }
}
@media (min-width: 901px) and (max-width: 1199px) {
  #analyticsView.active { grid-template-rows: max-content max-content 108px max-content; }
  #analyticsView > .analytics-grid { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: 'trend trend' 'source pipeline' 'refund workload'; grid-template-rows: 510px 360px 260px; min-height: 0; }
  #analyticsView #settlementTrendCard { grid-area: trend; }
  #analyticsView #sourceMixCard { grid-area: source; }
  #analyticsView #refundTrendCard { grid-area: refund; }
  #analyticsView #pipelineCard { grid-area: pipeline; }
  #analyticsView #efficiencyCard { grid-area: workload; }
  #analyticsView .analytics-card-head h3 { font-size: 15px; }
  #analyticsView .analytics-metric { padding-inline: 13px; }
  #analyticsView .analytics-metric-note { font-size: 10px; }
}
@media (max-width: 900px) {
  #analyticsView.active { display: flex; flex-direction: column; height: auto; min-height: 0; overflow: visible; padding-bottom: 12px; gap: 12px; }
  #analyticsView .analytics-intro > div { display: block; }
  #analyticsView .analytics-intro p { margin-top: 4px; }
  #analyticsView .analytics-live-label { display: none; }
  #analyticsView .analytics-summary-row { flex: 0 0 auto; padding: 7px; }
  #analyticsView .analytics-top-controls { gap: 7px; }
  #analyticsView .analytics-date-range-label { width: 100%; text-align: left; }
  #analyticsView > .analytics-metrics { flex: 0 0 auto; height: auto; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: 'net net' 'deals refunds' 'amount price'; gap: 9px; }
  #analyticsView .analytics-metric { min-height: 96px; padding: 13px; }
  #analyticsView .analytics-metric[data-analytics-metric="netAmount"] { grid-area: net; }
  #analyticsView .analytics-metric[data-analytics-metric="dealCount"] { grid-area: deals; }
  #analyticsView .analytics-metric[data-analytics-metric="refundCount"] { grid-area: refunds; }
  #analyticsView .analytics-metric[data-analytics-metric="refundAmount"] { grid-area: amount; }
  #analyticsView .analytics-metric[data-analytics-metric="averagePrice"] { grid-area: price; }
  #analyticsView .analytics-metric-value { white-space: normal; overflow-wrap: anywhere; font-size: 28px; }
  #analyticsView .analytics-metric-note, #analyticsView .analytics-metric-label { font-size: 11px; }
  #analyticsView > .analytics-grid { display: flex; flex-direction: column; flex: none; min-height: 0; gap: 13px; }
  #analyticsView .analytics-grid > .analytics-card { flex: none; height: auto; min-height: 240px; padding: 18px; overflow: hidden; }
  #analyticsView #settlementTrendCard { order: 0; min-height: 510px; padding: 17px 13px; }
  #analyticsView #sourceMixCard { order: 1; }
  #analyticsView #refundTrendCard { order: 2; min-height: 260px; }
  #analyticsView #pipelineCard { order: 3; }
  #analyticsView #efficiencyCard { order: 4; }
  #analyticsView .analytics-card-head, #analyticsView #settlementTrendCard .analytics-card-head { flex-wrap: wrap; gap: 9px; }
  #analyticsView .analytics-card-head h3, #analyticsView #settlementTrendCard .analytics-card-head h3 { font-size: 17px; }
  #analyticsView .analytics-card-note { font-size: 11px; }
  #analyticsView .analytics-mode-switch { width: 100%; }
  #analyticsView .analytics-mode-switch button { min-height: 44px; flex: 1; padding: 5px; font-size: 12px; }
  #analyticsView .analytics-trend-legend { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2px; margin-bottom: 6px; }
  #analyticsView .analytics-trend-legend button { min-height: 44px; gap: 4px; padding: 4px 1px; font-size: 11px; white-space: nowrap; }
  #analyticsView .analytics-trend-plot { flex: none; height: 260px; min-height: 260px; }
  #analyticsView .analytics-trend-plot svg { height: 100%; min-height: 0; max-height: none; }
  #analyticsView .analytics-timeline input { height: 44px; }
  #analyticsView #analyticsTimelineValue { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #analyticsView .analytics-timeline-stat { font-size: 11px; }
  #analyticsView .analytics-source-overview { padding: 7px 0 18px; }
  #analyticsView .analytics-source-ring-wrap { width: 186px; height: 186px; }
  #analyticsView .analytics-source-table { flex: none; max-height: 330px; overflow: auto; }
  #analyticsView .analytics-source-row { grid-template-columns: minmax(0,1fr) minmax(80px,1fr) minmax(72px,.8fr); gap: 8px; font-size: 12px; }
  #analyticsView .analytics-source-row:not(.analytics-source-head) { padding-block: 10px; }
  #analyticsView .analytics-source-row b { font-size: 12px; }
  #analyticsView .analytics-source-head { font-size: 11px; }
  #analyticsView .analytics-source-row small, #analyticsView .analytics-source-share { font-size: 11px; }
  #analyticsView .analytics-delivery-stages span { font-size: 11px; }
  #analyticsView .analytics-settlement-values span, #analyticsView .analytics-workload-totals span { font-size: 11px; }
  #analyticsView .analytics-settlement-values strong { font-size: 13px; }
  #analyticsView .analytics-workload-list { flex: none; max-height: 300px; }
  #analyticsView .analytics-workload-row-head { font-size: 11px; }
  #analyticsView .analytics-refund-plot { flex: none; height: 160px; min-height: 160px; }
  #analyticsView .analytics-date-range-button { flex-basis: 40px; height: 44px; }
  #analyticsView .analytics-range-segment .segment-button { min-height: 44px; padding-inline: 10px; font-size: 12px; }
}
@media (max-width: 480px) {
  #analyticsView > .analytics-metrics { grid-template-areas: 'net net' 'deals refunds' 'amount amount' 'price price'; }
  #analyticsView .analytics-summary-row { border: 0; padding: 0; box-shadow: none; background: none; }
  #analyticsView .analytics-top-controls { gap: 7px; }
  #analyticsView .analytics-time-controls { gap: 5px; flex: 1 1 auto; }
  #analyticsView .analytics-range-segment { flex: 1; min-width: 0; padding: 3px; }
  #analyticsView .analytics-range-segment .segment-button { padding-inline: 5px; font-size: 12px; }
  #analyticsView .analytics-card-note { max-width: 100%; }
  #analyticsView .analytics-settlement-values { grid-template-columns: 1fr; gap: 8px; }
  #analyticsView .analytics-settlement-values > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
  #analyticsView .analytics-settlement-values span { margin: 0; }
  #analyticsView .analytics-settlement-values strong { text-align: right; }
}
@media (prefers-reduced-motion: reduce) {
  #analyticsView .analytics-card, #analyticsView .analytics-metric { transition: none; }
}