:root{
  --bg:#f5f7fb;
  --surface:#ffffff;
  --surface-2:#f8fafc;
  --ink:#0f172a;
  --muted:#64748b;
  --line:#e2e8f0;
  --line-strong:#cbd5e1;
  --primary:#0f4c81;
  --primary-2:#123a63;
  --accent:#14b8a6;
  --danger:#dc2626;
  --warning:#b45309;
  --success:#047857;
  --sidebar:#08111f;
  --sidebar-soft:#0e1b2e;
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 22px 55px rgba(15,23,42,.08);
  --shadow-soft:0 10px 28px rgba(15,23,42,.06);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:14px;line-height:1.45}
a{color:var(--primary);text-decoration:none}a:hover{text-decoration:none;color:var(--primary-2)}
button,input,select,textarea{font:inherit}button{border:0}img{max-width:100%}code{background:#eef6ff;color:#0f4c81;border:1px solid #dbeafe;border-radius:8px;padding:.15rem .42rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.86em}.small{font-size:.84rem}.muted{color:var(--muted)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}
.app-shell{min-height:100vh;display:grid;grid-template-columns:292px minmax(0,1fr)}
.sidebar{background:linear-gradient(180deg,var(--sidebar),var(--sidebar-soft));color:#fff;padding:20px 16px;position:sticky;top:0;height:100vh;overflow:auto;border-right:1px solid rgba(255,255,255,.06)}
.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:999px}
.sidebar-brand{display:flex;gap:12px;align-items:center;margin-bottom:22px;padding:8px 8px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.brandmark{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#0f4c81,#14b8a6);color:#fff;font-weight:900;letter-spacing:.02em;box-shadow:0 16px 38px rgba(20,184,166,.22)}
.sidebar-brand strong{display:block;font-size:1.05rem;letter-spacing:.01em}.sidebar-brand span{display:block;color:#9fb0c5;font-size:.82rem;margin-top:2px}
.sidebar nav{display:grid;gap:4px}.sidebar nav a{display:flex;align-items:center;gap:10px;color:#dbe5f2;padding:10px 10px;border-radius:13px;text-decoration:none;font-weight:650;transition:.14s ease;border:1px solid transparent}.sidebar nav a:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.08);color:#fff}.sidebar nav a.active{background:#fff;color:#102033;box-shadow:0 14px 26px rgba(0,0,0,.18)}
.nav-dot{width:30px;height:30px;border-radius:10px;display:inline-grid;place-items:center;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.12);font-size:.72rem;font-weight:800;letter-spacing:.05em;color:#e8f1ff;flex:0 0 30px}.sidebar nav a.active .nav-dot{background:#e6f5f3;border-color:#d2eeeb;color:#0f766e}.nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.main{min-width:0}.topbar{min-height:82px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:grid;grid-template-columns:auto minmax(180px,1fr) minmax(260px,440px) auto;align-items:center;gap:18px;padding:14px 28px;position:sticky;top:0;z-index:10}.top-title h1{font-size:1.22rem;margin:0;font-weight:800;letter-spacing:-.02em}.top-title p{margin:.18rem 0 0;color:var(--muted);font-size:.84rem}.icon-btn{display:none;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 13px;cursor:pointer;color:var(--ink);font-weight:700;min-height:40px}.top-search{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 5px 5px 14px;box-shadow:var(--shadow-soft)}.top-search input{border:0;box-shadow:none;padding:8px;background:transparent}.top-search input:focus{box-shadow:none}.top-search button{border-radius:999px;min-height:34px;padding:8px 13px}.user-pill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 8px 7px 13px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-soft);white-space:nowrap}.user-pill span{font-weight:750}.user-pill small{color:var(--muted);text-transform:uppercase;font-size:.72rem;letter-spacing:.06em}.user-pill a{border-left:1px solid var(--line);padding-left:10px;color:var(--primary);font-weight:750}
.content{padding:28px;display:grid;gap:20px;max-width:1540px;width:100%;margin:0 auto}.page-kicker{color:var(--muted);margin:0 0 -8px}.alert{border-radius:14px;padding:12px 14px;border:1px solid var(--line);margin:14px 28px 0;background:#fff}.content>.alert{margin:0}.alert.success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}.alert.danger{background:#fef2f2;border-color:#fecaca;color:#991b1b}.alert.warning{background:#fffbeb;border-color:#fde68a;color:#92400e}.callout{background:#f8fafc;border:1px dashed var(--line-strong);border-radius:14px;padding:14px;color:var(--muted);margin-top:14px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-soft);padding:20px;min-width:0}.card:hover{box-shadow:var(--shadow)}.card.narrow{max-width:980px}.card.flush{padding:0;overflow:hidden}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.card-head h2{font-size:1rem;margin:0;font-weight:800;letter-spacing:-.01em}.card-head p{margin:3px 0 0}.cards{display:grid;gap:16px}.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}.grid{display:grid;gap:20px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.stat{position:relative;overflow:hidden}.stat:before{content:"";position:absolute;right:-38px;top:-42px;width:130px;height:130px;border-radius:50%;background:linear-gradient(135deg,rgba(15,76,129,.11),rgba(20,184,166,.11))}.stat span{position:relative;color:var(--muted);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.stat strong{position:relative;display:block;font-size:2.15rem;margin:.28rem 0 0;font-weight:900;letter-spacing:-.06em}.stat small{position:relative;color:var(--muted)}.danger-stat strong{color:var(--danger)}.success-stat strong{color:var(--success)}.warning-stat strong{color:var(--warning)}
.metric-list{display:grid;gap:10px}.metric-row{display:grid;grid-template-columns:110px 1fr 58px;gap:10px;align-items:center}.metric-row span:first-child{font-weight:700}.bar-track{height:10px;border-radius:999px;background:#e5e7eb;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--primary),var(--accent));min-width:2px}.progress-row{display:grid;gap:8px}.progress-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:.83rem}.insight-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}.insight-list li{border:1px solid var(--line);border-radius:13px;padding:11px 12px;background:#fff;display:flex;justify-content:space-between;gap:10px}.insight-list small{color:var(--muted);display:block}.quick-actions,.action-bar,.filters,.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.toolbar{margin-bottom:14px}.toolbar input{max-width:360px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:12px;padding:10px 14px;cursor:pointer;text-decoration:none;min-height:42px;font-weight:750;box-shadow:none}.btn:hover{text-decoration:none;border-color:var(--line-strong);background:#f8fafc}.btn.primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));border-color:var(--primary);color:#fff}.btn.primary:hover{background:linear-gradient(135deg,var(--primary-2),#0b2947);color:#fff}.btn.ghost{background:transparent}.btn.danger{background:#fff1f2;border-color:#fecdd3;color:var(--danger)}.btn.full{width:100%}.pill{border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:#fff;color:var(--muted);font-weight:750}.pill.active{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.badge{display:inline-flex;border-radius:999px;background:#eef6ff;color:#0f4c81;font-size:.77rem;padding:5px 9px;white-space:nowrap;font-weight:800;text-transform:capitalize}.badge.neutral{background:#f1f5f9;color:#475569}.status-pending{background:#fff7ed;color:#c2410c}.status-picked{background:#ecfeff;color:#0e7490}.status-packed{background:#f5f3ff;color:#6d28d9}.status-shipped{background:#ecfdf5;color:#047857}.status-cancelled{background:#fef2f2;color:#b91c1c}
.table-wrap{width:100%;overflow:auto;border-radius:15px;border:1px solid var(--line);background:#fff}table{border-collapse:separate;border-spacing:0;width:100%;background:#fff}th,td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}th{font-size:.76rem;color:#475569;background:#f8fafc;text-transform:uppercase;letter-spacing:.05em;font-weight:850;position:sticky;top:0;z-index:1}tr:last-child td{border-bottom:0}tbody tr:hover td{background:#fbfdff}.actions{white-space:nowrap;display:flex;gap:10px;align-items:center}.empty{text-align:center;color:var(--muted);padding:30px}.small-barcode{max-width:180px;height:auto;display:block}.qr-code{width:72px;height:72px;object-fit:contain;max-width:72px}.qr-preview{width:220px;height:220px;object-fit:contain;margin:auto;display:block}
form label{display:grid;gap:7px;color:#334155;font-weight:750;font-size:.9rem}input,select,textarea{width:100%;border:1px solid #d0d7e2;border-radius:12px;padding:11px 12px;background:#fff;color:var(--ink);outline:none;transition:.13s ease}input:focus,select:focus,textarea:focus{border-color:#86b7df;box-shadow:0 0 0 4px rgba(15,76,129,.10)}textarea{resize:vertical}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid.compact{gap:12px}.span2{grid-column:span 2}.stacked{display:grid;gap:14px}.input-action{display:flex;gap:8px}.input-action input{flex:1}.barcode-preview{border:1px dashed var(--line-strong);border-radius:14px;padding:16px;background:#f8fafc;text-align:center}.barcode-preview .small{margin:8px 0 0}.order-lines{display:grid;gap:10px}.line-row{display:grid;grid-template-columns:1fr 110px 48px;gap:8px}.order-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.order-meta div{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:12px}.order-meta span{display:block;color:var(--muted);font-size:.8rem;margin-bottom:4px}.mini-list{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}.mini-list li{padding:9px 10px;background:#f8fafc;border:1px solid var(--line);border-radius:10px}.mini-list small{color:var(--muted)}
.login-body,.installer-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top left,#dbeafe,transparent 32%),linear-gradient(135deg,#f8fafc,#eef4fb);padding:24px}.login-card,.installer-card{width:min(100%,460px);background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:28px}.installer-card{width:min(100%,980px)}.brandline{display:flex;align-items:center;gap:12px;margin-bottom:20px}.brandline.center{justify-content:center;text-align:left}.brandline h1{margin:0;font-size:1.35rem}.brandline p{margin:3px 0 0;color:var(--muted)}.install-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.install-grid section{display:grid;gap:12px}.install-grid h2{font-size:1rem;margin:0}.install-grid .full{grid-column:span 2}.installer-card textarea{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.scanner-box{position:relative;overflow:hidden;border-radius:20px;border:1px solid var(--line);background:#020617;min-height:360px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}#barcodeVideo{width:100%;height:420px;object-fit:cover}.scanner-status{position:absolute;left:16px;bottom:16px;background:rgba(15,23,42,.86);color:#fff;border-radius:999px;padding:9px 13px;font-size:.88rem}.scanner-box:after{content:"";position:absolute;width:240px;height:240px;border:2px solid rgba(20,184,166,.78);border-radius:22px;box-shadow:0 0 0 999px rgba(2,6,23,.20);pointer-events:none}
.print-page{background:#fff;padding:20px}.print-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:18px}.paper{max-width:960px;margin:auto;background:#fff}.paper h1{margin-top:0}.pick-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}.label-sheet{display:grid;grid-template-columns:repeat(3,64mm);gap:4mm;align-content:start}.barcode-label{height:36mm;border:1px dashed #999;padding:3mm;display:grid;align-content:center;text-align:center;break-inside:avoid;overflow:hidden}.barcode-label strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.barcode-label span,.barcode-label small{font-size:9px;color:#111}.barcode-label img{width:100%;max-height:18mm;object-fit:contain}.qr-label-sheet{grid-template-columns:repeat(3,64mm)}.qr-label{height:36mm;grid-template-columns:1fr 28mm;grid-template-rows:1fr;align-items:center;gap:3mm;text-align:left}.qr-label .qr-label-text{min-width:0;display:grid;gap:2mm}.qr-label img{width:28mm;height:28mm;max-height:none}.qr-label strong{font-size:12px}.qr-label span{font-size:10px}.qr-label small{font-size:9px}.thermal-print-page{background:#f1f5f9;padding:18px}.print-toolbar-sticky{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:16px;padding:12px;backdrop-filter:blur(12px);box-shadow:var(--shadow-soft)}.label-editor-panel{max-width:1120px;margin:0 auto 18px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow-soft)}.label-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.label-editor-head h2{margin:0;font-size:1.1rem}.label-editor-head p{margin:4px 0 0}.label-editor-actions{display:flex;gap:10px;flex-wrap:wrap}.label-editor-grid{display:grid;grid-template-columns:180px 1fr;gap:12px;margin-bottom:12px}.label-options{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.label-options label{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:#f8fafc}.label-options input{width:auto}.label-edit-table textarea{min-width:260px}.thermal-label-sheet{display:grid;grid-template-columns:100mm;gap:10mm;justify-content:center}.thermal-label{width:100mm;height:150mm;background:#fff;border:1px solid #111;padding:7mm;display:grid;grid-template-rows:auto auto 1fr auto auto auto;align-items:center;text-align:center;page-break-after:always;break-after:page;overflow:hidden}.thermal-brand{font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.thermal-product-name{font-size:18px;font-weight:900;line-height:1.2;max-height:44px;overflow:hidden}.thermal-qr-wrap{display:grid;place-items:center;margin:3mm 0}.thermal-qr-wrap img{width:68mm;height:68mm;object-fit:contain}.thermal-sku-caption{font-size:17px;font-weight:900;letter-spacing:.02em}.thermal-sku-description{font-size:12px;line-height:1.25;min-height:30px;max-height:50px;overflow:hidden}.thermal-custom-note{font-size:12px;font-weight:800;border:1px solid #111;border-radius:4px;padding:2mm;margin-top:2mm}.thermal-meta{display:flex;justify-content:space-between;font-size:10px;margin-top:3mm;border-top:1px solid #111;padding-top:2mm}.hide-label-brand .thermal-brand{display:none}.hide-label-name .thermal-product-name{display:none}.hide-label-sku .thermal-sku-caption{display:none}.hide-label-description .thermal-sku-description{display:none}.hide-label-stock .thermal-stock{display:none}.hide-label-date .thermal-date{display:none}.hide-label-custom-note .thermal-custom-note{display:none}
@media(max-width:1180px){.cards.four{grid-template-columns:repeat(2,1fr)}.grid.three,.grid.four{grid-template-columns:1fr 1fr}.grid.two{grid-template-columns:1fr}.order-meta{grid-template-columns:repeat(2,1fr)}.topbar{grid-template-columns:auto 1fr auto}.top-search{display:none}}
@media(max-width:820px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:30;left:-305px;transition:.2s ease;width:292px}.sidebar.open{left:0}.icon-btn{display:inline-flex}.topbar{padding:12px 16px;grid-template-columns:auto 1fr auto}.content{padding:16px}.user-pill small{display:none}.user-pill span{display:none}.form-grid,.install-grid,.label-editor-grid{grid-template-columns:1fr}.span2,.install-grid .full{grid-column:auto}.cards.four,.grid.three,.grid.four{grid-template-columns:1fr}.line-row{grid-template-columns:1fr 82px 44px}.order-meta{grid-template-columns:1fr}.label-sheet{grid-template-columns:repeat(2,1fr)}}
@media print{.no-print,.topbar,.sidebar,.btn,.alert{display:none!important}.app-shell{display:block}.content{padding:0}.card,.paper{box-shadow:none;border:0}.print-page{padding:0}.label-sheet{gap:3mm}.barcode-label{page-break-inside:avoid}body{background:#fff}.table-wrap{overflow:visible;border:0}table{font-size:12px}th,td{padding:6px 8px}.thermal-print-page{padding:0;background:#fff}@page{size:100mm 150mm;margin:0}.thermal-label-sheet{display:block}.thermal-label{width:100mm;height:150mm;border:0;margin:0;box-shadow:none;page-break-after:always;break-after:page}.label-editor-panel,.print-toolbar-sticky{display:none!important}}
.status-draft{background:#f1f5f9;color:#475569}.status-reserved{background:#eff6ff;color:#1d4ed8}.status-urgent{background:#fef2f2;color:#b91c1c}.status-hold{background:#fffbeb;color:#92400e}
.outbound-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0 18px}.flow-step{border:1px solid var(--line);background:#f8fafc;border-radius:14px;padding:10px;text-align:center;color:var(--muted);font-weight:800;text-transform:capitalize}.flow-step.done{background:#ecfdf5;border-color:#a7f3d0;color:#047857}.dispatch-paper{max-width:1050px}.dispatch-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;border-bottom:2px solid #111;padding-bottom:14px;margin-bottom:14px}.dispatch-head h1{margin:0 0 6px}.dispatch-qr{width:110px;height:110px;object-fit:contain}.dispatch-grid{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:14px;margin:16px 0}.dispatch-grid>div{border:1px solid #111;padding:10px;min-height:90px}.dispatch-grid h3{margin:0 0 6px;font-size:13px;text-transform:uppercase}.dispatch-grid p{margin:0}.sign-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;text-align:center}.sign-grid>div{border-top:1px solid transparent;padding-top:10px;min-height:92px}.sign-grid span{font-size:12px}@media(max-width:820px){.outbound-flow,.dispatch-grid,.sign-grid{grid-template-columns:1fr}.dispatch-head{align-items:center}.dispatch-qr{width:84px;height:84px}}@media print{.outbound-flow{display:none}.dispatch-paper{max-width:none}.dispatch-grid{grid-template-columns:1fr 1.5fr 1fr}.sign-grid{grid-template-columns:repeat(3,1fr)}.dispatch-qr{width:90px;height:90px}}

/* Operational mobile scanner */
.scanner-shell{display:grid;gap:18px}
.scanner-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,430px);gap:16px;align-items:stretch;background:linear-gradient(135deg,#071221,#0f4c81);color:#fff;border-radius:24px;padding:24px;border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}
.scanner-hero .eyebrow{display:inline-flex;margin-bottom:8px;color:#9de4d9;text-transform:uppercase;font-size:.74rem;font-weight:900;letter-spacing:.12em}.scanner-hero h2{font-size:1.8rem;line-height:1.1;margin:0 0 8px;letter-spacing:-.04em}.scanner-hero p{margin:0;color:#c8d6e5;max-width:760px}.scanner-url-box{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:14px;display:grid;gap:8px;align-content:center;min-width:0}.scanner-url-box span{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#a8c6df;font-weight:900}.scanner-url-box code{display:block;white-space:normal;word-break:break-all;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);color:#fff}
.scanner-mode-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.scanner-tab{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px;font-weight:900;color:#334155;text-align:center;box-shadow:var(--shadow-soft)}.scanner-tab.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));border-color:var(--primary);color:#fff}.scanner-grid{grid-template-columns:minmax(320px,.95fr) minmax(360px,1.05fr);align-items:start}.scanner-camera-card,.scanner-operation-card{min-height:100%}.scanner-box-large{min-height:420px}.scanner-actions{margin-top:12px}.scanner-status[data-type="success"]{background:rgba(4,120,87,.94)}.scanner-status[data-type="danger"]{background:rgba(185,28,28,.94)}.scan-last-result{margin-top:12px;border:1px solid var(--line);border-radius:15px;padding:12px;background:#f8fafc;display:grid;gap:4px}.scan-last-result span{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.scan-last-result strong{font-size:1rem;word-break:break-all}.scanner-form{margin-top:4px}.scanner-toggle{display:flex!important;align-items:center;gap:9px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:10px 12px}.scanner-toggle input{width:auto}.scanner-selector-form{margin-bottom:14px}.scanner-selector-actions{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.outbound-scan-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}.outbound-scan-summary>div{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:11px}.outbound-scan-summary span{display:block;color:var(--muted);font-size:.74rem;text-transform:uppercase;font-weight:900;letter-spacing:.06em}.outbound-scan-summary strong{display:block;margin-top:4px;word-break:break-word}.scan-session-log{display:grid;gap:8px}.scan-log-item{display:grid;grid-template-columns:84px 1fr auto;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}.scan-log-item span{color:var(--muted);font-size:.82rem;font-weight:800}.scan-log-item strong{font-size:.9rem}.scan-log-item.success{border-color:#bbf7d0;background:#f0fdf4}.scan-log-item.danger{border-color:#fecaca;background:#fef2f2}.scanner-final-actions form{display:flex;gap:10px;flex-wrap:wrap}.row-updated td{background:#ecfdf5!important;transition:.2s ease}
@media(max-width:920px){.scanner-hero,.scanner-grid{grid-template-columns:1fr}.scanner-mode-tabs{grid-template-columns:1fr}.scanner-box-large{min-height:360px}#barcodeVideo{height:360px}.outbound-scan-summary{grid-template-columns:1fr 1fr}.scan-log-item{grid-template-columns:1fr}.scanner-selector-actions{align-items:stretch}.scanner-selector-actions .btn{width:100%}}
@media(max-width:560px){.scanner-hero{border-radius:18px;padding:18px}.scanner-hero h2{font-size:1.38rem}.scanner-camera-card,.scanner-operation-card{padding:14px}.scanner-box-large{min-height:300px;border-radius:16px}#barcodeVideo{height:300px}.scanner-box:after{width:190px;height:190px}.outbound-scan-summary{grid-template-columns:1fr}.scanner-final-actions form,.scanner-final-actions .btn{width:100%}.scanner-final-actions button{width:100%}.scanner-status{left:10px;right:10px;bottom:10px;border-radius:12px}.scan-last-result strong{font-size:.94rem}}


/* Nutrinesia master data update */
.masterdata-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff,#f8fbff)}
.masterdata-hero h2{font-size:1.32rem;margin:0 0 6px;letter-spacing:-.03em}
.masterdata-hero p{max-width:820px;margin:0}.eyebrow.dark{display:inline-flex;margin-bottom:8px;color:#0f4c81;text-transform:uppercase;font-size:.74rem;font-weight:900;letter-spacing:.12em}.masterdata-sync-form{justify-self:end}.compact-table{margin-top:14px;max-height:360px}.compact-table th,.compact-table td{padding:9px 11px}.compact-table code{font-size:.78rem}
@media(max-width:820px){.masterdata-hero{grid-template-columns:1fr}.masterdata-sync-form{justify-self:stretch}.masterdata-sync-form .btn{width:100%}}

/* Shared-hosting SaaS OMS + WMS layer */
.saas-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff 0%,#eef6ff 50%,#f8fafc 100%);overflow:hidden;position:relative}.saas-hero:after{content:"";position:absolute;right:-80px;top:-80px;width:220px;height:220px;border-radius:999px;background:radial-gradient(circle,rgba(15,76,129,.18),rgba(20,184,166,.06),transparent 70%)}.saas-hero h2{font-size:1.7rem;margin:.2rem 0 .4rem;letter-spacing:-.045em}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;position:relative;z-index:1}.span2-desktop{grid-column:span 2}.mini-chart{height:260px;display:flex;gap:8px;align-items:end;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,#f8fafc,#fff);padding:16px;overflow:auto}.chart-col{min-width:46px;display:grid;grid-template-rows:1fr auto;align-items:end;height:100%;gap:8px}.chart-col div{width:100%;border-radius:10px 10px 3px 3px;background:linear-gradient(180deg,var(--primary),var(--accent));min-height:6px}.chart-col span{font-size:.72rem;color:var(--muted);white-space:nowrap;text-align:center}.speed-gauge{min-height:170px;border:1px solid var(--line);border-radius:50%;aspect-ratio:1/1;max-width:190px;margin:8px auto;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 50% 45%,#fff,#eff6ff)}.speed-gauge strong{font-size:2.6rem;letter-spacing:-.06em;display:block}.speed-gauge span{display:block;color:var(--muted);font-weight:800}.webhook-box{display:grid;gap:8px}.webhook-box span{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.webhook-box code{display:block;word-break:break-all}.inline-form{display:inline}.route-legend{display:grid;gap:6px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:14px;margin-top:12px}.route-legend span{color:var(--muted);font-weight:800}.packing-workbench{background:linear-gradient(135deg,#fff,#f8fbff)}.scan-simulator{display:grid;gap:12px}.scan-feedback{border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:14px;font-weight:800;color:var(--muted)}.scan-feedback.success{background:#ecfdf5;border-color:#a7f3d0;color:#047857}.scan-feedback.error{background:#fef2f2;border-color:#fecaca;color:#b91c1c}.tv-mode{background:#071221;color:#fff;border-radius:28px;padding:26px;box-shadow:0 25px 80px rgba(7,18,33,.28)}.tv-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.tv-header span{color:#9de4d9;text-transform:uppercase;font-weight:900;letter-spacing:.1em;font-size:.72rem}.tv-header h2{margin:4px 0 0;font-size:2rem;letter-spacing:-.05em}.tv-header strong{font-size:2rem}.tv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.tv-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:18px}.tv-card span{display:block;color:#a8c6df;font-size:.76rem;text-transform:uppercase;font-weight:900;letter-spacing:.08em}.tv-card strong{display:block;font-size:3rem;line-height:1;margin-top:10px}.tv-mode .card{background:#fff;color:var(--ink)}.notification-list{display:grid;gap:10px}.notification-item{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:16px;padding:14px;background:#fff}.notification-item p{margin:5px 0;color:var(--muted)}.notification-item.warning{border-color:#fde68a;background:#fffbeb}.notification-item.danger{border-color:#fecaca;background:#fef2f2}.notification-item.success{border-color:#a7f3d0;background:#ecfdf5}.permission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.permission-card{border:1px solid var(--line);border-radius:18px;padding:18px;background:linear-gradient(180deg,#fff,#f8fafc)}.permission-card h3{margin:0 0 12px;font-size:1rem}.permission-card span{display:inline-flex;margin:4px 5px 4px 0;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:6px 10px;font-weight:750;font-size:.82rem}.theme-toggle{border:1px solid var(--line);background:#f8fafc;border-radius:999px;padding:6px 9px;font-size:.75rem;font-weight:850;color:var(--muted);cursor:pointer}.realtime-metrics .stat strong{transition:.18s ease}.realtime-metrics .stat strong.updated{transform:scale(1.04);color:var(--accent)}
@media(max-width:1180px){.span2-desktop{grid-column:auto}.saas-hero{grid-template-columns:1fr}.hero-actions{justify-content:flex-start}.tv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.permission-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.tv-mode{border-radius:18px;padding:16px}.tv-grid,.permission-grid{grid-template-columns:1fr}.tv-header h2{font-size:1.45rem}.tv-header strong{font-size:1.4rem}.tv-card strong{font-size:2.2rem}.mini-chart{height:210px}.hero-actions .btn{width:100%}.saas-hero h2{font-size:1.35rem}.notification-item{display:grid}}
:root.dark-mode{--bg:#071221;--surface:#0f1b2d;--surface-2:#111f33;--ink:#e5edf7;--muted:#94a3b8;--line:#22314a;--line-strong:#334761;--sidebar:#050a12;--sidebar-soft:#071221;--shadow:0 22px 55px rgba(0,0,0,.28);--shadow-soft:0 10px 28px rgba(0,0,0,.18)}:root.dark-mode body{background:var(--bg);color:var(--ink)}:root.dark-mode .topbar{background:rgba(15,27,45,.88)}:root.dark-mode .card,:root.dark-mode .top-search,:root.dark-mode .user-pill,:root.dark-mode input,:root.dark-mode select,:root.dark-mode textarea,:root.dark-mode table,:root.dark-mode .table-wrap,:root.dark-mode .btn,:root.dark-mode .notification-item{background:var(--surface);color:var(--ink);border-color:var(--line)}:root.dark-mode th{background:var(--surface-2);color:#cbd5e1}:root.dark-mode tbody tr:hover td{background:#122139}:root.dark-mode .saas-hero,:root.dark-mode .packing-workbench,:root.dark-mode .permission-card{background:linear-gradient(135deg,#0f1b2d,#111f33)}:root.dark-mode .mini-chart,:root.dark-mode .callout,:root.dark-mode .route-legend,:root.dark-mode .scan-feedback,:root.dark-mode .outbound-scan-summary>div{background:#111f33;border-color:var(--line)}:root.dark-mode code{background:#132540;border-color:#22314a;color:#93c5fd}:root.dark-mode .metric-row .bar-track{background:#1f2d45}:root.dark-mode .btn.primary{background:linear-gradient(135deg,#2563eb,#0f4c81)}

/* Manual resi + PDF upload mode */
.manual-mode-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff 0%,#eef6ff 54%,#f8fafc 100%);position:relative;overflow:hidden}.manual-mode-banner:after{content:"";position:absolute;right:-90px;top:-100px;width:240px;height:240px;border-radius:999px;background:radial-gradient(circle,rgba(15,76,129,.16),rgba(20,184,166,.08),transparent 70%)}.manual-mode-banner h2{font-size:1.55rem;margin:.1rem 0 .35rem;letter-spacing:-.04em}.manual-mode-banner p{max-width:920px;margin:0}.manual-mode-banner .btn{position:relative;z-index:1}.wide-form{max-width:1180px}.upload-zone{border:1px dashed var(--line-strong);background:#f8fafc;border-radius:16px;padding:13px}.upload-zone input{background:#fff}.upload-zone small{font-weight:600;color:var(--muted)}.file-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:5px 10px;font-weight:850;font-size:.8rem}.file-chip:hover{background:#dbeafe;color:#1e40af}.order-resi-panel{background:linear-gradient(180deg,#fff,#f8fbff)}.doc-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}.doc-preview>div{border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px}.doc-preview span{display:block;color:var(--muted);font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;font-weight:900}.doc-preview strong{display:block;margin-top:5px;word-break:break-word}.workflow-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.workflow-grid>div{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px}.workflow-grid strong{display:block;margin-bottom:5px}.workflow-grid small{display:block;color:var(--muted)}
@media(max-width:980px){.manual-mode-banner{grid-template-columns:1fr}.manual-mode-banner .btn{width:100%}.workflow-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.doc-preview{grid-template-columns:1fr}}
@media(max-width:620px){.workflow-grid{grid-template-columns:1fr}.manual-mode-banner h2{font-size:1.28rem}.file-chip{width:max-content;max-width:100%}}
:root.dark-mode .manual-mode-banner,:root.dark-mode .order-resi-panel{background:linear-gradient(135deg,#0f1b2d,#111f33)}:root.dark-mode .upload-zone,:root.dark-mode .doc-preview>div,:root.dark-mode .workflow-grid>div{background:#111f33;border-color:var(--line)}:root.dark-mode .file-chip{background:#132540;border-color:#22314a;color:#93c5fd}

/* Warehouse order processing dashboard */
.cards.five{grid-template-columns:repeat(5,minmax(0,1fr))}.toolbar-wide{display:grid;grid-template-columns:minmax(260px,1fr) minmax(220px,340px) auto;gap:10px;align-items:center}.toolbar-select{min-height:42px}.warehouse-tabs{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.warehouse-dashboard-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff 0%,#eef6ff 52%,#f8fafc 100%);position:relative;overflow:hidden}.warehouse-dashboard-header:after{content:"";position:absolute;right:-90px;top:-90px;width:240px;height:240px;border-radius:999px;background:radial-gradient(circle,rgba(15,76,129,.16),rgba(20,184,166,.08),transparent 70%)}.warehouse-dashboard-header h2{font-size:1.55rem;margin:.1rem 0 .35rem;letter-spacing:-.04em}.warehouse-badge{display:inline-flex;align-items:center;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:5px 10px;font-weight:900;font-size:.78rem;letter-spacing:.04em}.order-meta{grid-template-columns:repeat(6,minmax(0,1fr))}.doc-preview{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:1180px){.cards.five{grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar-wide{grid-template-columns:1fr}.warehouse-dashboard-header{grid-template-columns:1fr}.warehouse-dashboard-header .hero-actions{justify-content:flex-start}.order-meta{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.cards.five{grid-template-columns:1fr}.warehouse-tabs .pill{width:100%;justify-content:center}.warehouse-dashboard-header h2{font-size:1.28rem}.order-meta{grid-template-columns:1fr}}:root.dark-mode .warehouse-dashboard-header{background:linear-gradient(135deg,#0f1b2d,#111f33)}:root.dark-mode .warehouse-badge{background:#132540;border-color:#22314a;color:#93c5fd}