/* ================================================================
   Spoonity Macondo — base element styles
   Mirrors macondo src/index.css @layer base.
   ================================================================ */
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--background);
  color: var(--typography-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings default to the medium weight of their type style */
h1 { font-size: var(--h1-font-size); line-height: var(--h1-line-height); font-weight: var(--font-weight-medium); margin: 0; }
h2 { font-size: var(--h2-font-size); line-height: var(--h2-line-height); font-weight: var(--font-weight-medium); margin: 0; }
h3 { font-size: var(--h3-font-size); line-height: var(--h3-line-height); font-weight: var(--font-weight-medium); margin: 0; }
h4 { font-size: var(--h4-font-size); line-height: var(--h4-line-height); font-weight: var(--font-weight-medium); margin: 0; }
h5 { font-size: var(--h5-font-size); line-height: var(--h5-line-height); font-weight: var(--font-weight-medium); margin: 0; }
p { margin: 0; }

* { border-color: var(--border-primary); box-sizing: border-box; }

/* Focus ring — 2px orange ring with hairline offset (macondo .focus-ring) */
.focus-ring:focus-visible,
button:focus-visible,
a:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 0.5px var(--background), 0 0 0 2.5px var(--orange-400);
}