/*
 * Apple proportion system — single authority for scale and spatial rhythm.
 * Keeps the existing Apple surfaces, blue, navigation and business components.
 * The named layer's important declarations intentionally outrank the historical
 * unlayered !important rules. Add future size adjustments here, not to old files.
 * Presentation only: no data, event handlers, table column ordering or zoom changes.
 */
:root {
  --ar-caption: 11px;
  --ar-data: 12px;
  --ar-body: 13px;
  --ar-nav-heading: 15px;
  --ar-section: 16px;
  --ar-title: 18px;
  --ar-metric: 22px;
  /* Three semantic weights. Do not add per-page numeric weight overrides. */
  --ar-weight-body: 400;
  --ar-weight-label: 500;
  --ar-weight-emphasis: 600;
  --ar-control: 36px;
  --ar-action: 28px;
  --ar-tag: 24px;
  --ar-row: 40px;
  --ar-detail-row: 48px;
  --ar-gap: 8px;
  --ar-inset: 16px;
  /* One palette: light-blue metadata; gray only for empty/inactive states. */
  --ar-canvas: #f5f5f7;
  --ar-surface: #ffffff;
  --ar-surface-muted: #f7f7f9;
  --ar-ink: #1d1d1f;       /* Headings, column headers and primary reading text. */
  --ar-secondary: #45474d; /* Field labels and secondary navigation/context. */
  --ar-muted: #676b73;     /* Supporting notes, timestamps and secondary IDs. */
  --ar-line: #e5e5ea;
  --ar-border: #dcdce2;
  /* Balance solid actions against outlined controls without resizing either. */
  --ar-control-border: #9aa6b6;
  --ar-control-border-hover: #8793a3;
  --ar-button-primary: #3477bf;
  --ar-button-primary-hover: #2d69ab;
  --ar-blue: #0071e3;
  --ar-blue-hover: #0062c4;
  --ar-link: #0066cc;
  --ar-blue-soft: #edf5ff;
  --ar-blue-line: #c9dffc;
  --ar-success: #237744;
  --ar-success-soft: #edf7f0;
  --ar-success-line: #cde5d5;
  --ar-warning: #92560d;
  --ar-warning-soft: #fff5e5;
  --ar-warning-line: #f0dfbd;
  --ar-danger: #b42332;
  --ar-danger-soft: #fff0f1;
  --ar-danger-line: #f1cdd2;
  --ar-neutral: #5f646d;
  --ar-neutral-soft: #f1f2f5;
  --ar-neutral-line: #e0e2e7;
  --ar-radius-panel: 14px;
  --ar-radius-control: 10px;
  --ar-radius-tag: 999px;
  --ar-radius-modal: 18px;
  --ar-shadow-control: 0 1px 2px rgba(29, 29, 31, .04);
  /* Flat action controls: no bevel, highlight, glow or drop shadow. */
  --ar-shadow-button: none;
  --ar-shadow-float: 0 12px 32px rgba(29, 29, 31, .14), 0 2px 8px rgba(29, 29, 31, .06);
  --ar-focus: 0 0 0 3px rgba(0, 113, 227, .2);
}

/* Store overview uses one vertical scroller so its sortable header stays visible. */
#app-shell #view .merged-store-panel .merged-store-overview-content {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

#app-shell #view .merged-store-panel .merged-store-table-wrap {
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  scrollbar-gutter: stable !important;
}

#app-shell #view .merged-store-panel .merged-store-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  background: rgb(251, 251, 252) !important;
  box-shadow: inset 0 -1px 0 var(--apple-table-line, #e4e7ec) !important;
}

