/* Shared type scale for the 840px workspace, forms and drawers. */
:root {
  --type-caption:11px;
  --type-small:12px;
  --type-body:13px;
  --type-input:14px;
  --type-subheading:15px;
  --type-card-title:17px;
  --type-section:18px;
  --type-page:28px;
  --type-metric:28px;
}
body { font-size:var(--type-body);line-height:1.6; }
#app h1,#overlay h1 { font-size:var(--type-page);line-height:1.3;font-weight:650;letter-spacing:-.7px; }
#app h2,#overlay h2 { font-size:var(--type-section);line-height:1.45;font-weight:600;letter-spacing:-.3px; }
#app h3,#overlay h3 { font-size:var(--type-subheading);line-height:1.5;font-weight:600;letter-spacing:-.15px; }
#app p,#overlay p { line-height:1.75; }
#app small,#overlay small { font-size:var(--type-small);line-height:1.6; }
#app :is(.page-heading p,.offer-editor-heading p,.product-description,.product-summary p,.offer-body>p,.settings-section>p,.billing-banner p,.plan-card p,.empty-state p),
#overlay :is(.body-copy,.help-step p,.creation-spec p) { font-size:var(--type-body);line-height:1.75; }
#app :is(.eyebrow,.workspace-label),#overlay .eyebrow { font-size:var(--type-caption);line-height:1.5;letter-spacing:1.2px; }

/* Navigation and secondary labels stay compact, but readable. */
#app .sidebar .nav-item { font-size:var(--type-body);line-height:1.5; }
#app .sidebar .store-select :is(.system-select-trigger,.system-select-menu,.system-select-option),
#app .sidebar .store-create-action { font-size:var(--type-body);line-height:1.5; }
#app .sidebar .workspace-label { font-size:var(--type-caption); }
#app .profile strong { font-size:var(--type-small);line-height:1.5; }
#app .profile small { font-size:var(--type-caption);line-height:1.5; }
#app .credit-card span { font-size:var(--type-caption);line-height:1.5; }
#app :is(.avatar,.workspace-avatar) { font-size:var(--type-caption); }
.account-menu-heading { font-size:var(--type-caption);line-height:1.5; }
.account-menu :is([role=menuitem],[role=menuitemcheckbox]) { font-size:var(--type-body);line-height:1.5; }
#app .mobile-navigation>span { font-size:var(--type-small);line-height:1.5; }
#app .footer { font-size:var(--type-caption);line-height:1.6;gap:16px;flex-wrap:wrap; }

/* Buttons, tabs and every form share the same labels and control sizes. */
#app :is(.btn,.text-btn,.tab,.chip),#overlay :is(.btn,.text-btn,.tab,.chip),
#app .recommendation-list .decision-actions .btn { font-size:var(--type-small);line-height:1.5; }
#app .btn.small,#overlay .btn.small { font-size:var(--type-caption); }
#app .tab { min-height:40px; }
#app .tab span { font-size:var(--type-caption);line-height:1.5; }
#app .badge,#overlay .badge,#app .count-badge { font-size:var(--type-caption);line-height:1.45; }
#app .field>span,#overlay .field>span { font-size:var(--type-small);line-height:1.5; }
#app .field small,#overlay .field small { font-size:var(--type-small);line-height:1.6; }
#app :is(.field,.product-settings,.offer-form) :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,select,.system-select-trigger),
#overlay .field :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,select,.system-select-trigger) { font-size:var(--type-input);line-height:1.5; }
#app :is(.search-field input,.system-select-trigger),#overlay .system-select-trigger,.system-select-menu { font-size:var(--type-body);line-height:1.5; }
#app .date-picker .system-select-trigger { font-size:var(--type-small); }
#app :is(.form-error,.offer-field-error,.queue-error,.offer-notice),#overlay .form-error { font-size:var(--type-small);line-height:1.65; }
#app :is(.demo-notice,.queue-demo,.inline-info,.offer-save>span,.asset-upload-hint,.asset-preparation),
#overlay :is(.demo-notice,.inline-info) { font-size:var(--type-small);line-height:1.65; }
#app :is(.tiny,.toolbar>.muted,.filter-row>.tiny,.recommendation-workspace .filter-row>.tiny) { font-size:var(--type-small);line-height:1.6; }

