@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap";:root{--slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;--slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;--slate-600:#475569;--slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;--slate-950:#020617;--brand-primary:#0f172a;--brand-accent:#4f46e5;--brand-accent-hover:#4338ca;--brand-accent-active:#3730a3;--brand-accent-light:#eef2ff;--brand-accent-border:#c7d2fe;--success-color:#059669;--success-strong:#047857;--success-bg:#ecfdf5;--success-border:#a7f3d0;--success-text:#065f46;--warning-color:#d97706;--warning-bg:#fffbeb;--warning-border:#fde68a;--warning-text:#92400e;--danger-color:#dc2626;--danger-bg:#fef2f2;--danger-border:#fecaca;--danger-text:#991b1b;--bg-canvas:#f6f8fb;--bg-surface:#fff;--bg-surface-subtle:var(--slate-50);--border-subtle:var(--slate-200);--border-strong:var(--slate-300);--text-main:var(--slate-900);--text-muted:var(--slate-500);--text-dim:var(--slate-400);--bg-app:var(--bg-canvas);--panel-bg:var(--bg-surface);--panel-border:var(--border-subtle);--panel-border-subtle:var(--slate-100);--card-bg:var(--bg-surface);--card-hover:var(--slate-100);--primary:var(--brand-accent);--primary-hover:var(--brand-accent-hover);--accent:var(--brand-accent);--success:var(--success-color);--warning:var(--warning-color);--danger:var(--danger-color);--green-highlight:var(--success-color);--red-error:var(--danger-color);--orange-warn:var(--warning-color);--sapBrandColor:var(--brand-accent);--shadow-xs:0 1px 2px 0 #0f172a0d;--shadow-sm:0 1px 3px 0 #0f172a12, 0 1px 2px -1px #0f172a0a;--shadow-md:0 6px 16px -4px #0f172a1a, 0 2px 4px -2px #0f172a0d;--shadow-lg:0 16px 32px -8px #0f172a24, 0 4px 8px -4px #0f172a0f;--shadow-pdt:0 24px 48px -12px #0f172a38, 0 8px 16px -8px #0f172a1a;--r-xs:6px;--r-sm:8px;--r-md:10px;--r-lg:12px;--r-xl:16px;--r-pill:999px;--ease:cubic-bezier(.4, 0, .2, 1);--dur:.16s;--font-sans:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;font-family:var(--font-sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background-color:var(--bg-canvas);color:var(--text-main);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-image:radial-gradient(circle at 0 0,#4f46e50a,#0000 45%),radial-gradient(circle at 100% 0,#0f172a08,#0000 40%);justify-content:center;align-items:flex-start;min-height:100vh;font-size:14px;line-height:1.5;display:flex}#root{justify-content:center;width:100%;padding:20px 24px 48px;display:flex}.app-wrapper{flex-direction:column;gap:18px;width:100%;max-width:1440px;display:flex}svg{flex-shrink:0}.global-app-bar{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);z-index:40;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:12px 18px;font-size:13px;font-weight:500;display:flex;position:sticky;top:12px}.header-left{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.brand-badge{background:var(--slate-900);color:#fff;border-radius:var(--r-md);box-shadow:var(--shadow-xs);align-items:center;gap:9px;padding:7px 12px 7px 9px;display:inline-flex}.brand-logo-mark{background:linear-gradient(135deg, var(--brand-accent), #6366f1);color:#fff;border-radius:7px;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:800;display:inline-flex;box-shadow:inset 0 0 0 1px #ffffff24}.brand-logo-mark svg{display:block}.brand-name{letter-spacing:-.3px;font-size:15px;font-weight:700;line-height:1}.brand-name strong{font-weight:800}.brand-edition{border-radius:var(--r-xs);letter-spacing:.7px;background:#ffffff29;padding:3px 6px;font-size:9px;font-weight:700;line-height:1}.warehouse-badge{color:var(--slate-600);background:var(--slate-100);border-radius:var(--r-sm);border:1px solid var(--slate-200);align-items:center;gap:6px;padding:6px 11px;font-size:12px;font-weight:600;display:inline-flex}.user-session-badge{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-pill);color:var(--slate-700);align-items:center;gap:8px;padding:5px 11px 5px 6px;font-size:12px;display:inline-flex}.user-avatar-initials{background:linear-gradient(135deg, var(--slate-700), var(--slate-900));color:#fff;letter-spacing:.3px;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;font-size:10px;font-weight:700;display:inline-flex}.app-mode-selector{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.app-mode-selector .mode-toggle-btn:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0}.mode-toggle-btn{background:var(--slate-100);color:var(--slate-600);border-radius:var(--r-sm);cursor:pointer;transition:background var(--dur) var(--ease), color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);border:1px solid #0000;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:600;display:inline-flex}.mode-toggle-btn:hover{color:var(--slate-900);background:var(--slate-200)}.mode-toggle-btn.active{background:var(--brand-primary);color:#fff;box-shadow:0 1px 3px #0f172a3d}.btn-logout{border:1px solid var(--border-subtle);color:var(--slate-500);border-radius:var(--r-sm);cursor:pointer;transition:all var(--dur) var(--ease);background:0 0;align-items:center;gap:5px;padding:8px 12px;font-size:12px;font-weight:600;display:inline-flex}.btn-logout:hover{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-color)}.sync-pill,.offline-status-badge{border-radius:var(--r-pill);background:var(--success-bg);color:var(--success-text);border:1px solid var(--success-border);white-space:nowrap;align-items:center;gap:6px;padding:6px 11px;font-size:11px;font-weight:700;display:inline-flex}.admin-viewport{flex-direction:column;gap:18px;width:100%;display:flex}.admin-container{flex-direction:column;gap:18px;display:flex}.admin-page-header{flex-direction:column;gap:16px;display:flex}.admin-title-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.admin-kicker{color:var(--brand-accent);text-transform:uppercase;letter-spacing:.7px;font-size:11px;font-weight:700;display:block}.admin-heading{color:var(--slate-900);letter-spacing:-.4px;margin-top:3px;font-size:24px;font-weight:800;line-height:1.15}.admin-controls{align-items:center;gap:8px;display:inline-flex}.status-badge.live{letter-spacing:.3px;border-radius:var(--r-pill);background:var(--success-bg);color:var(--success-text);border:1px solid var(--success-border);align-items:center;gap:7px;padding:6px 13px;font-size:11px;font-weight:700;display:inline-flex}.live-dot{background-color:var(--success-color);width:7px;height:7px;animation:pulse-dot 2s var(--ease) infinite;border-radius:50%;box-shadow:0 0 0 3px #0596692e}@keyframes pulse-dot{0%,to{box-shadow:0 0 0 3px #0596692e}50%{box-shadow:0 0 0 5px #0596690f}}.admin-subnav{background-color:var(--slate-100);border:1px solid var(--border-subtle);border-radius:var(--r-lg);box-shadow:var(--shadow-xs) inset;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;gap:4px;padding:5px;display:flex;overflow-x:auto}.admin-subnav::-webkit-scrollbar{display:none}.admin-nav-btn{color:var(--slate-600);border-radius:var(--r-sm);cursor:pointer;white-space:nowrap;transition:all var(--dur) var(--ease);scroll-snap-align:start;background:0 0;border:1px solid #0000;flex-shrink:0;align-items:center;gap:7px;padding:9px 14px;font-size:13px;font-weight:600;display:inline-flex}.admin-nav-btn svg{color:var(--slate-400);transition:color var(--dur) var(--ease)}.admin-nav-btn:hover{color:var(--slate-900);background:#ffffffb3}.admin-nav-btn:hover svg{color:var(--slate-500)}.admin-nav-btn.active{background:var(--bg-surface);color:var(--brand-accent);border-color:var(--border-subtle);box-shadow:var(--shadow-sm)}.admin-nav-btn.active svg{color:var(--brand-accent)}.admin-alert{border-radius:var(--r-md);border:1px solid var(--border-subtle);background:var(--bg-surface);color:var(--slate-700);align-items:center;gap:8px;padding:11px 16px;font-size:13px;font-weight:500;display:flex}.admin-alert.info{background:var(--brand-accent-light);border-color:var(--brand-accent-border);color:var(--brand-accent-active)}.admin-alert.success{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}.admin-alert.error{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-text)}.admin-card-section{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-xl);box-shadow:var(--shadow-sm);padding:22px}.section-header-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.section-header-row h2,.section-header h2{color:var(--slate-900);letter-spacing:-.2px;font-size:17px;font-weight:700}.section-desc{color:var(--text-muted);max-width:720px;margin-top:4px;font-size:13px;line-height:1.5}.reconcile-banner{border-radius:var(--r-lg);box-shadow:var(--shadow-xs);border:1px solid #0000;flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:22px;padding:18px 20px;display:flex}.reconcile-banner.balanced{background:linear-gradient(180deg, var(--success-bg), #fff);border-color:var(--success-border);color:var(--success-text)}.reconcile-banner.unbalanced{background:linear-gradient(180deg, var(--danger-bg), #fff);border-color:var(--danger-border);color:var(--danger-text)}.banner-icon{border-radius:var(--r-lg);background:#ffffffb3;border:1px solid #0f172a0f;flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;display:inline-flex}.banner-content{flex:1;min-width:260px}.banner-content h2{letter-spacing:.2px;margin-bottom:4px;font-size:15px;font-weight:800}.banner-content p{opacity:.92;font-size:13px;line-height:1.5}.btn-refresh{background-color:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--slate-800);border-radius:var(--r-sm);cursor:pointer;white-space:nowrap;box-shadow:var(--shadow-xs);transition:all var(--dur) var(--ease);align-items:center;gap:6px;padding:9px 16px;font-size:12px;font-weight:600;display:inline-flex}.btn-refresh:hover:not(:disabled){border-color:var(--brand-accent);color:var(--brand-accent);background:var(--brand-accent-light)}.btn-refresh:disabled{opacity:.6;cursor:progress}.kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px;display:grid}.kpi-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);flex-direction:column;gap:4px;padding:18px 18px 16px;display:flex;position:relative;overflow:hidden}.kpi-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.kpi-card:before{content:"";background:var(--brand-accent);opacity:.9;height:3px;position:absolute;top:0;left:0;right:0}.kpi-card.highlight-green:before{background:var(--success-color)}.kpi-card.highlight-red:before{background:var(--danger-color)}.kpi-card.highlight-orange:before{background:var(--warning-color)}.kpi-lbl{text-transform:uppercase;letter-spacing:.6px;color:var(--slate-500);font-size:10.5px;font-weight:700;display:block}.kpi-val{color:var(--slate-900);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:-1px;font-size:32px;font-weight:700;line-height:1.05;font-family:var(--font-mono);margin:4px 0 2px;display:block}.kpi-val.date-val{letter-spacing:-.5px;font-size:24px}.kpi-card.highlight-green .kpi-val{color:var(--success-strong)}.kpi-card.highlight-red .kpi-val{color:var(--danger-color)}.kpi-card.highlight-orange .kpi-val{color:var(--warning-color)}.kpi-sub{color:var(--slate-500);font-size:12px;line-height:1.4;display:block}.table-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.filter-group{background:var(--slate-100);border-radius:var(--r-md);border:1px solid var(--slate-200);align-items:center;gap:2px;padding:4px;display:inline-flex}.filter-group label{color:var(--slate-500);padding:0 10px 0 8px;font-size:12px;font-weight:600}.filter-btn{color:var(--slate-600);border-radius:var(--r-xs);cursor:pointer;transition:all var(--dur) var(--ease);white-space:nowrap;background:0 0;border:1px solid #0000;padding:7px 13px;font-size:12px;font-weight:600}.filter-btn:hover{color:var(--slate-900)}.filter-btn.active{background:var(--bg-surface);color:var(--slate-900);box-shadow:var(--shadow-xs);border-color:var(--border-subtle)}.filter-btn.active.alert,.filter-btn.active.highlight-red{background:var(--danger-bg);color:var(--danger-color);border-color:var(--danger-border)}.filter-btn.active.highlight-green{background:var(--success-bg);color:var(--success-strong);border-color:var(--success-border)}.filter-btn.active.highlight-orange{background:var(--warning-bg);color:var(--warning-color);border-color:var(--warning-border)}.admin-search-input{flex:1;min-width:220px;height:42px}.chip-btn{height:34px;color:var(--slate-600);background:var(--slate-100);border:1px solid var(--slate-200);border-radius:var(--r-pill);cursor:pointer;white-space:nowrap;transition:all var(--dur) var(--ease);padding:0 14px;font-size:12px;font-weight:600}.chip-btn:hover{background:var(--slate-200);color:var(--slate-900)}.table-wrapper{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;overflow-x:auto}.admin-table{border-collapse:collapse;text-align:left;width:100%;min-width:860px;font-size:13px}.admin-table th{background:var(--slate-50);color:var(--slate-500);text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--border-subtle);white-space:nowrap;z-index:1;padding:12px 16px;font-size:11px;font-weight:600;position:sticky;top:0}.admin-table td{border-bottom:1px solid var(--slate-100);color:var(--slate-800);vertical-align:middle;padding:13px 16px}.admin-table tr:last-child td{border-bottom:none}.admin-table tbody tr{transition:background var(--dur) var(--ease)}.admin-table tbody tr:hover td{background-color:var(--slate-50)}.admin-table td.numeric,.admin-table th.numeric{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font-mono)}.admin-table .row-ok:hover td{background-color:var(--success-bg)}.admin-table .row-error td{background-color:#dc262609}.admin-table .row-error:hover td{background-color:var(--danger-bg)}.empty-cell{text-align:center;color:var(--text-muted);font-size:13px;padding:36px 16px!important}.sku-cell strong{color:var(--slate-900);font-weight:700;font-family:var(--font-mono);font-size:12.5px}.code-cell{font-family:var(--font-mono);color:var(--slate-600);font-size:12px}.doc-cell{text-overflow:ellipsis;white-space:nowrap;max-width:160px;overflow:hidden}.date-cell{font-family:var(--font-mono);color:var(--slate-500);white-space:nowrap;font-size:12px}.tracking-tag{border-radius:var(--r-pill);border:1px solid var(--slate-200);background:var(--slate-100);color:var(--slate-600);align-items:center;padding:3px 9px;font-size:11px;font-weight:600;display:inline-flex}.tracking-tag.batch{background:var(--brand-accent-light);color:var(--brand-accent-active);border-color:var(--brand-accent-border)}.tracking-tag.serial{color:#a21caf;background:#fdf4ff;border-color:#f5d0fe}.tracking-tag.none{background:var(--slate-100);color:var(--slate-500)}.operation-tag{color:var(--slate-700);font-size:12px;font-weight:600}.event-tag{font-family:var(--font-mono);color:var(--slate-700);letter-spacing:-.2px;font-size:11.5px;font-weight:600}.payload-cell{color:var(--slate-600);font-size:12px}.tag-lot,.tag-ser{border-radius:var(--r-xs);font-size:11px;font-weight:600;font-family:var(--font-mono);align-items:center;padding:2px 8px;display:inline-flex}.tag-lot{background:var(--brand-accent-light);color:var(--brand-accent-active)}.tag-ser{color:#a21caf;background:#fdf4ff}.badge{border-radius:var(--r-pill);letter-spacing:.2px;white-space:nowrap;align-items:center;gap:4px;padding:3px 9px;font-size:11px;font-weight:700;line-height:1.3;display:inline-flex}.badge-green{background:var(--success-bg);color:var(--success-strong);border:1px solid var(--success-border)}.badge-orange,.badge-amber{background:var(--warning-bg);color:var(--warning-color);border:1px solid var(--warning-border)}.badge-red{background:var(--danger-bg);color:var(--danger-color);border:1px solid var(--danger-border)}.badge-blue,.badge-neutral{background:var(--brand-accent-light);color:var(--brand-accent-active);border:1px solid var(--brand-accent-border)}.scan-input,.admin-input,.admin-select,input[type=text],input[type=number],input[type=password],select{height:42px;color:var(--slate-900);background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-sm);transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);outline:none;width:100%;padding:9px 14px;font-family:inherit;font-size:13px}.scan-input:focus,.admin-input:focus,.admin-select:focus,input:focus,select:focus{border-color:var(--brand-accent);box-shadow:0 0 0 3px #4f46e524}::placeholder{color:var(--text-dim)}.pdt-btn{border-radius:var(--r-sm);cursor:pointer;min-height:42px;transition:all var(--dur) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:9px 18px;font-size:13px;font-weight:600;display:inline-flex}.pdt-btn.primary{background-color:var(--brand-accent);color:#fff;border-color:var(--brand-accent);box-shadow:0 1px 3px #4f46e54d}.pdt-btn.primary:hover{background-color:var(--brand-accent-hover);border-color:var(--brand-accent-hover)}.pdt-btn.primary:active{background-color:var(--brand-accent-active)}.pdt-btn.secondary{background-color:var(--bg-surface);color:var(--slate-700);border-color:var(--border-subtle)}.pdt-btn.secondary:hover{background-color:var(--slate-50);border-color:var(--border-strong)}.pdt-viewport{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-xl);width:100%;max-width:480px;box-shadow:var(--shadow-pdt);flex-direction:column;margin:0 auto;display:flex;overflow:hidden}.pdt-statusbar{background-color:var(--slate-900);color:#fff;justify-content:space-between;align-items:center;padding:9px 14px;font-size:11px;font-weight:600;display:flex}.pdt-statusbar .status-dot{background-color:#34d399;border-radius:50%;width:7px;height:7px;margin-right:5px;display:inline-block;box-shadow:0 0 0 2px #34d3994d}.pdt-nav-tabs{background:var(--bg-surface-subtle);border-bottom:1px solid var(--border-subtle);scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:6px;padding:8px 12px;display:flex;overflow-x:auto}.pdt-nav-tabs::-webkit-scrollbar{display:none}.pdt-tab{background:var(--bg-surface);min-width:112px;color:var(--slate-600);border:1px solid var(--border-subtle);border-radius:var(--r-sm);cursor:pointer;white-space:nowrap;transition:all var(--dur) var(--ease);flex:1;justify-content:center;align-items:center;gap:5px;padding:9px 10px;font-size:12px;font-weight:600;display:inline-flex}.pdt-tab:hover{border-color:var(--border-strong);color:var(--slate-900)}.pdt-tab.active{background:var(--brand-accent);color:#fff;border-color:var(--brand-accent);box-shadow:0 1px 3px #4f46e54d}.pdt-header{background-color:var(--bg-surface);border-bottom:1px solid var(--border-subtle);padding:18px 20px}.pdt-header .kicker{color:var(--brand-accent);text-transform:uppercase;letter-spacing:.6px;font-size:11px;font-weight:700}.pdt-header h1{color:var(--slate-900);letter-spacing:-.3px;margin:3px 0;font-size:21px;font-weight:800}.pdt-header .subtitle{color:var(--slate-500);font-size:12px}.pdt-content{background-color:var(--bg-surface-subtle);flex-direction:column;gap:16px;padding:16px;display:flex}.scan-container{background-color:var(--bg-surface);border-radius:var(--r-lg);border:1px solid var(--border-subtle);box-shadow:var(--shadow-xs);padding:16px}.scan-container label{color:var(--slate-600);margin-bottom:7px;font-size:12px;font-weight:600;display:block}.scan-input-group{gap:8px;display:flex}.scan-input{height:48px;font-size:15px;font-weight:600;font-family:var(--font-mono);flex:1}.btn-scan{background-color:var(--brand-accent);color:#fff;border-radius:var(--r-sm);cursor:pointer;white-space:nowrap;height:48px;transition:background var(--dur) var(--ease);border:none;align-items:center;gap:6px;padding:0 18px;font-size:13px;font-weight:700;display:inline-flex}.btn-scan:hover{background-color:var(--brand-accent-hover)}.btn-scan-laser{background-color:var(--brand-accent);color:#fff;border-radius:var(--r-sm);cursor:pointer;border:none;align-items:center;gap:6px;height:48px;padding:0 16px;font-weight:600;display:inline-flex}.btn-scan-laser:hover{background-color:var(--brand-accent-hover)}.quick-chips{flex-wrap:wrap;gap:7px;margin-top:12px;display:flex}.quick-chips .chip-btn{height:32px}.feedback-box{border-radius:var(--r-md);border:1px solid var(--border-subtle);padding:13px 16px;font-size:13px;font-weight:500}.feedback-box.error{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-text)}.feedback-box.empty{background:var(--bg-surface);color:var(--text-muted);text-align:center;border-style:dashed}.result-card{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);flex-direction:column;gap:14px;padding:18px;display:flex}.item-title-block{border-bottom:1px solid var(--slate-100);padding-bottom:12px}.item-sku{color:var(--slate-900);font-size:20px;font-weight:800;font-family:var(--font-mono);letter-spacing:-.5px}.item-desc{color:var(--slate-500);margin-top:2px;font-size:13px}.field-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.field-box{background:var(--bg-surface-subtle);border:1px solid var(--border-subtle);border-radius:var(--r-sm);padding:10px 12px}.field-box .lbl{text-transform:uppercase;letter-spacing:.4px;color:var(--slate-500);margin-bottom:3px;font-size:10.5px;font-weight:700;display:block}.field-box .val{color:var(--slate-900);font-size:13px;font-weight:600}.stock-metrics-box{background:var(--slate-900);border-radius:var(--r-lg);flex-direction:column;gap:8px;padding:14px 16px;display:flex}.metric-row{justify-content:space-between;align-items:center;display:flex}.metric-row .m-lbl{color:var(--slate-400);font-size:12px}.metric-row .m-val{color:#fff;font-size:14px;font-weight:700;font-family:var(--font-mono)}.metric-row.available{border-top:1px solid #ffffff1a;margin-top:4px;padding-top:10px}.metric-row.available .m-lbl{color:#fff;font-weight:600}.metric-row.available .m-val{color:#34d399;font-size:18px}.action-buttons{gap:10px;display:flex}.action-buttons .pdt-btn{flex:1}.login-card{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);width:100%;max-width:420px;margin:44px auto;padding:38px 34px}.login-header{text-align:center;margin-bottom:26px}.login-header .logo-box{background:var(--slate-900);color:#fff;border-radius:var(--r-lg);align-items:center;gap:8px;margin-bottom:14px;padding:10px 18px;display:inline-flex}.login-header .brand-logo-text{color:#fff;letter-spacing:-.5px;font-size:20px;font-weight:800}.login-header .brand-subtitle{color:var(--slate-500);font-size:13px}.login-form .form-group{margin-bottom:16px}.login-form label{color:var(--slate-600);margin-bottom:6px;font-size:12px;font-weight:600;display:block}.login-form input{width:100%}.pin-display{letter-spacing:6px;text-align:center;font-size:18px;font-family:var(--font-mono)!important}.pin-pad{grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 6px;display:grid}.pin-btn{border-radius:var(--r-md);border:1px solid var(--border-subtle);background:var(--bg-surface);height:46px;color:var(--slate-800);font-family:var(--font-mono);cursor:pointer;transition:all var(--dur) var(--ease);box-shadow:var(--shadow-xs);justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex}.pin-btn:hover{background:var(--slate-100);border-color:var(--slate-300)}.pin-btn:active{transform:scale(.97)}.pin-btn.clear{color:#dc2626;background:#fef2f2;border-color:#fecaca;font-size:14px}.pin-btn.clear:hover{background:#fee2e2}.pin-btn.ok{color:#059669;background:#ecfdf5;border-color:#a7f3d0;font-size:14px}.pin-btn.ok:hover{background:#d1fae5}.login-submit-btn{background-color:var(--brand-accent);color:#fff;border-radius:var(--r-sm);cursor:pointer;width:100%;height:48px;transition:background var(--dur) var(--ease);border:none;margin-top:10px;font-size:14px;font-weight:700;box-shadow:0 2px 8px #4f46e552}.login-submit-btn:hover{background-color:var(--brand-accent-hover)}.quick-presets{flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;display:flex}.preset-label{color:var(--slate-500);text-transform:uppercase;letter-spacing:.3px;font-size:11px;font-weight:600}.preset-btn{font-size:11.5px;font-weight:600;font-family:var(--font-mono);background:var(--slate-100);color:var(--slate-700);border:1px solid var(--slate-200);border-radius:var(--r-sm);cursor:pointer;transition:all var(--dur) var(--ease);padding:5px 12px}.preset-btn:hover{background:var(--brand-accent-light);color:var(--brand-accent);border-color:var(--brand-accent-border)}.btn{border-radius:var(--r-sm);font-family:var(--font-sans);cursor:pointer;transition:all var(--dur) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;gap:6px;font-weight:600;display:inline-flex}.btn-primary{box-shadow:0 1px 3px #4f46e540;background-color:var(--brand-accent)!important;color:#fff!important;border-color:var(--brand-accent)!important}.btn-primary:hover{background-color:var(--brand-accent-hover)!important;border-color:var(--brand-accent-hover)!important}.btn-secondary{background-color:var(--bg-surface)!important;color:var(--slate-700)!important;border-color:var(--slate-200)!important}.btn-secondary:hover{background-color:var(--slate-50)!important;border-color:var(--slate-300)!important}.input-field{font-family:var(--font-sans);transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);outline:none;font-size:13px;background-color:var(--bg-surface)!important;color:var(--slate-900)!important;border:1px solid var(--slate-200)!important;border-radius:var(--r-sm)!important}.input-field:focus{border-color:var(--brand-accent)!important;box-shadow:0 0 0 3px #4f46e51f!important}@media (width>=1600px){.kpi-val{font-size:34px}}@media (width<=1200px){.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=900px){.admin-heading{font-size:21px}}@media (width<=768px){#root{padding:12px 12px 32px}.global-app-bar{flex-direction:column;align-items:stretch;gap:12px;padding:12px 14px;position:static}.header-left,.app-mode-selector{justify-content:space-between;width:100%}.mode-toggle-btn{flex:1;justify-content:center;padding:9px 8px;font-size:11px}.btn-logout{flex-shrink:0}.admin-card-section{padding:16px}.table-toolbar{flex-direction:column;align-items:stretch}.filter-group{justify-content:space-between;width:100%;overflow-x:auto}.filter-btn{text-align:center;flex:1}.reconcile-banner{text-align:left;flex-direction:column;align-items:stretch}.btn-refresh{justify-content:center;width:100%}.section-header-row{flex-direction:column}.section-header-row .btn-refresh{width:100%}}@media (width<=540px){.kpi-grid{grid-template-columns:1fr;gap:12px}.admin-heading{font-size:19px}.kpi-val{font-size:30px}.pdt-viewport{border-radius:var(--r-md)}.field-grid{grid-template-columns:1fr}.brand-badge{padding:6px 10px 6px 7px}.brand-name{font-size:13px}.warehouse-badge,.user-session-badge span:not(.user-avatar-initials):not(.badge){display:none}.action-buttons{flex-direction:column}}@media (width<=380px){#root{padding:8px 8px 24px}.kpi-val{font-size:27px}.mode-toggle-btn span,.mode-toggle-btn{font-size:10.5px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}