@layer base {
     *,
     ::before,
     ::after {
          box-sizing: border-box;
     }

     html:focus-within {
          scroll-behavior: smooth;
     }

     html,
     body {
          height: 100%;
          font-family: system-ui, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          line-height: 1.5;
          background-color: #fff;
          color: #000;
     }

     body {
          margin: 0;
          text-rendering: optimizeSpeed;
     }

     img,
     picture,
     video,
     canvas,
     svg {
          display: block;
          max-width: 100%;
          height: auto;
     }

     input,
     button,
     textarea,
     select {
          font: inherit;
          color: inherit;
          background: transparent;
          border-width: 0;
          border-style: solid;
          border-color: currentColor;
     }

     button {
          cursor: pointer;
          background: transparent;
     }

     a {
          text-decoration: inherit;
          color: inherit;
     }

     table {
          border-collapse: collapse;
          width: 100%;
     }

     [hidden] {
          display: none !important;
     }
}