:root{color-scheme:light;--g:#166534;--gd:#14532d;--p:#f7faf8;--i:#1f2937;--m:#4b5563;--l:#e5e7eb;--w:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--p);color:var(--i);font:16px/1.65 system-ui,"Segoe UI","Noto Sans Thai",sans-serif}a{color:var(--g);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:var(--gd)}button,input,select,textarea{font:inherit}button{cursor:pointer}:focus-visible{outline:3px solid #87c99b;outline-offset:2px}[hidden]{display:none!important}
.skip{position:absolute;left:12px;top:-60px;padding:8px 12px;background:var(--gd);color:#fff;z-index:20}.skip:focus{top:10px;color:#fff}.container{width:min(100% - 36px,1160px);margin:auto}.header{background:#fff;border-bottom:1px solid var(--l)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--i);font-weight:800;letter-spacing:-.03em}.brand:hover{color:var(--i)}.logo{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--g);color:#fff;font-size:19px}.brand small{display:block;color:var(--g);font-size:11px;letter-spacing:.1em;text-transform:uppercase;line-height:1.1}.nav{display:flex;align-items:center;gap:25px}.nav a{color:var(--m);font-weight:650;text-decoration:none}.nav a:hover{color:var(--g)}.nav form{margin:0}.nav button{border:0;background:none;color:var(--m);font-weight:650}.nav button:hover{color:var(--g)}
.main{min-height:calc(100vh - 170px);padding:45px 0 85px}.eyebrow{margin:0 0 9px;color:var(--g);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.25;letter-spacing:-.025em}h1{font-size:clamp(2rem,4vw,3.2rem)}h2{font-size:1.5rem}h3{font-size:1.1rem}.lead{color:var(--m);font-size:1.1rem;max-width:670px}.page-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:27px}.page-head h1{margin:0 0 7px}.page-head .lead{margin:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 18px;border:1px solid var(--g);border-radius:11px;background:var(--g);color:#fff;font-weight:750;text-decoration:none;line-height:1.3}.button:hover{background:var(--gd);color:#fff}.button.light{background:#fff;color:var(--g)}.button.light:hover{background:#e9f5ec}.button.neutral{background:#fff;border-color:#cbd5cf;color:var(--i)}.button.neutral:hover{background:var(--p)}.button.danger{background:#fff;border-color:#c97c70;color:#a13329}.button.danger:hover{background:#fff3f1}.small{font-size:13px;color:var(--m)}
.notice{padding:15px 18px;border-radius:12px;border:1px solid #b4d9be;background:#edf8ef;color:var(--gd);margin:0 0 22px}.notice.warn{border-color:#e9d39d;background:#fff8e7;color:#795916}.card{min-width:0;background:#fff;border:1px solid var(--l);border-radius:18px;box-shadow:0 10px 35px rgba(31,41,55,.035)}.card-pad{padding:26px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:28px 0}.stat{padding:20px 22px}.stat span{display:block;color:var(--m);font-size:13px;overflow-wrap:anywhere}.stat strong{display:block;margin-top:8px;font-size:30px;line-height:1.1;color:var(--i)}.stat.accent{background:#eaf6ed;border-color:#cae5d2}.stat.accent strong{color:var(--g)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:35px 0 14px}.section-head h2{margin:0}.table-wrap{min-width:0;max-width:100%;overflow:auto}.table{width:100%;border-collapse:collapse;min-width:650px}.table th,.table td{text-align:left;padding:14px 17px;border-bottom:1px solid var(--l);vertical-align:top}.table th{background:#fbfcfb;color:var(--m);font-size:12px;font-weight:800}.table tr:last-child td{border-bottom:0}.table a{font-weight:750;text-decoration:none}.table .sub{display:block;color:var(--m);font-size:12px}.empty{padding:37px 24px;color:var(--m);text-align:center}.badge{display:inline-flex;align-items:center;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:800;white-space:nowrap}.badge.draft{background:#f0f2f1;color:#59645e}.badge.submitted{background:#fff3dc;color:#825900}.badge.revision_requested{background:#fff0ed;color:#a04030}.badge.approved{background:#e7f5eb;color:#166534}
.form-card{max-width:780px;padding:29px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}.field{margin-bottom:18px}.field.full{grid-column:1/-1}.field label{display:block;font-weight:750;margin-bottom:6px}.field input,.field select,.field textarea{width:100%;min-height:45px;padding:10px 12px;border:1px solid #cbd5cf;border-radius:9px;background:#fff;color:var(--i)}.field input[type="checkbox"]{width:auto;min-height:0;margin-right:8px}.field textarea{min-height:110px;resize:vertical}.field .hint{margin:6px 0 0;color:var(--m);font-size:13px}.actions{display:flex;flex-wrap:wrap;gap:10px;padding-top:6px}.login-layout{display:grid;grid-template-columns:1fr 440px;align-items:center;gap:80px}.login-intro h1 span{color:var(--g)}.login-intro .lead{max-width:520px}.login-points{list-style:none;padding:0;margin:28px 0}.login-points li{margin:13px 0;color:var(--m)}.login-points li::before{content:"✓";display:inline-grid;place-items:center;width:24px;height:24px;margin-right:11px;border-radius:7px;background:#e9f5ec;color:var(--g);font-weight:800}.login-card{padding:31px}.login-card h2{margin-bottom:7px}.login-card p{color:var(--m)}.login-card .button{width:100%}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.7fr);gap:22px}.meta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}.meta-item span{display:block;color:var(--m);font-size:12px}.meta-item strong{display:block;margin-top:2px;font-size:15px}.timeline{margin:0;padding:0;list-style:none}.timeline li{padding:16px 0;border-bottom:1px solid var(--l)}.timeline li:last-child{border:0}.timeline p{margin:6px 0 0;color:var(--m);font-size:14px}.review-box{margin-top:20px}.review-box h2{margin-bottom:14px}.inline-form{display:inline-block;margin:0}.preview-ribbon{margin-bottom:22px;padding:14px 17px;border-radius:11px;background:#fff8e7;border:1px solid #ead6a5;color:#6f5517}.preview-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:22px}.preview-grid>*{min-width:0}.preview-placeholder{padding:24px;border:1px dashed #b7c9bd;border-radius:14px;color:var(--m)}.muted{color:var(--m)}.footer{background:#fff;border-top:1px solid var(--l);padding:22px 0;color:var(--m);font-size:12px}
@media(max-width:850px){.login-layout{grid-template-columns:minmax(0,1fr);gap:25px;padding:35px 0}.login-card{max-width:500px}.detail-grid,.preview-grid{grid-template-columns:minmax(0,1fr)}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.container{width:min(100% - 28px,1160px)}.header-inner{align-items:start;padding:13px 0;flex-wrap:wrap}.nav{width:100%;gap:19px;flex-wrap:wrap;font-size:14px}.main{padding:31px 0 65px}.page-head{align-items:start;flex-direction:column}.stats{gap:9px}.stat{padding:15px}.stat strong{font-size:26px}.form-grid,.meta-grid{grid-template-columns:minmax(0,1fr)}.card-pad,.form-card,.login-card{padding:20px}.login-layout{display:block;min-height:0}.login-intro{overflow-wrap:anywhere}.login-card{width:100%;margin-top:30px}.login-intro h1{font-size:2.35rem}}