.surface,
.metric-card {background: var(--surface);border: 1px solid var(--border);border-radius: var(--radius-lg);box-shadow: var(--shadow-soft);}
.surface {padding: var(--panel-padding);}
.metric-card {min-height: 142px;padding: var(--panel-padding);}
.metric-icon,
.empty-state-icon,
.placeholder-icon {display: inline-flex;align-items: center;justify-content: center;width: 40px;height: 40px;border-radius: var(--radius);color: var(--primary);background: var(--primary-light);font-size: 1.15rem;}
.metric-card p {margin: 14px 0 6px;color: var(--text-secondary);font-weight: 750;font-size: .9rem;}
.metric-card strong {display: block;margin-bottom: 5px;color: var(--text);font-size: 1.34rem;font-weight: 840;}
.metric-card span {color: var(--text-muted);font-size: .9rem;}
.status-pill {display: inline-flex;align-items: center;min-height: 26px;padding: 4px 10px;border-radius: 999px;font-weight: 820;font-size: .78rem;}
.status-pill.active {color: var(--primary-hover);background: var(--primary-light);}
.status-pill.inactive {color: var(--text-secondary);background: var(--surface-muted);}
.status-pill.danger {color: var(--danger);background: var(--danger-light);}
.empty-state,
.placeholder-surface {min-height: 260px;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 10px;text-align: center;}
.empty-state h2,
.placeholder-surface h2 {margin: 4px 0 0;color: var(--text);font-size: 1.25rem;font-weight: 820;}
.empty-state p,
.placeholder-surface p {max-width: 500px;margin: 0;color: var(--text-secondary);}
.ft-surface {color: var(--text);background-color: var(--surface);border-color: var(--border);border-radius: var(--radius-lg);}
.ft-indicator {font-variant-numeric: tabular-nums;}
.ft-indicator strong {font-size: var(--font-size-metric);font-weight: var(--font-weight-heading);}
.ft-status {display: inline-flex;align-items: center;max-width: 100%;gap: var(--space-1);padding: 4px 10px;border-radius: var(--radius-pill);font-size: var(--font-size-small);font-weight: var(--font-weight-control);line-height: 1.4;overflow-wrap: anywhere;}
.ft-empty:not(.empty-state) {color: var(--text-secondary);font-size: var(--font-size-control);line-height: var(--line-height);overflow-wrap: anywhere;}
.ft-data-table {font-variant-numeric: tabular-nums;}
.ft-pagination,
.pagination {display: flex;align-items: center;flex-wrap: wrap;gap: var(--space-2);margin-block: var(--space-4);}
.pagination {--bs-pagination-color: var(--primary-hover);--bs-pagination-bg: var(--surface);--bs-pagination-border-color: var(--border-strong);--bs-pagination-hover-color: var(--primary-hover);--bs-pagination-hover-bg: var(--primary-light);--bs-pagination-active-color: var(--button-ink);--bs-pagination-active-bg: var(--button-fill);--bs-pagination-active-border-color: var(--primary);--bs-pagination-disabled-color: var(--text-muted);--bs-pagination-disabled-bg: var(--surface-muted);--bs-pagination-disabled-border-color: var(--border);}
.page-link {min-width: var(--control-height);min-height: var(--control-height);display: grid;place-items: center;}
.page-link:focus-visible {outline: 3px solid var(--focus);outline-offset: 3px;}
.ft-filters :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),select) {min-height: var(--control-height);max-width: 100%;}
.ft-filters :is(input,select,button):focus-visible {outline: 3px solid var(--focus);outline-offset: 3px;}