:root{--ink:#20334d;--muted:#617084;--line:#dfe6ee;--teal:#216c65;--paper:#f4f7f9}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'IBM Plex Sans Thai',sans-serif;font-size:15px}header{display:flex;gap:24px;align-items:center;background:#162b43;color:white;padding:20px max(24px,calc((100vw - 1160px)/2))}header>a{font-size:24px;font-weight:700}header a{color:white;text-decoration:none}nav{display:flex;gap:20px;margin-right:auto}header>span{font-size:12px;background:#ffffff20;padding:5px 10px;border-radius:15px}main{max-width:1160px;margin:auto;padding:36px 24px}.eyebrow{letter-spacing:.16em;color:var(--teal);font-size:12px;font-weight:700}h1{font-size:32px;margin:8px 0}.hero>p{color:var(--muted)}h2{font-size:21px;margin:0 0 8px}h3{font-size:16px;margin:0}section.card{background:white;border:1px solid var(--line);border-radius:18px;padding:24px;margin:24px 0;box-shadow:0 7px 24px #20334d06}.hint{color:var(--muted);font-size:13px;line-height:1.7}.toolbar,.form-row{display:flex;gap:16px;align-items:end;flex-wrap:wrap}.toolbar{margin:24px 0}label{display:grid;gap:7px;font-size:13px;flex:1;min-width:170px;margin:12px 0}input,select,textarea,button{font:inherit}input,select,textarea{width:100%;padding:11px;border:1px solid #cbd5df;border-radius:9px;background:#fff;color:var(--ink)}textarea{min-height:132px;resize:vertical}button{border:0;border-radius:9px;background:var(--teal);color:white;padding:11px 17px;cursor:pointer;margin:12px 0}button.secondary{background:#eaf1f5;color:var(--ink)}button:disabled{opacity:.5;cursor:default}input:focus,select:focus,textarea:focus,button:focus-visible{outline:3px solid #b9dbd8;outline-offset:2px}.reason{background:#edf3f5;padding:14px 18px;border-radius:12px}.row{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding:14px 0;flex-wrap:wrap}.row>div:first-child{flex:1;min-width:210px}.row label{flex:0 1 180px;min-width:110px}.badge{font-size:12px;padding:4px 9px;border-radius:6px;background:#fff3da;color:#775824;display:inline-block}#status{min-height:26px;color:#275e55}#status.error{color:#a32630}details{margin:15px 0}summary{cursor:pointer;color:var(--teal)}footer{text-align:center;padding:28px;color:var(--muted);font-size:12px}a{color:var(--teal)}[hidden]{display:none!important}@media(max-width:650px){header{flex-wrap:wrap;padding:18px}nav{font-size:13px}main{padding:24px 16px}h1{font-size:27px}.form-row{display:block}.row>div:first-child{width:100%}.card{padding:18px!important}}
