Codepen表单正常但WordPress中错乱求助（CF7+Simple Custom CSS）

我制作的联系表单在Codepen中显示正常，但迁移到WordPress后出现多处样式错乱问题，当前使用Contact Form 7（CF7）和Simple Custom CSS插件，具体问题包括：

• 复选框样式异常
• 表单垂直、水平方向尺寸不符合预期
• 部分SVG图标不显示
• 文本框过长

相关代码如下：

* {
  box-sizing: border-box;
  user-select: none;
}
html, body {
  margin: 0;
  height: 100%;
}
body {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  color: #ddd;
}
/* 其余CSS代码保留原样 */

<div class="contact-form">
  <div class="form-and-image-container">
    <form action="/your-form-action" method="post" class="form-container">
      <!-- 其余HTML代码保留原样 -->
    </form>
  </div>
</div>

网站异常显示截图：

内容的提问来源于stack exchange，提问作者Norbert