@layer apple-proportions {
  /* Bridge the historical theme names to one maintained source of truth. */
  :root {
    --ta-canvas: var(--ar-canvas) !important;
    --ta-surface: var(--ar-surface) !important;
    --ta-surface-soft: var(--ar-surface-muted) !important;
    --ta-primary: var(--ar-blue) !important;
    --ta-primary-hover: var(--ar-blue-hover) !important;
    --ta-primary-active: var(--ar-blue-hover) !important;
    --ta-primary-soft: var(--ar-blue-soft) !important;
    --ta-ink: var(--ar-ink) !important;
    --ta-ink-soft: var(--ar-secondary) !important;
    --ta-muted: var(--ar-muted) !important;
    --ta-line: var(--ar-border) !important;
    --ta-green: var(--ar-success) !important;
    --ta-amber: var(--ar-warning) !important;
    --ta-red: var(--ar-danger) !important;
    --ads-shell-blue: var(--ar-blue) !important;
    --ads-shell-blue-strong: var(--ar-blue-hover) !important;
    --ads-shell-secondary: var(--ar-secondary) !important;
    --ads-shell-tertiary: var(--ar-muted) !important;
    --apple-symbol-active: var(--ar-link) !important;
    --apple-symbol-ink: var(--ar-secondary) !important;
    --apple-table-header-bg: var(--ar-surface-muted) !important;
    --apple-table-header-ink: var(--ar-ink) !important;
    --apple-table-subtle: var(--ar-muted) !important;
    --apple-table-line: var(--ar-line) !important;
    --apple-table-active: var(--ar-blue) !important;
    --auc-blue: var(--ar-blue) !important;
    --auc-blue-soft: var(--ar-blue-soft) !important;
    --auc-surface: var(--ar-surface) !important;
    --auc-muted: var(--ar-muted) !important;
    --auc-line: var(--ar-line) !important;
  }
  /* Typography: one family, a small hierarchy, normal-weight field values. */
  html, body, button, input, select, textarea,
  #app-shell *, #modal-root *, .member-popover *, .toast {
    font-family: var(--ads-font-sans) !important;
  }
  /* Inherit by default, including dynamically mounted popovers and login.
     This retires the old 520/650/750/900 overrides without changing geometry.
     Low-specificity defaults allow the explicit component roles below to win. */
  :where(body) { font-weight: var(--ar-weight-body) !important; }
  :where(body *) { font-weight: inherit !important; }
  :where(h1, h2, h3, h4, h5, h6, strong, b) {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  :where(button, .button, [role="button"], [role="tab"], [role="menuitem"],
      th, [role="columnheader"], .user-account-head) {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  :where(label, dt, summary, .filter-label) {
    font-weight: var(--ar-weight-label) !important;
  }
  :where(input, select, textarea, code, small, .cell-sub, .cell-main,
      .user-account-cell, table td, table td strong, table td b) {
    font-weight: var(--ar-weight-body) !important;
  }
  /* A strong tag inside a control is not a headline. Disabled/selected controls
     retain their weight, so changing state never changes the label's width. */
  :is(button, .button, [role="button"], [role="tab"], [role="menuitem"])
      :where(strong, b, .custom-select-value) {
    font-weight: inherit !important;
  }
  label :is(strong, b) { font-weight: inherit !important; }
  /* Navigation groups are text headings, not selected-page cards. Keep the
     existing hit area and folding behavior; clear legacy active/hover chrome. */
  .nav .nav-group-button {
    font-size: var(--ar-nav-heading) !important;
    font-weight: var(--ar-weight-emphasis) !important;
    color: var(--ar-ink) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .nav .nav-group-button .nav-label {
    font-size: var(--ar-nav-heading) !important;
    line-height: 20px !important;
  }
  .nav .nav-child.nav-standalone {
    font-size: var(--ar-nav-heading) !important;
    font-weight: var(--ar-weight-emphasis) !important;
  }
  .nav .nav-child.nav-standalone:not(.active) {
    color: var(--ar-ink) !important;
  }
  .nav .nav-child.nav-standalone .nav-label {
    font-size: var(--ar-nav-heading) !important;
    line-height: 20px !important;
  }
  .nav :is(.nav-child, .nav-standalone) .nav-label {
    font-size: var(--ar-body) !important;
  }
  @media (hover: hover) and (pointer: fine) {
    .nav .nav-group-button:hover,
    .nav .nav-group-button:hover .nav-group-chevron {
      color: var(--ar-link) !important;
    }
  }
  /* Keyboard users still need a focus indicator, never a permanent frame. */
  .nav .nav-group-button:focus-visible {
    outline: 2px solid var(--ar-link) !important;
    outline-offset: -2px !important;
  }
  .nav :is(.nav-child, .nav-standalone) { font-weight: var(--ar-weight-label) !important; }
  .nav :is(.nav-child, .nav-standalone).active { font-weight: var(--ar-weight-emphasis) !important; }
  .avatar, .account-identity > strong { font-weight: var(--ar-weight-emphasis) !important; }
  .account-identity > span, .sidebar-foot-label, .pagination-summary {
    font-weight: var(--ar-weight-body) !important;
  }
  .account-popover-action, .account-popover-action strong {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  .facebook-live-switch strong, .automation-setting-switch strong,
  .system-ai-master-switch strong {
    font-weight: var(--ar-weight-label) !important;
  }
  /* Labels, contextual details and secondary numbers must not compete with
     object names or top-level KPIs, even when legacy markup uses strong/b. */
  :is(.ad-data-windsor-clock, .merged-store-summary-context,
      .merged-store-summary-overview-head, .order-pulse-window-head,
      .automation-detail-meta, .automation-timezone-line,
      .automation-plan-setting-list, .automation-decision-threshold-summary,
      .currency-breakdown-popover-row, .ad-followup-summary,
      .ad-data-report-inline-field, .creative-assets-analysis-grid) :is(strong, b),
  .creative-ad-preview-copy-text,
  .ad-campaign-owner-inline, .order-member-inline, .order-report-member,
  .automation-kpi-note, .automation-kpi-note b, .automation-timeline-item time,
  .automation-sync-state, .windsor-schedule-preview > strong {
    font-weight: var(--ar-weight-body) !important;
  }
  .ad-data-windsor-clock b, .order-pulse-window-head > span,
  .order-pulse-metric > span, .ad-metric-strip dt,
  .automation-kpi-grid article > span, .automation-plan-roas-grid article > span,
  .automation-decision-signals article > span, .creative-performance-summary > div > span,
  .merged-store-summary-context > strong, .merged-store-summary-overview-head > strong,
  .automation-switch-row > div > strong, .automation-plan-setting-label > strong,
  .automation-plan-setting-list strong, .system-ai-field-label,
  .system-ai-settings-row > span > strong, .system-ai-settings-row > b, .system-ai-key-source > strong,
  .creative-performance-context b, .creative-assets-analysis-grid > div > span,
  .team-assignment-group-title > strong, .team-assignment-option strong,
  .custom-select-option strong, .system-ai-model-option strong {
    font-weight: var(--ar-weight-label) !important;
  }
  .merged-store-summary-overview-grid b,
  .automation-decision-signals article > strong,
  .automation-budget-adjustment > strong, .automation-budget-confidence > strong,
  .automation-timeline-title > strong, .result-metrics b,
  .creative-performance-summary strong, .shopify-preview-summary strong {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  :is(tfoot, .orders-report-summary-row) :is(td, strong, b),
  .notice > strong, .empty strong, .creative-assets-load-error > strong {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  /* Use this attribute only for the record's identity, not an arbitrary cell's
     first line. The renderer's values, ordering and event hooks stay unchanged. */
  [data-ui-text="primary"] { font-weight: var(--ar-weight-emphasis) !important; }
  #view, .modal { font-size: var(--ar-body) !important; line-height: 1.5 !important; }
  #view :is(h2, h3), .modal h3 {
    font-size: var(--ar-section) !important;
    line-height: 24px !important;
    font-weight: var(--ar-weight-emphasis) !important;
    letter-spacing: 0 !important;
  }
  .modal-title h3 { font-size: var(--ar-title) !important; line-height: 26px !important; }
  #view :is(.panel-head, .store-create-panel-head) {
    gap: 12px !important;
    padding: 12px var(--ar-inset) !important;
    min-height: 52px !important;
  }
  #view .admin-form-panel { padding: var(--ar-inset) !important; }
  #view .admin-form-panel .store-create-panel-head { padding: 0 !important; min-height: 28px !important; }
  #view .admin-form-panel > h3 { margin: 0 0 16px !important; }
  .panel-head p, .form-hint, .field-hint, .help-text,
  .modal :is(.muted, small), .member-popover small {
    font-size: var(--ar-caption) !important;
    line-height: 16px !important;
    font-weight: var(--ar-weight-body) !important;
  }
  /* Inputs and adjacent action buttons share one physical size contract.
     Primary/secondary variants only change colors, never the painted bounds. */
  :is(#view, #modal-root, #login-screen) :is(input, select):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not(.native-select-hidden):not([data-system-ai-model-search]),
  :is(#view, #modal-root, #login-screen) .button,
  .custom-select-trigger, .store-choice-trigger, .date-picker-trigger,
  .apple-confirm-button {
    box-sizing: border-box !important;
    min-height: var(--ar-control) !important;
    height: var(--ar-control) !important;
    max-height: none !important;
    padding: var(--ar-control-padding, 0 12px) !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-radius: var(--ar-radius-control) !important;
    background-clip: border-box !important;
  }
  :is(#view, #modal-root, #login-screen) :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not(.native-select-hidden) {
    font-size: var(--ar-body) !important;
    font-weight: var(--ar-weight-body) !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
  }
  /* Keep the native input as the only visible frame. Input padding ends the
     text before the eye; the opaque eye cap stays one pixel inside that frame. */
  :is(#view, #modal-root, #login-screen) .secret-input-wrap {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  :is(#view#view, #modal-root#modal-root, #login-screen#login-screen) .secret-input-wrap > input[data-secret-input] {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 52px 0 12px !important;
  }
  :is(#view, #modal-root, #login-screen) .secret-input-wrap > .secret-toggle {
    position: absolute !important;
    top: 2px !important;
    right: 2px !important;
    bottom: 2px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 calc(var(--ar-radius-control) - 2px) calc(var(--ar-radius-control) - 2px) 0 !important;
    background: var(--ar-surface) !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1 !important;
  }
  :is(#view, #modal-root, #login-screen) .secret-input-wrap > .secret-toggle:hover {
    color: var(--ar-link) !important;
    background: var(--ar-surface-muted) !important;
  }
  :is(#view, #modal-root) textarea {
    height: auto !important;
    min-height: 96px !important;
    padding: 10px 12px !important;
    line-height: 20px !important;
  }
  #modal-root #manual-ad-data-paste {
    min-height: 178px !important;
    max-height: min(320px, 40vh) !important;
  }
  #modal-root .manual-ad-data-modal.has-multiple-series #manual-ad-data-paste {
    min-height: 200px !important;
  }
  :is(#view, #modal-root, #login-screen) .button,
  .custom-select-trigger, .store-choice-trigger, .date-picker-trigger,
  .apple-confirm-button {
    font-size: var(--ar-data) !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
  }
  /* Actions need a real visible emphasis in Microsoft YaHei (500 maps to
     regular). Keep selected field values and ordinary labels at their old weight. */
  :is(#view, #modal-root, #login-screen) .button,
  .apple-confirm-button {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  .custom-select-trigger, .store-choice-trigger, .date-picker-trigger {
    font-weight: var(--ar-weight-label) !important;
  }
  :is(.custom-select-trigger, .store-choice-trigger, .date-picker-trigger) { justify-content: space-between !important; }
  :is(.custom-select-trigger, .store-choice-trigger, .date-picker-trigger) strong {
    font-size: var(--ar-data) !important; font-weight: var(--ar-weight-label) !important; line-height: 18px !important;
  }
  :is(.admin-form-panel, .modal) form { gap: 12px !important; }
  :is(.admin-form-panel, .modal) label:not(.checkbox-line):not(.team-assignment-option):not(.automation-switch) {
    gap: 6px !important;
    font-size: var(--ar-data) !important;
    font-weight: var(--ar-weight-label) !important;
    line-height: 18px !important;
  }
  .filter-label, .merged-store-filterbar > label > span, .merged-store-activity-field > span {
    font-size: var(--ar-data) !important; line-height: 16px !important; font-weight: var(--ar-weight-label) !important;
  }

  /* Compact desktop controls: same vertical center, separate roles by 4px. */
  #view :is(td, .user-account-actions, .creative-library-card-actions) .button,
  .pagination :is(.button, .custom-select-trigger),
  #view .store-app-config-button {
    min-height: var(--ar-action) !important; height: var(--ar-action) !important;
    min-width: 40px !important; padding: 0 8px !important;
    font-size: var(--ar-data) !important; line-height: 18px !important;
    border-radius: 8px !important;
  }
  .table-actions, .store-row-actions, .user-account-actions { align-items: center !important; gap: 6px !important; }
  :is(.status-pill, .shopify-status, .member-count-button, .currency-breakdown-trigger,
      .user-role-pill, .team-assignment-button, .vendor-code-table-button,
      .order-status-pill, .member-role-label, .automation-decision-action, .facebook-status) {
    box-sizing: border-box !important;
    min-height: var(--ar-tag) !important; height: var(--ar-tag) !important;
    max-height: none !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    padding: 0 7px !important; gap: 4px !important;
    border-radius: var(--ar-radius-tag) !important;
    font-size: var(--ar-data) !important; line-height: 18px !important;
    font-weight: var(--ar-weight-label) !important; letter-spacing: 0 !important;
    vertical-align: middle !important; white-space: nowrap !important;
  }
  :is(.member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button) :is(strong, small, span) {
    font-size: inherit !important; line-height: inherit !important; font-weight: inherit !important;
  }
  :is(.member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button) {
    font-weight: var(--ar-weight-emphasis) !important;
  }
  :is(.store-settings-table, .merged-store-table) .store-identity-value {
    display: inline-block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: var(--ar-ink) !important;
    font-size: var(--ar-data) !important;
    font-weight: var(--ar-weight-body) !important;
    line-height: 18px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .merged-store-table .store-identity-value {
    box-sizing: border-box !important;
    min-height: var(--ar-tag) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1px 8px !important;
    border: 1px solid var(--ar-blue-line) !important;
    border-radius: var(--ar-radius-tag) !important;
    background: var(--ar-blue-soft) !important;
    color: var(--ar-link) !important;
    font-weight: var(--ar-weight-label) !important;
  }
  .merged-store-table .store-identity-value.is-unset {
    border-color: var(--ar-neutral-line) !important;
    background: var(--ar-neutral-soft) !important;
    color: var(--ar-muted) !important;
  }
  #view :is([role="tablist"], .merged-store-activity-tabs, .creative-library-segments) {
    box-sizing: border-box !important; min-height: 36px !important;
    padding: 3px !important; gap: 2px !important;
  }
  #view :is([role="tablist"], .merged-store-activity-tabs, .creative-library-segments) :is(button, .button) {
    box-sizing: border-box !important; min-height: 28px !important; height: 28px !important;
    max-height: none !important; padding: 0 10px !important;
    font-size: var(--ar-data) !important; line-height: 18px !important; font-weight: var(--ar-weight-emphasis) !important;
    border-radius: 8px !important;
  }

  /* Page view switches fit their labels, not historical 200/224/236px tracks.
     Shared by advertising and automation; do not stretch or clip longer tabs. */
  #view .apple-segmented-control.workspace-view-switch {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
    height: var(--ar-control) !important;
    min-height: var(--ar-control) !important;
    padding: 3px !important;
    gap: 2px !important;
    align-items: center !important;
    overflow: visible !important;
  }
  #view .apple-segmented-control.workspace-view-switch > button {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 12px !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* Table geometry is controlled here; row hover/selected paint remains original. */
  #view table :is(th, td) {
    box-sizing: border-box !important;
    font-size: var(--ar-data) !important; line-height: 18px !important;
    letter-spacing: 0 !important; vertical-align: middle !important;
  }
  #view table th { height: 36px !important; padding: 6px 8px !important; font-weight: var(--ar-weight-emphasis) !important; }
  #view table td { height: var(--ar-row) !important; padding: 5px 8px !important; }
  #view table :is(.number, [class*="amount"], [class*="price"], [class*="time"]) { font-variant-numeric: tabular-nums !important; }
  #view .sort-header {
    font-size: inherit !important; font-weight: var(--ar-weight-emphasis) !important; line-height: 16px !important;
    min-height: 24px !important; height: 24px !important; padding: 0 2px !important;
  }
  #view :is(.merged-store-table, .store-settings-table, .facebook-account-table, .system-ai-log-table) td {
    height: var(--ar-detail-row) !important;
  }
  #view :is(.cell-sub, .ad-campaign-owner, .facebook-account-owner) { font-size: var(--ar-caption) !important; line-height: 16px !important; font-weight: var(--ar-weight-body) !important; }
  #view :is(.ad-data-latest-table, .ad-data-report-table) :is(th, td) {
    height: 38px !important; padding: 4px 6px !important;
  }
  #view :is(.ad-data-latest-table, .ad-data-report-table) th,
  #view .ad-data-report-table .ad-report-column-label { font-size: 11px !important; line-height: 14px !important; }
  #view .ad-data-report-table .status-pill { min-height: 22px !important; height: 22px !important; font-size: 11px !important; }
  #view .pagination {
    /* Contextual scale also reaches native jump inputs through the shared
       field rule, avoiding a specificity fight with ordinary 36px forms. */
    --ar-control: var(--ar-action);
    min-height: 44px !important; padding: 7px 12px !important;
    gap: 8px !important; font-size: 12px !important;
  }
  #view .pagination .pagination-jump {
    min-height: var(--ar-control) !important;
    height: var(--ar-control) !important;
    align-items: center !important;
  }
  #view .pagination .pagination-jump input {
    /* Reserve four digits plus native number arrows, including focus/hover. */
    --ar-control-padding: 0 6px;
    width: 72px !important;
    min-width: 72px !important;
    max-width: none !important;
    flex: 0 0 72px !important;
    text-align: center !important;
    font-variant-numeric: tabular-nums !important;
  }
  #view .pagination :is(input:not([type="checkbox"]), .custom-select-trigger, .pagination-page, .pagination-arrow) {
    min-height: 28px !important; height: 28px !important; max-height: 28px !important;
  }
  #view .pagination :is(.pagination-page, .pagination-arrow) { min-width: 28px !important; }
  #view .pagination .pagination-page { font-size: 12px !important; }
  .merged-store-table { min-width: 1200px !important; table-layout: fixed !important; }
  .merged-store-table th:nth-child(1) { width: 24% !important; }
  .merged-store-table th:nth-child(2) { width: 8% !important; }
  .merged-store-table th:nth-child(3) { width: 7% !important; }
  .merged-store-table th:nth-child(4) { width: 8% !important; }
  .merged-store-table th:nth-child(5) { width: 7% !important; }
  .merged-store-table th:nth-child(6) { width: 9% !important; }
  .merged-store-table th:nth-child(7) { width: 6% !important; }
  .merged-store-table th:nth-child(8) { width: 10% !important; }
  .merged-store-table th:nth-child(9) { width: 9% !important; }
  .merged-store-table th:nth-child(10) { width: 12% !important; }
  #view .merged-store-table th { font-size: 11px !important; }
  .merged-store-table :is(th, td):nth-child(2) { text-align: center !important; }
  .merged-store-table th:nth-child(2) .sort-header { justify-content: center !important; }
  .merged-store-table :is(th, td):nth-child(5) { text-align: center !important; }
  .merged-store-table .merged-store-card-name-row > strong {
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    flex: 1 1 auto !important;
  }
  .merged-store-table .merged-store-card-date { white-space: nowrap !important; }
  .orders-table .order-money-cell {
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .orders-table .order-money-cell > .cell-main {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums !important;
  }
  .orders-table :is(th, td):nth-child(4) { text-align: center !important; }
  .orders-table th:nth-child(4) .sort-header { justify-content: center !important; }
  .merged-store-table-wrap { scrollbar-gutter: auto !important; }

  /* Summaries keep data close to its label, with equal separators and insets. */
  #view .ad-metric-summary-head { min-height: 52px !important; padding: 0 12px !important; }
  #view .ad-metric-strip { min-height: 50px !important; }
  #view .ad-metric-strip dt, #view .ad-metric-strip > span { font-size: 11px !important; line-height: 16px !important; }
  #view .ad-metric-strip dd, #view .ad-metric-strip > span strong { font-size: 18px !important; line-height: 22px !important; font-weight: var(--ar-weight-emphasis) !important; letter-spacing: 0 !important; }
  #view .ad-metric-strip .ad-metric-item, #view .ad-metric-strip > span { gap: 2px !important; padding: 5px 12px !important; }
  .merged-store-pulse { flex: 0 0 auto !important; min-height: 64px !important; }
  .merged-store-summary-strip {
    height: auto !important; min-height: 64px !important;
    grid-template-columns: minmax(180px, 1.05fr) repeat(3, minmax(112px, .7fr)) minmax(300px, 1.5fr) !important;
    grid-template-rows: auto !important;
  }
  .merged-store-summary-strip > * { grid-column: auto !important; height: auto !important; min-height: 62px !important; padding: 5px 16px !important; }
  .merged-store-summary-context { gap: 2px !important; }
  .merged-store-summary-context :is(small, b), .merged-store-summary-overview-head > small { font-size: 11px !important; line-height: 16px !important; }
  .order-pulse-refresh, .merged-store-summary-overview-head > small {
    font-size: var(--ar-caption) !important; line-height: 16px !important;
    font-weight: var(--ar-weight-body) !important; color: var(--ar-muted) !important;
  }
  .order-pulse-window-head { flex-wrap: wrap !important; gap: 2px 10px !important; }
  .order-pulse-metric > span { font-size: 11px !important; line-height: 16px !important; }
  .order-pulse-metric > strong {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 22px !important; line-height: 26px !important; font-weight: var(--ar-weight-emphasis) !important;
    font-variant-numeric: tabular-nums !important;
  }
  /* Use the same responsive gutter as the page edges, without legacy 4px
     offsets. Keep height content-driven so narrow layouts can still wrap. */
  #view .merged-store-overview-page { padding: 0 !important; gap: var(--ta-page-gap, var(--ar-gap)) !important; }
  #view .orders-fixed-page { padding: 0 !important; gap: var(--ta-page-gap, var(--ar-gap)) !important; }
  .orders-fixed-page > .order-management-pulse { min-height: 56px !important; flex: 0 0 auto !important; margin: 0 !important; }
  .orders-fixed-page .order-pulse-summary { height: auto !important; min-height: 56px !important; grid-template-rows: auto !important; }
  .orders-fixed-page .order-pulse-metric { min-height: 54px !important; padding: 5px 16px !important; gap: 2px !important; justify-content: center !important; }
  .merged-store-summary-overview-grid { gap: 8px !important; margin-top: 6px !important; }
  .merged-store-summary-overview-grid :is(small, strong) { font-size: 12px !important; line-height: 18px !important; }

  /* Filters: responsive tracks prevent the search button covering refresh text. */
  .merged-store-panel .merged-store-filterbar {
    display: flex !important; flex-wrap: wrap !important; align-items: end !important;
    gap: 12px !important; padding: 12px 16px !important; min-height: 80px !important;
  }
  .merged-store-filterbar > :is(label, .merged-store-filter-field, .merged-store-member-filter) {
    min-width: 140px !important; flex: 1 1 140px !important;
    grid-template-rows: 16px 36px !important; gap: 6px !important;
  }
  .merged-store-filterbar .merged-store-activity-field {
    min-width: 270px !important; flex: 0 0 270px !important;
    grid-template-rows: 16px 36px !important; gap: 6px !important;
  }
  .merged-store-filterbar .merged-store-search { min-width: 200px !important; flex: 1.3 1 200px !important; }
  .merged-store-filterbar .store-overview-date-filter {
    min-width: 220px !important;
    flex: 1.15 1 220px !important;
  }
  .merged-store-activity-tabs { width: 100% !important; min-width: 0 !important; }
  .merged-store-activity-tabs button { flex: 1 1 0 !important; min-width: 0 !important; }
  .ad-data-report-mode-head {
    display: flex !important; flex-wrap: wrap !important; align-items: center !important;
    gap: 8px 12px !important; height: auto !important; min-height: 52px !important; padding: 8px !important;
  }
  .ad-data-head-filters {
    width: auto !important; max-width: 100% !important; height: auto !important;
    min-height: 36px !important; max-height: none !important;
    flex: 1 1 auto !important; flex-wrap: wrap !important; gap: 8px !important;
  }
  .ad-data-head-filters > :is(label, .ad-data-choice-control, .ad-data-date-picker),
  .ad-data-head-filters :is(.store-choice-menu, .ad-data-search-control, .filter-label, .custom-select-wrap) {
    height: 36px !important; min-height: 36px !important; max-height: none !important;
  }
  .ad-data-report-top-controls { margin-left: auto !important; flex: 0 0 auto !important; gap: 8px !important; }
  .ad-report-filter-toolbar {
    display: flex !important; flex-wrap: wrap !important; align-items: end !important; gap: 8px !important;
  }
  .ad-report-filter-toolbar > :is(label, .date-picker, .store-choice-control) { flex: 1 1 190px !important; min-width: 160px !important; }
  #view .ad-report-filter-toolbar > .ad-report-member-filter { flex: 0 1 220px !important; width: 220px !important; min-width: 160px !important; max-width: 100% !important; }
  #view .ad-report-filter-toolbar > .ad-report-date-picker { flex: 0 1 240px !important; width: 240px !important; min-width: 220px !important; max-width: 100% !important; }
  #view .ad-report-filter-toolbar > .ad-report-search-field { flex: 0 1 420px !important; width: 420px !important; min-width: 220px !important; max-width: 100% !important; }
  .ad-report-filter-actions { flex: 0 0 auto !important; margin-left: 0 !important; }
  .ad-report-filter-toolbar .ad-report-auto-update { flex: 0 0 auto !important; width: auto !important; min-width: 220px !important; margin-left: auto !important; }

  /* Administration: reserve space for actions instead of inflating every column. */
  #view .stores-fixed-page .store-settings-layout {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: 12px !important;
  }
  #view .stores-fixed-page .store-settings-layout > #new-store-panel {
    grid-column: 1 !important;
    min-width: 0 !important;
  }
  #view .stores-fixed-page .store-settings-layout > #stores-list {
    grid-column: 2 !important;
    min-width: 0 !important;
  }
  .users-layout { grid-template-columns: 280px minmax(0, 1fr) !important; gap: 12px !important; }
  .store-settings-table { min-width: 1040px !important; width: 100% !important; table-layout: fixed !important; }
  .store-settings-table th:nth-child(1) { width: 38px !important; }
  .store-settings-table th:nth-child(2) { width: auto !important; }
  .store-settings-table th:nth-child(3),
  .store-settings-table th:nth-child(4),
  .store-settings-table th:nth-child(5) { width: clamp(88px, 7vw, 126px) !important; }
  .store-settings-table th:nth-child(6) { width: clamp(104px, 8vw, 150px) !important; }
  .store-settings-table th:nth-child(7) { width: clamp(110px, 8.5vw, 160px) !important; }
  .store-settings-table th:nth-child(8) { width: clamp(248px, 15vw, 280px) !important; }
  .store-settings-table .store-name-cell :is(.cell-main, .cell-sub) { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  .stores-fixed-page #new-store-form {
    box-sizing: border-box !important;
    width: 100% !important;
    overflow-y: hidden !important;
    overflow-x: hidden !important;
    scrollbar-gutter: auto !important;
    padding-inline: 0 !important;
    margin-top: 8px !important;
    gap: 8px !important;
  }
  .stores-fixed-page #new-store-form > :is(label, .member-selector-field, .button.primary, .form-error) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    align-self: stretch !important;
  }
  .stores-fixed-page #new-store-form .member-selector-field { flex: 1 1 112px !important; min-height: 96px !important; }
  .stores-fixed-page #new-store-form .fixed-checkbox-list {
    max-height: none !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }
  #view .stores-fixed-page #new-store-select-all {
    min-width: 40px !important;
    min-height: var(--ar-action) !important;
    height: var(--ar-action) !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    font-size: var(--ar-caption) !important;
  }
  .stores-fixed-page #new-store-form > .button.primary { position: static !important; bottom: auto !important; z-index: auto !important; margin-top: auto !important; }
