@import "https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{color:#111827;background:#f4f3ee;font-family:Plus Jakarta Sans,Noto Sans Thai,system-ui,sans-serif}button,input,select,textarea{font-family:inherit}button{cursor:pointer}input,select,textarea{background:#f9f8f4;border:1px solid #e5e4de;border-radius:10px;outline:none;width:100%;padding:11px 12px;font-size:15px}input:focus,select:focus,textarea:focus{border-color:#e8640a}textarea{resize:vertical;font-family:Courier New,Noto Sans Thai,monospace;font-size:13px;line-height:1.55}.app{background:#f4f3ee;max-width:560px;min-height:100vh;margin:0 auto;padding-bottom:84px}.loading,.login{flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.logoBig{font-size:44px}.loaderLine{background:#e8640a;border-radius:99px;width:42px;height:4px}.topbar{z-index:20;color:#fff;background:#131e2a;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;display:flex;position:sticky;top:0;box-shadow:0 2px 16px #00000040}.brand{white-space:nowrap;align-items:center;gap:8px;font-size:16px;font-weight:800;display:flex}.brand small{color:#ffffff9e;margin-top:2px;font-size:11px;display:block}.topActions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px;display:flex}.topBtn{color:#ffffffbf;background:0 0;border:0;border-radius:9px;padding:7px 10px;font-size:12px;font-weight:800}.topBtn.active{color:#fff;background:#e8640a}.loginCard{text-align:center;background:#fff;border:1px solid #e5e4de;border-radius:24px;flex-direction:column;gap:14px;width:min(92vw,440px);padding:24px;display:flex;box-shadow:0 18px 60px #131e2a1f}.loginCard h1{color:#1b2a3b;font-size:22px}.loginCard p{color:#6b7280;font-size:14px;line-height:1.5}.loginUsers{grid-template-columns:1fr 1fr;gap:8px;display:grid}.roleBtn{color:#1b2a3b;background:#f9f8f4;border:1px solid #e5e4de;border-radius:12px;padding:12px 10px;font-weight:800}.roleBtn.active{color:#fff;background:#1b2a3b;border-color:#1b2a3b}.languageRow{justify-content:center;gap:8px;display:flex}.languageRow button{color:#e8640a;background:#fff1e6;border:0;border-radius:10px;width:70px;padding:8px;font-weight:800}.screen{animation:.16s fade}.screen.noPad{padding:0}.dateStrip{color:#e8640a;background:#fff1e6;justify-content:space-between;align-items:center;padding:10px 16px;font-size:13px;display:flex}.dateStrip strong{color:#fff;background:#e8640a;border-radius:999px;padding:3px 9px;font-size:11px}.chips{gap:8px;padding:14px 16px 2px;display:flex;overflow:auto}.smallChips{padding-top:8px}.chip{background:#fff;border:2px solid #e5e4de;border-radius:999px;flex-shrink:0;padding:7px 15px;font-weight:700}.chip.active{color:#fff;background:#1b2a3b;border-color:#1b2a3b}.list{padding:12px 16px}.hint{color:#6b7280;margin-bottom:12px;font-size:13px;line-height:1.55}.card{background:#fff;border:1px solid #e5e4de;border-radius:14px;flex-direction:column;gap:9px;margin-bottom:10px;padding:14px;display:flex}.orderItem{background:#fff;border:1px solid #e5e4de;border-left-width:4px;border-radius:14px;align-items:center;gap:11px;margin-bottom:8px;padding:13px 14px;display:flex}.orderItem.selected{border-left-color:#e8640a}.orderItem strong{font-size:15px}.orderItem small{color:#6b7280;margin-top:2px;font-size:11px;display:block}.orderItem input{text-align:center;background:#fff;width:78px;font-size:18px;font-weight:800}.unit{color:#6b7280;width:58px;font-size:12px;font-weight:700}.grow{flex:1}.row{align-items:center;display:flex}.gap{gap:8px}.grid2{grid-template-columns:1fr 1fr;gap:8px;display:grid}.dashed{color:#1b2a3b;background:#fff;border:2px dashed #e5e4de;border-radius:14px;justify-content:center;align-items:center;gap:8px;width:100%;padding:13px;font-weight:800;display:flex}.bottomBar{z-index:15;background:#f4f3ee;border-top:1px solid #e5e4de;width:100%;max-width:560px;padding:12px 16px;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.primary{color:#fff;background:#e8640a;border:0;border-radius:13px;justify-content:center;align-items:center;gap:9px;padding:15px 16px;font-size:16px;font-weight:800;display:flex}.primary:disabled{color:#6b7280;cursor:default;background:#e5e4de}.primary.navy{background:#1b2a3b}.primary.small{padding:11px 14px;font-size:14px}.ghost{color:#6b7280;background:#fff;border:1px solid #e5e4de;border-radius:10px;justify-content:center;align-items:center;gap:7px;padding:11px 14px;font-weight:700;display:flex}.ghostMini{color:#1b2a3b;background:#fff;border:0;border-radius:8px;padding:8px 10px;font-weight:800}.full{width:100%}.successBox{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:46px 26px;display:flex}.successIcon{color:#1a9456;background:#e6f5ed;border-radius:50%;place-items:center;width:78px;height:78px;font-size:34px;display:grid}.successBox h2{color:#1b2a3b}.successBox p,.empty p{color:#6b7280;font-size:14px;line-height:1.6}.pin{text-align:center;letter-spacing:9px;background:#fff;width:180px;margin:0 auto;font-size:24px;font-weight:800}.pin.bad{border-color:#d63020}.error{color:#d63020;font-size:13px}.managerTabs{z-index:10;background:#fff;border-bottom:1px solid #e5e4de;grid-template-columns:repeat(6,1fr);display:grid;position:sticky;top:57px}.managerTabs button{color:#6b7280;text-transform:uppercase;background:0 0;border:0;border-bottom:3px solid #0000;padding:12px 2px;font-size:9.5px;font-weight:800}.managerTabs button.active{color:#e8640a;border-bottom-color:#e8640a}.managerBody{padding:16px}.stack{flex-direction:column;gap:13px;display:flex}.sectionTitle{color:#1b2a3b;justify-content:space-between;align-items:center;gap:10px;display:flex}.sectionTitle h2{font-size:18px}.sectionTitle small{color:#6b7280}.dateInput{max-width:150px}.addSmall,.sendSmall{color:#fff;background:#1b2a3b;border:0;border-radius:9px;align-items:center;gap:6px;padding:8px 12px;font-weight:800;display:flex}.sendSmall{background:#e8640a}.supplierBox,.record,.statsBox,.settingsCard,.userBox,.importBox{background:#fff;border:1px solid #e5e4de;border-radius:14px;overflow:hidden}.supplierHead{color:#fff;background:#1b2a3b;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;display:flex}.supplierHead.sent{color:#1a9456;background:#e6f5ed}.supplierHead.confirmed{color:#075e75;background:#ddf7ff}.supplierHead small{opacity:.72;margin-top:2px;font-size:11px;display:block}.actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.pill{color:#fff;background:#1a9456;border-radius:999px;align-items:center;gap:5px;padding:4px 10px;font-size:11px;font-weight:800;display:flex}.orderLine{border-bottom:1px solid #e5e4de;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font-size:14px;display:flex}.orderLine:last-child{border-bottom:0}.orderLine small{color:#6b7280;margin-top:2px;font-size:11px;display:block}.empty{text-align:center;color:#6b7280;padding:38px 18px}.emptyBig{font-size:42px}.empty h3{color:#1b2a3b;margin:10px 0 4px;font-size:17px}.emptyText{text-align:center;color:#6b7280;padding:38px 18px}.editBox{background:#fff1e6;border:2px solid #e8640a;border-radius:14px;flex-direction:column;gap:9px;padding:14px;display:flex}.editBox h3,.settingsCard h3,.statsBox h3{color:#1b2a3b;font-size:15px}.record{align-items:center;gap:8px;margin-bottom:7px;padding:11px 13px;display:flex}.record small{color:#6b7280;margin-top:2px;font-size:11px;display:block}.icon{color:#6b7280;background:#f9f8f4;border:0;border-radius:8px;align-items:center;padding:8px;display:flex}.danger{color:#d63020;background:#fdecea}.msg{border-radius:11px;justify-content:center;align-items:center;gap:7px;padding:11px 12px;font-size:13px;font-weight:800;display:flex}.msg.ok{color:#1a9456;background:#e6f5ed}.msg.err{color:#d63020;background:#fdecea}.checkGrid{background:#f9f8f4;border-radius:12px;grid-template-columns:1fr 1fr;gap:8px;padding:10px;display:grid}.checkGrid label{color:#1b2a3b;align-items:center;gap:7px;font-size:13px;font-weight:700;display:flex}.checkGrid input{width:auto}.importBox{padding:12px}.importBox summary{color:#1b2a3b;cursor:pointer;font-weight:800}.importBox p{color:#6b7280;margin:8px 0;font-size:13px;line-height:1.5}.quickRanges{grid-template-columns:repeat(4,1fr);gap:7px;display:grid}.quickRanges button{color:#6b7280;background:#fff;border:1px solid #e5e4de;border-radius:10px;padding:10px 5px;font-weight:800}.quickRanges button.active{color:#fff;background:#1b2a3b}.statsBox{flex-direction:column;gap:6px;padding:12px;display:flex}.statLine{border-top:1px solid #e5e4de;grid-template-columns:1fr auto 42px;align-items:center;gap:8px;padding-top:8px;font-size:13px;display:grid}.statLine strong{color:#1b2a3b}.statLine small{text-align:right;color:#6b7280}.settingsCard,.userBox{flex-direction:column;gap:10px;padding:14px;display:flex}.settingsCard small{color:#6b7280}.linkBtn{text-decoration:none}.auditLine{border-top:1px solid #e5e4de;padding-top:8px}.auditLine strong{font-size:13px}.auditLine small{color:#6b7280;margin-top:2px;font-size:11px;display:block}.modalShade{z-index:50;background:#000000a6;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:20px 20px 0 0;flex-direction:column;width:100%;max-width:560px;max-height:92vh;animation:.18s up;display:flex}.modalHead{border-bottom:1px solid #e5e4de;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;display:flex}.modalHead small{color:#6b7280;margin-top:3px;font-size:12px;display:block}.modalBody{flex-direction:column;gap:8px;padding:14px 18px;display:flex;overflow:auto}.modalBody label{color:#6b7280;text-transform:uppercase;letter-spacing:.8px;font-size:11px;font-weight:800}.subjectBox{background:#f9f8f4;border-radius:10px;padding:10px 12px;font-size:14px;font-weight:700}.modalFoot{border-top:1px solid #e5e4de;flex-direction:column;gap:8px;padding:12px 18px;display:flex}.spin{font-size:20px;animation:.7s linear infinite spin;display:inline-block}@media (width<=460px){.grid2{grid-template-columns:1fr}.managerTabs button{font-size:8.5px}.supplierHead{flex-direction:column;align-items:flex-start}.actions{width:100%}.sendSmall,.ghostMini{justify-content:center;width:100%}.loginUsers{grid-template-columns:1fr}.quickRanges{grid-template-columns:1fr 1fr}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes up{0%{transform:translateY(100%)}to{transform:none}}