/* Performance labels and charts must remain legible without crowding values. */
#app .stat-label { font-size:var(--type-small);line-height:1.5;gap:8px; }
#app .stat-label>svg { flex-shrink:0;color:var(--muted); }
#app .stat-card { min-width:0;container-type:inline-size;padding-top:16px; }
#app .stat-value { margin:8px 0 12px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1.3em 24px;gap:9px;font-size:clamp(20px,18cqi,var(--type-metric));line-height:1.3;letter-spacing:-.7px; }
#app .stat-value>.stat-number { display:block;min-width:0;margin:0;white-space:nowrap;font-size:inherit;font-variant-numeric:tabular-nums; }
#app .stat-number>.stat-unit { font-size:.7em;margin-left:2px; }
#app .stat-value>.sparkline { width:100%;height:24px;min-width:0;margin:0; }
#app .stat-foot { font-size:var(--type-caption);line-height:1.5;white-space:normal;flex-wrap:wrap;gap:4px 7px; }
#app .trend { font-size:var(--type-caption);line-height:1.5; }
#app .metric-note { font-size:var(--type-caption);line-height:1.7;flex-wrap:wrap; }
#app :is(.trend-header p,.trend-legend,.trend-axis,.trend-dates,.trend-caption,.chart-legend,.performance-chart text) { font-size:var(--type-caption);line-height:1.6; }
#app .trend-axis { min-width:48px; }
#app .trend-header { align-items:flex-start;flex-wrap:wrap;gap:16px; }
#app .trend-legend { gap:12px; }
#app .trend-dates { gap:8px; }
#app .recommendation-summary h2 { font-size:var(--type-subheading);line-height:1.5; }
#app .recommendation-summary p { font-size:var(--type-small);line-height:1.65; }

/* Recommendations retain one clear title, explanation and action row. */
#app .recommendation-list .decision-card h2.rec-title { font-size:var(--type-card-title);line-height:1.5;letter-spacing:-.2px; }
#app .recommendation-list .decision-card .rec-content>p { font-size:var(--type-body);line-height:1.75; }
#app :is(.rec-entity,.rec-meta,.recommendation-list .decision-card .rec-evidence,.history-row p,.queue-row small,.queue-row-change) { font-size:var(--type-small);line-height:1.65; }
#app .recommendation-list .decision-change { font-size:var(--type-body);line-height:1.5; }
#app .recommendation-list .decision-change strong { font-size:var(--type-subheading);line-height:1.5; }
#app .recommendation-list .decision-change small { font-size:var(--type-small); }
#app :is(.history-row strong,.queue-row strong) { font-size:var(--type-body);line-height:1.6; }
#app .history-row { flex-wrap:wrap; }

/* Product lists, landing pages and asset details. */
#app .product-list-summary>strong { font-size:var(--type-card-title);line-height:1.5; }
#app .product-list-summary>span:not(.product-meta) { font-size:var(--type-body);line-height:1.7; }
#app :is(.product-meta,.product-page-market,.product-page-name>a,.offer-landing-row small,.offer-image-layout p,.offer-form .field>small,.offer-additional>summary,.asset-grid small) { font-size:var(--type-small);line-height:1.65; }
#app :is(.product-page-name>strong,.offer-landing-row strong,.product-assets .offer-asset-name) { font-size:var(--type-body);line-height:1.6; }
#app .offer-landing-row span { font-size:var(--type-body);line-height:1.65; }
#app .offer-image-section h3,#app .offer-ad-goals h3 { font-size:var(--type-subheading);line-height:1.5; }

/* Campaign tables and their detail drawers. */
#app table,#overlay table { font-size:var(--type-small);line-height:1.6; }
#app th,#overlay th { font-size:var(--type-caption);line-height:1.5; }
#app td small,#overlay td small { font-size:var(--type-caption);line-height:1.6; }
#app .table-link { font-size:var(--type-body);line-height:1.5; }
#overlay .drawer-header h2 { font-size:22px;line-height:1.4;letter-spacing:-.4px; }
#overlay :is(.details-list,.drill-row,.launch-option,.permission-row) { font-size:var(--type-body);line-height:1.6; }
#overlay :is(.detail-context small,.drill-row small,.launch-option small,.evidence-grid span,.change-box>div span,.preview-brand small,.utm-box,.utm-box code) { font-size:var(--type-small);line-height:1.65; }
#overlay :is(.detail-context strong,.preview-brand strong,.preview-caption strong) { font-size:var(--type-subheading);line-height:1.5; }
#overlay .evidence-grid strong { font-size:22px;line-height:1.4; }
#overlay .details-list { grid-template-columns:minmax(100px,140px) minmax(0,1fr); }
#overlay .creation-quote small { font-size:var(--type-small); }

