:root{--navy:#1B4F72;--line:#d9dfe5;--text:#1d2733;--muted:#5f6b77;--bad:#a8302a}
*{box-sizing:border-box}
body{margin:0;background:#f4f6f8;color:var(--text);font:16px/1.6 system-ui,-apple-system,'Segoe UI','Leelawadee UI','Noto Sans Thai',Tahoma,sans-serif}
main{max-width:560px;margin:6vh auto;background:#fff;border:1px solid var(--line);border-radius:10px;padding:28px 24px}
h1{margin:0 0 6px;font-size:22px;color:var(--navy)}
.lead{margin:0 0 20px;color:var(--muted)}
form{display:flex;flex-direction:column;gap:14px}
label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted)}
.req{color:var(--bad)}
input,select,textarea{font:inherit;padding:9px 11px;border:1px solid var(--line);border-radius:6px;color:var(--text);background:#fff}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.check{flex-direction:row;align-items:flex-start;gap:8px;color:var(--text)}
.check input{margin-top:5px}
.hp{position:absolute;left:-5000px;width:1px;height:1px;opacity:0}
.ts{min-height:66px}
.btn{background:var(--navy);color:#fff;border:0;border-radius:6px;padding:11px 18px;font:inherit;font-weight:600;cursor:pointer}
.btn:disabled{opacity:.6;cursor:default}
.msg{margin:0;min-height:1.2em;font-size:14px}.msg.bad{color:var(--bad)}
.done h2{color:var(--navy);font-size:20px}
@media (max-width:480px){main{margin:0;border-radius:0;border-left:0;border-right:0}.two{grid-template-columns:1fr}}
.more{display:grid;gap:12px}