/* The contact page (2026-10-19): the look of My account and the cancellation page (account.css), plus the parts
   only this form has. Colours only through the site's tokens. */
.contact-points{list-style:none;margin:0;padding:0;display:grid;gap:18px;max-width:520px}
.contact-points li{display:flex;gap:14px;align-items:flex-start;font-size:15px;color:var(--text)}
.contact-points li p{margin:3px 0 0;font-size:13.5px;color:var(--text-muted);line-height:1.55}
.contact-points .ficon{width:38px;height:38px;border-radius:11px}
.contact-mail{margin:28px 0 0;font-family:"IBM Plex Mono";font-size:12.5px;color:var(--text-muted)}

.field textarea{font:inherit;font-size:15px;line-height:1.55;color:var(--text);background:var(--bg);border:1px solid var(--border-strong);border-radius:12px;
  padding:13px 14px;min-width:0;min-height:168px;resize:vertical;transition:border-color .15s ease, box-shadow .15s ease}
.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent)}
.field.invalid input,.field.invalid textarea{border-color:color-mix(in srgb,var(--red) 70%,var(--border-strong))}
.counter{margin:-10px 2px 0;text-align:right;font-family:"IBM Plex Mono";font-size:11.5px;color:var(--text-muted)}
.counter.near{color:var(--brand)}

.consent{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;line-height:1.55;color:var(--text-muted);cursor:pointer}
.consent input{flex-shrink:0;width:17px;height:17px;margin:2px 0 0;accent-color:var(--brand)}
.consent input:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.consent a{color:var(--brand);text-decoration:none}
.consent a:hover{text-decoration:underline}
.consent.invalid{color:#FF8A95}

.spinner{display:none;width:15px;height:15px;border-radius:50%;border:2px solid color-mix(in srgb,var(--brand-ink) 30%,transparent);border-top-color:var(--brand-ink);
  animation:contact-spin .8s linear infinite}
.btn.busy .spinner{display:inline-block}
.btn.busy{cursor:progress;opacity:.85}
@keyframes contact-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none}}

#again{margin-top:8px}
@media (max-width:920px){.contact-points{max-width:none}}
/* Form colours as on every form (owner, 2026-10-28; account.css end). */
.consent,.counter{color:#C2C7DA}
.field textarea{color:#F2F4FA}
.field textarea::placeholder{color:#9AA0BA}
