:root{--sj-bg:#f6f7f9;--sj-surface:#fff;--sj-surface-2:#eef1f5;--sj-border:#dbe1e8;--sj-text:#1f2933;--sj-text-muted:#64748b;--sj-primary:#1f7a5a;--sj-primary-weak:#e6f4ee;--sj-danger:#c0392b;--sj-danger-weak:#fdecea;--sj-warn:#8a5a00;--sj-warn-weak:#fff6e0;--sj-warn-border:#e5a00d;--sj-radius:12px;--sj-radius-sm:8px;--sj-tap:44px;--sj-font:system-ui, -apple-system, "Segoe UI", "Noto Sans Thai", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:var(--sj-bg);color:var(--sj-text);font:16px/1.55 var(--sj-font);margin:0}h1,h2,h3,p{margin:0}a{color:inherit}.shell{grid-template:"header""nav""main"minmax(0,1fr)"foot"/minmax(0,1fr);align-content:start;min-height:100vh;display:grid}.wrap{max-width:960px;margin:0 auto;padding:0 16px}.app-header{z-index:6;background:var(--sj-surface);border-bottom:1px solid var(--sj-border);grid-area:header;position:sticky;top:0}.app-header .wrap{align-items:center;gap:12px;min-height:56px;padding-top:8px;padding-bottom:8px;display:flex}.app-header h1{flex:1;font-size:20px;font-weight:700}.menu-toggle{min-width:var(--sj-tap);min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius-sm);background:var(--sj-surface);color:var(--sj-text);font:inherit;cursor:pointer;justify-content:center;align-items:center;padding:0 8px;font-size:18px;line-height:1;display:inline-flex}.nav{background:var(--sj-surface);grid-area:nav;display:none}.shell[data-menu-open=true] .nav{display:block}@media (width<=767px){.nav{top:var(--menu-top);z-index:5;max-height:calc(100dvh - var(--menu-top));position:fixed;left:0;right:0;overflow-y:auto;box-shadow:0 8px 16px #0000001f}}.nav .wrap{flex-direction:column;gap:6px;padding-top:4px;padding-bottom:12px;display:flex}.nav a{min-height:var(--sj-tap);border-radius:var(--sj-radius-sm);background:var(--sj-surface-2);color:var(--sj-text);align-items:center;gap:6px;padding:8px 12px;font-size:14px;text-decoration:none;display:inline-flex}.nav a[aria-current=page]{background:var(--sj-primary);color:#fff}@media (width>=768px){.menu-toggle{display:none}.nav{display:block}.nav .wrap{scrollbar-width:thin;flex-direction:row;gap:8px;padding-top:8px;padding-bottom:8px;overflow-x:auto}.nav a{border-radius:999px;flex:none}}main{grid-area:main;padding:16px 0 110px}.foot{max-width:960px;color:var(--sj-text-muted);grid-area:foot;margin:0 auto;padding:0 16px 24px;font-size:12px}@media (width>=1024px){.shell{grid-template:"header header""nav main"minmax(0,1fr)"nav foot"/240px minmax(0,1fr)}.nav{border-right:1px solid var(--sj-border);align-self:start;max-height:calc(100vh - 57px);position:sticky;top:57px;overflow-y:auto}.nav .wrap{flex-direction:column;gap:6px;padding-top:12px;padding-bottom:12px;overflow:visible}.nav a{border-radius:var(--sj-radius-sm);justify-content:flex-start;width:100%}}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--sj-primary);outline-offset:2px}.btn{min-height:var(--sj-tap);border-radius:var(--sj-radius-sm);background:var(--sj-surface-2);color:var(--sj-text);font:inherit;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:0 16px;font-size:15px;text-decoration:none;display:inline-flex}.btn-primary{background:var(--sj-primary);color:#fff}.btn-ghost{background:var(--sj-surface);border-color:var(--sj-border)}.btn-danger{background:var(--sj-surface);border-color:var(--sj-danger);color:var(--sj-danger)}.btn:disabled{opacity:.45;cursor:not-allowed}.view{gap:12px;display:grid}.view h2{font-size:18px}.view h3{font-size:15px}.view-note{color:var(--sj-text-muted);font-size:13px}.settings-actions{flex-wrap:wrap;gap:8px;display:flex}.summary-bar{min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);align-items:center;gap:10px;padding:14px 16px;font-size:15px;display:flex}.cards{gap:12px;display:grid}@media (width>=768px){.cards{grid-template-columns:1fr 1fr}}.card{border:1px solid var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);padding:14px 16px}.card-top{align-items:flex-start;gap:10px;display:flex}.card-name{flex:1;font-size:16px;font-weight:600}.card-meta{color:var(--sj-text-muted);margin-top:4px;font-size:13px}.card-lots{border-top:1px dashed var(--sj-border);margin:10px 0 0;padding:0;list-style:none}.card-lots li{flex-wrap:wrap;align-items:baseline;gap:8px;padding:6px 0;font-size:13px;display:flex}.card-lots .lot-qty{font-weight:600}.card-lots .lot-where{color:var(--sj-text-muted)}.card-lots .badge{margin-left:auto}.badge{white-space:nowrap;border:1px solid #0000;border-radius:999px;align-items:center;padding:4px 10px;font-size:13px;font-weight:600;display:inline-flex}.badge-warn{background:var(--sj-warn-weak);border-color:var(--sj-warn-border);color:var(--sj-warn)}.badge-danger{background:var(--sj-danger-weak);border-color:var(--sj-danger);color:var(--sj-danger)}.badge-fresh{color:var(--sj-text-muted);background:0 0;font-weight:500}.badge-active{background:var(--sj-primary-weak);border-color:var(--sj-primary);color:var(--sj-primary)}.badge-inactive{background:var(--sj-surface-2);border-color:var(--sj-border);color:var(--sj-text-muted)}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{min-height:var(--sj-tap);border:1px solid var(--sj-border);background:var(--sj-surface);color:var(--sj-text);font:inherit;cursor:pointer;border-radius:999px;align-items:center;padding:0 16px;font-size:14px;display:inline-flex}.chip[aria-pressed=true]{background:var(--sj-primary);border-color:var(--sj-primary);color:#fff;font-weight:600}.search-row{gap:8px;display:flex}.search-row input[type=search]{min-width:0;min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius-sm);font:inherit;color:var(--sj-text);background:#fff;flex:1;padding:0 12px;font-size:15px}.filter-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.field-inline{gap:4px}.field-inline>label{color:var(--sj-text-muted);font-size:13px;font-weight:600}.filter-row select,.inline-form select{width:100%;min-width:0;min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius-sm);font:inherit;color:var(--sj-text);text-overflow:ellipsis;appearance:none;background-color:#fff;padding:0 34px 0 12px;font-size:15px}.field-inline{position:relative}.select-chevron{pointer-events:none;border-left:5px solid #0000;border-right:5px solid #0000;border-top:6px solid var(--sj-text-muted);width:0;height:0;position:absolute;bottom:22px;right:14px;transform:translateY(50%)}.chips-label{color:var(--sj-text-muted);flex:none;align-self:center;font-size:13px;font-weight:600}.card-actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.card-actions .btn{min-height:var(--sj-tap)}.inline-form{border:1px solid var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);gap:8px;padding:14px 16px;display:grid}.inline-form label{font-size:14px;font-weight:600}.inline-form input[type=text]{min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius-sm);font:inherit;color:var(--sj-text);background:#fff;padding:0 12px;font-size:15px}.inline-form .form-row{flex-wrap:wrap;gap:8px;display:flex}.field-error{color:var(--sj-danger);font-size:13px}.form{border:1px solid var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);gap:12px;padding:16px;display:grid}.field{gap:6px;display:grid}.field>label{font-size:14px;font-weight:600}.field .required{color:var(--sj-danger)}.field input[type=text],.field input[type=number],.field input[type=date],.field select,.field textarea{min-height:var(--sj-tap);border:1px solid var(--sj-border);border-radius:var(--sj-radius-sm);font:inherit;color:var(--sj-text);background:#fff;max-width:100%;padding:0 12px;font-size:15px}.field textarea{resize:vertical;padding:10px 12px}.field-row{gap:12px;display:grid}@media (width>=768px){.field-row{grid-template-columns:1fr 1fr}}.suggest{flex-wrap:wrap;gap:8px;display:flex}.suggest .chip{min-height:var(--sj-tap)}.form-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:30;box-sizing:border-box;background:var(--sj-surface);width:min(480px,100vw - 32px);color:var(--sj-text);border:1px solid color-mix(in srgb, var(--sj-primary) 35%, white);text-align:center;border-radius:16px;padding:12px 20px;font-size:15px;line-height:1.4;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #27312c29}.undo-toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:30;box-sizing:border-box;background:var(--sj-surface);width:min(480px,100vw - 32px);color:var(--sj-text);border:1px solid color-mix(in srgb, var(--sj-primary) 35%, white);border-radius:16px;align-items:center;gap:12px;padding:12px 12px 12px 16px;font-size:15px;line-height:1.4;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #27312c29}.undo-toast>span{flex:auto;min-width:0}.undo-toast .btn{min-height:var(--sj-tap);flex:none}.stepper{align-items:center;gap:8px;margin-top:12px;display:flex}.stepper .btn{min-width:var(--sj-tap);min-height:var(--sj-tap);padding:0 12px;font-size:18px;font-weight:700}.stepper-qty{text-align:center;min-width:3ch;font-weight:700}.card-move{margin-top:8px}.dialog-backdrop{z-index:20;background:#1f293373;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{border:1px solid var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);gap:10px;width:min(440px,100%);padding:20px;display:grid}.dialog h3{font-size:16px}.dialog p{color:var(--sj-text);font-size:14px}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:4px;display:flex}.empty{border:1px dashed var(--sj-border);border-radius:var(--sj-radius);background:var(--sj-surface);text-align:center;justify-items:center;gap:12px;padding:28px 16px;display:grid}.empty p{font-size:15px}.empty .btn{justify-self:center}.item-list{margin:0;padding:0;list-style:none}.item-row{min-height:var(--sj-tap);border-bottom:1px solid var(--sj-border);flex-wrap:wrap;align-items:baseline;gap:8px;padding:8px 0;display:flex}.item-name{font-weight:600}.item-details{color:var(--sj-text-muted);font-size:13px}.item-status{margin-left:auto;font-size:13px}.item-row[data-status=expired] .item-status{color:var(--sj-danger);font-weight:700}.item-row[data-status=expiring] .item-status{color:var(--sj-warn);font-weight:600}.item-row .stepper{flex-basis:100%;margin-top:0}.item-row .card-move{flex-basis:100%}.btn-activity{padding:0 8px;font-size:13px}.card-actions{gap:6px}.stepper .btn-activity{min-width:var(--sj-tap)}.history-box{width:100%}.history{border-top:1px dashed var(--sj-border);margin:8px 0 0;padding:0;font-size:13px;list-style:none}.history li{border-bottom:1px dotted var(--sj-border);flex-wrap:wrap;gap:4px 8px;padding:6px 0;display:flex}.history li:last-child{border-bottom:none}.history .h-date,.history .h-balance,.history .h-note{color:var(--sj-text-muted)}.history .h-balance{margin-left:auto}.expiring-group h3{margin:16px 0 0;font-size:15px}.move-form{list-style:none}
