:root {
  --sos-bg: #050608;
  --sos-surface: #0d0f12;
  --sos-surface-elevated: #14171b;
  --sos-text: #f5f6f7;
  --sos-muted: #a5abb3;
  --sos-line: rgba(255, 255, 255, 0.13);
  --sos-focus: #ffffff;
  --sos-success: #6ee7a8;
  --sos-warning: #ffd166;
  --sos-danger: #ff6b6b;
  --sos-radius-sm: 10px;
  --sos-radius-md: 16px;
  --sos-radius-lg: 24px;
  --sos-space-1: .25rem;
  --sos-space-2: .5rem;
  --sos-space-3: .75rem;
  --sos-space-4: 1rem;
  --sos-space-5: 1.5rem;
  --sos-space-6: 2rem;
  --sos-shadow: 0 18px 60px rgba(0, 0, 0, .35);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--sos-focus);
  outline-offset: 3px;
}

.sos-runtime-warning {
  margin: 0;
  padding: .75rem 1rem;
  border: 1px solid rgba(255, 209, 102, .4);
  border-radius: var(--sos-radius-sm);
  background: rgba(255, 209, 102, .08);
  color: var(--sos-text);
  font-size: .875rem;
  line-height: 1.5;
}

.sos-runtime-warning strong { color: var(--sos-warning); }

[hidden] { display: none !important; }

[aria-busy="true"] { cursor: progress; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
