*{box-sizing:border-box}body{margin:0;background:#f3f6fc;color:#183152;font-family:Arial,"Noto Sans Thai",sans-serif}header{display:flex;justify-content:space-between;gap:20px;align-items:center;background:white;padding:20px max(16px,calc((100vw - 1050px)/2))}a{color:#1759a6}header>a{font-size:25px;font-weight:900;text-decoration:none}nav{display:flex;gap:12px}main{max-width:1050px;margin:24px auto;padding:0 16px}.hero{background:linear-gradient(120deg,#123768,#6050ca);border-radius:24px;padding:35px;color:white}.hero h1{font-size:32px;margin:8px 0 18px}.card{background:white;border:1px solid #dfe7f2;border-radius:18px;padding:24px;margin:18px 0;box-shadow:0 8px 24px #173e7010}.card h2{font-size:20px;margin-top:0}.card p{line-height:1.7}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid strong{display:block;font-size:40px;margin:12px 0}small{color:#687d99;font-size:14px}progress{width:100%;accent-color:#6554da}button,.btn{display:inline-block;border:0;border-radius:11px;padding:13px 19px;background:#1759a6;color:white;font-weight:bold;font-size:15px;text-decoration:none;cursor:pointer}.row{display:flex;gap:10px}input,select{min-width:0;flex:1;border:1px solid #d0dcea;border-radius:10px;padding:12px;font-size:15px}form{margin:10px 0}.badge{background:#ece9ff;color:#5e49b7;border-radius:20px;padding:5px 10px}.table{overflow:auto}table{width:100%;border-collapse:collapse}td,th{padding:10px;text-align:left;border-bottom:1px solid #e4eaf3;white-space:nowrap}@media(max-width:700px){.grid{grid-template-columns:1fr;gap:0}.grid .card{margin:8px 0}.hero{padding:26px 20px}.hero h1{font-size:26px}.card{padding:19px}.row{flex-direction:column}header{flex-wrap:wrap}nav{font-size:13px}}