:root{--bg:#f4f6fb;--card:#ffffff;--ink:#0f172a;--slate:#475569;--muted:#94a3b8;--faint:#cbd5e1;--line:#e7ebf2;--blue:#2563eb;--blue-d:#1d4ed8;--blue-50:#eff6ff;--navy:#102a52;--ok:#16a34a;--ok-bg:#dcfce7;--ok-line:#bbf7d0;--warn:#d97706;--warn-bg:#fef3c7;--warn-line:#fde68a;--danger:#dc2626;--danger-bg:#fee2e2;--danger-line:#fecaca}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Noto Sans Thai,system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:disabled{opacity:.4;cursor:not-allowed;filter:saturate(.35)}input,select,textarea{font-family:inherit}a{color:var(--blue);text-decoration:none}a:hover{color:var(--blue-d)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#d3dae6;border-radius:8px;border:3px solid var(--bg)}@keyframes ov{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}.input{width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 13px;font-size:14px;outline:none;background:#fff}.input:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-50)}.input:disabled{background:#f8fafc;color:var(--muted)}textarea.input{height:auto;padding:10px 13px;resize:none}select.input{padding-right:8px}.label{display:block;font-size:12.5px;font-weight:600;color:var(--slate);margin-bottom:6px}.btn-primary{height:42px;padding:0 18px;border-radius:10px;background:var(--blue);color:#fff;font-weight:700;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover:not(:disabled){background:var(--blue-d)}.btn-ghost{height:42px;padding:0 18px;border-radius:10px;border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--slate);display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff}.btn-ghost:hover:not(:disabled){background:#f4f6fb}.btn-outline{height:34px;padding:0 12px;border-radius:8px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--slate);display:inline-flex;align-items:center;gap:6px;background:#fff}.btn-outline:hover:not(:disabled){border-color:var(--blue);color:var(--blue)}.hoverable:hover{background:#fafbfe}.navbtn{width:100%;display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;font-size:14.5px;font-weight:600;text-align:left}.navbtn:hover{background:#f4f6fb}.iconbtn{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--slate)}.iconbtn:hover{background:#f1f4f9}.card{background:#fff;border:1px solid var(--line);border-radius:15px}.spinner{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--blue);border-radius:50%;animation:spin .8s linear infinite}