/* Shared visual system. */
:root {
  --ink:        #16324f;
  --ink-soft:   #4e6274;
  --ink-faint:  #718292;
  --line:       #d9dad5;
  --line-soft:  #e9e9e5;
  --bg:         #f3f3f1;
  --panel:      #ffffff;
  --accent:     #16324f;
  --accent-dk:  #0b2238;
  --accent-bg:  #fff0e7;
  --signal:     #ff8a4c;
  --deep:       #16324f;
  --deep-soft:  #234866;
  --ok:         #236b2b;
  --ok-bg:      #e8f8e5;
  --warn:       #805700;
  --warn-bg:    #fff3cf;
  --err:        #a92d2d;
  --err-bg:     #ffebea;
  --radius:     6px;
  --gap:        16px;
  --shadow:     0 1px 2px rgba(0,0,0,.04), 0 12px 30px rgba(0,0,0,.05);
  --display:    "Aptos Display", "Trebuchet MS", sans-serif;
  --mono:       ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

body {
  font-family: "Aptos", "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
}

/* Focus must always be visible. Never remove this without replacing it. */
:focus-visible {
  outline: 3px solid #d95f23;
  outline-offset: 2px;
  border-radius: 3px;
}

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