:root{--bg:#f4f6f5;--surface:#fff;--surface-2:#f8faf9;--ink:#17231f;--muted:#56655f;--rule:#dce3df;--rule-strong:#c4cfca;--primary:#22433a;--primary-2:#2f5a4d;--on-primary:#fff;--accent:#a15c07;--accent-bg:#fdf3dc;--focus:#c98a12;--ok:#1f7a46;--ok-bg:#e2f3e8;--calib:#17686f;--calib-bg:#ddf0f1;--sop:#2a5b96;--sop-bg:#e2ebf7;--est:#855d06;--est-bg:#f7edd2;--count:#56625e;--count-bg:#eaedec;--miss:#b12f27;--miss-bg:#fbe4e2;--r-sm:5px;--r-md:8px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--f-body:-apple-system, BlinkMacSystemFont, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "Segoe UI", "Leelawadee UI", "Thonburi", sans-serif;--f-mono:ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;--dur:.16s}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--f-body);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.5}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--primary-2)}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.num,td.n,th.n{font-variant-numeric:tabular-nums}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.shell{grid-template-columns:236px minmax(0,1fr);min-height:100%;display:grid}.side{background:var(--primary);color:var(--on-primary);height:100vh;padding:var(--sp-4) var(--sp-3);gap:var(--sp-4);flex-direction:column;display:flex;position:sticky;top:0}.brand{padding:0 var(--sp-2);flex-direction:column;gap:2px;display:flex}.brand b{letter-spacing:.02em;font-size:17px}.brand span{opacity:.75;font-size:12px}.seg{border-radius:var(--r-sm);background:#0000002e;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;display:grid}.seg button{color:var(--on-primary);cursor:pointer;opacity:.8;background:0 0;border:0;border-radius:4px;min-height:32px;padding:6px 0}.seg button[aria-pressed=true]{color:var(--primary);opacity:1;background:#fff;font-weight:700}.nav{flex-direction:column;gap:2px;display:flex}.nav a{align-items:center;gap:var(--sp-2);padding:9px var(--sp-2);border-radius:var(--r-sm);color:var(--on-primary);opacity:.82;min-height:40px;transition:background var(--dur), opacity var(--dur);text-decoration:none;display:flex}.nav a:hover{opacity:1;background:#ffffff14}.nav a[aria-current=page]{opacity:1;background:#ffffff29;font-weight:600}.nav a .badge{font-variant-numeric:tabular-nums;background:#ffffff24;border-radius:10px;margin-left:auto;padding:0 7px;font-size:12px}.nav a .badge.warn{color:#3d2a02;background:#f3c873}.side-foot{gap:var(--sp-2);flex-direction:column;margin-top:auto;display:flex}.side-foot .btn{color:var(--on-primary);background:0 0;border-color:#ffffff59;justify-content:center}.side-foot .btn:hover{background:#ffffff1a}.save-state{opacity:.8;padding:0 var(--sp-2);min-height:18px;font-size:12px}.main{padding:var(--sp-5) var(--sp-5) 64px;gap:var(--sp-5);flex-direction:column;min-width:0;display:flex}.page-head{justify-content:space-between;align-items:flex-end;gap:var(--sp-3);flex-wrap:wrap;display:flex}.page-head h1{text-wrap:balance;margin:0;font-size:22px}.page-head p{color:var(--muted);max-width:72ch;margin:4px 0 0}section>h2{margin:0 0 var(--sp-2);align-items:baseline;gap:var(--sp-2);font-size:16px;display:flex}section>h2 small{color:var(--muted);font-size:13px;font-weight:400}section>p.hint{margin:0 0 var(--sp-3);color:var(--muted);max-width:80ch;font-size:13.5px}.btn{border:1px solid var(--rule-strong);background:var(--surface);border-radius:var(--r-sm);cursor:pointer;min-height:36px;color:var(--ink);white-space:nowrap;transition:background var(--dur), border-color var(--dur);align-items:center;gap:6px;padding:7px 12px;text-decoration:none;display:inline-flex}.btn:hover{background:var(--surface-2);border-color:var(--muted)}.btn.primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.btn.primary:hover{background:var(--primary-2)}.btn.ghost{background:0 0;border-color:#0000}.btn.icon{min-width:32px;min-height:32px;color:var(--muted);justify-content:center;padding:6px}.btn.icon:hover{color:var(--miss);border-color:var(--miss-bg);background:var(--miss-bg)}.btn.confirm{color:#fff;background:var(--miss);border-color:var(--miss)}.btn:disabled{opacity:.5;cursor:not-allowed}.icon-svg{flex:none;width:16px;height:16px}.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md)}.card.pad{padding:var(--sp-4)}.tiles{gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(170px,1fr));display:grid}.tile{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);flex-direction:column;gap:2px;display:flex}.tile .v{font-variant-numeric:tabular-nums;font-size:28px;font-weight:700;line-height:1.15}.tile .k{color:var(--muted);font-size:13px}.tile.alert .v{color:var(--miss)}.tile.good .v{color:var(--ok)}.stack{background:var(--rule);border-radius:5px;height:10px;display:flex;overflow:hidden}.stack.sm{border-radius:3px;height:6px}.stack span{height:100%;display:block}.legend{gap:var(--sp-2) var(--sp-3);color:var(--muted);flex-wrap:wrap;align-items:center;font-size:13px;display:flex}.legend .item{align-items:center;gap:6px;display:inline-flex}.legend .sw{border-radius:2px;width:10px;height:10px}.pill{white-space:nowrap;border-radius:10px;align-items:center;padding:1px 8px;font-size:12px;font-weight:600;line-height:1.6;display:inline-flex}.st-measured{background:var(--ok-bg);color:var(--ok)}.st-calib{background:var(--calib-bg);color:var(--calib)}.st-sop{background:var(--sop-bg);color:var(--sop)}.st-est{background:var(--est-bg);color:var(--est)}.st-count{background:var(--count-bg);color:var(--count)}.st-missing{background:var(--miss-bg);color:var(--miss)}.pill.next{background:var(--accent-bg);color:var(--accent)}.table-wrap{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);overflow-x:auto}table.grid{border-collapse:separate;border-spacing:0;width:100%;font-size:14px}table.grid th{text-align:left;color:var(--muted);background:var(--surface-2);border-bottom:1px solid var(--rule);white-space:nowrap;padding:8px;font-size:12px;font-weight:600}table.grid td{border-bottom:1px solid var(--rule);vertical-align:middle;padding:5px 6px}table.grid tr:last-child td{border-bottom:0}table.grid tbody tr:hover td{background:#fbfcfb}table.grid tr.is-next td{background:var(--accent-bg)}table.grid td.n,table.grid th.n{text-align:right;white-space:nowrap}table.grid td.strong{font-weight:700}.name{flex-direction:column;line-height:1.3;display:flex}.name .th{color:var(--muted);font-size:12.5px}.name .en{color:var(--muted);font-size:11.5px}.subtle{color:var(--muted);font-size:12.5px}.field{flex-direction:column;gap:2px;min-width:0;display:inline-flex}.field input,.field select,.field textarea{border:1px solid var(--rule-strong);border-radius:var(--r-sm);width:100%;min-height:34px;transition:border-color var(--dur), background var(--dur), box-shadow var(--dur);background:#fff;padding:6px 8px}.field input:hover,.field select:hover{border-color:var(--muted)}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--focus);outline:none;box-shadow:0 0 0 3px #c98a1238}.field.num input{text-align:right;font-variant-numeric:tabular-nums}.field.filled input{background:#f2faf5;border-color:#9fd1b2}.field[data-state=saving] input{border-color:var(--sop)}.field[data-state=error] input{border-color:var(--miss);background:var(--miss-bg)}.field .err{color:var(--miss);font-size:12px}.w-xs{width:60px}.w-s{width:90px}.w-sm{width:110px}.w-m{width:140px}.w-l{width:220px}.w-full{width:100%}label.lbl{color:var(--muted);flex-direction:column;gap:4px;font-size:12.5px;display:inline-flex}.toolbar{gap:var(--sp-2);flex-wrap:wrap;align-items:center;display:flex}.toolbar .field input,.toolbar .field select{min-height:36px}.check{cursor:pointer;align-items:center;gap:6px;min-height:36px;font-size:13.5px;display:inline-flex}.check input{width:16px;height:16px;accent-color:var(--primary)}.split{gap:var(--sp-4);grid-template-columns:250px minmax(0,1fr);align-items:start;display:grid}.dish-list{top:var(--sp-4);max-height:calc(100vh - 2 * var(--sp-4));flex-direction:column;display:flex;position:sticky;overflow:hidden}.dish-list .filters{gap:var(--sp-2);padding:var(--sp-3);border-bottom:1px solid var(--rule);flex-direction:column;display:flex}.dish-list .scroll{padding-bottom:var(--sp-2);overflow-y:auto}.dish-list .cat{color:var(--muted);padding:var(--sp-3) var(--sp-3) 4px;letter-spacing:.04em;font-size:12px;font-weight:700}.dish-list a{padding:7px var(--sp-3);color:var(--ink);cursor:pointer;border-left:3px solid #0000;flex-direction:column;gap:5px;text-decoration:none;display:flex}.dish-list a:hover{background:var(--surface-2)}.dish-list a[aria-current=true]{border-left-color:var(--primary);background:#edf3f0}.dish-list .row{justify-content:space-between;gap:var(--sp-2);align-items:baseline;display:flex}.dish-list .cnt{font-variant-numeric:tabular-nums;color:var(--miss);white-space:nowrap;font-size:12px}.dish-list .cnt.done{color:var(--ok)}.dish-list .cnt.none{color:var(--muted)}.dish-head{gap:var(--sp-3) var(--sp-5);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;display:flex}.dish-head h2{margin:0;font-size:21px}.dish-head .th{color:var(--muted);margin-left:6px;font-size:15px;font-weight:400}.kpis{gap:var(--sp-2) var(--sp-5);flex-wrap:wrap;display:flex}.kpis div{flex-direction:column;display:flex}.kpis .k{color:var(--muted);font-size:12px}.kpis .v{font-variant-numeric:tabular-nums;font-size:19px;font-weight:700}.dish-meta{gap:var(--sp-3);margin-top:var(--sp-3);flex-wrap:wrap;align-items:flex-end;display:flex}tr.addrow td{background:var(--surface-2)}.grams{flex-direction:column;align-items:flex-end;gap:2px;display:flex}.grams b{font-variant-numeric:tabular-nums}.grid-cards{gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(440px,1fr));display:grid}.chips{flex-wrap:wrap;gap:4px;display:flex}.chip{color:var(--ink);cursor:pointer;background:#edf1ef;border-radius:10px;padding:2px 9px;font-size:12px;text-decoration:none}.chip:hover{background:#dfe7e3}.two-col{gap:var(--sp-4);grid-template-columns:repeat(auto-fit,minmax(420px,1fr));display:grid}ul.plain{margin:0;padding-left:1.2em}ul.plain li{margin:4px 0}.toast{right:var(--sp-4);bottom:var(--sp-4);background:var(--ink);color:#fff;border-radius:var(--r-sm);opacity:0;transition:opacity var(--dur), transform var(--dur);pointer-events:none;z-index:20;padding:9px 14px;font-size:14px;position:fixed;transform:translateY(6px)}.toast.show{opacity:.94;transform:none}.toast.err{background:var(--miss)}.loading{padding:var(--sp-6);color:var(--muted)}@media (max-width:1100px){.split{grid-template-columns:1fr}.dish-list{max-height:340px;position:static}}@media (max-width:760px){.shell{grid-template-columns:1fr}.side{height:auto;position:static}.nav{flex-direction:row;overflow-x:auto}.main{padding:var(--sp-4)}.grid-cards,.two-col{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}html[lang=th] body{font-family:"Thonburi", "Leelawadee UI", "Noto Sans Thai", var(--f-body);font-size:16px}.name .zh,h2 .zh{color:var(--muted);font-size:12px;font-weight:400;display:block}h2 .zh{margin-top:2px;font-size:14px}.field.w-unit select{width:11em}.field.vague select{border-color:var(--est);background:var(--est-bg)}.warn-box{padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--est-bg);color:var(--est);border:1px solid var(--est);margin:0}.login{min-height:100vh;padding:var(--sp-4);place-items:center;display:grid}.login form{gap:var(--sp-3);flex-direction:column;width:min(360px,100%);display:flex}.login h1{margin:0;font-size:20px}.login .btn{justify-content:center;min-height:44px}.login .err{color:var(--miss);margin:0}.stack-y{gap:var(--sp-3);margin-top:var(--sp-4);flex-direction:column;display:flex}.stack-y h2{margin:0;font-size:18px}.count-cell{align-items:center;gap:4px;display:inline-flex}.muted-row td{color:var(--muted)}button.chip{border:0;align-items:center;gap:4px;min-height:28px;display:inline-flex}button.chip .icon-svg{width:12px;height:12px}.seg.light{background:var(--surface-2);max-width:440px;margin-top:var(--sp-3)}.seg.light button{color:var(--ink)}.seg.light button[aria-pressed=true]{background:var(--primary);color:var(--on-primary)}
