/* =========================================================
   TOF AI Typography System

   Manrope carries human-facing interface and prose.
   IBM Plex Mono carries machine-facing identity and data.
   Page-specific layout remains in application.css; this file
   is the single authority for typographic roles and rhythm.
========================================================= */

/* 1. Foundations */
:root {
  --font-family-ui: "Manrope", "Aptos", "Segoe UI Variable", "Segoe UI", sans-serif;
  --font-family-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  --type-display: clamp(2.1rem, 3.8vw, 3.25rem);
  --type-page-title: clamp(1.85rem, 2.7vw, 2.6rem);
  --type-section-title: clamp(1.22rem, 1.7vw, 1.52rem);
  --type-subsection-title: 1.04rem;
  --type-body: 0.95rem;
  --type-prose: clamp(1rem, 0.25vw + 0.94rem, 1.08rem);
  --type-navigation: 1rem;
  --type-control: 0.875rem;
  --type-meta: 0.75rem;
  --type-eyebrow: 0.69rem;

  --leading-display: 1.04;
  --leading-heading: 1.18;
  --leading-body: 1.55;
  --leading-compact: 1.32;

  --tracking-display: -0.038em;
  --tracking-heading: -0.022em;
  --tracking-body: -0.006em;
  --tracking-label: 0.105em;
}

/* 2. Global text rendering */
html {
  font-family: var(--font-family-ui);
  font-size: 16px;
  text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-family-ui);
}

body {
  font-size: var(--type-body);
  font-weight: var(--font-weight-regular);
  line-height: var(--leading-body);
  letter-spacing: var(--tracking-body);
  font-kerning: normal;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font-size: var(--type-control);
  letter-spacing: -0.008em;
}

strong,
b {
  font-weight: var(--font-weight-bold);
}

/* 3. Headings and editorial hierarchy */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-family-ui);
  font-optical-sizing: auto;
  text-wrap: balance;
}

h1 {
  font-size: var(--type-page-title);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
}

h2 {
  font-size: var(--type-section-title);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}

h3 {
  font-size: var(--type-subsection-title);
  font-weight: var(--font-weight-semibold);
  line-height: 1.24;
  letter-spacing: -0.014em;
}

h4,
h5,
h6 {
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-compact);
  letter-spacing: -0.01em;
}

.conversation-index-hero h1,
.projects-section-card--landing h3 {
  font-size: var(--type-display);
  font-weight: var(--font-weight-medium);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
}

.dashboard-hero h1,
.tasks-dashboard-hero h1,
.organization-page-header h1,
.mailbox-main__heading h1,
.settings-log-hero h1,
.user-memories-header h1,
.memories-page h1,
.vision-workspace-header h1 {
  font-size: var(--type-page-title);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
}

.settings-log-section-card > h2,
.settings-log-section-header h2,
.projects-section-card > h2,
.dashboard-card > h2,
.memories-page h2,
.mailbox-main h2 {
  font-size: var(--type-section-title);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--tracking-heading);
}

/* 4. Navigation, controls, and compact interface copy */
.navbar-button,
.secondary-navbar-link,
.action-bar-label,
.mailbox-nav__link,
.conversation-index-filter,
.settings-log-filter-button,
.settings-log-filter-reset {
  font-size: var(--type-control);
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.012em;
}

.navbar-link,
.global-navigation-link strong {
  font-size: var(--type-navigation);
  font-weight: var(--font-weight-semibold);
  line-height: 1.3;
  letter-spacing: -0.018em;
}

.navbar-user,
.mailbox-main__heading p,
.conversation-index-copy small,
.dashboard-hero-copy,
.organization-page-header p,
.settings-log-hero p {
  font-size: var(--type-control);
  line-height: 1.48;
  letter-spacing: -0.008em;
}

