.head{background:var(--bg-soft);border-bottom:1px solid var(--line);padding-block:clamp(26px,4vw,48px) 26px}.head .lead{max-width:64ch}.crumb{margin-bottom:10px;color:var(--fg-faint)}.crumb a{color:var(--fg-mut)}.trust{display:flex;gap:.5em;align-items:center;margin:0 0 18px;font-size:.88rem;color:var(--ok);font-weight:600}#abc-app,.head{--cA: var(--accent);--cB: var(--brand-2);--cC: var(--ok)}.tA{color:var(--cA)}.tB{color:var(--cB)}.tC{color:var(--cC)}.steps{list-style:none;display:flex;gap:8px;padding:0;margin:0;flex-wrap:wrap}.steps li{display:flex;align-items:center;gap:.5em;font-size:.88rem;font-weight:600;color:var(--fg-faint);padding:.35em .9em .35em .4em;border-radius:999px;border:1px solid var(--line);background:var(--surface)}.steps li span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.78rem;background:var(--bg-sunk);color:var(--fg-mut)}.steps li.on{color:var(--fg);border-color:var(--brand-2)}.steps li.on span{background:var(--brand);color:var(--on-brand)}.steps li.done span{background:var(--ok);color:var(--on-brand)}.app{padding-block:26px 60px;display:grid;grid-template-columns:minmax(0,1fr);gap:20px}.panel h2{font-size:1.22rem;display:flex;align-items:center;gap:.55em;margin-bottom:.8em}.panel h3{font-size:1.1rem}.num{width:30px;height:30px;border-radius:50%;display:inline-grid;place-items:center;background:var(--brand);color:var(--on-brand);font-size:.95rem;flex:none}.tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:16px}.tab{font:inherit;font-size:.92rem;font-weight:600;cursor:pointer;color:var(--fg-mut);background:none;border:0;border-bottom:3px solid transparent;padding:.55em .9em;margin-bottom:-1px}.tab:hover{color:var(--fg)}.tab.on{color:var(--brand-2);border-bottom-color:var(--accent)}.drop{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:34px 18px;border:2px dashed var(--line-2);border-radius:var(--radius);background:var(--bg-soft);cursor:pointer;transition:border-color .15s,background .15s}.drop:hover,.drop.over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--bg-soft))}.drop:focus-within{outline:3px solid var(--accent);outline-offset:2px}.drop-ic svg{width:46px;height:46px;fill:none;stroke:var(--brand-2);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}textarea#paste{width:100%;font:.88rem/1.5 ui-monospace,Consolas,monospace;padding:.7em .85em;margin-bottom:10px;color:var(--fg);background:var(--bg);border:1px solid var(--line-2);border-radius:var(--radius-sm);resize:vertical}kbd{font:.8em ui-monospace,Consolas,monospace;padding:.1em .4em;border:1px solid var(--line-2);border-radius:4px;background:var(--bg-soft)}.hint{margin-top:18px;padding:12px 16px;border-radius:var(--radius-sm);background:var(--bg-soft);display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap;font-size:.9rem}.hint ul{margin:.2em 0 0;padding-left:1.2em}.msg{margin:12px 0 0;font-size:.9rem;font-weight:600;min-height:1em}.msg:empty{display:none}.msg.err{color:var(--warn)}.msg.ok{color:var(--ok)}.src-row{display:flex;justify-content:space-between;align-items:center;gap:8px 14px;flex-wrap:wrap;margin-bottom:12px}.src-row p{margin:0}.js-reset:hover{border-color:var(--warn);color:var(--warn)}.mode{border:0;padding:0;margin:0 0 14px;display:flex;gap:8px 22px;flex-wrap:wrap}.mode legend{font-size:.88rem;font-weight:600;margin-bottom:.4em;padding:0}.mode label{display:flex;gap:.45em;align-items:center;font-size:.93rem;cursor:pointer}.mode input{accent-color:var(--accent);width:17px;height:17px}.maprow{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 16px}.field select.bad{border-color:var(--warn)}.preview-wrap{margin-top:14px;border:1px solid var(--line);border-radius:var(--radius-sm)}.tbl{width:100%;border-collapse:collapse;font-size:.88rem}.tbl th,.tbl td{padding:8px 11px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.tbl th{background:var(--bg-soft);font-weight:600;font-size:.82rem;color:var(--fg-mut);position:sticky;top:0}.tbl td.n,.tbl th.n{text-align:right;font-variant-numeric:tabular-nums}.tbl td.nm{white-space:normal;min-width:180px}.preview th .tag{display:inline-block;margin-left:.4em;font-size:.7rem;padding:.05em .45em;border-radius:999px;background:var(--brand);color:var(--on-brand)}.preview td.used{background:color-mix(in srgb,var(--brand-2) 7%,transparent)}.res-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.res-head h2{margin:0}.cut{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin:16px 0;padding:12px 14px;border-radius:var(--radius-sm);background:var(--bg-soft)}.cut-in{font-size:.88rem;display:flex;align-items:center;gap:.4em}.cut-in input{width:64px;font:inherit;padding:.3em .45em;border:1px solid var(--line-2);border-radius:7px;background:var(--bg);color:var(--fg);text-align:right}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{font:inherit;font-size:.84rem;font-weight:600;cursor:pointer;padding:.3em .85em;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--fg-mut)}.chip:hover{border-color:var(--brand-2);color:var(--brand-2)}.chip.on{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}.headline{font-size:clamp(1.05rem,.95rem + .5vw,1.3rem);font-weight:600;line-height:1.55;margin:6px 0 18px;padding-left:14px;border-left:4px solid var(--accent-2)}.headline b{color:var(--cA)}.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.kpi{border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 16px;background:var(--surface);border-top:4px solid var(--c, var(--line-2))}.kpi .k{display:flex;align-items:center;gap:.5em;font-weight:700}.kpi .k i{font-style:normal;width:26px;height:26px;border-radius:7px;display:grid;place-items:center;background:var(--c);color:var(--on-accent);font-size:.9rem}.kpi .v{font-size:1.5rem;font-weight:700;line-height:1.2;margin-top:6px;font-variant-numeric:tabular-nums}.kpi .s{font-size:.82rem;color:var(--fg-mut)}.kpi .bar{height:6px;border-radius:3px;background:var(--bg-sunk);margin-top:8px;overflow:hidden}.kpi .bar span{display:block;height:100%;background:var(--c)}.chart{margin:22px 0 0}.chart-box{margin-top:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}.chart-box svg{width:100%;min-width:640px;height:auto;display:block}.chart-box .ax{stroke:var(--line-2);stroke-width:1}.chart-box .grid-l{stroke:var(--line);stroke-width:1}.chart-box .ref{stroke:var(--fg-faint);stroke-dasharray:5 4;stroke-width:1.2}.chart-box text{fill:var(--fg-mut);font-size:12px;font-family:var(--font)}.chart-box .cum{fill:none;stroke:var(--fg);stroke-width:2.4;stroke-linejoin:round}.chart-box .cA{fill:var(--cA)}.chart-box .cB{fill:var(--cB)}.chart-box .cC{fill:var(--cC)}.chart-box .lg text{font-size:12.5px;fill:var(--fg)}.warn-box{margin-top:18px;border-left:3px solid var(--warn);background:var(--bg-soft);border-radius:var(--radius-sm);padding:12px 16px;font-size:.9rem}.warn-box ul{margin:.3em 0 0;padding-left:1.2em}.policy{margin-top:6px}.pol{border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px;position:relative;border-top:4px solid var(--c)}.pA{--c: var(--cA)}.pB{--c: var(--cB)}.pC{--c: var(--cC)}.pol .cls{position:absolute;top:12px;right:14px;font-size:1.6rem;font-weight:800;color:var(--c);opacity:.9}.pol h4{margin:0 0 4px;font-size:1rem}.pol p{margin:0 0 8px}.pol ul{margin:0;padding-left:1.15em}.pol li{margin-bottom:.3em}.tbl-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.tbl-head h3{margin:0}.search{font:inherit;font-size:.9rem;padding:.42em .8em;border:1px solid var(--line-2);border-radius:999px;background:var(--bg);color:var(--fg);min-width:200px}.result{font-size:.87rem}.result tbody tr:hover{background:var(--bg-soft)}.cls-b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;font-weight:700;font-size:.8rem;color:var(--on-accent)}.cls-b.A{background:var(--cA)}.cls-b.B{background:var(--cB)}.cls-b.C{background:var(--cC)}#more{margin-top:14px}.rel{display:flex;flex-direction:column;gap:6px;padding:16px;box-shadow:none}.rel p{margin:0;color:var(--fg)}.rel .badge{align-self:flex-start}.rel .go{margin-top:auto;font-weight:700;font-size:.88rem;color:var(--accent)}.next .cta{margin-top:18px}.method summary{cursor:pointer}.method .prose{margin-top:10px;max-width:none}.method-hero{margin:2px 0 16px;padding:10px 16px;max-width:880px;box-shadow:none;border-left:3px solid var(--accent-2)}.method-hero summary{list-style:none;display:flex;align-items:center;gap:.5em;color:var(--brand-2);font-size:.95rem}.method-hero summary::-webkit-details-marker{display:none}.method-hero summary:before{content:"💡"}.method-hero summary:after{content:"▸";margin-left:auto;transition:transform .15s;color:var(--fg-faint)}.method-hero[open] summary:after{transform:rotate(90deg)}.method-hero .prose ol{margin-bottom:.6em}.method-hero .prose p{margin-bottom:0}@media(max-width:640px){.panel{padding:18px 16px}.search{min-width:0;width:100%}.tbl-head .row{width:100%}}.print-only{display:none}.pro{border:1px dashed var(--accent)!important}.pro ul{margin:6px 0 12px;padding-left:1.2em}@page{size:A4 portrait;margin:17mm 10mm 13mm;@top-right{content:"";width:26mm;vertical-align:bottom;background:url(/brand/logo-navy-400.png) right 2.5mm / auto 11mm no-repeat}@bottom-left{content:"SX Application";font:7.5pt Anuphan,Leelawadee UI,sans-serif;color:#7b8d9c}@bottom-center{content:"www.sourceexpert.co.th";font:7.5pt Anuphan,Leelawadee UI,sans-serif;color:#7b8d9c}@bottom-right{content:"หน้า " counter(page) " / " counter(pages);font:7.5pt Anuphan,Leelawadee UI,sans-serif;color:#7b8d9c}}@media print{html,body{background:#fff!important;font-size:10pt}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}section.head,#step1,#step2,.method,.hf,#more,.res-head .row,.cut,.tbl-head,figcaption{display:none!important}.print-only{display:block}.app{padding:0;gap:0}.wrap{max-width:none;padding:0}.card,.panel{box-shadow:none!important;border:0!important;padding:0!important;background:none!important;border-radius:0}.res-head h2{display:none}.rpt-head{border-bottom:2.5pt solid var(--brand);padding-bottom:6pt;margin-bottom:8pt}.rpt-head .t1{display:flex;justify-content:space-between;align-items:baseline;gap:10pt}.rpt-head h1{font-size:16pt;margin:0;color:var(--brand)}.rpt-head .brand{font-size:9pt;font-weight:700;color:var(--brand);white-space:nowrap}.rpt-head dl{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:1pt 10pt;margin:5pt 0 0;font-size:8.5pt}.rpt-head dt{color:#4e6274}.rpt-head dd{margin:0;font-weight:600}.headline{font-size:11.5pt;margin:0 0 8pt;padding-left:8pt;border-left-width:3pt}.kpis{grid-template-columns:repeat(4,1fr);gap:6pt;break-inside:avoid}.kpi{padding:6pt 8pt;border-top-width:3pt}.kpi .v{font-size:14pt}.kpi .s{font-size:7.5pt}.chart{margin:8pt 0 0;break-inside:avoid}.chart-box{overflow:visible}.chart-box svg{min-width:0}.warn-box{margin-top:6pt;padding:5pt 9pt;font-size:8.5pt;break-inside:avoid}.pol-card{margin-top:8pt}.pol-card h3{font-size:11pt;margin:0 0 5pt}.policy{grid-template-columns:repeat(3,1fr);gap:6pt}.pol{padding:6pt 8pt;border-top-width:3pt;break-inside:avoid}.pol h4{font-size:9.5pt}.pol .cls{font-size:13pt;top:5pt;right:8pt}.pol p,.pol ul{font-size:7.8pt;line-height:1.4}.pol li{margin-bottom:1pt}.tbl-card{break-before:page}.tbl-card .print-only{font-size:11pt;font-weight:700;margin:0 0 4pt;color:var(--brand)}.tbl-card .rpt-notes{font-size:7.8pt;font-weight:400;color:#33475b;margin-top:8pt;border-top:1pt solid #d5dee7;padding-top:5pt;break-inside:avoid}.rpt-notes h4{font-size:9pt;margin:0 0 2pt;color:var(--brand)}.rpt-notes ul{margin:0;padding-left:12pt}.rpt-notes li{margin:0 0 1pt}.scroller{overflow:visible!important}.result{font-size:7.6pt;table-layout:fixed;width:100%}.result th,.result td{padding:1.6pt 3pt;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result th{position:static;font-size:7pt;background:#e7edf3!important;color:#14212e}.result td.nm{white-space:nowrap;min-width:0}.result tr{break-inside:avoid}.result thead{display:table-header-group}.result tbody tr:nth-child(2n) td{background:#f3f6f9}.cls-b{width:13pt;height:11pt;font-size:7pt;border-radius:2pt}.result col.c-rank{width:5%}.result col.c-code{width:10%}.result col.c-name{width:33%}.result col.c-cost,.result col.c-qty{width:9%}.result col.c-val{width:12%}.result col.c-pct{width:7%}.result col.c-cum{width:8%}.result col.c-cls{width:7%}}