/* Minimal element defaults. Consumers get correct type and color without extra work. */
body {
  background: var(--tn-surface-page);
  color: var(--tn-text-primary);
  font-family: var(--tn-font-body);
  font-size: var(--tn-size-body);
  line-height: var(--tn-leading-body);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--tn-font-display);
  font-weight: var(--tn-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tn-track-display);
  margin: 0;
}
a { color: var(--tn-text-primary); text-decoration: none; border-bottom: 1px solid var(--tn-signal); }
a:hover { color: var(--tn-signal); border-bottom-color: var(--tn-signal); }
*, *::before, *::after { border-radius: var(--tn-radius); box-sizing: border-box; }