/* 5. Shared section labels */
.conversation-code-builder-status-eyebrow,
.conversation-notification-panel-eyebrow,
.conversation-workflow-status-eyebrow,
.dashboard-calendar-detail-eyebrow,
.dashboard-card-eyebrow,
.dashboard-eyebrow,
.deep-synthesis-failure-eyebrow,
.home-utility-queue-eyebrow,
.project-final-deliverable-attachment__eyebrow,
.project-hil-callout__eyebrow,
.project-hil-request__eyebrow,
.projects-final-deliverable-summary__eyebrow,
.settings-log-section-eyebrow,
.temporal-hil-receipt__eyebrow,
.temporal-hil-review__eyebrow,
.user-memories-eyebrow,
.vision-workspace-eyebrow {
  font-family: var(--font-family-ui);
  font-size: var(--type-eyebrow);
  font-weight: var(--font-weight-bold);
  line-height: 1.25;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}

/* 6. Conversation reading surface */
.conversation-heading-row h3,
.conversation-research-title-link {
  font-size: clamp(1.24rem, 1.45vw, 1.52rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.16;
  letter-spacing: var(--tracking-heading);
}

.conversation-transcript .message-user .message-bubble,
.conversation-transcript .message-user .message-markdown,
.conversation-transcript .message-assistant .message-bubble,
.conversation-transcript .message-assistant .message-markdown {
  font-family: var(--font-family-ui);
  font-size: var(--type-prose);
  line-height: 1.62;
  letter-spacing: -0.009em;
}

.conversation-transcript .message-markdown h2,
.conversation-transcript .message-markdown h3,
.conversation-transcript .message-markdown h4 {
  line-height: 1.28;
  letter-spacing: -0.016em;
}

.message-role {
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.012em;
}

/* 7. Machine-readable data and operational metadata */
code,
pre,
kbd,
samp,
.conversation-index-marker,
.conversation-ticker,
.projects-project-heading-ticker,
.run-payload-code,
.blueprint-editor-input,
.settings-log-table code,
.jobs-entry-contract-call code,
.message-markdown code {
  font-family: var(--font-family-mono);
  font-variant-ligatures: none;
  letter-spacing: -0.015em;
}

.message-timestamp,
.conversation-runtime-alert-meta,
.conversation-workflow-alert-meta,
.conversation-workflow-status-event-meta,
.home-utility-queue-meta,
.dashboard-activity-meta,
.settings-activity-meta,
.memories-metric-value,
.settings-log-section-stat,
.dashboard-card-stat,
.mailbox-row__meta,
.mailbox-toolbar__count,
.mailbox-main__counts,
.settings-log-table th,
.settings-log-table td {
  font-variant-numeric: tabular-nums;
}

.conversation-ticker,
.projects-project-heading-ticker,
.message-timestamp,
.conversation-runtime-alert-meta,
.conversation-workflow-alert-meta,
.conversation-workflow-status-event-meta,
.home-utility-queue-meta,
.settings-activity-meta,
.mailbox-row__meta {
  font-family: var(--font-family-mono);
  font-size: var(--type-meta);
  line-height: var(--leading-compact);
}

.settings-log-table th,
.settings-log-table td,
.jobs-capability-detail-grid,
.organization-scope-audit-meta-grid {
  font-size: 0.79rem;
  line-height: 1.42;
}

.settings-log-table th,
.jobs-capability-detail-label,
.organization-scope-audit-meta-label,
.memories-metric-label {
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.065em;
}

/* 8. Responsive type compression */
@media (max-width: 700px) {
  :root {
    --type-display: clamp(1.9rem, 10vw, 2.55rem);
    --type-page-title: clamp(1.62rem, 8vw, 2.05rem);
    --type-section-title: 1.2rem;
    --type-prose: 1rem;
  }

  .navbar-link,
  .secondary-navbar-link {
    font-size: 0.82rem;
  }

  .conversation-heading-row h3,
  .conversation-research-title-link {
    font-size: 1.2rem;
  }

  .home-utility-queue-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .home-utility-queue-header > div:first-child,
  .home-utility-queue-actions,
  .home-utility-queue-counts {
    min-width: 0;
  }

  .home-utility-queue-actions,
  .home-utility-queue-counts {
    justify-content: flex-start;
  }

  .home-utility-queue-counts span {
    min-width: 0;
    white-space: normal;
  }
}