### Embed Mathfield in HTML

Source: https://cortexjs.io/mathfield

Initialize a math-field component with a default LaTeX expression.

```html
<p>Start typing math below:</p> <math-field> x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} </math-field>
```

--------------------------------

### Style Mathfield with CSS

Source: https://cortexjs.io/mathfield

Apply custom styles to the math-field element, including responsive adjustments for touch devices using media queries.

```css
math-field {  border: 1px solid var(--neutral-400);  background: var(--neutral-200);  border-radius: 8px;  padding: 8px;  }  @media (pointer: coarse) {  math-field {  border-radius: 16px;  font-size: 1.25rem;  border: 1px solid var(--neutral-100);  background: var(--neutral-700);  --primary-color: white;  color: white;  padding: 16px;  box-shadow:  inset 4px 4px 16px rgb(0 0 0 / 10%),  inset 2px 2px 8px rgb(0 0 0 / 60%);  --smart-fence-color: white;  --caret-color: var(--blue-400);  --selection-background-color: var(--blue-300);  --contains-highlight-background-color: var(--blue-900);  }  math-field:focus {  outline: 4px solid rgb(255 255 255 / 25%);  }  math-field::part(virtual-keyboard-toggle), math-field::part(menu-toggle) {  color: white;  }  }
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.