/* Round 1, rule 2: small type, tight rhythm, eyebrow labels.
   Vertical space separates groups; it never decorates.

   Scoped to the app screens. A marketing page keeps a heading you can see from
   across the room, because that is its job (owner, 2026-09-23). */

/* Eyebrows are the label style everywhere they appear, app or not. */
.guide-label,
.kv-label,
.eyebrow {
  font-size: var(--fs-label);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted);
}

.mono, code, pre, .tnum { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; }
.code-block, pre.code-block { font-size: .76rem; background: #f8f9fb; border: 1px solid var(--border);
                              border-radius: var(--radius); padding: .7rem .8rem; }

body.app-page,
body.admin-page,
body:has(.console-shell) {
  h1 { font-size: 1.15rem; font-weight: 650; letter-spacing: -.01em; margin: 0 0 .5rem; }
  h2 { font-size: var(--fs-title); font-weight: 650; margin: 0 0 .5rem; }
  h3 { font-size: .87rem; font-weight: 650; margin: 0 0 .35rem; }

  main > p, main > ul, main > ol, main > blockquote, main > h2 + p { max-width: 58rem; }
  .prose { max-width: 46rem; }

  p { margin: 0 0 .6rem; }
  .lede { font-size: .92rem; color: var(--muted); max-width: 58rem; }
  small, .small { font-size: .76rem; }

  /* Section spacing is 16px, not 32 to 64. */
  section + section,
  .console-section { margin-top: var(--gap); }

  hr { border: 0; border-top: 1px solid var(--border); margin: var(--gap) 0; }
}

.muted { color: var(--muted); }