/* Базовые правила и служебные keyframes. */
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: var(--line-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--font-heading); line-height: var(--line-heading); margin: 0; }
h1 { font-size: var(--font-size-h1); font-weight: var(--weight-h1); }
h2 { font-size: var(--font-size-h2); font-weight: var(--weight-heading); }
h3 { font-size: var(--font-size-h3); font-weight: var(--weight-heading); }
p { margin: 0; }
a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
a:hover { color: var(--link-hover); }

/* Видимый фокус — всегда trust */
.bt-focusable:focus-visible {
  outline: var(--focus-width) solid var(--focus-ring);
  outline-offset: var(--focus-offset);
}

@keyframes bt-spin { to { transform: rotate(360deg); } }
@keyframes bt-shimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}
@keyframes bt-dot {
  0%, 80%, 100% { opacity: 0.25; }
  40% { opacity: 1; }
}
@keyframes bt-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(30, 95, 204, 0.35); }
  50% { box-shadow: 0 0 0 6px rgba(30, 95, 204, 0); }
}