@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Prompt:wght@500;600;700&display=swap");:root{--ink:#2d2440;--muted:#756d82;--green:#65458f;--green2:#432b68;--mint:#f4effa;--cream:#fcfbff;--line:#e8e0ef;--white:#fff;--red:#b42318;--amber:#9a6b16;--blue:#5d42a6;--gold:#d7b86a;--gold-soft:#f7efd9;--lavender:#eee7f7;--shadow:0 18px 55px rgba(68,43,104,.10)}*{box-sizing:border-box}body,html{margin:0;min-height:100%}body{color:var(--ink);background:linear-gradient(180deg,#fff 0,var(--cream) 100%);font-family:Noto Sans Thai,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.shell{min-height:100vh}.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:20;justify-content:space-between;padding:12px clamp(20px,4vw,60px);background:rgba(255,255,255,.93);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 4px 24px rgba(67,43,104,.04)}.brand,.topbar{display:flex;align-items:center}.brand{gap:11px;font-family:Prompt;font-weight:700;color:var(--green2)}.brand-logo{width:46px;height:46px;display:block;filter:drop-shadow(0 5px 10px rgba(67,43,104,.14))}.brand-copy{display:flex;flex-direction:column;line-height:1.05;letter-spacing:.04em}.brand-copy strong{font-size:17px}.brand-copy small{margin-top:5px;color:var(--gold);font-size:8px;letter-spacing:.16em}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;color:white;background:linear-gradient(145deg,var(--green),var(--green2))}.nav{display:flex;gap:6px;align-items:center}.link-button,.nav a{padding:9px 13px;border-radius:10px;color:#655c70;font-weight:600;border:0;background:transparent}.link-button:hover,.nav a.active,.nav a:hover{background:var(--mint);color:var(--green2)}.container{width:min(1180px,calc(100% - 36px));margin:0 auto;padding:34px 0 64px}.narrow{width:min(780px,calc(100% - 32px))}.hero{padding:64px 0 48px;background:radial-gradient(circle at 88% 16%,rgba(215,184,106,.24),transparent 23%),linear-gradient(135deg,#ffffff,#f4effa 48%,#ebe1f5);color:var(--ink);overflow:hidden;position:relative;border-bottom:1px solid #e3d7ed}.hero:before{width:340px;height:340px;background:linear-gradient(145deg,rgba(117,87,168,.11),rgba(215,184,106,.09));border-radius:46% 54% 58% 42%;right:7%;top:-140px;transform:rotate(20deg)}.hero:after,.hero:before{content:"";position:absolute}.hero:after{width:460px;height:460px;border:75px solid rgba(101,69,143,.055);border-radius:50%;right:-100px;top:-210px}.hero-inner{width:min(900px,calc(100% - 36px));margin:auto;position:relative;z-index:1}.eyebrow{font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:13px;color:var(--green)}h1,h2,h3{font-family:Prompt;margin:0;line-height:1.35}h1{font-size:clamp(32px,5vw,54px);max-width:760px}.hero p{max-width:700px;color:#665a73;font-size:17px;line-height:1.8}.steps{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:12px;gap:12px;margin-top:28px}.step{padding:15px;border:1px solid rgba(101,69,143,.14);border-radius:14px;background:rgba(255,255,255,.66);box-shadow:0 9px 24px rgba(68,43,104,.05);font-size:14px}.step b{display:block;font-size:18px;color:var(--gold)}.card,.panel{background:white;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.panel{padding:clamp(20px,4vw,38px)}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:24px}.section-head p,.subtle{margin:5px 0 0;color:var(--muted)}.form-section{padding:22px 0;border-top:1px solid var(--line)}.form-section:first-of-type{border-top:0;padding-top:0}.form-section h3{font-size:18px;margin-bottom:16px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:17px}.grid,.grid-3{display:grid;gap:17px}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:17px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}label{font-weight:600;font-size:14px}.required{color:var(--red)}input,select,textarea{width:100%;border:1px solid #dcd3e5;border-radius:10px;padding:11px 13px;background:white;color:var(--ink);outline:none;transition:.18s}input:focus,select:focus,textarea:focus{border-color:#8465aa;box-shadow:0 0 0 3px rgba(101,69,143,.11)}textarea{min-height:90px;resize:vertical}.radio-row{display:flex;gap:12px}.radio-card{flex:1 1;display:flex;align-items:center;gap:9px;border:1px solid var(--line);padding:12px;border-radius:11px;cursor:pointer}.radio-card input{width:auto}.file-help{color:var(--muted);font-size:12px}.notice{padding:14px 16px;border-radius:11px;background:var(--gold-soft);color:#72521c;border:1px solid #ead49b;font-size:14px}.alert{padding:12px 15px;border-radius:10px;margin-bottom:16px}.alert.error{background:#fef3f2;color:var(--red);border:1px solid #fecdca}.alert.success{background:#f3eef9;color:var(--green2);border:1px solid #d9cceb}.toast{position:fixed;top:84px;right:24px;z-index:100;width:min(390px,calc(100vw - 32px));display:flex;align-items:center;gap:12px;padding:15px 16px;border-radius:14px;background:white;border:1px solid var(--line);box-shadow:0 18px 50px rgba(45,36,64,.2);animation:toast-in .25s ease-out}.toast-success{border-left:4px solid var(--gold)}.toast-icon{width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:50%;color:white;background:linear-gradient(135deg,var(--green),var(--green2));font-weight:800}.toast div{display:grid;grid-gap:2px;gap:2px;flex:1 1}.toast div b{color:var(--green2);font-size:14px}.toast div span{color:var(--muted);font-size:13px}.toast button{align-self:flex-start;border:0;background:transparent;color:var(--muted);font-size:22px;line-height:1;padding:0 2px}@keyframes toast-in{0%{opacity:0;transform:translateY(-10px) translateX(10px)}to{opacity:1;transform:none}}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:0;border-radius:10px;padding:11px 17px;font-weight:700;transition:.18s}.btn-primary{background:linear-gradient(135deg,var(--green),var(--green2));color:white;box-shadow:0 7px 16px rgba(67,43,104,.18)}.btn-primary:hover{background:linear-gradient(135deg,#73549d,#382153);transform:translateY(-1px)}.btn-secondary{background:var(--mint);color:var(--green2)}.btn-danger{background:#fef3f2;color:var(--red)}.btn-sm{padding:7px 10px;font-size:13px}.actions{gap:10px;flex-wrap:wrap}.actions,.submit-row{display:flex;align-items:center}.submit-row{justify-content:space-between;margin-top:24px;gap:18px}.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}.login-art{background:radial-gradient(circle at 82% 18%,rgba(233,210,150,.28),transparent 22%),linear-gradient(145deg,#33204f,#684893 72%,#8261a4);color:white;padding:10vw 7vw;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.login-art:after{content:"";position:absolute;width:410px;height:410px;border:70px solid rgba(255,255,255,.045);border-radius:50%;right:-170px;bottom:-160px}.login-art .brand{color:white;position:relative;z-index:1}.login-art .brand-copy small{color:#f0d995}.login-art h1{font-size:45px}.login-art p{color:#eee7f5;max-width:560px;font-size:17px;line-height:1.8}.login-box{display:grid;place-items:center;padding:30px}.login-card{width:min(430px,100%)}.login-card h2{font-size:30px}.login-form{display:grid;grid-gap:16px;gap:16px;margin-top:28px}.login-form .btn{width:100%;margin-top:5px}.demo-box{margin-top:22px;padding:13px;border-radius:10px;background:var(--mint);font-size:13px;color:#55426b;border-left:3px solid var(--gold)}.page-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.page-title h1{font-size:30px}.stats{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:16px;gap:16px;margin-bottom:24px}.stat{padding:20px}.stat-label{color:var(--muted);font-size:13px;font-weight:600}.stat-value{font:700 31px Prompt;margin:6px 0 2px}.stat-note{color:var(--green);font-size:12px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}td,th{padding:13px 15px;text-align:left;border-bottom:1px solid #edf0ee;vertical-align:middle}th{color:#685d75;font-size:12px;text-transform:uppercase;letter-spacing:.025em;background:#faf8fd}td{font-size:14px}tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;border-radius:100px;padding:5px 9px;font-size:12px;font-weight:700;white-space:nowrap}.badge.PENDING{color:var(--amber);background:#fff4e5}.badge.APPROVED,.badge.PAID{color:#513477;background:#f0eafa}.badge.CANCELLED,.badge.REJECTED,.badge.SUSPENDED{color:var(--red);background:#fef3f2}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap}.toolbar input{max-width:340px}.empty{padding:45px;text-align:center;color:var(--muted)}.detail-grid{display:grid;grid-template-columns:2fr 1fr;grid-gap:20px;gap:20px}.info-list{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:20px;gap:20px}.info-item span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}.info-item b{font-weight:600}.stack{display:grid;grid-gap:16px;gap:16px}.document-row{display:grid;grid-gap:11px;gap:11px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fbf9fd}.document-title{display:flex;justify-content:space-between;gap:14px;align-items:center}.document-title a{color:var(--green2);overflow-wrap:anywhere}.document-title a:hover{text-decoration:underline}.document-title span{color:var(--muted);font-size:12px;white-space:nowrap}.document-title .document-type-label{display:block;margin-top:3px;white-space:normal;color:var(--green2);font-weight:600}.document-controls{display:grid;grid-template-columns:1.1fr 1.6fr auto auto;grid-gap:9px;gap:9px;align-items:center}.document-controls input,.document-controls select{padding:8px 10px;font-size:13px}.document-upload{margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}.document-upload h3{font-size:17px;margin-bottom:15px}.kpi-bar{height:9px;background:#eee8f3;border-radius:9px;overflow:hidden}.kpi-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--gold));border-radius:9px}.footer{text-align:center;color:var(--muted);font-size:13px;padding:22px}@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.detail-grid,.login-wrap{grid-template-columns:1fr}.login-art,.nav a{display:none}.nav a:last-of-type{display:block}.document-controls{grid-template-columns:1fr 1fr}.document-controls .btn{width:100%}}@media(max-width:620px){.grid,.grid-3,.info-list,.steps{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.container{width:min(100% - 24px,1180px);padding-top:22px}.panel{border-radius:14px}.page-title,.submit-row{align-items:stretch;flex-direction:column}.btn{width:100%}.radio-row{flex-direction:column}.topbar{padding:11px 14px}.stat-value{font-size:25px}.document-controls{grid-template-columns:1fr}.document-upload .field{grid-column:auto!important}}