:root{--bg:#e3f3e6;--card:#f1f3f5;--primary:#2563eb;--primary-d:#1d4ed8;--in:#16a34a;--out:#ea580c;--ink:#1f2937;--muted:#6b7280;--line:#dfe3e8;--radius:16px}
*{-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;padding-bottom:calc(78px + env(safe-area-inset-bottom));overflow-x:hidden}
a{color:var(--primary)}
img{max-width:100%}
/* layout */
.topbar{position:sticky;top:0;z-index:1030;display:flex;align-items:center;gap:.6rem;background:#fff;border-bottom:1px solid var(--line);padding:.55rem .85rem;min-height:56px}
.brand{font-weight:700;font-size:1.1rem;color:var(--ink);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55vw}
.menu-btn{font-size:1.3rem;line-height:1;min-width:44px;min-height:44px;border-radius:12px}
.user-chip{font-size:.85rem;max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.content{padding:1rem;max-width:1200px;margin:0 auto}
.sidebar{position:fixed;top:56px;bottom:0;left:0;width:224px;background:#fff;border-right:1px solid var(--line);padding:1rem .75rem;overflow:auto}
.side-nav a{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border-radius:12px;color:var(--ink);text-decoration:none;margin-bottom:.2rem;font-weight:500}
.side-nav a:hover{background:#f3f4f6}
.side-nav a.active{background:#e8efff;color:var(--primary);font-weight:700}
@media(min-width:992px){body{padding-bottom:1rem}.app-shell{padding-left:224px}}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:1030;display:flex;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.bottom-nav a{flex:1;text-align:center;padding:.45rem 0 .4rem;font-size:.72rem;color:var(--muted);text-decoration:none;font-weight:600;min-height:58px}
.bottom-nav .ico{display:block;font-size:1.35rem;line-height:1.3}
.bottom-nav a.active{color:var(--primary)}
.bottom-nav a.in.active{color:var(--in)}.bottom-nav a.out.active{color:var(--out)}
/* cards / boxes */
.box{background:var(--card);border-radius:var(--radius);padding:1rem;margin-bottom:1rem;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.box h2,.box .h5{font-size:1.05rem;font-weight:700}
.page-title{font-size:1.35rem;font-weight:700;margin:.25rem 0 1rem}
.stat{background:var(--card);border-radius:var(--radius);padding:.9rem 1rem;height:100%;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.stat .lbl{font-size:.8rem;color:var(--muted);font-weight:600}
.stat .val{font-size:1.7rem;font-weight:800;line-height:1.2;word-break:break-word}
.stat.in .val{color:var(--in)}.stat.out .val{color:var(--out)}
.stat small{color:var(--muted)}
/* buttons / forms */
.btn{border-radius:14px;font-weight:600}
.btn-lg{min-height:54px;font-size:1.05rem}
.btn-primary{background:var(--primary);border-color:var(--primary)}
.btn-primary:hover,.btn-primary:focus{background:var(--primary-d);border-color:var(--primary-d)}
.btn-in{background:var(--in);border-color:var(--in);color:#fff}.btn-in:hover{background:#15803d;border-color:#15803d;color:#fff}
.btn-out{background:var(--out);border-color:var(--out);color:#fff}.btn-out:hover{background:#c2410c;border-color:#c2410c;color:#fff}
.btn-in:disabled,.btn-out:disabled{opacity:.65;color:#fff}
.form-control,.form-select{border-radius:12px;min-height:46px;font-size:16px}
.form-control-lg,.form-select-lg{min-height:54px}
textarea.form-control{min-height:80px}
.quick .btn{min-height:64px;font-size:1.05rem;display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%}
/* movement + status badges */
.mv-badge{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.75rem;font-weight:800;color:#fff;letter-spacing:.03em}
.mv-in{background:var(--in)}.mv-out{background:var(--out)}.mv-adj{background:#6b7280}
.qty-in{color:var(--in);font-weight:700}.qty-out{color:var(--out);font-weight:700}
.thumb{width:46px;height:46px;object-fit:cover;border-radius:10px;background:#e5e7eb;flex:none}
.preview-img{width:96px;height:96px;object-fit:cover;border-radius:14px;background:#e5e7eb;border:1px solid var(--line)}
/* lists as cards */
.mcard{background:#fff;border-radius:14px;padding:.75rem;margin-bottom:.6rem;border-left:5px solid var(--line)}
.mcard.in{border-left-color:var(--in)}.mcard.out{border-left-color:var(--out)}
.mcard .meta{font-size:.82rem;color:var(--muted)}
.mcard .row1{display:flex;gap:.7rem;align-items:center}
.mcard .grow{flex:1;min-width:0}
.mcard .nm{font-weight:700;word-break:break-word}
.table>:not(caption)>*>*{background:transparent}
.table-box{background:#fff;border-radius:var(--radius);padding:.5rem;overflow:hidden}
/* product picker */
.picker-list{max-height:44vh;overflow-y:auto;border-radius:12px;padding:2px}
.pick-item{position:relative;display:flex;align-items:center;gap:.7rem;padding:.55rem .65rem;background:#fff;border:2px solid transparent;border-radius:14px;margin-bottom:.4rem;cursor:pointer;min-height:64px}
.pick-item input{position:absolute;opacity:0;width:1px;height:1px;left:50%;top:50%}
.pick-item.selected{border-color:var(--primary);background:#eef4ff}
.pick-item.disabled{opacity:.5;cursor:not-allowed}
.pick-info{flex:1;min-width:0;display:flex;flex-direction:column}
.pick-name{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.pick-cat{font-size:.78rem;color:var(--muted)}
.pick-stock{white-space:nowrap;text-align:right;font-size:.9rem}
.pick-stock b{font-size:1.1rem}
.picker-selected{background:#fff;border-radius:12px;padding:.6rem .8rem;border:1px dashed var(--primary)}
.picker-empty{padding:.8rem;color:var(--muted);text-align:center}
.step-label{font-weight:600;margin-bottom:.35rem}
/* stacked tables on phones (no horizontal scrolling) */
@media(max-width:767.98px){
  table.stack thead{display:none}
  table.stack,table.stack tbody{display:block}
  table.stack tr{display:block;background:#fff;border-radius:12px;margin-bottom:.6rem;padding:.4rem .75rem}
  table.stack td{display:flex;justify-content:space-between;gap:1rem;border:0!important;padding:.3rem 0;text-align:right;word-break:break-word}
  table.stack td::before{content:attr(data-label);font-weight:600;color:var(--muted);text-align:left;flex:none}
}
/* toasts */
#toasts{position:fixed;top:64px;left:50%;transform:translateX(-50%);width:min(94vw,520px);z-index:2000;pointer-events:none}
#toasts .alert{pointer-events:auto;margin-bottom:.5rem;border-radius:14px;font-weight:600}
.print-only{display:none}
@media print{
  body{background:#fff;padding:0}.app-shell{padding-left:0}.no-print,.sidebar,.topbar,.bottom-nav{display:none!important}
  .print-only{display:block!important}.print-title{font-size:1.2rem;font-weight:700;margin-bottom:.6rem}
  .content{max-width:none;padding:0}.box,.table-box{box-shadow:none;background:#fff;padding:0}
  .d-md-none{display:none!important}.d-none.d-md-block{display:block!important}.d-none.d-md-table{display:table!important}
  table.stack thead{display:table-header-group!important}
  table.stack{display:table!important}table.stack tbody{display:table-row-group!important}
  table.stack tr{display:table-row!important;padding:0!important;margin:0!important}
  table.stack td{display:table-cell!important;text-align:left!important}table.stack td::before{content:none!important}
  .table{font-size:.8rem}
}
.qty-adjustment{color:var(--muted);font-weight:700}