/* Support form. Uses the site's colour variables, so light and dark follow the phone. */
.sform-wrap{--err:#F2685E;margin:0 0 1.6em}
.sform{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 16px}
.field{margin:0 0 18px}
.field label{display:block;font-weight:600;margin:0 0 6px}
.field .opt,.field .req{font-weight:400;color:var(--text2);font-size:.9375rem}
.field input,.field select,.field textarea{display:block;width:100%;min-height:48px;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);font:400 1rem/1.4 var(--body)}
.field textarea{min-height:160px;resize:vertical}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.field [aria-invalid="true"]{border-color:var(--err);border-width:2px}
.count{margin:6px 0 0;color:var(--text2);font-size:.9375rem}
.count.low{color:var(--tired)}
.ferr{margin:6px 0 0;color:var(--err);font-weight:600;font-size:.9375rem}
.fstatus{margin:0 0 16px;padding:12px 14px;border-radius:10px;border:1.5px solid var(--err);background:var(--bg);color:var(--text)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sform .btn{width:100%;cursor:pointer}
.sform .btn[aria-disabled="true"]{opacity:.65;cursor:progress}
.fine{margin:14px 0 0;color:var(--text2);font-size:.9375rem}
.thanks{background:var(--surface);border:1px solid var(--fill);border-radius:16px;padding:20px 16px}
.thanks p{margin:0}
.thanks:focus{outline:3px solid var(--focus)}
@media (min-width:640px){.sform{padding:28px}.sform .btn{width:auto;min-width:160px}}
@media (prefers-color-scheme:light){.sform-wrap{--err:#B3261E}}
.ts-box{margin:0 0 16px;min-height:0}