/* Store creation and settings share the same type scale as product forms. */
#app #business-setup { font-size:var(--type-body);line-height:1.65; }
#app #business-setup h1 { font-size:var(--type-page);line-height:1.3; }
#app #business-setup h2 { font-size:var(--type-section);line-height:1.45; }
#app #business-setup p { font-size:var(--type-body);line-height:1.75; }
#app #business-setup :is(.nb-help,.nb-note,.nb-source-note,.nb-status,.nb-choice small,.nb-signal small,.nb-badge,.nb-error,.nb-field>span,.nb-check,summary) { font-size:var(--type-small);line-height:1.65; }
#app #business-setup .nb-eyebrow { font-size:var(--type-caption);line-height:1.5;letter-spacing:1.2px; }
#app #business-setup :is(.nb-steps,.nb-steps li,.nb-steps span,.nb-button) { font-size:var(--type-small);line-height:1.5; }
#app #business-setup :is(.nb-choice,.nb-choice strong,.nb-row,.nb-signal,.nb-event-map) { font-size:var(--type-body);line-height:1.6; }
#app #business-setup :is(input:not([type=checkbox]):not([type=hidden]),select,.system-select-trigger) { font-size:var(--type-input);line-height:1.5; }
#app #business-setup .nb-code-field { font-size:var(--type-caption); }
#app #business-setup :is(.nb-help,.nb-note) { font-size:var(--type-small); }
#app #business-setup.store-creation-flow>.demo-notice { font-size:var(--type-small);line-height:1.65; }

/* People, access and billing are account-level pages with the same hierarchy. */
#app :is(.user-row strong,.user-grant-heading>strong,.user-access-summary,.user-preview-note p,.user-permissions,.switch-row,.connection-row,.permission-row) { font-size:var(--type-body);line-height:1.6; }
#app :is(.user-row small,.user-access-summary>span:last-child,.user-preview-note,.member-row small,.business-setting-summary) { font-size:var(--type-small);line-height:1.65; }
#app .plan-card h3 { font-size:var(--type-section);line-height:1.45; }
#app :is(.plan-card li,.plan-card>strong,.plan-price span,.billing-banner>div:last-child>span) { font-size:var(--type-small);line-height:1.7; }
#app .plan-price,#app .billing-banner>div:last-child>strong { font-size:32px;line-height:1.3;letter-spacing:-.6px; }
#toast { font-size:var(--type-body);line-height:1.65; }

@media(max-width:640px) {
  :root { --type-page:24px;--type-card-title:16px;--type-metric:26px; }
  #app :is(.field,.product-settings,.offer-form) :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,select,.system-select-trigger),
  #app #business-setup :is(input:not([type=checkbox]):not([type=hidden]),select,.system-select-trigger),
  #overlay .field :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,select,.system-select-trigger) { font-size:16px; }
  #app .heading-actions { flex-wrap:wrap;max-width:100%; }

  #app .recommendation-workspace .filter-row { flex-wrap:wrap;gap:12px; }
  #app .recommendation-workspace .filter-row>.tiny { flex-basis:100%; }
  #app .recommendation-workspace .chips { flex-wrap:wrap; }
  #app .recommendation-list .decision-actions>div:last-child { flex-wrap:wrap;gap:8px; }
  #app .trend-dates { flex-wrap:wrap;row-gap:4px; }
  #app #business-setup.store-creation-flow .nb-steps { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px; }
  #app #business-setup.store-creation-flow .nb-steps li { align-items:flex-start;min-height:50px; }
  #app .footer { row-gap:8px; }
}
@media(pointer:coarse) {
  #app :is(.field,.offer-form,.product-settings) :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,.system-select-trigger),
  #app #business-setup :is(input:not([type=checkbox]):not([type=hidden]),.system-select-trigger),
  #overlay .field :is(input:not([type=hidden]):not([type=file]):not([type=checkbox]),textarea,.system-select-trigger) { font-size:16px; }
}

/* Card titles double as compact metric pickers, using the shared dropdown menu. */
#app .stat-label .system-select { flex:1;min-width:0; }
#app .stat-label .system-select-trigger { min-height:22px;padding:0;border:0;border-radius:3px;background:transparent;box-shadow:none;gap:6px;color:var(--muted);font-size:var(--type-small);line-height:1.5; }
#app .stat-label .system-select-trigger:hover,#app .stat-label .system-select-trigger[aria-expanded="true"] { color:var(--primary);background:transparent;box-shadow:none; }
#app .stat-label .system-select-value { white-space:normal; }
#app .stat-label .system-select-arrow { width:5px;height:5px;margin-right:2px; }
@media(pointer:coarse) { #app .stat-label .system-select-trigger { min-height:44px; } }


#app .trend.positive { color:var(--success); }
#app .trend.negative { color:var(--action-error,#a64747); }
#app .trend.neutral { color:var(--muted); }