/* ============================================================
   OPI DESIGN SYSTEM — global entry point
   Optometric Practice Intelligence · Brand Standards V1.1
   "Light on dark. Sans first. Blue gathers; white resolves."

   Consumers link THIS one file. It @imports the token closure
   (fonts, colors, type, spacing) and applies base resets.
   Do not inline component rules here.
   ============================================================ */

@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");

/* ============================================================
   BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--deep-space);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: var(--t-body);
  line-height: var(--lead-body);
  font-weight: var(--w-regular);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--blue-40); color: var(--resolution-white); }

a { color: var(--signal-blue); text-decoration: none; }
a:hover { color: var(--signal-blue-hi); }

hr, .opi-rule { border: none; border-top: 1px solid var(--panel-line); margin: 0; }

/* Ambient dot-field texture utility (the "gathering field") */
.opi-dotgrid {
  background-image: radial-gradient(rgba(139,149,165,0.10) 1.2px, transparent 1.2px);
  background-size: 26px 26px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}