@font-face{font-family:ThaiUI;src:local("Thonburi");font-weight:400;unicode-range:U+0E00-0E7F}@font-face{font-family:ThaiUI;src:local("Thonburi-Bold"),local("Thonburi Bold");font-weight:700;unicode-range:U+0E00-0E7F}:root{--banner-bg: #e8f0fe;--banner-border: #cccccc;--banner-text: #202124;--banner-link: #1967d2;--banner-font: "Google Sans", Roboto, Helvetica, Arial, sans-serif;--font: "ThaiUI", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Thonburi, "Noto Sans Thai Looped", "Noto Sans Thai", "Helvetica Neue", Arial, sans-serif;--ink: #1f2937;--muted: #64748b;--note: #6b7a90;--line: #cbd5e1;--line-soft: #dce3ee;--card-border: #e1e8f2;--primary: #2357c6;--primary-dark: #1c48a6;--radius: 8px;--bg: linear-gradient(145deg, #0f2344 0%, #153a75 30%, #1c4993 50%, #6988b7 70%, #99acc7 80%, #c8d0d7 90%, #f7f3e7 100%)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}#root{min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column;background:#fff}.app-in{background:#f1f5f9}.banner{position:relative;display:flex;align-items:center;height:46px;padding:0 46px 0 20px;background:var(--banner-bg);border-bottom:1px solid var(--banner-border);font-family:var(--banner-font);font-size:14px;color:var(--banner-text);flex:none}.banner-main{display:flex;align-items:center;flex:1;min-width:0}.banner-icon{width:24px;height:24px;flex:none;margin-right:20px}.banner-text{line-height:19px}.banner-links{display:flex;gap:2px;margin-right:11px}.banner-link{font:500 14px/23px var(--banner-font);color:var(--banner-link);background:none;border:0;padding:0 10px;border-radius:100px;text-decoration:none;cursor:pointer;white-space:nowrap}.banner-link:hover{background:#1967d214}.banner-close{position:absolute;right:10px;top:10px;width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer;border-radius:100px}.stage{background:var(--bg);flex:1;display:flex;align-items:center;justify-content:center;padding:20px}.card{width:460px;max-width:100%;background:#fff;border:1px solid var(--card-border);border-radius:var(--radius);padding:31px 30px 35px;box-shadow:0 18px 40px #08142d2e}.emblem{display:block;width:100px;height:100px;object-fit:contain;object-position:left center}.title{margin:15px 0 6px;font-size:25px;line-height:32px;font-weight:700;color:var(--ink)}.subtitle{margin:0 0 26px;font-size:15px;line-height:23px;color:var(--muted)}.label{display:block;margin:0 0 7px;font-size:13px;line-height:18px;font-weight:700;color:var(--ink)}.label-pw{margin-top:16px;margin-bottom:8px}.input{display:block;width:100%;height:45px;padding:0 12px;font:15px var(--font);color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--radius);outline:none}.input::placeholder{color:#6b7280}.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #2357c626}.pw-row{display:flex;gap:8px}.pw-row .input{flex:1;min-width:0;height:46px}.btn-show{flex:none;width:69px;height:46px;font:700 15px var(--font);color:var(--ink);background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius);cursor:pointer}.btn-show:hover{background:#f8fafc}.btn-primary{display:block;width:100%;height:43px;margin-top:16px;font:700 15px var(--font);color:#fff;background:var(--primary);border:0;border-radius:var(--radius);cursor:pointer}.btn-primary:hover{background:var(--primary-dark)}.btn-primary:disabled{opacity:.7;cursor:wait}.error{margin:12px 0 0;font-size:14px;color:#dc2626}.note{margin:20px 0 10px;font-size:13px;line-height:21px;color:var(--note)}.dash{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:20px}.dash-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}.brand{display:flex;align-items:center;gap:12px}.brand .emblem{width:48px;height:48px}.brand strong{display:block;font-size:18px}.brand span{font-size:13px;color:var(--muted)}.who{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted)}.tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}.tab{font:600 14px var(--font);padding:8px 14px;border:1px solid var(--line-soft);border-radius:100px;background:#fff;color:var(--ink);cursor:pointer}.tab.on{background:var(--primary);border-color:var(--primary);color:#fff}.panel{background:#fff;border:1px solid var(--card-border);border-radius:var(--radius);padding:20px;margin-bottom:16px}.panel h2{margin:0 0 12px;font-size:18px}.muted{color:var(--muted);font-size:14px;line-height:1.6}.tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.tools input,.tools select,.field input,.field select,.field textarea{font:14px var(--font);padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--ink);min-width:0}.tools input[type=search]{flex:1 1 220px}.btn-inline{display:inline-block;width:auto;height:38px;margin:0;padding:0 16px}.btn-ghost{font:600 14px var(--font);height:38px;padding:0 14px;border:1px solid var(--line-soft);border-radius:var(--radius);background:#fff;color:var(--ink);cursor:pointer}.danger{color:#dc2626}.link{background:none;border:0;padding:0 4px;font:600 14px var(--font);color:var(--primary);cursor:pointer}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:10px 8px;border-bottom:1px solid #eef2f7;vertical-align:top}th{color:var(--muted);font-weight:600;white-space:nowrap}.row-actions{white-space:nowrap}.pill{display:inline-block;padding:2px 10px;border-radius:100px;font-size:12px;background:#e2e8f0}.pill.s1{background:#dbeafe;color:#1d4ed8}.pill.s2{background:#dcfce7;color:#15803d}.pill.s3{background:#fef3c7;color:#b45309}.result{white-space:pre-wrap;font:13px var(--font);background:#f8fafc;padding:10px;border-radius:var(--radius)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:flex-start;justify-content:center;padding:24px 12px;background:#0f172a80;overflow-y:auto}.modal-card{width:760px;max-width:100%;background:#fff;border-radius:var(--radius);padding:20px;color:var(--ink)}.modal-card>h2{margin:0 0 14px;font-size:18px}.modal-card .panel{border:0;padding:0;margin:0}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600}.field.wide{grid-column:1 / -1}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}@media (max-width: 600px){.banner{height:91px;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:11px 46px 0 20px}.banner-main{flex:none;align-items:flex-start}.banner-icon{margin-top:5px}.banner-text{padding-top:0}.banner-links{justify-content:center;margin:10px 0 0 24px;gap:20px}.stage{padding:20px}.card{padding:23px 22px 27px}.grid{grid-template-columns:1fr}}.panel h3{margin:18px 0 6px;font-size:15px}.tools input.grow{flex:1 1 280px}.howto{font-size:14px;line-height:1.7;background:#f8fafc;border:1px solid #eef2f7;border-radius:var(--radius);padding:12px 16px;margin-bottom:12px}.howto p{margin:0 0 8px}.howto ol{margin:0 0 8px;padding-left:20px}.howto code{font-size:12.5px;background:#e8eef7;padding:1px 5px;border-radius:4px;word-break:break-all}.howto a{color:var(--primary)}input[type=password],.main input[type=password]:not(.file),.modal-card input[type=password]{font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif!important;font-size:17px;font-weight:400;letter-spacing:2px;-webkit-text-security:disc}input[type=password]::placeholder{font-family:var(--font);letter-spacing:0;font-size:15px}.sso-or{display:flex;align-items:center;gap:12px;margin:18px 0 12px;color:#6b7280;font-size:14px}.sso-or:before,.sso-or:after{content:"";flex:1;height:1px;background:#e5e7eb}.sso-btn{display:flex;justify-content:center;min-height:44px}:root{--side-bg: #14203b;--side-active: #313b53;--side-line: #374158;--side-text: #dde8f8;--side-sub: #c0d1ed;--side-btn: #eef2f6;--page-bg: #f5f7fb;--box-border: #dde3ed;--head-ink: #212936;--num-ink: #14203b;--soft-ink: #677489;--info-bg: #eff5fe;--info-line: #5d85c8;--info-ink: #3d5476;--btn-blue: #3156bf;--field-line: #cdd5e0}.app-in{background:var(--page-bg)}.portal{min-height:100vh;display:flex;background:var(--page-bg);color:var(--head-ink)}.topbar{display:none}.side{position:sticky;top:0;flex:none;width:249px;height:100vh;overflow-y:auto;display:flex;flex-direction:column;background:var(--side-bg);color:var(--side-text);padding:0 16px 16px}.side-brand{display:flex;gap:10px;align-items:flex-start;padding:30px 3px 22px;border-bottom:1px solid var(--side-line)}.side-logo{flex:none;width:48px;height:48px;border-radius:3px;background:#fff;display:grid;place-items:center}.side-logo .emblem{width:42px;height:42px;object-position:center}.side-brand strong{display:block;font-size:18px;line-height:22px;color:#fff}.side-brand span{display:block;margin-top:5px;font-size:13px;color:var(--side-sub)}.side-nav{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding-top:20px;flex:1}.side-item{display:inline-flex;align-items:center;gap:4px;height:46px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:var(--side-text);font:700 17px var(--font);cursor:pointer;text-align:left}.side-item:hover{background:#ffffff0f}.side-item.on{background:var(--side-active);color:#fff}.side-icon{display:inline-block;width:16px;font-size:14px;text-align:center}.side-user{border-top:1px solid var(--side-line);padding:18px 10px 0;font-size:13.5px;line-height:19px}.side-user strong{display:block;font-size:13.5px;color:var(--side-text)}.side-user span{display:block;color:var(--side-text)}.side-btns{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:10px}.side-btns button{height:32px;padding:0 12px;border:0;border-radius:7px;background:var(--side-btn);color:var(--num-ink);font:700 14px var(--font);cursor:pointer}.side-btns button:hover{background:#fff}.side-shade{display:none}.main{flex:1;min-width:0;padding:30px 42px 48px}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}.page-head h1{margin:0;font-size:25px;line-height:34px;font-weight:700;color:var(--head-ink)}.page-head p{margin:2px 0 0;font-size:15px;color:var(--soft-ink)}.btn-outline{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 15px;background:#fff;color:var(--head-ink);border:1px solid var(--box-border);border-radius:8px;font:700 14px var(--font);cursor:pointer;text-decoration:none;white-space:nowrap}.btn-outline:hover{background:#f8fafc}.btn-outline:disabled{color:#a0aabb;cursor:default}.page-head .btn-outline{height:45px}.btn-lg{height:45px!important;padding:0 16px;font-size:16.5px}.btn-sm{height:30px;padding:0 10px;font-size:12.5px}.main .btn-primary{background:var(--btn-blue)}.main .btn-primary:hover{background:#2747a6}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.stat{background:#fff;border:1px solid var(--box-border);border-radius:8px;height:100px;padding:17px}.stat span{display:block;font-size:14px;color:var(--soft-ink)}.stat strong{display:block;margin-top:2px;font-size:32px;line-height:42px;color:var(--num-ink)}.info{background:var(--info-bg);border-left:3px solid var(--info-line);border-radius:4px;color:var(--info-ink);padding:10px 14px;font-size:14.5px;line-height:21px;margin-bottom:12px}.info-in{margin:4px 0 18px}.plain-note{margin:0 0 4px;font-size:14.5px;color:var(--soft-ink)}.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.box{background:#fff;border:1px solid var(--box-border);border-radius:8px;padding:20px;margin-bottom:16px}.box h2{margin:6px 0 16px;font-size:19px;color:var(--head-ink)}.box-line{margin:0 0 18px;font-size:16.5px;font-weight:600}.box-muted{margin:0 0 12px;font-size:14.5px;color:var(--soft-ink)}.grid3,.grid2,.grid4{display:grid;gap:16px}.grid3{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:25px;margin-bottom:25px}.grid2{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:26px}.grid4{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 6px}.f{display:flex;flex-direction:column;gap:8px;font-size:14.5px;font-weight:700;color:var(--head-ink);min-width:0}.f-wide{grid-column:1 / -1;margin-bottom:4px}.f-full{grid-column:1 / -1}.main input:not([type=radio]):not([type=checkbox]):not(.file),.main select,.main textarea{width:100%;min-width:0;height:45px;padding:0 12px;font:500 16.5px var(--font);color:var(--head-ink);background:#fff;border:1px solid var(--field-line);border-radius:6px;outline:none}.main textarea{height:auto;padding:10px 12px;line-height:1.6;resize:vertical}.main input:focus,.main select:focus,.main textarea:focus{border-color:var(--btn-blue);box-shadow:0 0 0 3px #3156bf1f}.main input::placeholder{color:#7b8698}.file{width:100%;padding:10px 12px;border:1px solid var(--field-line);border-radius:6px;font:15px var(--font);background:#fff}.hint{margin:6px 0 18px;font-size:14.5px;color:var(--soft-ink)}.btn-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}.btn-row .btn-primary.btn-inline{height:38px}.btn-row-tight{margin:4px 0 0}.btn-end{justify-content:flex-end;margin-top:14px}.count{margin:2px 0 0;font-size:14px;color:var(--soft-ink)}.empty{text-align:center;color:var(--soft-ink);font-size:17px;padding:40px 0 44px;margin:0}.pager{display:flex;justify-content:flex-end;gap:8px}.pager .btn-outline{height:34px;font-size:13px}.plan-list{list-style:none;margin:12px 0;padding:0}.plan-row{display:flex;justify-content:space-between;gap:14px;padding:14px 0;border-top:1px solid #eef2f7}.plan-row:first-child{border-top:0}.plan-main{min-width:0}.plan-title{background:none;border:0;padding:0;text-align:left;font:700 15px var(--font);color:var(--head-ink);cursor:pointer}.plan-title:hover{color:var(--btn-blue);text-decoration:underline}.plan-meta{margin-top:3px;font-size:12.5px;color:var(--soft-ink)}.plan-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none}.plan-actions{display:flex;gap:6px}.pill{white-space:nowrap}.pill-ok{background:#dcfce7;color:#166534}.pill-warn{background:#fef3c7;color:#92400e}.pill-wait{background:#dbeafe;color:#1e40af}.pill-todo{background:#ede9fe;color:#5b21b6}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.modal-head h2{margin:0 0 12px;font-size:19px}.modal-sm{width:480px}.modal-card h3{margin:18px 0 8px;font-size:15px}.modal-card .f{margin-bottom:10px}.modal-card input:not([type=radio]):not(.file),.modal-card textarea{width:100%;padding:9px 12px;font:15px var(--font);border:1px solid var(--field-line);border-radius:6px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px;font-size:14px}.detail-grid span{display:block;font-size:12px;color:var(--soft-ink)}.files{margin:0;padding-left:18px;font-size:14px;line-height:1.9}.files small,.detail-grid small{color:var(--soft-ink)}.action{margin-top:14px;padding:14px;border:1px solid var(--box-border);border-radius:8px;background:#fafbfd}.action h3{margin-top:0}.action .file{margin-bottom:10px}.radio-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:4px 0 12px;font-size:14px}.range{display:inline-flex;gap:6px}.range input{width:90px!important;padding:6px 8px!important}.history{margin:0;padding-left:18px;font-size:13.5px;line-height:1.8}.pre{white-space:pre-wrap;font-size:14px;line-height:1.7;margin:0}.sig-pad{width:100%;height:auto;aspect-ratio:3 / 1;border:1px dashed #94a3b8;border-radius:8px;background:#fff;touch-action:none;margin-bottom:10px}.sig-now{height:40px;vertical-align:middle}.btn-file{cursor:pointer}.search-wide{margin-bottom:10px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#14203b;color:#fff;padding:10px 18px;border-radius:8px;font-size:14px;z-index:30}.main .panel{padding:20px}@media (max-width: 1100px){.stats,.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 900px){.portal{display:block}.topbar{position:sticky;top:0;z-index:15;display:flex;align-items:center;gap:10px;height:52px;padding:0 12px;background:var(--side-bg);color:#fff;font-size:16px}.menu-btn{width:40px;height:40px;border:0;border-radius:8px;background:transparent;color:#fff;font-size:22px;cursor:pointer}.side{position:fixed;left:0;top:0;z-index:25;transform:translate(-100%);transition:transform .2s;box-shadow:4px 0 20px #0000004d}.side.open{transform:none}.side-shade{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#0f172a73}.main{padding:22px 16px 40px}.two-col,.grid3,.grid2,.detail-grid{grid-template-columns:minmax(0,1fr)}}@media (max-width: 560px){.grid4{grid-template-columns:minmax(0,1fr)}.stats{gap:10px}.stat{height:auto;padding:12px}.plan-row{flex-direction:column}.plan-side{align-items:flex-start}.page-head{flex-direction:column}}
