/* SiamLMS — base tokens */
:root{
  --bg:#f4f6fb;--card:#fff;--ink:#0f172a;--ink2:#334155;--mute:#64748b;--line:#e5e9f2;--line2:#eef1f7;
  --pri:#3b6cf6;--pri2:#5a5ff0;--pri-soft:#eaf0ff;--ok:#059669;--ok-soft:#e7f8f1;--warn:#d97706;--warn-soft:#fff6e5;
  --err:#dc2626;--err-soft:#fdecec;--r:14px;--sh:0 1px 2px rgba(15,23,42,.05),0 6px 24px -12px rgba(15,23,42,.18);
  --side:248px;--top:60px;
  font-family:"IBM Plex Sans Thai","Noto Sans Thai","Sarabun","Leelawadee UI","Thonburi",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--pri);text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}
.boot{display:grid;place-items:center;height:100vh;color:var(--mute)}
.hide{display:none!important}.mute{color:var(--mute)}.r{text-align:right}.c{text-align:center}.nowrap{white-space:nowrap}
.num{font-variant-numeric:tabular-nums}.row{display:flex;align-items:center;gap:10px}.sp{flex:1}
.fld{margin-bottom:14px}.fld label{display:block;font-weight:600;font-size:13.5px;margin-bottom:6px}
.inp{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:11px 14px;outline:0;transition:.15s}
.inp:focus{border-color:var(--pri);box-shadow:0 0 0 4px var(--pri-soft)}select.inp{padding:9px 12px}textarea.inp{min-height:84px;resize:vertical}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid transparent;border-radius:11px;
  padding:9px 15px;font-weight:600;cursor:pointer;background:var(--pri);color:#fff;transition:.15s;white-space:nowrap}
.btn:hover{filter:brightness(1.06)}.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.ghost{background:#fff;color:var(--ink2);border-color:var(--line)}.btn.ghost:hover{background:#f8fafc}
.btn.sm{padding:6px 11px;font-size:13px;border-radius:9px}.btn.ok{background:var(--ok)}.btn.danger{background:var(--err)}
.err{background:var(--err-soft);color:#991b1b;border:1px solid #f8caca;border-radius:11px;padding:10px 13px;margin-bottom:14px;font-size:13.5px}
.ico{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;font-size:15px}
.t-blue{background:#e8efff;color:#2f5bea}.t-green{background:#e3f7ee;color:#059669}.t-amber{background:#fff3dc;color:#c27803}
.t-rose{background:#fde8ee;color:#e11d48}.t-violet{background:#efe9ff;color:#6d28d9}.t-cyan{background:#e0f6fb;color:#0891b2}
.t-orange{background:#ffeedd;color:#ea580c}.t-indigo{background:#e7e9ff;color:#4338ca}.t-pink{background:#fde7f3;color:#db2777}
.t-sky{background:#e3f2fd;color:#0284c7}.t-teal{background:#dcf5f0;color:#0f766e}.t-gray{background:#eef0f4;color:#475569}
.switch{position:relative;width:42px;height:24px;flex:none}.switch input{opacity:0;width:0;height:0}
.switch i{position:absolute;inset:0;background:#cbd5e1;border-radius:99px;transition:.2s;cursor:pointer}
.switch i:before{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked+i{background:var(--pri)}.switch input:checked+i:before{transform:translateX(18px)}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:#0f172a;color:#fff;padding:11px 18px;border-radius:12px;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.5);z-index:60;font-weight:500}.toast.err{background:#991b1b}