/* Approved Demo B typography: 18 / 14 / 12 CSS px at every viewport size.
 * An important cascade layer wins over legacy !important and lazy app CSS.
 * New components can explicitly select a tier with data-text-level="1|2|3".
 * Geometry changes below only provide clearance for readable text.
 */
@layer site-typography {
  :root {
    --text-level-1: 18px;
    --line-level-1: 26px;
    --text-level-2: 14px;
    --line-level-2: 22px;
    --text-level-3: 12px;
    --line-level-3: 20px;
  }
  body, body :where(*) {
    font-size: var(--text-level-3) !important;
    line-height: var(--line-level-3) !important;
  }
  body :where(h2, h3, h4, h5, h6, .top-nav-link, .top-nav-link > span,
      .top-subnav > a, .shop-board-heading > strong, .activity-heading strong,
      .overview-metric-label, .overview-card-heading h2,
      .order-columns-picker header strong, .order-filter-settings-panel header strong,
      .date-calendar > header > strong, .order-calendar header strong,
      .button.primary, .toolbar-button.primary,
      .auth-submit, [data-text-level="2"]) {
    font-size: var(--text-level-2) !important;
    line-height: var(--line-level-2) !important;
    font-weight: 600 !important;
  }
  body :where(h1, dialog h2, [role="dialog"] h2, .shop-action-dialog h2,
      .overview-summary-value > strong, .overview-secondary-metric strong,
      .metric-value, .shop-kpis strong, .brand-name, [data-text-level="1"]) {
    font-size: var(--text-level-1) !important;
    line-height: var(--line-level-1) !important;
    font-weight: 700 !important;
  }
  body [data-text-level="3"] {
    font-size: var(--text-level-3) !important;
    line-height: var(--line-level-3) !important;
  }
  body [data-text-level="1"] { font-size: var(--text-level-1) !important; line-height: var(--line-level-1) !important; }
  body [data-text-level="2"] { font-size: var(--text-level-2) !important; line-height: var(--line-level-2) !important; }
  /* Daily reports are a writing surface: dates and readable copy use level 2,
   * while status metadata remains at the shared compact level 3. */
  body :is(.dev-daily-person-list strong, .dev-daily-calendar-number,
      .dev-daily-calendar-month-switcher > strong, .dev-daily-editor > label,
      .dev-daily-editor textarea[name="summary"], .dev-daily-report-panel > .dev-empty,
      .dev-daily-markdown :is(p, li, blockquote), .dev-daily-legacy article > strong) {
    font-size: var(--text-level-2) !important;
    line-height: var(--line-level-2) !important;
  }
  body :is(.dev-daily-reader > header > strong, .dev-daily-markdown-preview > header > strong) {
    font-size: var(--text-level-1) !important;
    line-height: var(--line-level-1) !important;
    font-weight: 700 !important;
  }
  body :is(table, input, .metric-value, .overview-summary-value,
      .overview-summary-footer, .overview-secondary-metric, .shop-kpis) {
    font-variant-numeric: tabular-nums !important;
  }
  /* Never enlarge checkboxes, hidden fields or color chips. */
  body :is(input:not([type="checkbox"], [type="radio"], [type="hidden"],
      [type="range"], [type="color"], [type="file"]), select,
      .button, .toolbar-button, .date-range-trigger, .order-date-trigger, .order-display-toggle,
      .page-link, .workbench-searchable-select-input) {
    min-height: 38px !important;
    box-sizing: border-box !important;
  }
  body :is(input, select, textarea) { max-width: 100% !important; }
  /* Shared date controls follow DATE_PICKER_STANDARD's 14px input minimum. */
  body :is(.date-range-trigger, .date-range-trigger > span, .date-range-label,
      .date-range-popover input, .date-range-presets button, .date-calendar-day,
      .date-range-actions button) {
    font-size: var(--text-level-2) !important;
    line-height: var(--line-level-2) !important;
  }
  body :is(.page-link, .account-download) { min-width: 38px !important; }
  body :is(th, td) { vertical-align: middle !important; padding-block: 8px !important; }
  body th { height: 44px !important; }
  body td { height: 52px !important; }
  body .report-table { --report-head: 44px !important; }
  /* A natural-month worksheet must keep all 31 daily rows visible on desktop. */
  body .daily-report-page .daily-report-table th {
    height: var(--daily-report-head-height, 42px) !important;
    padding-block: 0 !important;
  }
  body .daily-report-page .daily-report-table tbody tr:not(.daily-report-total) td:not(.daily-report-empty) {
    height: var(--daily-report-row-height, 22px) !important;
    padding-block: 0 !important;
  }
  body .daily-report-page .daily-report-table .daily-report-total td {
    height: var(--daily-report-total-height, 24px) !important;
    padding-block: 0 !important;
  }
  /* 商品报表 compact rows (user 2026-10-10: customers want more products per screen).
   * Geometry-only exception recorded in TYPOGRAPHY_STANDARD_V1.md; text stays 12px+. */
  body .product-report .report-table { --report-head: 30px !important; }
  body .product-report .report-table th { height: 30px !important; padding-block: 2px !important; }
  body .product-report .report-table tbody td { height: 44px !important; padding-block: 2px !important; }
  /* Secondary text uses contrast, not a smaller font, for hierarchy. */
  body :is(.workbench-cell-secondary, .order-time-cell, .page-summary,
      .order-filter-actions > span, .order-filter-tools > span,
      .order-columns-picker header small, .order-filter-settings-panel header small,
      .overview-updated, .overview-summary-footer, .overview-card-heading > span,
      .overview-contribution-panel footer, .overview-store-table-panel > footer) {
    color: #64748b !important;
  }
  /* Keep the two default filter rows; wide columns scroll instead of shrinking. */
  body .order-filter-field { grid-template-columns: 98px minmax(0, 1fr) !important; }
  body .order-filter-grid { gap: 12px 18px !important; }
  body .order-filter-actions { flex-wrap: wrap !important; row-gap: 10px !important; }
  body .order-wide-page { grid-template-rows: auto auto minmax(420px, 1fr) !important; }
  body .order-wide-page .order-list-tools {
    min-height: 54px !important; height: auto !important; padding-block: 8px !important;
    grid-template-columns: minmax(200px, 1fr) minmax(260px, 420px) minmax(320px, 1fr) !important;
  }
  body .order-status-legend { flex-wrap: wrap !important; }
  body .order-wide-table :is(th, td)[data-order-column$="_at"],
  body .order-wide-table :is(th, td)[data-order-column="pickup_time"] { min-width: 188px !important; }
  body .order-wide-table :is(th, td)[data-order-column="trade_id"],
  body .order-wide-table :is(th, td)[data-order-column="order_id"] { min-width: 194px !important; }
  body .order-wide-table :is(th, td)[data-order-column="shop_name"] { min-width: 158px !important; }
  body .order-wide-table :is(th, td)[data-order-column="title"] { min-width: 340px !important; max-width: 340px !important; }
  body .order-wide-table .badge { max-width: none !important; }
  body .table-footer { min-height: 56px !important; gap: 12px !important; }
  body .order-columns-picker { width: min(var(--display-fields-width, 490px), calc(100vw - 24px)) !important; }
  body .order-columns-picker label { min-height: 38px !important; }
  body .order-filter-settings-panel li { min-height: 46px !important; height: auto !important; }
  /* Short date popovers scroll internally rather than reducing label size. */
  body .date-range-popover .date-range-editor input { padding-inline: 7px !important; }
  body .date-range-popover .date-calendar-weekdays { min-height: 26px !important; }
  body .date-range-popover .date-calendar-grid { grid-auto-rows: 32px !important; }
  body .date-range-popover .date-calendar-day { height: 30px !important; }
  body .date-range-popover .date-range-presets button { min-height: 34px !important; height: auto !important; }
  body .date-range-popover .date-range-actions button { min-height: 38px !important; }
  body .date-range-popover .date-range-footer { gap: 10px !important; flex-wrap: wrap !important; }
  body .order-date-panel { width: min(860px, calc(100vw - 20px)) !important; max-height: calc(100vh - 90px) !important; overflow-y: auto !important; }
  body .order-date-editors label { grid-template-columns: auto minmax(0, 1fr) 126px !important; }
  body .order-calendar-days button { height: 30px !important; }
  body .order-date-shortcuts button { min-height: 34px !important; }
  body .order-date-body > footer button { min-height: 38px !important; }
  body .topbar-release-badge { height: auto !important; top: -5px !important; }
  body .top-nav-badge { line-height: 22px !important; }
  body .topbar.has-tertiary .top-nav-link { padding-bottom: 2px !important; }
  /* Embedded app styles must not enlarge the shared account controls. */
  body .topbar .text-button { padding: 0 !important; border: 0 !important; background: transparent !important; color: #c8d4e3 !important; box-shadow: none !important; }
  body .supply-chain-app-shell .page-heading-actions { flex-wrap: wrap !important; }
  body .supply-chain-app-shell .page-heading-actions .button { flex-shrink: 0 !important; white-space: nowrap !important; }
  @media (max-width: 1500px) {
    body .order-wide-page .order-list-tools { grid-template-columns: auto minmax(240px, 1fr) !important; }
    body .order-list-progress { justify-self: end !important; }
    body .order-status-legend { grid-column: 1 / -1 !important; justify-self: end !important; }
    body .order-toolbar-progress { width: min(420px, 100%) !important; }
  }
  @media (max-width: 1180px) {
    body .order-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  }
  @media (max-width: 1000px) {
    body .top-nav-link { padding-inline: 6px !important; }
    body .topbar.has-tertiary .top-nav-link { padding-inline: 4px !important; }
    body .overview-toolbar { flex-wrap: wrap !important; }
  }
  @media (max-width: 900px) {
    body .date-range-popover[data-date-mode="datetime"] .date-range-editor {
      grid-template-columns: minmax(0, 1fr) 110px !important;
    }
    body .date-range-popover[data-date-mode="datetime"] .date-range-editor > strong { display: none !important; }
    body .date-range-popover[data-date-mode="datetime"] .date-range-editor > label { grid-column: auto !important; }
    body .order-date-editors label { grid-template-columns: auto minmax(0, 1fr) !important; }
    body .order-date-editors input[type="time"] { grid-column: 2 !important; }
    body .supply-chain-app-shell .page-heading { flex-wrap: wrap !important; }
    body .supply-chain-app-shell .page-heading-actions { width: 100% !important; }
    body .supply-chain-app-shell .fixed-table-page { overflow-y: auto !important; }
    body .supply-chain-app-shell .fixed-table-page > * { flex-shrink: 0 !important; }
    body .supply-chain-app-shell .fixed-table-panel { min-height: 400px !important; }
  }
  @media (max-width: 720px) {
    body .topbar .top-nav { gap: 2px !important; }
    body .topbar .top-nav-link, body .topbar.has-tertiary .top-nav-link { padding-inline: 0 !important; }
    body .topbar .account { gap: 6px !important; }
    body .order-filter-grid { grid-template-columns: 1fr !important; }
    body .order-wide-page .order-list-tools { grid-template-columns: minmax(0, 1fr) !important; }
    body .order-list-progress, body .order-status-legend { justify-self: stretch !important; grid-column: auto !important; }
    body .order-filter-actions > span { white-space: normal !important; }
    body .table-footer { grid-template-columns: minmax(0, 1fr) !important; justify-items: center !important; }
    body .date-range-popover .date-range-inclusive { white-space: normal !important; }
  }
}

/* 2026-10-21: the selected work-order prototype uses a 14/22 reading scale.
   This opt-in surface does not change the site's default B scale. */
@layer site-typography {
  body .feedback-entry-workbench[data-feedback-root] :is(th, td, input, textarea, select, label, label > span,
    button, .button, .workbench-status, .workbench-progress-bar b, .workbench-view-tabs > a,
    .workbench-pagination, .workbench-pagination span, .workbench-cell-time, summary,
    .feedback-record-table .workbench-cell-secondary, .feedback-record-table td > a) {
    font-size: var(--text-level-2) !important;
    line-height: var(--line-level-2) !important;
  }
  body .feedback-entry-workbench[data-feedback-root] .feedback-record-table td {
    height: var(--feedback-row-height, 62px) !important;
  }
}