:root{font-family:"Leelawadee UI","Noto Sans Thai",Tahoma,system-ui,sans-serif;color:#213b3a;background:#f5f6f2;font-size:15px;line-height:1.65;--ink:#143f3c;--muted:#6c7c78;--line:#dde5df;--green:#136e5f;--soft:#e5efe9;--gold:#c49547}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:10px 16px;background:white;color:var(--ink);font-weight:600}button:hover{background:#edf3ef}button.primary{background:var(--green);border-color:var(--green);color:white}button.danger{color:#a03836}button:disabled{opacity:.5;cursor:wait}input,select,textarea{width:100%;border:1px solid #bbcfc5;background:white;border-radius:7px;padding:10px 12px;color:var(--ink);min-height:44px}textarea{min-height:80px}input[type=checkbox]{width:20px;min-height:20px;accent-color:var(--green)}label{display:grid;gap:5px;font-weight:600}small,.muted{color:var(--muted);font-size:13px}h1,h2,h3,p{margin-top:0}h1{font-size:29px;line-height:1.4;letter-spacing:-.5px;margin-bottom:8px}h2{font-size:19px;margin-bottom:16px}h3{font-size:16px}a{color:var(--green)}.skip{position:fixed;top:-60px;left:10px;background:white;padding:10px;z-index:20}.skip:focus{top:10px}.shell{display:grid;grid-template-columns:242px 1fr;min-height:100vh}.sidebar{background:var(--ink);color:#e7f0e7;padding:30px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;margin-bottom:36px;color:inherit}.mark{width:40px;height:40px;background:#d9e8b2;color:var(--ink);border-radius:12px;display:grid;place-items:center;font:bold 20px Georgia}.brand strong{font-size:18px;letter-spacing:-.5px}.brand small{display:block;color:#b0c7be;font-size:11px;letter-spacing:1px}.nav{display:grid;gap:8px}.nav button{background:transparent;border-color:transparent;color:#bed3cb;text-align:left;padding:12px 14px}.nav button.active,.nav button:hover{background:#285953;color:white}.nav button span{font-size:12px;margin-right:13px;color:#b4cb95}.sidebar-footer{margin-top:auto;padding:20px 5px 0;font-size:12px;color:#a7c4b9;border-top:1px solid #3a605a}.topbar{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:16px 36px;gap:20px}.topbar select{max-width:300px;font-size:14px}.identity{display:flex;align-items:center;gap:12px}.avatar{height:34px;width:34px;display:grid;place-items:center;background:var(--soft);border-radius:50%;font-weight:bold}.workspace{padding:32px 36px;max-width:1500px;margin:auto}.eyebrow{color:var(--green);font-size:11px;letter-spacing:1.6px;text-transform:uppercase;font-weight:bold;margin-bottom:6px}.page-heading{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-bottom:24px}.panel{background:white;border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:20px}.hero{background:#e8efe6;border-color:#d1ddcd}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.stat{border-top:3px solid #aac68d}.stat .number{font:500 29px system-ui,sans-serif;margin-top:12px;letter-spacing:-1px;color:var(--ink);overflow-wrap:anywhere}.stat small{display:block}.toolbar,.actions,.form-grid{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.form-grid>label{flex:1;min-width:160px}.toolbar label{min-width:140px;max-width:220px}.actions{align-items:center;margin-top:18px}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:14px}th{text-align:left;color:var(--muted);font-size:12px;font-weight:600;padding:12px;background:#f7f9f5;white-space:nowrap}td{border-bottom:1px solid #edf0ec;padding:14px 12px;vertical-align:top}td.numeric{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;background:#eef1ed;color:#5c6c62;font-size:12px;white-space:nowrap}.badge.success{background:#e1f0e5;color:#216b45}.badge.warning{background:#fcf1d9;color:#8b611e}.badge.error{background:#fbe5e4;color:#a23633}.notice{background:#eff4e9;border:1px solid #d2e0c5;border-radius:9px;padding:13px 16px;margin-bottom:18px}.notice.error{background:#fff0ee;border-color:#e8c1bb;color:#933d34}.notice.warning{background:#fff6e5;border-color:#e8d7b0;color:#7f6129}.empty{text-align:center;padding:44px 20px;color:var(--muted)}.empty strong{display:block;color:var(--ink);font-size:18px;margin-bottom:10px}.dropzone{border:2px dashed #c3d3c5;background:#f7faf4;text-align:center;padding:30px 24px;border-radius:10px;margin:18px 0}.dropzone input{background:white;text-align:left}.dropzone h3{font-size:18px;margin:6px}.steps{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:18px 0;font-size:12px}.steps span{background:var(--soft);padding:7px 12px;border-radius:7px}.file-detail{border-left:3px solid var(--gold)}.split{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.checkbox-row{display:flex;align-items:center;gap:10px;font-weight:normal;margin:10px 0}.login-page{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}.login-story{background:var(--ink);color:#edf3df;padding:60px 13%;display:flex;flex-direction:column;justify-content:space-between}.login-story .brand{margin:0}.login-story h1{font-size:43px;font-weight:500;line-height:1.5;max-width:480px}.login-story p{color:#b7cfc2;max-width:400px}.login-story .story-footer{font-size:12px;color:#b3c891;border-top:1px solid #45685e;padding-top:20px}.login-form{display:flex;align-items:center;justify-content:center;padding:35px}.login-card{max-width:390px;width:100%}.login-card form{display:grid;gap:20px}.login-card h1{margin-bottom:12px}.login-card .notice{margin-top:20px}.login-card button{padding:13px}.loading{text-align:center;padding:70px 20px;color:var(--muted)}.progress-note{font-size:13px;white-space:pre-wrap}.candidate-box{border:1px solid var(--line);border-radius:9px;padding:18px;margin-top:18px}.divider{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.calendar{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.calendar-cell{border-radius:7px;background:#f1f3ee;padding:9px;font-size:11px}.calendar-cell.published{background:#d9ecd8;color:#256b39}.period-title{font-size:18px;font-weight:bold}.login-card .primary{width:100%}.inline{display:inline-flex;gap:10px;align-items:center}.pending{color:#886519}.review-item{border-bottom:1px solid var(--line);padding:15px 0}.monospace{font:12px ui-monospace,monospace;overflow-wrap:anywhere}.subtle-link{border:0;padding:0;background:none;text-decoration:underline}.full{width:100%}details summary{cursor:pointer;font-weight:600;margin-bottom:10px}pre{font:12px ui-monospace,monospace;overflow:auto;max-height:320px;background:#f4f6f1;padding:14px;border-radius:7px}footer{font-size:12px;color:var(--muted);padding:10px 0 25px}.screen-reader{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1050px){.shell{grid-template-columns:205px 1fr}.workspace{padding:24px}.topbar{padding:15px 24px}.grid{grid-template-columns:1fr}.split{grid-template-columns:1fr}.login-story{padding:45px}.calendar{grid-template-columns:repeat(4,1fr)}}@media(max-width:700px){.shell{display:block}.sidebar{position:static;height:auto;padding:16px}.brand{margin-bottom:12px}.nav{display:flex;overflow:auto;gap:4px}.nav button{white-space:nowrap;font-size:13px;padding:9px}.sidebar-footer{display:none}.topbar{padding:12px 16px;align-items:start;flex-wrap:wrap}.workspace{padding:20px 14px}.page-heading{display:block}h1{font-size:24px}.panel{padding:18px}.grid.two{grid-template-columns:1fr}.login-page{display:block}.login-story{padding:28px;min-height:250px}.login-story h1{font-size:28px;margin-top:30px}.login-story .story-footer{display:none}.login-form{padding:30px 20px}.toolbar label{max-width:none;flex:1}.identity small{display:none}.calendar{grid-template-columns:repeat(4,1fr)}.actions button{flex:1}}
[hidden]{display:none!important}

/* Reconciliation remains exact and readable at narrow widths. */
.shell>div,.panel,.candidate-box{min-width:0}
.validation-table caption{text-align:left;font-size:14px;font-weight:600;padding:12px 0;color:var(--ink)}
.validation-table td:first-child{min-width:180px;max-width:260px}
.validation-table code{font:13px ui-monospace,monospace;overflow-wrap:anywhere}
.validation-table details{min-width:130px;max-width:260px}
.validation-table summary{padding:7px 0;min-height:44px;margin:0}
.validation-table tr.validation-mismatch{background:#fff4f1}
.validation-table .validation-mismatch .delta{font-weight:700;color:#9c3228}
button:disabled{cursor:not-allowed}
@media(max-width:700px){
 .validation-scroll{overflow:visible}
 .validation-table,.validation-table tbody{display:block;width:100%;min-width:0}
 .validation-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .validation-table tr{display:block;border:1px solid var(--line);border-radius:9px;margin:12px 0;padding:12px;overflow:hidden}
 .validation-table td,.validation-table td.numeric{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:10px;padding:9px 0;text-align:right;white-space:normal;font-size:14px;min-width:0;max-width:none;overflow-wrap:anywhere}
 .validation-table td:before{content:attr(data-label);font-size:12px;color:var(--muted);font-weight:600;text-align:left}
 .validation-table td:first-child{display:block;font-weight:600;border-bottom:1px solid var(--line);min-width:0}
 .validation-table td:first-child:before{display:none}
 .validation-table td[data-label^="เซลล์"]{display:block;text-align:left}
 .validation-table td[data-label^="เซลล์"]:before{display:block;margin-bottom:5px}
 .validation-table details{max-width:none;min-width:0}
 .validation-table code{font-size:13px}
 .file-detail .page-heading{flex-wrap:wrap}
}
.validation-table caption{display:block;width:100%}@media(min-width:701px){.validation-table caption{display:table-caption}}@media(max-width:700px){.validation-table td:first-child{text-align:left}}
