apps/desktop/src/renderer/styles/settings/about.css

/* About and data-portability settings. */
/* Astryx convergence: the page container is the kit's SettingsPage now —
   the About-only `.settingsAboutPage` grid (16px rhythm, breaking the shared
   32px page rhythm) is retired. */

.settingsAboutHero {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: var(--space-4);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.settingsAboutLogo {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  /* Square icon plate — ratio-governed, see --radius-plate. */
  border-radius: var(--radius-plate);
  background: oklch(from var(--brand-deep) l c h / 0.10);
  color: var(--brand-deep);
}

.settingsAboutHeading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2-5);
  margin: 0 0 var(--space-1);
}

.settingsAboutHeading h2 {
  font: var(--maka-text-heading-2);
  margin: 0;
  color: var(--foreground);
  letter-spacing: var(--tracking-normal);
}

/* #1879: both hero pills are Astryx `Badge`s, and neither has a product rule
   left. The version keeps the mono stack — a version string is read digit by
   digit — but takes it from being a `<code>` inside the badge rather than from
   a rule here: `:where(code, kbd, samp, pre)` in maka-tokens.css is the one
   monospace authority in the renderer, and it composes the roles a second time
   against that family, so nothing else about the badge's type moves. The
   channel pill was a hand-tinted `--brand-deep` wash; `blue` is the tinted
   variant that keeps it distinguishable from the neutral version pill. */

.settingsAboutTagline {
  font: var(--maka-text-body);
  margin: 0;
  color: var(--foreground-secondary);
}