body{margin:0;font-family:Arial,'Noto Sans Thai',sans-serif;background:#f5f7fa;color:#102a43}.page{max-width:880px;margin:0 auto;padding:24px}.brand{display:flex;gap:14px;align-items:center;margin-bottom:18px}.logo{width:54px;height:54px;border-radius:16px;background:#103e68;color:white;display:flex;align-items:center;justify-content:center;font-weight:700}.brand h1{margin:0;color:#103e68}.brand p{margin:4px 0 0;color:#64748b}.card{background:white;border-radius:18px;box-shadow:0 8px 24px rgba(15,23,42,.08);padding:22px;margin-bottom:16px}.card input{width:100%;padding:14px;border:1px solid #d8e0e8;border-radius:12px;font-size:18px;box-sizing:border-box}.card button{margin-top:12px;padding:12px 18px;background:#103e68;color:white;border:0;border-radius:12px;font-size:16px}.hero{text-align:center}.job{color:#64748b}.percent{font-size:52px;font-weight:800;color:#103e68}.progress{height:16px;background:#e2e8f0;border-radius:20px;overflow:hidden}.progress span{display:block;height:100%}.current{font-size:20px}.muted{color:#64748b}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.step{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #eef2f7}.step b{margin-left:auto;color:#103e68}.dot{width:14px;height:14px;border-radius:50%}@media(max-width:700px){.grid{grid-template-columns:1fr}.percent{font-size:42px}}