.rp-form { display: grid; gap: 14px; text-align: left; }
.rp-label { display: block; margin-bottom: 6px; font: 800 12px var(--f-ui, system-ui); letter-spacing: .08em; text-transform: uppercase; color: rgba(236, 228, 255, .75); }
.rp-label em { font-style: normal; font-weight: 600; letter-spacing: 0; text-transform: none; color: rgba(236, 228, 255, .5); }
.rp-kinds { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0; padding: 0; border: 0; }
.rp-kinds legend { grid-column: 1 / -1; padding: 0; }
.rp-kind { display: grid; gap: 3px; padding: 12px; border-radius: 14px; border: 1px solid var(--jline, rgba(255,255,255,.14)); background: rgba(0, 0, 0, .3); color: #fff; text-align: left; font: inherit; cursor: pointer; }
.rp-kind b { font: 800 15px var(--f-ui, system-ui); }
.rp-kind span { font-size: 12px; color: rgba(236, 228, 255, .6); }
.rp-kind.is-on { border-color: var(--j2, #c46bff); background: linear-gradient(180deg, rgba(196, 107, 255, .22), rgba(106, 61, 255, .08)); box-shadow: 0 0 0 1px var(--j2, #c46bff) inset; }
.rp-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.rp-field select, .rp-field textarea, .rp-field input { width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--jline-2, rgba(255,255,255,.2)); background: rgba(0, 0, 0, .4); color: #fff; font: 500 15px var(--f-ui, system-ui); }
.rp-field select option { color: #111; }
.rp-field textarea { resize: vertical; min-height: 150px; line-height: 1.45; }
.rp-field :focus { outline: none; border-color: var(--j2, #c46bff); box-shadow: 0 0 0 3px rgba(196, 107, 255, .25); }
.rp-field .is-bad { border-color: #ff6b8a; box-shadow: 0 0 0 2px rgba(255, 107, 138, .3); }
.rp-count { display: block; margin-top: 4px; font-size: 12px; color: #ffc2d8; text-align: right; }
.rp-count.is-ok { color: rgba(236, 228, 255, .5); }
.rp-mute { margin: 0; font-size: 13px; color: rgba(236, 228, 255, .6); }
.rp-msg { margin: 0; min-height: 1.2em; font-size: 14px; color: #ffc2d8; }
.rp-row { display: flex; gap: 10px; flex-wrap: wrap; }
.rp-done { display: grid; gap: 10px; text-align: left; }
.rp-done b.display { font-size: clamp(36px, 7vw, 56px); color: #fff; }
.rp-done p { margin: 0; color: rgba(236, 228, 255, .8); }
@media (max-width: 560px) {
  .rp-kinds { grid-template-columns: 1fr; }
  .rp-kind { grid-template-columns: auto 1fr; align-items: baseline; gap: 10px; }
  .rp-two { grid-template-columns: 1fr; }
}