.store-settings-table :is(th, td):last-child {
  position: sticky !important;
  right: 0 !important;
  background: #fff !important;
  border-left: 1px solid var(--ar-line) !important;
}
  .store-settings-table th:last-child { z-index: 4 !important; background: #f8f9fb !important; }
  .store-settings-table tr.is-selected > td:last-child {
    background: var(--apple-table-selected) !important;
  }
  @media (hover: hover) and (pointer: fine) {
    .store-settings-table tbody tr:not(.has-row-highlight):not(.is-selected):hover > td:last-child {
      background: var(--apple-table-hover) !important;
    }
  }
  .user-account-row {
    min-width: 768px !important;
    grid-template-columns: minmax(56px, .75fr) minmax(74px, 1fr) minmax(80px, .8fr) minmax(90px, 1.1fr) minmax(46px, .6fr) minmax(106px, 1fr) minmax(76px, .9fr) 160px !important;
    min-height: var(--ar-detail-row) !important; padding: 6px 12px !important; gap: 8px !important;
    font-size: var(--ar-data) !important; line-height: 18px !important;
  }
  .user-account-head { min-height: 36px !important; font-size: var(--ar-data) !important; font-weight: var(--ar-weight-emphasis) !important; }
  .user-account-cell .cell-main { font-size: var(--ar-data) !important; }

  /* Floating surfaces and drawers share typography and internal grouping. */
  .modal { padding: 20px !important; background: #fbfbfc !important; }
  .modal form { box-sizing: border-box !important; min-width: 0 !important; max-width: 100% !important; }
  .windsor-schedule-preview { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; }
  .windsor-schedule-preview > span { white-space: nowrap !important; font-size: 11px !important; line-height: 16px !important; }
  .windsor-schedule-preview > strong { white-space: normal !important; overflow-wrap: anywhere !important; text-align: left !important; font-size: 12px !important; line-height: 20px !important; }
  .modal-title { gap: 12px !important; margin-bottom: 16px !important; padding-bottom: 12px !important; }
  .modal-actions { gap: 8px !important; padding-top: 16px !important; margin-top: 4px !important; }
  .modal-close { min-width: 36px !important; min-height: 28px !important; font-size: 12px !important; }
  .modal :is(.form-hint, .field-hint, .muted, label > small) { font-weight: var(--ar-weight-body) !important; line-height: 16px !important; }
  .custom-select-menu, .store-choice-popover, .date-picker-popover,
  .member-popover, .order-assignee-popover, .order-product-popover,
  .currency-breakdown-popover, .account-popover, .creative-library-copy-popover,
  .system-overflow-tooltip {
    background: #fbfbfc !important;
  }
  :is(.custom-select-option, .checkbox-line, .store-choice-option) {
    min-height: 32px !important; font-size: 12px !important; line-height: 18px !important; font-weight: var(--ar-weight-body) !important;
  }
  /* Store names reserve two lines; short names share the same row rhythm.
     Keep taller content readable instead of clipping it at two lines. */
  :is(#orders-store-choice-popover, #store-data-store-choice-popover) .store-choice-list > .checkbox-line:not(:first-child) {
    box-sizing: border-box !important;
    min-width: 0 !important;
    min-height: calc(2 * 1.5em + 10px) !important;
    height: auto !important;
    padding: 5px 7px !important;
    line-height: 1.5 !important;
    align-items: center !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  .member-popover-head { padding: 10px 12px !important; min-height: 44px !important; }
  .member-popover-head strong { font-size: 13px !important; line-height: 18px !important; font-weight: var(--ar-weight-emphasis) !important; }
  .member-popover .member-list-row { min-height: 48px !important; padding: 8px 6px !important; gap: 10px !important; }
  .member-popover .member-list-row strong { font-size: 12px !important; line-height: 18px !important; font-weight: var(--ar-weight-emphasis) !important; }
  .member-popover .member-list-row small { font-size: 11px !important; line-height: 16px !important; }
  /* Product names and variants are details to read, not one-line badges. */
  .order-product-popover {
    box-sizing: border-box !important;
    width: min(380px, calc(100vw - 32px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 32px) !important;
    max-height: min(340px, calc(100vh - 24px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  .order-product-popover .order-product-detail-list {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .order-product-popover :is(.order-product-detail-row, .order-product-name) { min-width: 0 !important; }
  .order-product-popover .order-product-name > span {
    flex: 1 1 auto !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  .order-product-popover .order-product-option {
    display: block !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  .team-assignment-scroll { display: flex !important; flex-direction: column !important; overflow-y: auto !important; }
  .team-assignment-group { flex: 0 0 auto !important; max-height: 48vh !important; }
  .team-assignment-group-options { flex: 0 1 auto !important; }
  .team-assignment-option { min-height: 48px !important; padding: 8px 12px !important; }
  .team-assignment-empty { min-height: 64px !important; }

  /* Media cards: no min-content widening, all actions fit inside the card. */
  .creative-library-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; gap: 12px !important; padding: 12px 16px 16px !important; }
  .creative-library-card-body { min-width: 0 !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto auto minmax(36px, auto) auto auto !important; gap: 8px !important; padding: 12px !important; }
  .creative-library-card-title { min-width: 0 !important; }
  .creative-library-card-title strong { font-size: 13px !important; font-weight: var(--ar-weight-emphasis) !important; line-height: 20px !important; }
  .creative-library-publisher strong, .creative-library-card-body > p { font-size: 12px !important; line-height: 18px !important; font-weight: var(--ar-weight-body) !important; }
  .creative-library-publisher small, .creative-library-operator, .creative-library-card-meta time,
  .creative-library-waiting, .creative-library-kind { font-size: 11px !important; line-height: 16px !important; font-weight: var(--ar-weight-body) !important; }
  .creative-library-card-actions { min-height: 28px !important; gap: 8px !important; flex-wrap: wrap !important; }
  .creative-library-copy-popover p { font-size: 13px !important; line-height: 20px !important; }

  /* AI controls use the same scale as account and store settings. */
  .system-ai-status-grid article { padding: 12px 16px !important; gap: 4px !important; }
  .facebook-quota-grid article {
    min-height: 72px !important; height: auto !important;
    padding: 6px 16px !important; gap: 2px !important;
  }
  .system-ai-log-card > header > span, .system-ai-log-card > header p,
  .system-ai-status-grid small, .system-ai-summary-control small,
  .facebook-quota-grid small {
    font-size: 11px !important; line-height: 16px !important; font-weight: var(--ar-weight-body) !important;
  }
  .system-ai-status-grid article > span, .system-ai-field-label,
  .facebook-quota-grid article > span {
    font-size: 11px !important; line-height: 16px !important; font-weight: var(--ar-weight-label) !important;
  }
  .system-ai-status-grid article > strong, .facebook-quota-grid article strong { font-size: 16px !important; line-height: 22px !important; font-weight: var(--ar-weight-emphasis) !important; }
  .system-ai-interface-card { padding: 8px 16px !important; }
  /* The card owns the gutter; its inner grid must not add a second gutter. */
  #system-ai-content .system-ai-config-grid { padding: 0 !important; }
  .system-ai-control-field { gap: 6px !important; }
  .system-ai-model-trigger, .system-ai-status-control, .system-ai-balance-control, .system-ai-summary-control {
    min-height: 36px !important; height: 36px !important; border-radius: 10px !important;
    font-size: 12px !important; line-height: 18px !important;
  }
  .system-ai-model-trigger > span, .system-ai-status-control > strong,
  .system-ai-summary-control > strong, .system-ai-balance-value > strong {
    font-size: 12px !important; line-height: 18px !important; font-weight: var(--ar-weight-label) !important;
  }
  .system-ai-refresh-button { min-height: 36px !important; height: 36px !important; width: 36px !important; }
  .system-ai-log-card > header { padding: 12px 16px !important; gap: 12px !important; }

  /* Managed-ad detail: readable evidence, without changing chart or data logic. */
  .automation-cockpit-page { grid-template-rows: minmax(48px, auto) minmax(92px, auto) minmax(280px, auto) minmax(344px, 1fr) !important; gap: 12px !important; }
  .automation-decision-settings-grid { height: auto !important; min-height: 280px !important; }
  .automation-decision-settings-grid > .automation-card { height: 100% !important; max-height: none !important; align-self: stretch !important; }
  .automation-mode-toolbar { display: flex !important; flex-wrap: wrap !important; height: auto !important; min-height: 52px !important; align-items: center !important; gap: 8px 12px !important; padding: 8px !important; }
  .automation-toolbar-actions { margin-left: auto !important; }
  .automation-toolbar-actions [data-automation-config] { color: var(--ar-link) !important; }
  .automation-toolbar-actions .automation-pill.blocked { color: var(--ar-danger) !important; border-color: var(--ar-danger-line) !important; background: var(--ar-danger-soft) !important; }
  .automation-kpi-grid { height: auto !important; min-height: 92px !important; grid-template-rows: auto !important; }
  .automation-kpi-grid article { height: auto !important; min-height: 90px !important; padding: 12px 16px !important; gap: 4px !important; grid-template-rows: 16px 26px 16px !important; align-content: center !important; }
  .automation-kpi-grid article > strong, .automation-plan-roas-grid article > strong { font-size: 22px !important; line-height: 26px !important; font-weight: var(--ar-weight-emphasis) !important; }
  .automation-kpi-grid article > span, .automation-kpi-note, .automation-kpi-note b,
  .automation-card-head p, .automation-decision-model, .automation-detail-meta,
  .automation-detail-meta :is(em, strong), .automation-detail-product,
  .automation-decision-kicker, .automation-decision-confidence-caption,
  .automation-decision-threshold-summary, .automation-decision-signals article > :is(span, small),
  .automation-plan-roas-grid article > span, .automation-plan-setting-label,
  .automation-plan-setting-list :is(strong, small, span), .automation-chart-legend,
  .automation-timeline-status, .automation-timeline-card header > span {
    font-size: 11px !important; line-height: 16px !important;
  }
  .automation-decision-conclusion p, .automation-decision-signals article > strong,
  .automation-timeline-title strong, .automation-timeline-reason, .automation-timeline-item time {
    font-size: 12px !important; line-height: 18px !important;
  }
  .automation-current-card .automation-decision-action {
    display: block !important; height: auto !important; min-height: 24px !important; padding: 0 !important;
    font-size: 16px !important; line-height: 24px !important; font-weight: var(--ar-weight-emphasis) !important;
  }
  .automation-card-head { padding: 12px 16px !important; gap: 8px !important; }
  .automation-plan-setting-label { flex-wrap: wrap !important; gap: 4px 8px !important; }
  .automation-bound-setting { display: flex !important; flex-direction: column !important; }
  .automation-bound-setting .automation-switch-row { flex: 1 0 auto !important; align-items: start !important; }
  .automation-bound-setting .automation-plan-setting-body { margin-top: 12px !important; }

  /* Surface hierarchy: calm work surfaces, elevation only for floating content. */
  #view :is(.panel, .facebook-account-directory-card, .system-ai-interface-card,
      .system-ai-log-card, .automation-card, .creative-library-card,
      .facebook-quota-grid article, .system-ai-status-grid article) {
    border-color: var(--ar-border) !important;
    border-radius: var(--ar-radius-panel) !important;
    background: var(--ar-surface) !important;
    box-shadow: none !important;
    color: var(--ar-ink) !important;
  }
  #view :is(.panel-head, .ad-metric-summary-head, .automation-card-head) {
    background: var(--ar-surface) !important;
    border-color: var(--ar-line) !important;
  }
  #view :is(h1, h2, h3, h4, h5, h6, .cell-main, .ad-metric-strip dd),
  .modal :is(h1, h2, h3, h4, h5, h6) { color: var(--ar-ink) !important; }
  /* Neutral text roles are independent of weight. Column labels are primary
     reading text in every page, grid and dialog, including inactive sort columns.
     Target text only: the sort arrow keeps its existing blue/neutral state. */
  :is(#view, #modal-root) :is(th, [role="columnheader"], .user-account-head,
      .sort-header, .sort-header > span, .ad-report-column-label),
  .user-account-head > span {
    color: var(--ar-ink) !important;
  }
  #view :is(.filter-label, .merged-store-filterbar > label > span,
      .merged-store-activity-field > span, .system-ai-field-label) {
    color: var(--ar-secondary) !important;
  }
  #view :is(.panel-head p, .cell-sub, .field-hint, .form-hint, .subtle,
      .facebook-account-owner small, .system-ai-status-grid small, .facebook-quota-grid small,
      .facebook-account-table td small, .order-pulse-refresh,
      .ad-metric-strip dt, .order-pulse-metric > span, .merged-store-summary-overview-head > small,
      .creative-library-publisher small, .creative-library-operator,
      .creative-library-card-meta time, .automation-kpi-note),
  .modal :is(.form-hint, .field-hint, .muted, label > small), .member-popover small {
    color: var(--ar-muted) !important;
  }
  #view .pagination { background: var(--ar-surface-muted) !important; border-color: var(--ar-line) !important; color: var(--ar-secondary) !important; }
  #view :is(table th, .user-account-head) { background: var(--ar-surface-muted) !important; color: var(--ar-ink) !important; border-color: var(--ar-line) !important; }
  #view .ad-data-report-table thead th.is-record-header.ad-data-accent-header {
    background: rgb(224, 239, 255) !important;
    color: rgb(7, 95, 189) !important;
  }
  #view .ad-data-report-table thead th[data-ad-column-key="reportBudgetValue"],
  #view .ad-data-report-table thead th[data-ad-column-key="reportCpmValue"] {
    background: linear-gradient(90deg, rgb(246, 249, 253), rgb(224, 239, 255) 16px) !important;
  }
  #view .ad-data-report-table thead th[data-ad-column-key="reportConversionCostValue"],
  #view .ad-data-report-table thead th[data-ad-column-key="reportFrequencyValue"] {
    background: linear-gradient(90deg, rgb(224, 239, 255) calc(100% - 16px), rgb(246, 249, 253)) !important;
  }
  .user-account-row { border-bottom-color: var(--ar-line) !important; }
  .user-account-cell { min-width: 0 !important; overflow-wrap: anywhere !important; }
  .user-account-actions { justify-content: flex-start !important; }
  .user-account-row :is(.user-role-column, .user-role-cell, .user-direct-reports-column, .user-direct-reports-cell) { justify-self: start !important; text-align: left !important; }
  #view .store-settings-table th:last-child { background: var(--ar-surface-muted) !important; }
  #view .store-settings-table td:last-child { border-left-color: var(--ar-line) !important; }

  /* A single family of resting/hover/pressed/focus/disabled controls. */
  :is(#view, #modal-root, #login-screen) .button,
  .custom-select-trigger, .store-choice-trigger, .date-picker-trigger,
  .system-ai-model-trigger, .apple-confirm-button,
  #view .pagination-page, #view .ad-data-manual-add-button {
    border: 1px solid var(--ar-control-border) !important;
    background: var(--ar-surface) !important;
    background-image: none !important;
    background-clip: border-box !important;
    color: var(--ar-ink) !important;
    box-shadow: var(--ar-shadow-button) !important;
    appearance: none !important;
    transform: none !important;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease !important;
  }
  :is(#view, #modal-root, #login-screen) .button:not(:disabled):hover,
  #view :is(.pagination-page, .ad-data-manual-add-button):not(:disabled):hover,
  :is(.custom-select-trigger, .store-choice-trigger, .date-picker-trigger, .system-ai-model-trigger):not(:disabled):hover {
    background-color: var(--ar-surface-muted) !important; border-color: var(--ar-control-border-hover) !important;
  }
  :is(#view, #modal-root, #login-screen) .button.primary,
  .apple-confirm-button.primary, #view .pagination-page.active {
    /* Same opaque 1px edge and full painted bounds as secondary controls. */
    border-color: var(--ar-button-primary) !important;
    background-color: var(--ar-button-primary) !important;
    color: #fff !important; box-shadow: var(--ar-shadow-button) !important;
  }
  :is(#view, #modal-root, #login-screen) .button.primary:not(:disabled):hover,
  .apple-confirm-button.primary:not(:disabled):hover, #view .pagination-page.active:not(:disabled):hover {
    background-color: var(--ar-button-primary-hover) !important; border-color: var(--ar-button-primary-hover) !important;
  }
  :is(#view, #modal-root) .button.danger {
    color: var(--ar-danger) !important; border-color: var(--ar-danger-line) !important;
    background-color: var(--ar-surface) !important; box-shadow: var(--ar-shadow-button) !important;
  }
  :is(#view, #modal-root) .button.danger:not(:disabled):hover {
    color: var(--ar-danger) !important; border-color: var(--ar-danger) !important; background-color: var(--ar-danger-soft) !important;
  }
  .apple-confirm-button.danger {
    background-color: var(--ar-danger) !important; border-color: var(--ar-danger) !important;
    color: #fff !important; box-shadow: var(--ar-shadow-button) !important;
  }
  /* Repeated row actions are secondary to the page's single main action. */
  #view :is(td, .user-account-actions, .creative-library-card-actions) .button.primary {
    color: var(--ar-link) !important; background-color: var(--ar-blue-soft) !important; border-color: var(--ar-blue-line) !important;
    box-shadow: var(--ar-shadow-button) !important;
  }
  #view :is(td, .user-account-actions, .creative-library-card-actions) .button.primary:not(:disabled):hover {
    color: var(--ar-link) !important; background-color: #dfedff !important; border-color: var(--ar-link) !important;
  }
  :is(#view, #modal-root, #login-screen) :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not(.native-select-hidden):not([data-system-ai-model-search]) {
    border-color: var(--ar-control-border) !important; background: var(--ar-surface) !important;
    color: var(--ar-ink) !important; box-shadow: none !important;
  }
  :is(#view, #modal-root, #login-screen) :is(input, textarea)::placeholder { color: var(--ar-muted) !important; opacity: 1 !important; }
  :is(#view, #modal-root, #login-screen) :is(button, [tabindex]):focus-visible,
  :is(.member-count-button, .currency-breakdown-trigger, .custom-select-option, .apple-confirm-button):focus-visible {
    outline: 2px solid var(--ar-link) !important; outline-offset: 2px !important;
  }
  :is(#view, #modal-root, #login-screen) :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([data-system-ai-model-search]):focus-visible {
    border-color: var(--ar-link) !important;
    outline: 0 !important;
    box-shadow: inset 0 0 0 1px var(--ar-link) !important;
  }
  #modal-root .system-ai-openrouter-settings-modal .system-ai-model-search:focus-within {
    border-color: var(--ar-link) !important;
    outline: 0 !important;
    box-shadow: inset 0 0 0 1px var(--ar-link) !important;
  }
  #modal-root .system-ai-openrouter-settings-modal input[data-system-ai-model-search],
  #modal-root .system-ai-openrouter-settings-modal input[data-system-ai-model-search]:focus,
  #modal-root .system-ai-openrouter-settings-modal input[data-system-ai-model-search]:focus-visible {
    height: 32px !important;
    min-height: 0 !important;
    max-height: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
  }
  :is(#view, #modal-root, #login-screen) .button:not(:disabled):active,
  #view :is(.pagination-page, .ad-data-manual-add-button):not(:disabled):active,
  .apple-confirm-button:not(:disabled):active {
    filter: brightness(.96) !important;
    box-shadow: var(--ar-shadow-button) !important;
    transform: none !important;
  }
  :is(#view, #modal-root, #login-screen) .button:disabled,
  #view :is(td, .user-account-actions, .creative-library-card-actions) .button:disabled,
  #view :is(.pagination-page, .ad-data-manual-add-button):disabled,
  :is(.custom-select-trigger, .store-choice-trigger, .date-picker-trigger, .apple-confirm-button):disabled {
    background-color: var(--ar-neutral-soft) !important; color: var(--ar-muted) !important;
    border-color: var(--ar-neutral-line) !important; border-width: 1px !important; box-shadow: none !important;
    opacity: 1 !important; cursor: not-allowed !important; filter: none !important;
  }
  :is(#view, #modal-root, #login-screen) .form-error { color: var(--ar-danger) !important; }
  :is(#view, #modal-root, #login-screen) :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--ar-danger) !important; }

  /* Shared pill geometry; semantic state is separate from interaction. */
  :is(.user-role-pill, .member-role-label,
      .status-pill, .shopify-status, .facebook-status, .order-fulfillment-status,
      .order-status-pill, span.automation-decision-action, .automation-pill,
      .automation-setting-status, .automation-managed-badge,
      .member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button) {
    --ar-tone-ink: var(--ar-neutral);
    --ar-tone-surface: var(--ar-neutral-soft);
    --ar-tone-line: var(--ar-neutral-line);
    border: 1px solid var(--ar-tone-line) !important;
    background: var(--ar-tone-surface) !important;
    color: var(--ar-tone-ink) !important;
    background-image: none !important;
    box-shadow: none !important;
    border-radius: var(--ar-radius-tag) !important;
  }
  :is(.order-fulfillment-status, .automation-pill, .automation-setting-status) {
    box-sizing: border-box !important; min-height: var(--ar-tag) !important;
    padding: 1px 8px !important; line-height: 20px !important;
    font-size: var(--ar-data) !important; font-weight: var(--ar-weight-label) !important;
  }
  :is(.user-role-pill, .member-role-label,
      .member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button,
      .status-pill.info, .facebook-status.pending, .order-fulfillment-status.partial, .order-fulfillment-status.scheduled,
      .automation-managed-badge.active) {
    --ar-tone-ink: var(--ar-link);
    --ar-tone-surface: var(--ar-blue-soft);
    --ar-tone-line: var(--ar-blue-line);
  }
  :is(.status-pill.success, .shopify-status.connected, .facebook-status.connected,
      .facebook-status.fetched, .order-fulfillment-status.fulfilled,
      span.automation-decision-action.increase, .automation-pill.live, .automation-setting-status.enabled) {
    --ar-tone-ink: var(--ar-success);
    --ar-tone-surface: var(--ar-success-soft);
    --ar-tone-line: var(--ar-success-line);
  }
  :is(.shopify-status.pending, .facebook-status.warning, .order-fulfillment-status.unfulfilled, .automation-managed-badge.warning) {
    --ar-tone-ink: var(--ar-warning);
    --ar-tone-surface: var(--ar-warning-soft);
    --ar-tone-line: var(--ar-warning-line);
  }
  :is(.status-pill.danger, .shopify-status.error, .facebook-status.error,
      .order-fulfillment-status.hold, span.automation-decision-action.decrease, .automation-pill.blocked, .automation-managed-badge.error) {
    --ar-tone-ink: var(--ar-danger);
    --ar-tone-surface: var(--ar-danger-soft);
    --ar-tone-line: var(--ar-danger-line);
  }
  :is(.member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button):not(:disabled):hover {
    background: #dfedff !important; border-color: var(--ar-link) !important;
  }
  :is(.member-count-button, .currency-breakdown-trigger, .team-assignment-button, .vendor-code-table-button) :is(strong, small, span) { color: inherit !important; }
  .team-assignment-button small { border-color: var(--ar-blue-line) !important; }
  .creative-library-waiting { color: var(--ar-warning) !important; }
  .automation-pill i { background: currentColor !important; }

  /* Detail views consume the same tokens as their list counterparts. */
  #ad-automation-content.automation-v2 {
    --automation-blue: var(--ar-link) !important;
    --automation-blue-soft: var(--ar-blue-soft) !important;
    --automation-green: var(--ar-success) !important;
    --automation-red: var(--ar-danger) !important;
    --automation-amber: var(--ar-warning) !important;
    --automation-ink: var(--ar-ink) !important;
    --automation-muted: var(--ar-muted) !important;
    --automation-line: var(--ar-border) !important;
    --automation-line-soft: var(--ar-line) !important;
    --automation-surface: var(--ar-surface) !important;
  }
  .automation-managed-badge { font-size: 10px !important; font-weight: var(--ar-weight-label) !important; }
  .automation-setting-status {
    width: auto !important; min-width: 58px !important; height: var(--ar-tag) !important;
    flex: 0 0 auto !important; white-space: nowrap !important;
  }
  .automation-cockpit-page :is(.automation-decision-signals span, .automation-decision-signals small,
      .automation-decision-confidence-caption em, .automation-decision-threshold-summary,
      .automation-decision-threshold-summary strong, .automation-budget-adjustment i) { color: var(--ar-muted) !important; }
  .automation-decision-signals strong { color: var(--ar-ink) !important; }
  .automation-decision-signals article { background: var(--ar-surface-muted) !important; border-color: var(--ar-line) !important; }
  .automation-decision-signals article.positive { background: var(--ar-success-soft) !important; border-color: var(--ar-success-line) !important; }
  .automation-decision-signals article.risk { background: var(--ar-danger-soft) !important; border-color: var(--ar-danger-line) !important; }
  .automation-decision-threshold-summary em.enabled strong { color: var(--ar-success) !important; }

  /* Shared selection vocabulary, with no permanent blue fill on plain labels. */
  #view :is([role="tablist"], .merged-store-activity-tabs, .creative-library-segments, .automation-mode-switch) {
    background: var(--ar-neutral-soft) !important; border: 1px solid var(--ar-border) !important;
    border-radius: var(--ar-radius-control) !important; box-shadow: none !important;
  }
  #view :is([role="tablist"], .merged-store-activity-tabs, .creative-library-segments, .automation-mode-switch) button {
    background: transparent !important; color: var(--ar-secondary) !important;
    border-color: transparent !important; box-shadow: none !important;
  }
  #view :is([role="tablist"], .merged-store-activity-tabs, .creative-library-segments, .automation-mode-switch) :is(button.active, button[aria-selected="true"]) {
    background: var(--ar-surface) !important; color: var(--ar-link) !important;
    border-color: var(--ar-border) !important; box-shadow: var(--ar-shadow-control) !important;
  }
  .nav :is(.nav-child, .nav-standalone).active {
    background: var(--ar-blue-soft) !important; color: var(--ar-link) !important; border-color: var(--ar-blue-line) !important;
  }
  .nav :is(.nav-child, .nav-standalone).active::before { background: var(--ar-blue) !important; }
  .custom-select-option[aria-selected="true"], .custom-select-option.is-selected,
  .store-choice-option.is-selected, .team-assignment-option:has(input:checked) {
    background: var(--ar-blue-soft) !important; color: var(--ar-link) !important;
  }

  /* Floaters use one neutral material; long content scrolls within it. */
  .modal, .apple-confirm-dialog { border-radius: var(--ar-radius-modal) !important; border-color: var(--ar-border) !important; background: var(--ar-surface) !important; box-shadow: var(--ar-shadow-float) !important; }
  .custom-select-menu, .store-choice-popover, .date-picker-popover,
  .member-popover, .order-assignee-popover, .order-product-popover,
  .currency-breakdown-popover, .account-popover, .creative-library-copy-popover,
  .system-overflow-tooltip {
    border-radius: var(--ar-radius-panel) !important; border: 1px solid var(--ar-border) !important;
    background: var(--ar-surface) !important; box-shadow: var(--ar-shadow-float) !important;
  }
  .member-popover-head, .currency-breakdown-popover-head, .modal-title { border-color: var(--ar-line) !important; }
  .member-avatar { color: var(--ar-link) !important; background: var(--ar-blue-soft) !important; border-color: var(--ar-blue-line) !important; }
  .currency-breakdown-popover-row > code { color: var(--ar-link) !important; background: var(--ar-blue-soft) !important; border-color: var(--ar-blue-line) !important; border-radius: var(--ar-radius-tag) !important; }

  /* Summary metrics form one reading group, without a large empty trailing track. */
  #view .ad-metric-strip {
    grid-template-columns: 88px repeat(var(--ad-metric-count), minmax(90px, 1fr)) !important;
    max-width: 1100px !important;
  }
  #view .ad-metric-strip::before { border-color: var(--ar-line) !important; color: var(--ar-secondary) !important; }
  #view .ad-metric-strip .ad-metric-item + .ad-metric-item::before { background: var(--ar-line) !important; }
  #view .order-pulse-metric { align-items: start !important; justify-content: start !important; text-align: left !important; }
  #view .order-pulse-metric > strong { color: var(--ar-ink) !important; }
  #view .order-pulse-metric:first-child > strong { color: var(--ar-link) !important; }
  #view .merged-store-summary-strip > .order-pulse-metric > strong { color: var(--ar-ink) !important; }
  #view .merged-store-summary-strip > .order-pulse-metric:nth-child(2) > strong { color: var(--ar-link) !important; }
  .creative-library-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; }

  /* Responsive density stays useful without shrinking text to fit. */
  @media (max-width: 1440px) {
    .store-settings-table th:nth-child(3),
    .store-settings-table th:nth-child(4),
    .store-settings-table th:nth-child(5) { width: 88px !important; }
    .store-settings-table th:nth-child(6) { width: 104px !important; }
    .store-settings-table th:nth-child(7) { width: 110px !important; }
    .store-settings-table th:nth-child(8) { width: 248px !important; }
  }
  @media (max-width: 1250px) {
    #view .stores-fixed-page .store-settings-layout { grid-template-columns: 260px minmax(0, 1fr) !important; }
    .users-layout { grid-template-columns: 260px minmax(0, 1fr) !important; }
    .merged-store-summary-strip { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .merged-store-summary-overview { grid-column: 1 / -1 !important; min-height: 58px !important; }
    .merged-store-summary-overview-head { justify-content: space-between !important; }
  }
  @media (max-width: 760px) {
    .automation-cockpit-page { grid-template-rows: auto !important; }
    #view .stores-fixed-page .store-settings-layout, .users-layout { grid-template-columns: minmax(0, 1fr) !important; }
    #view .stores-fixed-page .store-settings-layout > :is(#new-store-panel, #stores-list) { grid-column: 1 !important; }
    .merged-store-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .merged-store-filterbar > :is(label, .merged-store-filter-field, .merged-store-member-filter),
    .merged-store-filterbar .merged-store-activity-field { flex: 1 1 100% !important; min-width: 0 !important; }
    .ad-data-report-top-controls { flex-wrap: wrap !important; max-width: 100% !important; }
    .ad-data-head-filters { width: 100% !important; }
    .ad-data-head-filters > :is(label, .ad-data-choice-control) { min-width: 0 !important; width: 100% !important; max-width: none !important; flex: 1 1 100% !important; }
    .modal { padding: 16px !important; }
    .creative-library-grid { grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)) !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    .modal-side, .member-popover, .custom-select-menu, .store-choice-popover { animation: none !important; transition: none !important; }
    :is(#view, #modal-root, #login-screen) .button,
    .custom-select-trigger, .store-choice-trigger, .date-picker-trigger,
    .system-ai-model-trigger, .apple-confirm-button,
    #view .pagination-page, #view .ad-data-manual-add-button { transition: none !important; }
  }
  @media (prefers-reduced-transparency: reduce) {
    .modal, .member-popover, .custom-select-menu, .store-choice-popover, .date-picker-popover { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  }
}

@layer apple-proportions {
  /* One Facebook control outside, two existing actions inside. Presentation only. */
  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: stretch !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: var(--ar-control) !important;
    min-height: var(--ar-control) !important;
    gap: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #0866ff !important;
    border-radius: var(--ar-radius-control) !important;
    background: #0866ff !important;
    box-shadow: var(--ar-shadow-button) !important;
  }

  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action {
    box-sizing: border-box !important;
    flex: 0 0 150px !important;
    width: 150px !important;
    min-width: 150px !important;
    height: calc(var(--ar-control) - 2px) !important;
    min-height: calc(var(--ar-control) - 2px) !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #0866ff !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action + .facebook-account-primary-action {
    border-left: 1px solid rgba(255, 255, 255, .5) !important;
  }

  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action:not(:disabled):hover {
    background: #075bdc !important;
  }

  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action:disabled {
    border-color: transparent !important;
    background: #0866ff !important;
    color: rgba(255, 255, 255, .64) !important;
    opacity: 1 !important;
    box-shadow: none !important;
  }

  #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action + .facebook-account-primary-action:disabled {
    border-left-color: rgba(255, 255, 255, .5) !important;
  }

  @media (max-width: 900px) {
    #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps {
      max-width: 100% !important;
    }

    #view .facebook-account-toolbar-actions .facebook-account-onboarding-steps > .facebook-account-primary-action {
      flex: 1 1 150px !important;
    }
  }
}


/* Report detail live-control alignment: supersedes the earlier TailAdmin geometry. */
#app-shell #view .ad-data-live-controls:is(.is-single, .is-utm) {
  min-height: 36px !important;
  height: 36px !important;
  align-items: center !important;
}

#app-shell #view .ad-data-live-controls:is(.is-single, .is-utm) > div {
  display: inline-flex !important;
  align-self: center !important;
  align-items: center !important;
  min-height: 24px !important;
  margin-block: 0 !important;
}

#app-shell #view .ad-data-live-controls:is(.is-single, .is-utm) .status-pill,
#app-shell #view .ad-data-live-controls:is(.is-single, .is-utm) .facebook-live-switch {
  align-self: center !important;
  margin-block: 0 !important;
}

#app-shell #view .ad-data-live-controls:is(.is-single, .is-utm) .status-pill {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  line-height: 20px !important;
}

#app-shell #view .ad-data-live-controls.is-applovin > .ad-data-live-control-note {
  display: inline-flex !important;
  align-self: center !important;
  align-items: center !important;
  min-height: 24px !important;
  margin: 0 !important;
  color: #64748b !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}