/* Form validation states (works on dark and cream form panels) */
.form-panel .field.has-error input,.form-panel .field.has-error select,.form-panel .field.has-error textarea{border-color:#ff6b6b;box-shadow:0 0 0 3px rgba(255,107,107,.2)}
.form-panel .field.is-valid input,.form-panel .field.is-valid select,.form-panel .field.is-valid textarea{border-color:#4ade80}
.form-panel .field{position:relative}
.form-panel .field.is-valid::after{content:"";position:absolute;right:12px;top:37px;width:18px;height:18px;border-radius:50%;pointer-events:none;
  background:#22a45d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/72% no-repeat;animation:fv-pop .3s var(--ease)}
.form-panel .field.is-valid select + *,.form-panel .field.is-valid textarea ~ .fld-count{position:static}
.form-panel .field.is-valid:has(textarea)::after,.form-panel .field.is-valid:has(select)::after{display:none}
@keyframes fv-pop{from{transform:scale(0)}to{transform:scale(1)}}
.fld-err{display:none;margin-top:7px;font-size:.82rem;line-height:1.4;color:#ffb4ab;animation:fv-in .25s var(--ease)}
.form-panel.on-cream .fld-err{color:#b3261e}
.has-error>.fld-err,.field-check.has-error .fld-err{display:block}
.field-check{flex-wrap:wrap}.field-check .fld-err{flex-basis:100%}
.fld-fix{margin-left:8px;padding:3px 10px;border-radius:999px;border:1px solid currentColor;background:transparent;color:inherit;font:600 .76rem var(--font-body);cursor:pointer}
.fld-fix:hover{background:rgba(255,255,255,.12)}
.fld-count{margin-top:6px;text-align:right;font-size:.72rem;opacity:.6}
@keyframes fv-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.btn.shake{animation:fv-shake .45s}
@keyframes fv-shake{20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
.form-note-secure{display:flex;gap:10px;align-items:flex-start;margin:16px 0 0;font-size:.8rem;line-height:1.5;color:rgba(245,243,238,.72)}
.form-note-secure svg{flex:none;width:18px;height:18px;margin-top:1px;stroke:var(--gold-light);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.form-panel.on-cream .form-note-secure{color:var(--grey)}
@media (prefers-reduced-motion:reduce){.btn.shake,.fld-err,.form-panel .field.is-valid::after{animation:none}}
.field-check{align-items:flex-start}
.field-check input{margin-top:3px;flex:none}
.field-check label{flex:1 1 0;min-width:0;line-height:1.5}
