input
  background: none
  border: none

input.copy-area
  display: block
  font-family: $ff-code
  font-size: $fs-13
  font-weight: $fw-700
  color: var(--text-p3)

// 圆环与圆点画在同一个背景层上：元素落在非整数像素位置时，border 圆环与内部盒子会被
// 分别对齐，Firefox 下圆点最多偏离圆心 1 个物理像素，因此不用 border 绘制圆环。
input.ui-radio
  -webkit-appearance: none
  -moz-appearance: none
  appearance: none
  box-sizing: border-box
  display: inline-block
  flex: 0 0 auto
  width: 16px
  height: 16px
  margin: 0
  border: 0
  border-radius: 50%
  corner-shape: round
  --radio-ring: var(--text-p3)
  --radio-dot-size: 0
  // 外环：16px 内取 2px 环宽（半径 8px → 6px）；圆点：8px（半径 4px）
  background-image: radial-gradient(circle closest-side, transparent 0 5.875px, var(--radio-ring) 6.125px 100%), radial-gradient(circle closest-side, var(--theme) 0 3.875px, transparent 4.125px)
  background-position: center, center
  background-repeat: no-repeat, no-repeat
  background-size: 16px 16px, var(--radio-dot-size) var(--radio-dot-size)
  cursor: pointer
  &:checked
    --radio-ring: var(--theme)
    --radio-dot-size: 8px
  &:focus-visible
    outline: 2px solid var(--theme)
    outline-offset: 2px