@font-face{font-family:Sarabun;src:url(/assets/Sarabun-Regular-Dax1MQhh.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Sarabun;src:url(/assets/Sarabun-Medium-FWsYhmNF.ttf)format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Sarabun;src:url(/assets/Sarabun-SemiBold-BPbjEixa.ttf)format("truetype");font-weight:600 700;font-style:normal;font-display:swap}:root{--navy:#0a1f44;--navy-soft:#16305e;--accent:#ff6b00;--accent-hover:#c25000;--accent-soft:#fff1e6;--bg:#f3f5f9;--card:#fff;--line:#e3e7ef;--line-strong:#cdd3df;--text:#17223a;--muted:#687387;--ok:#1d7f4f;--ok-bg:#e5f4ec;--warn:#a9520b;--warn-bg:#fff1e0;--bad:#b9302a;--bad-bg:#fcebea;--idle:#34548f;--idle-bg:#e9effa;--off:#59616f;--off-bg:#eceef2;--radius:12px;--radius-sm:9px;--shadow:0 1px 2px #0a1f440f, 0 1px 1px #0a1f4408;--mono:Consolas, "SFMono-Regular", Menlo, monospace}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);margin:0;font-family:Sarabun,Leelawadee UI,Tahoma,sans-serif;font-size:15px;line-height:1.5}[hidden]{display:none!important}svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}h1,h2,h3{margin:0;font-weight:600;line-height:1.3}button,input,textarea,select{font:inherit;color:inherit}.btn{border-radius:var(--radius-sm);background:var(--card);white-space:nowrap;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;height:38px;padding:0 16px;font-weight:500;transition:background-color .12s,border-color .12s,color .12s;display:inline-flex}.btn svg{flex:none;width:18px;height:18px}.btn:focus-visible,.icon-btn:focus-visible{outline-offset:2px;outline:2px solid #ff6b008c}.btn:disabled{opacity:.55;cursor:default}.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover:not(:disabled){background:var(--accent-hover)}.btn.ghost{border-color:var(--line-strong)}.btn.ghost:hover:not(:disabled){border-color:var(--accent);color:var(--accent-hover)}.btn.danger{background:var(--bad);color:#fff}.btn.danger:hover:not(:disabled){background:#962520}.btn.wide{width:100%}.icon-btn{width:30px;height:30px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;padding:0;display:inline-grid}.icon-btn svg{width:17px;height:17px}.icon-btn:hover{background:var(--bg);color:var(--text)}.field{margin-bottom:14px;display:block}.field>span{margin-bottom:5px;font-size:14px;font-weight:500;display:block}.field>span small{color:var(--muted);font-weight:400}.input{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:#fff;outline:none;width:100%;height:40px;padding:0 12px;transition:border-color .12s,box-shadow .12s;display:block}textarea.input{resize:none;height:auto;padding:10px 12px}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #ff6b0029}.input.mono{font-family:var(--mono);letter-spacing:.02em}.error{min-height:22px;color:var(--bad);margin:0 0 10px;font-size:14px}.muted{color:var(--muted)}.offscreen{opacity:0;width:1px;height:1px;position:fixed;top:0;left:-9999px}.mono{font-family:var(--mono)}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.chip{white-space:nowrap;border-radius:999px;align-items:center;gap:6px;height:24px;padding:0 10px;font-size:13px;font-weight:500;display:inline-flex}.chip:before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px}.chip.ok{background:var(--ok-bg);color:var(--ok)}.chip.warn{background:var(--warn-bg);color:var(--warn)}.chip.bad{background:var(--bad-bg);color:var(--bad)}.chip.idle{background:var(--idle-bg);color:var(--idle)}.chip.off{background:var(--off-bg);color:var(--off)}dialog.modal{border-radius:var(--radius);background:var(--card);width:min(440px,100vw - 32px);color:var(--text);border:0;padding:24px;box-shadow:0 20px 50px #0a1f4440}dialog.modal::backdrop{background:#0a1f446b}.modal h2{font-size:19px}.modal .sub{color:var(--muted);margin:2px 0 18px;font-size:14px}.modal .actions{justify-content:flex-end;gap:8px;margin-top:6px;display:flex}.toast{z-index:50;background:var(--navy);color:#fff;border-radius:10px;padding:10px 18px;font-size:14px;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0a1f4440}
