/* Application-wide type and density scale derived from the compact navigation baseline. */
body.app-ui,
body.admin-ui {
    --ui-type-caption: 0.68rem;
    --ui-type-meta: 0.72rem;
    --ui-type-base: 0.78rem;
    --ui-type-body: 0.82rem;
    --ui-type-subtitle: 0.9rem;
    --ui-type-heading: 1rem;
    --ui-type-page: clamp(1.22rem, 1.55vw, 1.45rem);
    --ui-type-metric: clamp(1.35rem, 2vw, 1.72rem);
    --ui-line-compact: 1.15;
    --ui-line-body: 1.4;
}

/* Default content copy. */
body.app-ui .hybrid-content,
body.admin-ui .hybrid-content {
    font-size: var(--ui-type-body);
    line-height: var(--ui-line-body);
}

body.app-ui .hybrid-content :where(p, li, dd, address),
body.admin-ui .hybrid-content :where(p, li, dd, address),
body.app-ui .hybrid-content :where(.page-header__description, .card__description, .stat-card__description, .dashboard-tile__description, .feature-toggle-card__description),
body.admin-ui .hybrid-content :where(.page-header__description, .card__description, .stat-card__description, .dashboard-tile__description, .feature-toggle-card__description) {
    font-size: var(--ui-type-body);
    line-height: var(--ui-line-body);
}

/* Page and section hierarchy. */
body.app-ui .hybrid-content :where(.page-header__title, .page-header h1),
body.admin-ui .hybrid-content :where(.page-header__title, .page-header h1) {
    font-size: var(--ui-type-page);
    line-height: 1.1;
}

body.app-ui .hybrid-content :where(h2, .card__title, .tenant-card__title, .plan-card__title, .module-card__title, .feature-toggle-card__title, .audit-log-filters__title),
body.admin-ui .hybrid-content :where(h2, .card__title, .tenant-card__title, .plan-card__title, .module-card__title, .feature-toggle-card__title, .audit-log-filters__title) {
    font-size: var(--ui-type-heading);
    line-height: 1.2;
}

body.app-ui .hybrid-content h3,
body.admin-ui .hybrid-content h3 {
    font-size: var(--ui-type-subtitle);
    line-height: 1.25;
}

body.app-ui .hybrid-content h4,
body.admin-ui .hybrid-content h4 {
    font-size: var(--ui-type-body);
    line-height: 1.3;
}

/* Labels, metadata and compact supporting text. */
body.app-ui .hybrid-content :where(label, dt, .context-switcher__label, .page-header__eyebrow, .plan-card__eyebrow, .module-card__eyebrow, .audit-log-filters__eyebrow, .dashboard-tile__label, .stat-card__label, .owner-metric-tile__label),
body.admin-ui .hybrid-content :where(label, dt, .context-switcher__label, .page-header__eyebrow, .plan-card__eyebrow, .module-card__eyebrow, .audit-log-filters__eyebrow, .dashboard-tile__label, .stat-card__label, .owner-metric-tile__label) {
    font-size: var(--ui-type-meta);
    line-height: var(--ui-line-compact);
}

body.app-ui .hybrid-content :where(.muted, .section-note, .table-subline, .dropdown__meta, .feature-toggle-card__status, .feature-toggle-card__meta, .tenant-card__meta, .log-card__meta, small),
body.admin-ui .hybrid-content :where(.muted, .section-note, .table-subline, .dropdown__meta, .feature-toggle-card__status, .feature-toggle-card__meta, .tenant-card__meta, .log-card__meta, small) {
    font-size: var(--ui-type-meta);
    line-height: 1.35;
}

body.app-ui .hybrid-content :where(.badge, .context-switcher__badge, .admin-topbar__fact),
body.admin-ui .hybrid-content :where(.badge, .context-switcher__badge, .admin-topbar__fact) {
    font-size: var(--ui-type-caption);
    line-height: var(--ui-line-compact);
}

/* Form controls and actions use the same base size as navigation. */
body.app-ui .hybrid-content :where(button, .button, input, select, textarea, .form-input, .form-select, .form-textarea, .dropdown__item),
body.admin-ui .hybrid-content :where(button, .button, input, select, textarea, .form-input, .form-select, .form-textarea, .dropdown__item) {
    font-size: var(--ui-type-base);
    line-height: 1.3;
}

body.app-ui .hybrid-content :where(input:not([type='checkbox']):not([type='radio']), select, textarea, .form-input, .form-select, .form-textarea),
body.admin-ui .hybrid-content :where(input:not([type='checkbox']):not([type='radio']), select, textarea, .form-input, .form-select, .form-textarea) {
    padding: 0.56rem 0.68rem;
    border-radius: 8px;
}

body.app-ui .hybrid-content .button:not(.icon-button),
body.admin-ui .hybrid-content .button:not(.icon-button) {
    padding: 0.52rem 0.72rem;
    border-radius: 8px;
}

/* Tables follow the compact navigation density without sacrificing scanability. */
body.app-ui .hybrid-content .data-table,
body.admin-ui .hybrid-content .data-table {
    font-size: var(--ui-type-base);
    line-height: 1.3;
}

body.app-ui .hybrid-content .data-table th,
body.admin-ui .hybrid-content .data-table th {
    font-size: var(--ui-type-meta);
    line-height: var(--ui-line-compact);
}

body.app-ui .hybrid-content .data-table th,
body.app-ui .hybrid-content .data-table td,
body.admin-ui .hybrid-content .data-table th,
body.admin-ui .hybrid-content .data-table td {
    padding: 0.6rem 0.55rem;
}

/* Cards and page chrome keep spacing proportional to the reduced type scale. */
body.app-ui .hybrid-content .page-header,
body.admin-ui .hybrid-content .page-header {
    padding: 0.85rem;
}

body.app-ui .hybrid-content .card__header,
body.admin-ui .hybrid-content .card__header {
    padding: 0.85rem 0.85rem 0;
}

body.app-ui .hybrid-content :where(.card__body, .stat-card, .dashboard-tile, .plan-card, .module-card),
body.admin-ui .hybrid-content :where(.card__body, .stat-card, .dashboard-tile, .plan-card, .module-card) {
    padding: 0.85rem;
}

/* Metrics remain prominent, but use the same proportional scale. */
body.app-ui .hybrid-content :where(.dashboard-tile__value, .stat-card__value, .owner-metric-tile__value),
body.admin-ui .hybrid-content :where(.dashboard-tile__value, .stat-card__value, .owner-metric-tile__value) {
    font-size: var(--ui-type-metric);
    line-height: 1;
}

/* Secondary navigation-like controls inside pages. */
body.app-ui .hybrid-content :where(.tabs, .pagination, .breadcrumb, .filter-bar),
body.admin-ui .hybrid-content :where(.tabs, .pagination, .breadcrumb, .filter-bar) {
    font-size: var(--ui-type-base);
    line-height: 1.3;
}

body.app-ui .hybrid-content :where(code, kbd),
body.admin-ui .hybrid-content :where(code, kbd) {
    font-size: var(--ui-type-meta);
}

@media (max-width: 720px) {
    body.app-ui,
    body.admin-ui {
        --ui-type-body: 0.84rem;
        --ui-type-page: 1.22rem;
    }
}