body {
  background-color: #FFFDF5;
  color: #1E293B;
}

section[id] {
  scroll-margin-top: 6rem;
}

:focus-visible {
  outline: 3px solid #7C3AED;
  outline-offset: 3px;
}

.on-accent :focus-visible,
.on-ink :focus-visible {
  outline-color: #FBBF24;
}

/* Dot grid texture. Background patterns stay decorative, never behind body text. */
.bg-dots {
  background-image: radial-gradient(#CBD5E1 1.5px, transparent 1.5px);
  background-size: 22px 22px;
}
.bg-dots-light {
  background-image: radial-gradient(rgba(255, 255, 255, 0.28) 1.5px, transparent 1.5px);
  background-size: 22px 22px;
}
.bg-stripes {
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(30, 41, 59, 0.08) 0px,
    rgba(30, 41, 59, 0.08) 2px,
    transparent 2px,
    transparent 10px
  );
}

/* Hide number-input spinners so values read as figures, not controls. */
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type='number'] {
  -moz-appearance: textfield;
}

@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;
  }
}

::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #F1F5F9;
}
::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #64748B;
}