:root{--bg:#f5f7fc;--surface:#fff;--fg:#0f1e4a;--heading:#1e3a8a;--muted:#4a5578;--line:#dde3f0;--brand:#1e3a8a;--accent:#f59e0b;--accent-hover:#fbbf24;--on-accent:#0f1e4a;--ok:#157f3d;--warn:#b45309;--bad:#b42318;--font:"Anuphan","Poppins",system-ui,sans-serif;--display:"Poppins","Anuphan",system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:400 15px/1.6 var(--font)}a{color:var(--brand)}h1,h2,h3{margin:0;color:var(--heading)}h1{font:700 26px/1.3 var(--font)}h2{font:600 18px/1.4 var(--font)}.top{background:var(--brand);color:#fff}.top .in{max-width:1200px;margin:0 auto;padding:12px max(16px,env(safe-area-inset-left,0px));display:flex;align-items:center;gap:20px;flex-wrap:wrap}.top b{font:800 18px/1 var(--display)}.top b span{color:var(--accent)}.top nav{display:flex;gap:4px;flex-wrap:wrap;margin-right:auto}.top nav a{color:#fff;text-decoration:none;padding:8px 12px;border-radius:8px;font-weight:500}.top nav a:hover{background:hsla(0,0%,100%,.12)}.top form button{background:none;border:1px solid hsla(0,0%,100%,.5);color:#fff;border-radius:8px;padding:6px 12px;font:inherit;cursor:pointer}main{max-width:1200px;margin:0 auto;padding:28px max(16px,env(safe-area-inset-left,0px)) 64px;display:flex;flex-direction:column;gap:24px}.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;min-width:0}.card h2{margin-bottom:12px}.stats{display:grid;grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}.stat{display:block;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}.stat b{display:block;font:800 30px/1.1 var(--display)}.stat span{color:var(--muted);font-size:14px}.stat.hot{border:2px solid var(--accent)}.tbl{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14.5px}th{text-align:left;color:var(--muted);font-weight:600;padding:8px 10px;white-space:nowrap}td,th{border-bottom:1px solid var(--line)}td{padding:10px;vertical-align:top}tr:last-child td{border-bottom:0}.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:13px;font-weight:600;background:var(--bg);border:1px solid var(--line);white-space:nowrap}.p-new,.p-pending{background:#fef3c7;border-color:#fcd34d}.p-slip_uploaded{background:#fde68a;border-color:var(--accent)}.p-delivered,.p-paid{background:#dcfce7;border-color:#86efac}.p-waiting_info{background:#e0e7ff;border-color:#a5b4fc}.p-building{background:#dbeafe;border-color:#93c5fd}.p-review{background:#f3e8ff;border-color:#d8b4fe}.p-cancelled{background:#f3f4f6;color:#6b7280}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 16px;border-radius:10px;border:1.5px solid var(--fg);background:var(--surface);color:var(--fg);font:600 14.5px/1 var(--font);text-decoration:none;cursor:pointer;white-space:nowrap}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.btn.primary:hover{background:var(--accent-hover)}.btn.danger{border-color:var(--bad);color:var(--bad)}.btn.sm{min-height:32px;padding:0 10px;font-size:13.5px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.grid2{display:grid;grid-gap:24px;gap:24px;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}label{display:block;font-weight:600;font-size:14px;margin-bottom:4px}input,select,textarea{width:100%;min-height:40px;padding:8px 12px;border:1.5px solid var(--line);border-radius:8px;font:inherit;background:var(--surface);color:var(--fg)}textarea{min-height:90px;resize:vertical}.btn:focus-visible,input:focus,select:focus,textarea:focus{outline:2px solid var(--brand);outline-offset:1px}.fields{grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}.fields,dl{display:grid}dl{grid-template-columns:max-content 1fr;grid-gap:6px 16px;gap:6px 16px;margin:0}dt{color:var(--muted)}dd{margin:0;min-width:0;overflow-wrap:anywhere}.muted{color:var(--muted)}.small{font-size:13.5px}.flash{border-radius:10px;background:#dcfce7;border:1px solid #86efac}.err,.flash{padding:12px 16px}.err{border-radius:10px;background:#fee2e2;border:1px solid #fca5a5;color:var(--bad)}.steps{display:flex;flex-wrap:wrap;gap:6px}.steps .btn[aria-current]{background:var(--brand);border-color:var(--brand);color:#fff}.log li{padding:6px 0;border-bottom:1px dashed var(--line)}.log{list-style:none;margin:0;padding:0;max-height:360px;overflow:auto}.login{max-width:380px;margin:12vh auto;display:flex;flex-direction:column;gap:14px}.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-gap:4px;gap:4px;counter-reset:f}.flow li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:13.5px;color:var(--muted);min-width:0}.flow li:before{content:"";position:absolute;top:15px;left:-50%;right:50%;height:3px;background:var(--line);z-index:0}.flow li:first-child:before{display:none}.flow .dot{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 14px/1 var(--display);background:var(--surface);border:2px solid var(--line);color:var(--muted)}.flow .lbl{display:flex;flex-direction:column;line-height:1.35}.flow small{font-size:12px}.flow .f-done .dot{border-color:var(--ok);color:#fff}.flow .f-done .dot,.flow .f-done:before,.flow .f-now:before{background:var(--ok)}.flow .f-now .dot{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 0 0 5px #fef3c7}.flow .f-now{color:var(--fg);font-weight:700}.flow .f-skip{opacity:.55}@media(max-width:700px){.flow{grid-template-columns:1fr;gap:0}.flow li{flex-direction:row;text-align:left;padding:4px 0}.flow li:before{display:none}.flow li:not(.f-now) .lbl small{display:inline}}.card.next{border:2px solid var(--line);padding:22px 24px}.card.next.w-you{border-color:var(--accent);background:#fffbeb}.card.next.t-bad{border-color:var(--bad);background:#fef2f2}.card.next h2{font-size:21px;margin:2px 0 0}.na-kicker{margin:0;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--muted)}.who{flex:none;padding:5px 12px;border-radius:999px;font-size:13.5px;font-weight:700;white-space:nowrap}.who-you{background:var(--accent);color:var(--on-accent)}.who-cust{background:#e0e7ff;color:#3730a3}.who-done{background:#dcfce7;color:var(--ok)}.na-grid{display:grid;grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:start}.na-act,.na-form{display:flex;flex-direction:column;gap:10px;min-width:0}.na-form h3{font:600 17px/1.4 var(--font)}.choice-a,.choice-b{padding:16px}.choice-a,.choice-b,.obox{background:var(--surface);border:1px solid var(--line);border-radius:12px}.obox{padding:14px 16px;display:flex;flex-direction:column;gap:8px}.btn.big{min-height:48px;padding:0 22px;font-size:16px}.more summary{cursor:pointer;color:var(--brand);font-size:14px;font-weight:600}.card.next.side{padding:18px 22px}.card.next.side h2{font-size:18px}.queue{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}.queue li{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;flex-wrap:wrap}.queue li.late{border-color:var(--bad);background:#fef2f2}.qn{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font:700 13px/1 var(--display)}.pipe{display:grid;grid-gap:8px;gap:8px;grid-template-columns:repeat(7,minmax(0,1fr))}.pipe .stat{padding:12px 14px}.pipe .stat b{font-size:26px}.pipe .stat.on{border:2px solid var(--brand)}@media(max-width:900px){.pipe{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}}.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:50;max-width:min(640px,calc(100% - 32px));padding:14px 18px;border-radius:12px;font-weight:600;box-shadow:0 10px 30px rgba(15,30,74,.25);cursor:pointer;background:#157f3d;color:#fff}.toast.t-warn{background:#b45309}.slip{display:block;max-width:100%;max-height:360px;border-radius:10px;border:1px solid var(--line)}.chk{display:flex;gap:8px;align-items:flex-start;font-weight:500;margin:0;cursor:pointer}.chk input{width:20px;min-height:20px;height:20px;margin-top:2px;flex:none}.card.next.w-customer{background:#f5f7ff;border-color:#c7d2fe}.top nav a[aria-current]{background:hsla(0,0%,100%,.18)}@media(max-width:700px){.top .in{gap:8px;padding-block:10px}.top nav{flex-wrap:nowrap;overflow-x:auto;width:100%;order:3;margin:0 -4px;scrollbar-width:none}.top nav a{white-space:nowrap;padding:8px 10px}.top form{margin-left:auto}.flow{display:flex;gap:4px;overflow:hidden}.flow li{flex:1 1;padding:0}.flow li .lbl{display:none}.flow li.f-now{flex:4 1}.flow li.f-now .lbl{display:flex;font-size:13px}.flow .dot{width:26px;height:26px;font-size:12px}.btn.sm{min-height:40px}.queue li{flex-direction:column;align-items:stretch}.hide-m,.queue li .qn{display:none}main{gap:16px;padding-top:18px}.card,.card.next{padding:16px}.pill{padding:6px 12px}}