@import url("/static/theme.css?v=20260310ciafix1");
@import url("/static/theme2-admin.css?v=20260319theme1");
@import url("/static/workos-admin.css?v=20260320workos7");

  :root{
    --bg:#f0f4fb;
    --bg-soft:#eef3fb;
    --panel:#ffffff;
    --line:#dbe5f4;
    --line-2:#e7eef9;
    --ink:#101827;
    --muted:#5a6f92;
    --dark:#232a35;
    --dark-2:#2c3645;
    --accent:#dffe1f;
    --accent-ink:#1b1f12;
    --blue:#2448da;
    --sky:#8ea5c5;
    --ok:#0f9d58;
    --danger:#b42318;
    --focus:#dffe1f;
    --focus-ring:rgba(223,254,31,.45);
    --radius:16px;
    --shadow:0 18px 44px rgba(22,39,73,.10);
  }

  *{box-sizing:border-box}
  html,body{height:100%}
  body{
    margin:0;
    background:
      radial-gradient(980px 520px at -10% -5%, rgba(36,72,218,.12), transparent 58%),
      radial-gradient(860px 500px at 110% 110%, rgba(143,168,201,.16), transparent 60%),
      linear-gradient(180deg,#f6f9ff,#eef3fb);
    color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  }

  .topbar{
    position:sticky;
    top:0;
    z-index:50;
    border-bottom:1px solid var(--line);
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(10px);
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:12px 16px;
  }

  .brand-wrap{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
  }

  .brand-mark{
    width:28px;
    height:28px;
    border-radius:9px;
    border:1px solid rgba(36,72,218,.18);
    background:linear-gradient(135deg,#2b52e5,#6a7cf2);
    box-shadow:0 8px 18px rgba(37,67,183,.25);
  }

  .brand-copy{min-width:0}
  .brand-title{
    margin:0;
    font-size:18px;
    line-height:1.1;
    font-weight:900;
    letter-spacing:.01em;
    color:#0f2346;
  }
  .brand-sub{
    margin:2px 0 0;
    font-size:12px;
    color:var(--muted);
    font-weight:700;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .toolbar{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
    min-width:0;
  }

  .pill{
    border:1px solid var(--line);
    background:#f9fbff;
    border-radius:999px;
    min-height:34px;
    padding:0 12px;
    font-size:12px;
    color:#21395f;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
  }

  .pill.active{
    border-color:#d2e068;
    background:#f8ffdd;
    color:#344405;
  }

  .btn{
    border:1px solid #30466b;
    background:#172538;
    color:#fff;
    border-radius:11px;
    min-height:38px;
    padding:0 14px;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
    transition:all .16s ease;
  }
  .btn:hover{background:#223451}

  .btn.primary{
    border-color:#bfd436;
    background:var(--accent);
    color:var(--accent-ink);
  }
  .btn.primary:hover{background:#d6ef1a}

  .btn.ghost{
    border-color:#c9d6ee;
    background:#fff;
    color:#203a66;
  }
  .btn.ghost:hover{background:#f7faff}

  .wrap{
    padding:14px;
    padding-bottom:78px;
    display:grid;
    gap:12px;
  }

  .kpi-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
  }

  .kpi{
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--panel);
    box-shadow:var(--shadow);
    padding:12px;
    display:grid;
    gap:6px;
  }

  .kpi-label{
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#50678f;
    font-weight:900;
  }

  .kpi-value{
    font-size:28px;
    line-height:1;
    letter-spacing:-.02em;
    color:#10284f;
    font-weight:900;
  }

  .kpi-sub{
    font-size:12px;
    color:var(--muted);
    font-weight:700;
  }

  .kpi.kpi-dark{
    background:linear-gradient(145deg,#2a3342,#1f2937);
    border-color:#2b3546;
  }
  .kpi.kpi-dark .kpi-label,
  .kpi.kpi-dark .kpi-sub{color:#b9c8de}
  .kpi.kpi-dark .kpi-value{color:#fff}

  .search-row{
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--panel);
    box-shadow:var(--shadow);
    padding:10px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 180px auto;
    gap:8px;
    align-items:center;
  }
  .search-row > *{min-width:0}

  .search-wrap{
    border:1px solid #d4deef;
    background:#fff;
    border-radius:11px;
    min-height:38px;
    padding:0 10px;
    display:flex;
    align-items:center;
    gap:8px;
    font-size:12px;
    color:#5f7498;
    font-weight:800;
  }

  .search-wrap input{
    width:100%;
    border:0;
    outline:0;
    min-height:34px;
    font-size:14px;
    color:#132444;
    background:transparent;
  }

  .select-lite,
  .input-lite{
    border:1px solid #d4deef;
    background:#fff;
    border-radius:11px;
    min-height:38px;
    padding:0 10px;
    font-size:13px;
    color:#132444;
    font-weight:700;
  }

  .select-lite:focus,
  .input-lite:focus,
  .btn:focus,
  .cell:focus,
  .queue-card:focus,
  .command-item:focus{
    outline:none;
    border-color:var(--focus);
    box-shadow:0 0 0 3px var(--focus-ring);
  }

  .board{
    display:grid;
    grid-template-columns:320px minmax(0,1fr) 300px;
    gap:12px;
    min-height:calc(100vh - 68px - 14px - 14px - 102px - 74px - 78px);
  }

  .panel{
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--panel);
    box-shadow:var(--shadow);
    min-height:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }

  .panel-head{
    margin:0;
    border-bottom:1px solid var(--line-2);
    padding:12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
    color:#425b85;
    flex-wrap:wrap;
  }

  .panel-head .meta{
    font-size:11px;
    text-transform:none;
    letter-spacing:0;
    color:var(--muted);
    font-weight:700;
  }

  .queue-wrap{
    background:linear-gradient(160deg,var(--dark),var(--dark-2));
    border-color:#2f3b50;
  }

  .queue-wrap .panel-head{
    border-bottom-color:#32435d;
    color:#d6e1f2;
    background:rgba(0,0,0,.14);
  }
  .queue-wrap .panel-head .meta{color:#b7c6dc}

  .queue{
    padding:10px;
    overflow:auto;
    display:grid;
    gap:8px;
  }

  .queue-card{
    border:1px solid rgba(233,240,251,.14);
    border-radius:12px;
    background:rgba(12,18,30,.3);
    color:#ecf2ff;
    padding:10px;
    display:grid;
    gap:4px;
    cursor:pointer;
    transition:all .15s ease;
  }

  .queue-card:hover{
    transform:translateY(-1px);
    border-color:rgba(233,240,251,.24);
  }

  .queue-card.active{
    background:linear-gradient(145deg,#99b1d4,#b6c8df);
    border-color:#c7d6ea;
    color:#122a4d;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
  }

  .queue-id{
    font-size:13px;
    font-weight:900;
    letter-spacing:.02em;
  }

  .queue-customer{
    font-size:12px;
    font-weight:700;
    opacity:.97;
  }

  .queue-status{
    font-size:11px;
    font-weight:800;
    opacity:.85;
  }

  .editor-tools{
    border-bottom:1px solid var(--line-2);
    background:#f8fbff;
    padding:10px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
  }

  .tools-left{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
  }

  .customer-stack{
    display:grid;
    gap:4px;
    min-width:min(540px,100%);
    flex:1 1 320px;
  }

  .cell-info{
    font-size:11px;
    color:#5f7599;
    font-weight:700;
  }

  .sheet-wrap{
    overflow:auto;
    min-height:0;
    flex:1 1 auto;
    padding:8px 10px 10px;
  }

  table{
    width:100%;
    min-width:820px;
    border-collapse:collapse;
  }

  th{
    position:sticky;
    top:0;
    z-index:2;
    text-align:left;
    padding:10px 8px;
    border-bottom:1px solid #dce6f5;
    background:#f4f8ff;
    color:#4b6290;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
  }

  td{
    border-bottom:1px solid #ecf1f8;
    padding:8px 6px;
    vertical-align:middle;
  }

  tr.active td{background:#f1f7ff}

  .idx{width:40px;text-align:center;color:#5b7298;font-size:12px;font-weight:800}
  .num{width:120px}
  .amt{width:130px}

  .cell{
    border:1px solid transparent;
    border-radius:9px;
    min-height:42px;
    padding:10px 10px;
    background:#fff;
    font-size:14px;
    color:#102342;
  }

  .cell[contenteditable="true"]{cursor:text}
  .cell-readonly{
    background:#f3f7ff;
    border-color:#d8e2f3;
    color:#243e67;
    font-weight:800;
  }
  .cell.autofill{
    border-color:#d3e652;
    background:#f9ffe4;
  }
  .cell.unmatched{
    border-color:#f2b5b0;
    background:#fff5f4;
  }

  .cell-num{text-align:right;font-variant-numeric:tabular-nums}

  .cell.placeholder:empty::before{
    content:attr(data-ph);
    color:#94a6c5;
    pointer-events:none;
  }

  .line-total{
    text-align:right;
    padding:10px 10px;
    font-size:14px;
    font-weight:900;
    color:#1d3760;
    font-variant-numeric:tabular-nums;
  }

  .summary{
    padding:12px;
    display:grid;
    gap:10px;
    overflow:auto;
  }

  .summary-title{
    margin:0;
    font-size:14px;
    color:#1b345d;
    font-weight:900;
  }

  .summary-card{
    border:1px solid var(--line);
    border-radius:12px;
    background:#f8fbff;
    padding:10px;
    display:grid;
    gap:7px;
  }

  .summary-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    color:#3b547b;
    font-size:13px;
    font-weight:700;
  }

  .summary-row b{
    color:#0f2242;
    font-variant-numeric:tabular-nums;
    font-weight:900;
  }

  .hint-box{
    border:1px solid #d6e3f7;
    border-radius:12px;
    background:#fff;
    padding:10px;
    font-size:12px;
    line-height:1.5;
    color:#475f85;
    font-weight:700;
  }

  .customer-profile-card{
    margin:8px 10px 0;
    border:1px solid #d8e5f7;
    border-radius:12px;
    background:#f9fcff;
    padding:10px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px 10px;
    font-size:12px;
    color:#2d4671;
    font-weight:700;
  }
  .customer-profile-card b{
    color:#10284f;
    font-size:13px;
  }
  .customer-profile-card > div:first-child{
    grid-column:1 / -1;
  }
  .customer-profile-card > div:last-child{
    grid-column:1 / -1;
  }

  .workflow-card{
    margin-top:8px;
    border:1px solid #d8e5f7;
    border-radius:12px;
    background:#fff;
    padding:10px;
    display:grid;
    gap:10px;
  }
  .workflow-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    font-size:13px;
    color:#0f2242;
    font-weight:900;
  }
  .workflow-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 12px;
    color:#516a92;
    font-size:11px;
    font-weight:800;
  }
  .status-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid #d3dff2;
    background:#f6f9ff;
    color:#1f3f73;
    font-size:11px;
    letter-spacing:.04em;
    text-transform:uppercase;
    font-weight:900;
  }
  .status-chip.is-green{
    background:#edfbf3;
    border-color:#bde7cb;
    color:#15643a;
  }
  .status-chip.is-orange{
    background:#fff6eb;
    border-color:#f5d5ad;
    color:#8c5007;
  }
  .status-chip.is-red{
    background:#fff1f1;
    border-color:#efc5c5;
    color:#982121;
  }
  .workflow-inputs{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .workflow-inputs .btn{
    grid-column:1 / -1;
    justify-self:start;
  }
  .workflow-actions,
  .doc-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }
  .workflow-actions .btn,
  .doc-actions .btn{
    min-height:34px;
    padding:0 10px;
    font-size:12px;
  }

  .dash-flow-cards{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .dash-flow-item{
    border:1px solid #d8e5f7;
    border-radius:10px;
    background:#f9fcff;
    padding:8px;
    display:grid;
    gap:6px;
  }
  .dash-flow-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    font-size:12px;
    color:#1f3f73;
    font-weight:800;
  }
  .dash-flow-top span{
    font-variant-numeric:tabular-nums;
    color:#0f2242;
    font-weight:900;
  }
  .dash-flow-bar{
    height:8px;
    border-radius:999px;
    background:#e9eff9;
    overflow:hidden;
    border:1px solid #d8e4f5;
  }
  .dash-flow-bar span{
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,#2b52e5,#89a1ff);
  }
  .dash-flow-item small{
    color:#5d7498;
    font-size:11px;
    font-weight:700;
  }

  .dash-rank-list{
    display:grid;
    gap:8px;
  }
  .dash-rank-item{
    border:1px solid #d8e5f7;
    border-radius:10px;
    background:#fff;
    padding:8px;
    display:grid;
    gap:6px;
  }
  .dash-rank-head{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    font-size:12px;
    color:#21406f;
    font-weight:800;
  }
  .dash-rank-head strong{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color:#16335e;
  }
  .dash-rank-head b{
    font-variant-numeric:tabular-nums;
    color:#0f2242;
    font-weight:900;
  }
  .dash-rank-index{
    width:20px;
    height:20px;
    border-radius:999px;
    border:1px solid #cad9f1;
    background:#f5f9ff;
    color:#2d5188;
    font-size:11px;
    font-weight:900;
    display:grid;
    place-items:center;
  }
  .dash-rank-item small{
    color:#5d7498;
    font-size:11px;
    font-weight:700;
  }

  .dash-chart-host{
    min-height:220px;
    border:1px solid #d8e5f7;
    border-radius:12px;
    background:linear-gradient(180deg,#fbfdff,#f4f8ff);
    padding:10px;
  }
  .dash-chart-grid{
    display:grid;
    grid-template-columns:repeat(8,minmax(0,1fr));
    gap:8px;
    align-items:end;
    min-height:170px;
  }
  .dash-chart-bar{
    display:grid;
    gap:6px;
    justify-items:center;
    font-size:11px;
    color:#456189;
    font-weight:800;
  }
  .dash-chart-bar > span{
    width:100%;
    min-height:4px;
    border-radius:8px 8px 2px 2px;
    background:linear-gradient(180deg,#355ceb,#8ba4ff);
  }
  .dash-chart-svg{
    width:100%;
    height:190px;
    display:block;
  }
  .dash-chart-empty{
    color:#5d7498;
    font-size:12px;
    font-weight:700;
    padding:8px;
  }
  .dash-pie-wrap{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
  }
  .dash-pie{
    position:relative;
    width:140px;
    height:140px;
    border-radius:999px;
    border:1px solid #cfdcf2;
    flex:0 0 auto;
    display:grid;
    place-items:center;
  }
  .dash-pie-center{
    width:72px;
    height:72px;
    border-radius:999px;
    background:#fff;
    border:1px solid #e2eaf7;
    display:grid;
    place-items:center;
    box-shadow:0 4px 14px rgba(30,48,94,.08);
  }
  .dash-pie-center strong{
    font-size:18px;
    line-height:1;
    color:#173058;
  }
  .dash-pie-center small{
    margin-top:-2px;
    font-size:10px;
    font-weight:800;
    color:#6b82a8;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  .dash-pie-legend{
    display:grid;
    gap:6px;
    min-width:180px;
    flex:1 1 220px;
  }
  .dash-pie-legend-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    font-size:12px;
    color:#38547d;
    font-weight:800;
  }
  .dash-pie-dot{
    width:10px;
    height:10px;
    border-radius:999px;
    flex:0 0 auto;
    margin-right:6px;
    display:inline-block;
  }

  .sku-suggest-bar{
    position:fixed;
    left:0;
    top:0;
    width:520px;
    border:1px solid #d8e5f7;
    border-radius:10px;
    background:#fff;
    display:none;
    overflow:hidden;
    max-height:320px;
    overflow-y:auto;
    z-index:120;
    box-shadow:0 18px 36px rgba(15,34,68,.2);
  }
  .sku-suggest-bar.is-open{
    display:grid;
  }
  .sku-suggest-item{
    border:0;
    border-bottom:1px solid #edf2f9;
    background:#fff;
    display:grid;
    grid-template-columns:110px minmax(0,1fr) 120px;
    gap:8px;
    align-items:center;
    text-align:left;
    padding:8px 10px;
    cursor:pointer;
    color:#1a355f;
    font-weight:800;
    font-size:12px;
  }
  .sku-suggest-item:last-child{
    border-bottom:0;
  }
  .sku-suggest-item:hover,
  .sku-suggest-item.is-active{
    background:#f0f7ff;
  }
  .sku-suggest-sku{
    color:#2448da;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:11px;
  }
  .sku-suggest-name{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .sku-suggest-rate{
    text-align:right;
    color:#0f2444;
    font-variant-numeric:tabular-nums;
  }

  #dashOrdersTable,
  #dashReceivableTable{
    min-width:100%;
  }

  #dashOrdersTable:focus,
  #dashReceivableTable:focus,
  #dashFlowCards:focus,
  #dashTopSellingList:focus,
  #dashTopCustomersList:focus,
  #dashForecastList:focus,
  #inventoryTable:focus,
  #invMovesTable:focus,
  #invBackordersTable:focus,
  #voucherTable:focus,
  #bankTable:focus,
  #finOutstandingTable:focus,
  #finPeriodTable:focus,
  #crmTable:focus,
  #hrTable:focus,
  #boTable:focus{
    outline:3px solid var(--focus-ring);
    outline-offset:2px;
  }

  .btn.danger-lite{
    border-color:#edc4c2;
    background:#fff5f5;
    color:#9f1d1d;
  }
  .btn.danger-lite:hover{
    background:#ffeded;
  }
  .btn:disabled{
    opacity:.55;
    cursor:not-allowed;
    filter:saturate(.75);
  }

  .footer{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    height:62px;
    border-top:1px solid var(--line);
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(8px);
    z-index:60;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:0 14px;
  }

  .toast{
    position:fixed;
    right:12px;
    top:82px;
    min-width:240px;
    max-width:min(92vw,460px);
    border:1px solid #bae3c9;
    background:#ecfff2;
    color:#0d7345;
    border-radius:10px;
    box-shadow:0 16px 30px rgba(18,42,80,.12);
    padding:10px 12px;
    font-size:13px;
    font-weight:900;
    z-index:90;
    display:none;
  }
  .toast.show{display:block}

  .command{
    position:fixed;
    inset:0;
    background:rgba(9,18,36,.36);
    display:none;
    align-items:flex-start;
    justify-content:center;
    padding-top:96px;
    z-index:100;
  }
  .command.show{display:flex}

  .command-card{
    width:min(680px,94vw);
    border:1px solid #d8e3f5;
    border-radius:14px;
    background:#fff;
    box-shadow:0 26px 70px rgba(12,30,66,.2);
    overflow:hidden;
  }

  .command-head{
    border-bottom:1px solid #e8eef9;
    padding:11px 12px;
    font-size:13px;
    color:#173058;
    font-weight:900;
  }

  .command-list{display:grid}

  .command-item{
    border:0;
    border-bottom:1px solid #edf2f8;
    background:#fff;
    text-align:left;
    padding:12px;
    font-size:13px;
    color:#173058;
    font-weight:800;
    cursor:pointer;
  }
  .command-item:hover{background:#f3f8ff}

  .small{font-size:11px;color:var(--muted);font-weight:700}

  .module-pill{
    cursor:pointer;
  }

  .module-section{
    display:none;
    gap:12px;
  }
  .module-section.is-active{
    display:grid;
  }

  .split-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    min-height:420px;
  }

  .form-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    padding:10px;
    border-bottom:1px solid var(--line-2);
    background:#f8fbff;
  }
  .form-grid .btn{
    min-height:38px;
  }

  .panel-actions{
    border-top:1px solid var(--line-2);
    display:flex;
    gap:8px;
    justify-content:flex-end;
    flex-wrap:wrap;
    padding:10px;
  }

  .footer-actions{
    display:none;
    width:min(1200px,100%);
    align-items:center;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
  }
  .footer-actions.is-active{
    display:flex;
  }

  #inventoryTable .amt,
  #invMovesTable .num,
  #voucherTable .num,
  #bankTable .num{
    font-variant-numeric:tabular-nums;
    text-align:right;
  }

  @media (max-width: 1360px){
    .board{grid-template-columns:280px minmax(0,1fr) 280px}
    .split-grid{grid-template-columns:minmax(0,1fr)}
    .search-row{
      display:flex;
      flex-wrap:wrap;
      align-items:stretch;
    }
    .search-row .search-wrap{
      flex:1 1 360px;
      min-width:220px;
    }
    .search-row .btn,
    .search-row .select-lite,
    .search-row .input-lite,
    .search-row .pill{
      flex:0 0 auto;
    }
  }

  @media (max-width: 1140px){
    .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .search-row{
      display:flex;
      flex-wrap:wrap;
      align-items:stretch;
      gap:8px;
    }
    .search-row .search-wrap{
      flex:1 1 100%;
      min-width:0;
    }
    .search-row .btn,
    .search-row .select-lite,
    .search-row .input-lite,
    .search-row .pill{
      flex:1 1 220px;
      min-width:160px;
    }
    .board{
      grid-template-columns:minmax(0,1fr);
      min-height:auto;
    }
    .queue-wrap{order:2}
    .summary-panel{order:3}
    .form-grid{
      grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .customer-profile-card{
      grid-template-columns:1fr;
    }
    .dash-flow-cards{
      grid-template-columns:1fr;
    }
  }

  @media (max-width: 820px){
    .topbar{
      grid-template-columns:1fr;
      align-items:flex-start;
      padding:10px;
    }
    .toolbar{
      justify-content:flex-start;
      flex-wrap:nowrap;
      overflow-x:auto;
      padding-bottom:2px;
      -webkit-overflow-scrolling:touch;
    }
    .toolbar > *{
      flex:0 0 auto;
    }
    .kpi-grid{grid-template-columns:1fr}
    .wrap{padding:10px;padding-bottom:76px}
    .editor-tools{
      grid-template-columns:1fr;
      align-items:flex-start;
    }
    .footer{
      height:auto;
      min-height:62px;
      flex-wrap:wrap;
      justify-content:space-between;
      padding:8px 10px;
    }
    .footer .btn{flex:1 1 calc(33% - 8px)}
    .form-grid{
      grid-template-columns:minmax(0,1fr);
    }
    .footer-actions{
      width:100%;
      justify-content:space-between;
    }
    .panel-actions{
      justify-content:flex-start;
    }
    .search-row{
      padding:8px;
    }
    .search-row .btn,
    .search-row .select-lite,
    .search-row .input-lite,
    .search-row .pill{
      flex:1 1 100%;
      min-width:0;
    }
    .sheet-wrap{
      padding:6px 8px 8px;
    }
    th{
      font-size:10px;
      padding:8px 6px;
    }
    td{
      padding:6px 4px;
    }
    .cell{
      min-height:40px;
      padding:8px;
      font-size:13px;
    }
    .line-total{
      padding:8px;
      font-size:13px;
    }
    .sku-suggest-item{
      grid-template-columns:84px minmax(0,1fr) 92px;
      gap:6px;
      font-size:11px;
    }
    .workflow-inputs{
      grid-template-columns:1fr;
    }
  }