*{box-sizing:border-box}body{margin:0;font:15px/1.4 system-ui,-apple-system,Segoe UI,Noto Sans Thai,sans-serif;color:#1a1a1a;background:#fff}main{padding:12px 16px;max-width:1100px;margin:0 auto}main.narrow{max-width:380px;padding-top:48px}h1{font-size:20px;margin:4px 0 12px}.topbar{display:flex;gap:12px;align-items:center;padding:8px 16px;border-bottom:1px solid #ccc;flex-wrap:wrap}.topbar strong{margin-right:auto}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.stack{display:flex;flex-direction:column;gap:10px}.card{border:1px solid #ccc;padding:12px;margin-bottom:12px;max-width:420px}label{display:flex;flex-direction:column;gap:4px;font-size:14px}input,select,button{font:inherit;padding:6px 8px;border:1px solid #999;border-radius:3px;background:#fff}button{cursor:pointer;background:#f2f2f2}button:disabled{opacity:.6;cursor:default}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:520px}th,td{border:1px solid #d0d0d0;padding:6px 8px;text-align:left;white-space:nowrap}th{background:#f2f2f2;font-weight:600}tbody tr:nth-child(2n){background:#fafafa}.num{text-align:right}.muted{color:#666;font-size:13px}.error{color:#b00020}h2{font-size:16px;margin:20px 0 8px}.topbar nav{display:flex;gap:12px}.topbar nav a{color:#1a1a1a;text-decoration:none;padding:2px 4px}.topbar nav a.active{font-weight:600;border-bottom:2px solid #1a1a1a}a{color:#1a4fa0}label.inline{flex-direction:row;align-items:center;gap:6px}label.inline input{padding:0}tr.clickable{cursor:pointer}tr.clickable:hover{background:#eef3fb}tr.inactive td,tr.voided td{color:#888}tr.voided td{text-decoration:line-through}tr.voided td:last-child,tr.voided td.wrap{text-decoration:none}td.wrap{white-space:normal;min-width:160px}.ok{color:#1b7f3b}button.small{padding:2px 8px;font-size:13px}table.kv{width:auto;min-width:0}table.kv th{text-align:left;width:170px}table.kv th,table.kv td{white-space:normal}table.kv select{max-width:100%}@media (max-width: 600px){table.kv th{width:40%}table.kv{width:100%}}a.plain{color:inherit;text-decoration:none}@media (max-width: 600px){.hide-sm{display:none}main{padding:10px 12px}th,td{padding:5px 6px}table{min-width:0;font-size:14px}}@media (max-width: 600px){th,td{padding:5px 4px;font-size:13px}}p.updated{margin:-6px 0 10px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}button.qual.on{background:#1b7f3b;color:#fff;border-color:#1b7f3b;font-weight:600}@media (max-width: 600px){button.small{padding:2px 5px}}.card.wide{max-width:none}.warn{color:#8a5a00;background:#fff6e0;padding:6px 8px;border:1px solid #f0d58a}tr.sub td{background:#fff8f0;font-size:13px}details summary{cursor:pointer;margin-bottom:6px}details label{margin-bottom:6px}ul.tight{margin:4px 0 12px;padding-left:20px}ul.tight li{margin:2px 0}.search-wrap{max-width:560px}input.big-search{width:100%;font-size:17px;padding:10px 12px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:flex-start;justify-content:center;padding:40px 12px;z-index:10}.modal{background:#fff;width:100%;max-width:860px;max-height:calc(100vh - 80px);display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid #999}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-body{overflow:auto}button.add-btn{background:#1a4fa0;color:#fff;border-color:#1a4fa0;font-weight:600;white-space:nowrap}@media (max-width: 600px){.modal-backdrop{padding:8px}.modal{max-height:calc(100vh - 16px)}}tbody tr.row-red td{background:#fde2e2}tbody tr.row-blue td{background:#dce9fb}tbody tr.row-green td{background:#d9f2df}p.legend{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 4px;font-size:13px}.chip{padding:2px 8px;border:1px solid #ccc}.chip.row-red{background:#fde2e2}.chip.row-blue{background:#dce9fb}.chip.row-green{background:#d9f2df}td.status{white-space:normal;min-width:110px}@media (max-width: 600px){td.status{min-width:84px}}.belt{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.belt-bar{display:inline-block;width:34px;height:14px;border:1px solid #555;border-radius:2px;flex:none}@media (max-width: 600px){.belt-bar{width:32px;height:14px}.belt-name{display:none}}