/**
 * SafeDose V2 — entry stylesheet. Import order matters: tokens define
 * values, base resets + declares fonts, components define reusable shapes,
 * pages compose them for specific screens.
 */

@import url('tokens.css');
@import url('base.css');
@import url('components.css');
@import url('pages.css');

@media (max-width: 390px) {
  .shell { padding-left: var(--space-3); padding-right: var(--space-3); }
  .home-hero h1 { font-size: var(--font-size-lg); }
}

@media (prefers-reduced-motion: reduce) {
  .skeleton {
    animation: none;
  }
}