css - body で定義された font-family は、input タグとプレースホルダーによって継承されません

Question

bodyフォント スタイルをinputテキストとプレースホルダーに継承するにはどうすればよいですか?

body {
  font-family: "Circular", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
    "Helvetica Neue", sans-serif;
}

inputタグが使用されています:

<input
   type="text"
   value={value}
   onChange={onChange}
   placeholder={placeholder}
   className={styles.input}
/>

現在、グローバルスタイルはテキストとプレースホルダーbody font-familyには適用されていません。input次のようにフォント スタイルを明示的に追加した場合にのみ機能します。

.input {
    font-family: "Circular", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
    "Helvetica Neue", sans-serif;

  &::placeholder {
    font-family: "Circular", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
    "Helvetica Neue", sans-serif;
  }
}