| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- /* 1. Use a more-intuitive box-sizing model */
- *,
- *::before,
- *::after {
- box-sizing: border-box;
- }
- /* 2. Remove default margin */
- * {
- margin: 0;
- }
- /* 3. Enable keyword animations */
- @media (prefers-reduced-motion: no-preference) {
- html {
- interpolate-size: allow-keywords;
- }
- }
- body {
- /* 4. Add accessible line-height */
- line-height: 1.5;
- /* 5. Improve text rendering */
- -webkit-font-smoothing: antialiased;
- }
- /* 6. Improve media defaults */
- img,
- picture,
- video,
- canvas,
- svg {
- display: block;
- max-width: 100%;
- }
- /* 7. Inherit fonts for form controls */
- input,
- button,
- textarea,
- select {
- font: inherit;
- }
- /* 8. Avoid text overflows */
- p,
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- overflow-wrap: break-word;
- }
- /* 9. Improve line wrapping */
- p {
- text-wrap: pretty;
- }
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- text-wrap: balance;
- }
- /*
- 10. Create a root stacking context
- */
- #root,
- #__next {
- isolation: isolate;
- }
|