/* Selected A3 type scale. Keep layouts and control hit areas at their real size;
   do not simulate smaller text with browser zoom or transform: scale(). */
body[data-ui="studio_signal"] {
  --type-display: clamp(38px, 3.8vw, 52px);
  --type-page: clamp(24px, 2.3vw, 28px);
  --type-section: clamp(22px, 2.1vw, 28px);
  --type-card: 18px;
  --type-subheading: 16px;
  --type-body: 13px;
  --type-intro: 14px;
  --type-control: 12px;
  font-size: var(--type-body);
}

/* Homepage: same composition, less oversized headlines. */
body[data-ui="studio_signal"] .signal-hero h1 {
  font-size: var(--type-display);
  line-height: 1.18;
  margin-bottom: 18px;
}
body[data-ui="studio_signal"] .signal-subtitle { font-size: var(--type-intro); }
body[data-ui="studio_signal"] .signal-section-heading h2 { font-size: var(--type-section); }
body[data-ui="studio_signal"] .signal-step-copy h3 { font-size: 17px; }
body[data-ui="studio_signal"] :is(.signal-track h2, .signal-closing h2) { font-size: 23px; }
body[data-ui="studio_signal"] .signal-hero { min-height: 470px; }
body[data-ui="studio_signal"] .signal-hero-copy { padding-top: 64px; padding-bottom: 56px; }

/* Shared navigation and buttons. Already-small captions and illustration labels
   retain their size; data and instructions should not become microcopy. */
body[data-ui="studio_signal"] .brand { font-size: 18px; }
body[data-ui="studio_signal"] .nav-item { font-size: 12px; }
body[data-ui="studio_signal"] :is(.button, .primary, .download-link,
  .signal-actions .button, .signal-closing .button) { font-size: var(--type-control); }
body[data-ui="studio_signal"] :is(.account-menu a, .account-menu button) { font-size: 12px; }

/* Workspace, rules, FAQ, CLI/API documentation and account pages. */
body[data-ui="studio_signal"] .page-title,
body[data-ui="studio_signal"] .workspace-content > header:not(.page-heading) h1,
body[data-ui="studio_signal"] .card h1 { font-size: var(--type-page); }
body[data-ui="studio_signal"] .page-description,
body[data-ui="studio_signal"] .workspace-content > header:not(.page-heading) .lede,
body[data-ui="studio_signal"] .leaderboard-scope { font-size: var(--type-body); }
body[data-ui="studio_signal"] .section-heading h2,
body[data-ui="studio_signal"] .track-card h2 { font-size: 23px; }
body[data-ui="studio_signal"] :is(.card h2, .docs-card h2, .principle h2) { font-size: var(--type-card); }
body[data-ui="studio_signal"] :is(.docs-card h3, .step-card h3, .principle h3) { font-size: var(--type-subheading); }
body[data-ui="studio_signal"] .panel-head :is(h2, h3) { font-size: 16px; }
body[data-ui="studio_signal"] .empty :is(h2, h3) { font-size: 20px; }
body[data-ui="studio_signal"] .rules-document > summary { font-size: 13px; }
body[data-ui="studio_signal"] .leaderboard-data .strategy strong { font-size: 13px; }
body[data-ui="studio_signal"] .leaderboard-data .rank { font-size: 13px; }
body[data-ui="studio_signal"] .leaderboard-data .metric { font-size: 12px; }

/* Authentication and account forms use the same compact hierarchy. */
body[data-ui="studio_signal"] .agent-auth-copy h1,
body[data-ui="studio_signal"] .auth-story h1 { font-size: clamp(26px, 2.6vw, 34px); }
body[data-ui="studio_signal"] .agent-auth-copy p { font-size: var(--type-intro); }
body[data-ui="studio_signal"] .image-auth-form :is(h1, h2),
body[data-ui="studio_signal"] .auth-card :is(h1, h2) { font-size: 24px; }
body[data-ui="studio_signal"] .field label { font-size: 12px; }
body[data-ui="studio_signal"] :is(input, select, textarea) { font-size: 13px; }

@media (max-width: 800px) {
  body[data-ui="studio_signal"] { --type-display: 40px; }
  body[data-ui="studio_signal"] .signal-hero { min-height: 490px; }
  body[data-ui="studio_signal"] .signal-hero-copy { padding-top: 40px; padding-bottom: 40px; }
}

@media (max-width: 580px) {
  body[data-ui="studio_signal"] {
    --type-display: clamp(32px, 8.7vw, 36px);
    --type-page: 24px;
    --type-section: 24px;
    --type-intro: 13px;
  }
  body[data-ui="studio_signal"] .signal-hero { min-height: 580px; }
  body[data-ui="studio_signal"] .signal-hero-copy { padding-top: 28px; padding-bottom: 270px; }
  body[data-ui="studio_signal"] :is(.signal-track h2, .signal-closing h2,
    .section-heading h2, .track-card h2) { font-size: 22px; }
  /* Keep mobile entry fields large enough for comfortable typing and to avoid
     browser auto-zoom; this does not enlarge surrounding labels or buttons. */
  body[data-ui="studio_signal"] .field :is(input, select, textarea),
  body[data-ui="studio_signal"] .card form > div > :is(input, select, textarea) { font-size: 16px; }
}
