@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Space+Mono:wght@400;700&family=Inter:wght@300;400;500&display=swap');

/* Shared screen typography for the FAQ, manuals and Engineering Overview. */
@media screen {
  :root {
    --muted: #aeb9d0;
    --body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --sans: 'Space Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --mono: 'Space Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
  }

  body { font-size: 16px; line-height: 1.75; }
  .layout { grid-template-columns: 242px minmax(0, 1fr); }
  .main { min-width: 0; }
  .hero-sub { color: #bec9dc; line-height: 1.75; }
  .section { margin-bottom: 64px; }
  .section-header { align-items: flex-start; margin-bottom: 14px; }
  .section-header h2, .section > h2 {
    font-size: clamp(24px, 2.4vw, 30px);
    line-height: 1.25;
    letter-spacing: -0.025em;
    margin-bottom: 0;
  }
  .section > h2 { margin-bottom: 14px; }
  .section > h3 { font-size: 18px; line-height: 1.4; margin: 28px 0 12px; }
  .section > p, .section li { font-size: 15px; line-height: 1.75; color: #d0d9e7; }
  .section > p { margin-bottom: 16px; max-width: 75ch; }
  .section li { margin-block: 6px; }
  .section-desc { font-size: 14px; line-height: 1.7; }
  .section-divider { margin-bottom: 24px; }
  .card, .doc-card { padding: 20px; }
  .card p, .card li, .doc-card p { font-size: 14px; line-height: 1.75; color: #d0d9e7; }
  .card h3 { line-height: 1.5; }
  .callout, .note-box, .version-note { font-size: 14px; line-height: 1.75; }
  .callout strong, .note-box strong, .kicker, .cmd-field label { font-size: 11px; line-height: 1.6; }
  .cmd-grid { gap: 14px; }
  .cmd-header { padding: 16px; flex-wrap: wrap; align-items: flex-start; }
  .cmd-main { flex-wrap: wrap; gap: 6px 12px; }
  .cmd-name { white-space: normal; overflow-wrap: anywhere; font-size: 14px; }
  .cmd-action { white-space: normal; overflow: visible; text-overflow: clip; font-size: 14px; }
  .cmd-badges { flex-wrap: wrap; }
  .cmd-body { padding-bottom: 18px; }
  .cmd-body-inner { padding-top: 16px; gap: 16px 24px; }
  .cmd-field p { font-size: 14px; line-height: 1.75; }
  .sidebar a { font-size: 13px; line-height: 1.6; padding-block: 10px; }
  .sidebar-label, .nav-section-title, .sidebar .manual-meta { font-size: 11px; line-height: 1.6; }
  .hero-stat .label, .legend-bar span, .footer p, .doc-footer { font-size: 12px; line-height: 1.65; }
  #search { font-size: 14px; line-height: 1.5; padding: 10px 12px; }
  .mini { font-size: 12px !important; line-height: 1.7; }
  table, .quick-table, .update-table, .data-table { font-size: 14px; line-height: 1.65; }
  table th, .quick-table th, .update-table th, .data-table th { font-size: 11px; line-height: 1.6; }
  .quick-table .ctx, .quick-table .say { font-size: 13px; }
  .principle span { font-size: 14px; line-height: 1.75; }
  .sidebar-label { color: var(--muted); }
  .hero-links a, .main a { color: #bdd8ff; }
  .hero-links a:hover, .main a:hover { color: #fff; }

  @media (max-width: 790px) {
    .layout { display: block; }
    .sidebar { position: static; height: auto; }
    .section-header h2, .section > h2 { font-size: 24px; }
    .section { margin-bottom: 48px; }
  }
}