/**
 * Aqua Store — design tokens (unlayered so they actually apply)
 * responsive-design-os §§1–2, 4, 7
 */
:root {
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.8125rem, 0.78rem + 0.2vw, 0.9375rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --text-xl: clamp(1.35rem, 1.15rem + 0.8vw, 1.85rem);
  --text-2xl: clamp(1.75rem, 1.2rem + 2vw, 3.2rem);
  --touch: 44px;
}

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

.container {
  width: min(var(--max, 1120px), calc(100% - clamp(1.25rem, 4vw, 3.5rem)));
  margin-inline: auto;
}

.icon-btn,
.menu-toggle,
.theme-toggle,
.search-toggle {
  min-width: var(--touch);
  min-height: var(--touch);
}