:root{--brand-primary: #3b82f6;--brand-primary-light: #60a5fa;--brand-primary-dark: #2563eb;--brand-primary-subtle: rgba(59, 130, 246, .15);--brand-secondary: #8b5cf6;--brand-secondary-light: #a78bfa;--brand-secondary-dark: #7c3aed;--brand-secondary-subtle: rgba(139, 92, 246, .15);--color-success: #22c55e;--color-success-light: #4ade80;--color-success-dark: #16a34a;--color-success-subtle: rgba(34, 197, 94, .15);--color-warning: #f59e0b;--color-warning-light: #fbbf24;--color-warning-dark: #d97706;--color-warning-subtle: rgba(245, 158, 11, .15);--color-danger: #ef4444;--color-danger-light: #f87171;--color-danger-dark: #dc2626;--color-danger-subtle: rgba(239, 68, 68, .15);--color-info: #06b6d4;--color-info-light: #22d3ee;--color-info-dark: #0891b2;--color-info-subtle: rgba(6, 182, 212, .15);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--transition-spring: .3s cubic-bezier(.34, 1.56, .64, 1);--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-fixed: 300;--z-modal-backdrop: 400;--z-modal: 500;--z-popover: 600;--z-tooltip: 700;--z-toast: 800;--header-height: 64px;--sidebar-width: 260px;--content-max-width: 1400px}:root,[data-theme=dark]{--bg-app: #0a0f1a;--bg-surface: #0f172a;--bg-elevated: #1e293b;--bg-overlay: #334155;--bg-hover: rgba(255, 255, 255, .05);--bg-active: rgba(255, 255, 255, .1);--bg-selected: rgba(59, 130, 246, .15);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--text-disabled: #475569;--text-inverse: #0f172a;--border-default: rgba(255, 255, 255, .08);--border-subtle: rgba(255, 255, 255, .04);--border-strong: rgba(255, 255, 255, .15);--border-focus: var(--brand-primary);--input-bg: #1e293b;--input-border: #334155;--input-focus-ring: rgba(59, 130, 246, .4);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .3), 0 2px 4px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .3), 0 4px 6px rgba(0, 0, 0, .2);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .3), 0 10px 10px rgba(0, 0, 0, .2);--shadow-glow: 0 0 20px rgba(59, 130, 246, .3);--scrollbar-track: var(--bg-surface);--scrollbar-thumb: var(--border-strong);--scrollbar-thumb-hover: var(--text-muted);--card-bg: var(--bg-surface);--card-border: var(--border-default);--card-header-bg: var(--bg-elevated);--table-header-bg: var(--bg-elevated);--table-row-hover: var(--bg-hover);--table-stripe: rgba(255, 255, 255, .02);--badge-primary-bg: rgba(59, 130, 246, .2);--badge-primary-text: #60a5fa;--badge-success-bg: rgba(34, 197, 94, .2);--badge-success-text: #4ade80;--badge-warning-bg: rgba(245, 158, 11, .2);--badge-warning-text: #fbbf24;--badge-danger-bg: rgba(239, 68, 68, .2);--badge-danger-text: #f87171;--badge-gray-bg: rgba(148, 163, 184, .2);--badge-gray-text: #94a3b8;--modal-bg: var(--bg-surface);--modal-header-bg: var(--bg-elevated);--modal-footer-bg: var(--bg-elevated);--modal-overlay: rgba(0, 0, 0, .6);--modal-backdrop-blur: 4px;--alert-success-bg: var(--color-success-subtle);--alert-success-border: var(--color-success);--alert-success-text: var(--color-success-light);--alert-error-bg: var(--color-danger-subtle);--alert-error-border: var(--color-danger);--alert-error-text: var(--color-danger-light);--alert-warning-bg: var(--color-warning-subtle);--alert-warning-border: var(--color-warning);--alert-warning-text: var(--color-warning-light);--alert-info-bg: var(--color-info-subtle);--alert-info-border: var(--color-info);--alert-info-text: var(--color-info-light);--kpi-icon-primary-bg: var(--brand-primary-subtle);--kpi-icon-primary-color: var(--brand-primary-light);--kpi-icon-success-bg: var(--color-success-subtle);--kpi-icon-success-color: var(--color-success);--kpi-icon-warning-bg: var(--color-warning-subtle);--kpi-icon-warning-color: var(--color-warning);--kpi-icon-danger-bg: var(--color-danger-subtle);--kpi-icon-danger-color: var(--color-danger);--kpi-icon-info-bg: var(--color-info-subtle);--kpi-icon-info-color: var(--color-info);--glass-bg: rgba(15, 23, 42, .85);--glass-border: rgba(255, 255, 255, .08);--glass-blur: 12px;--app-gradient-start: #0a0f1a;--app-gradient-end: #1e293b}[data-theme=light]{--bg-app: #f8fafc;--bg-surface: #ffffff;--bg-elevated: #f1f5f9;--bg-overlay: #e2e8f0;--bg-hover: rgba(0, 0, 0, .04);--bg-active: rgba(0, 0, 0, .08);--bg-selected: rgba(59, 130, 246, .1);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #64748b;--text-disabled: #94a3b8;--text-inverse: #f1f5f9;--border-default: #e2e8f0;--border-subtle: #f1f5f9;--border-strong: #cbd5e1;--border-focus: var(--brand-primary);--input-bg: #ffffff;--input-border: #cbd5e1;--input-focus-ring: rgba(59, 130, 246, .3);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .1), 0 10px 10px rgba(0, 0, 0, .04);--shadow-glow: 0 0 20px rgba(59, 130, 246, .2);--scrollbar-track: #f1f5f9;--scrollbar-thumb: #cbd5e1;--scrollbar-thumb-hover: #94a3b8;--card-bg: var(--bg-surface);--card-border: var(--border-default);--card-header-bg: var(--bg-elevated);--table-header-bg: var(--bg-elevated);--table-row-hover: var(--bg-hover);--table-stripe: rgba(0, 0, 0, .02);--badge-primary-bg: #dbeafe;--badge-primary-text: #1d4ed8;--badge-success-bg: #dcfce7;--badge-success-text: #15803d;--badge-warning-bg: #fef3c7;--badge-warning-text: #b45309;--badge-danger-bg: #fee2e2;--badge-danger-text: #b91c1c;--badge-gray-bg: #f1f5f9;--badge-gray-text: #475569;--modal-bg: var(--bg-surface);--modal-header-bg: #f8fafc;--modal-footer-bg: #f8fafc;--modal-overlay: rgba(0, 0, 0, .4);--alert-success-bg: #ecfdf5;--alert-success-border: #a7f3d0;--alert-success-text: #047857;--alert-error-bg: #fff1f2;--alert-error-border: #fecdd3;--alert-error-text: #be123c;--alert-warning-bg: #fffbeb;--alert-warning-border: #fcd34d;--alert-warning-text: #b45309;--alert-info-bg: #f0f9ff;--alert-info-border: #bae6fd;--alert-info-text: #0369a1;--kpi-icon-primary-bg: #dbeafe;--kpi-icon-primary-color: #2563eb;--kpi-icon-success-bg: #dcfce7;--kpi-icon-success-color: #16a34a;--kpi-icon-warning-bg: #fef3c7;--kpi-icon-warning-color: #d97706;--kpi-icon-danger-bg: #fee2e2;--kpi-icon-danger-color: #dc2626;--kpi-icon-info-bg: #e0f2fe;--kpi-icon-info-color: #0891b2;--glass-bg: rgba(255, 255, 255, .9);--glass-border: #e2e8f0;--glass-blur: 10px;--app-gradient-start: #f8fafc;--app-gradient-end: #f1f5f9}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);font-size:var(--text-sm);line-height:1.5;color:var(--text-primary);background:var(--bg-app);transition:background-color var(--transition-normal),color var(--transition-normal)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}button:focus,.tab-btn:focus,.nav-btn:focus,.filter-btn:focus{outline:none}button:focus-visible,.tab-btn:focus-visible,.nav-btn:focus-visible,.filter-btn:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}::selection{background:var(--brand-primary-subtle);color:var(--text-primary)}.data-table-container{overflow-x:auto;background:var(--bg-surface);border-radius:var(--radius-lg);border:1px solid var(--border-default)}table,.data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}table th,.data-table th{text-align:left;padding:var(--space-3) var(--space-4);background:var(--table-header-bg);color:var(--text-muted);font-weight:var(--font-medium);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.05em;border-bottom:1px solid var(--border-default);white-space:nowrap}table th.sortable,.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--transition-fast)}table th.sortable:hover,.data-table th.sortable:hover{color:var(--text-primary)}table th svg,.data-table th svg{margin-left:var(--space-1);vertical-align:middle}table td,.data-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-default);color:var(--text-primary);background:var(--bg-surface)}table tbody tr:hover td,.data-table tbody tr:hover td{background:var(--table-row-hover)}table.table-striped tbody tr:nth-child(2n) td,.data-table.table-striped tbody tr:nth-child(2n) td{background:var(--table-stripe)}table.table-striped tbody tr:nth-child(2n):hover td,.data-table.table-striped tbody tr:nth-child(2n):hover td{background:var(--table-row-hover)}table td.text-right,table th.text-right,.data-table td.text-right,.data-table th.text-right,table td.right,.data-table td.right{text-align:right}table td.text-center,table th.text-center,.data-table td.text-center,.data-table th.text-center{text-align:center}table .text-danger,.data-table .text-danger{color:var(--color-danger);font-weight:var(--font-semibold)}table .text-warning,.data-table .text-warning{color:var(--color-warning)}table .text-success,.data-table .text-success{color:var(--color-success)}table .text-info,.data-table .text-info{color:var(--color-info)}table .text-muted,.data-table .text-muted{color:var(--text-muted)}.table-loading,.table-empty{padding:var(--space-12);text-align:center;color:var(--text-muted);background:var(--bg-surface)}table.table-compact th,table.table-compact td,.data-table.table-compact th,.data-table.table-compact td{padding:var(--space-2) var(--space-3);font-size:var(--text-xs)}table.table-bordered td,table.table-bordered th,.data-table.table-bordered td,.data-table.table-bordered th{border:1px solid var(--border-default)}table.table-sticky thead,.data-table.table-sticky thead{position:sticky;top:0;z-index:var(--z-sticky)}html.theme-transitioning,html.theme-transitioning *,html.theme-transitioning *:before,html.theme-transitioning *:after{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease!important}.app-container{background:var(--bg-app);color:var(--text-primary)}.app-container[data-theme=light]{--bg-app: #f8fafc;--bg-surface: #ffffff;--bg-elevated: #f1f5f9;--bg-overlay: #e2e8f0;--bg-hover: rgba(0, 0, 0, .04);--bg-active: rgba(0, 0, 0, .08);--bg-selected: rgba(59, 130, 246, .1);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #64748b;--text-disabled: #94a3b8;--text-inverse: #f1f5f9;--color-text-main: #0f172a;--color-text-muted: #475569;--color-bg-panel: #ffffff;--color-bg-app: #f8fafc;--color-bg-hover: rgba(0, 0, 0, .04);--color-border: #e2e8f0;--border-default: #e2e8f0;--border-subtle: #f1f5f9;--border-strong: #cbd5e1;--input-bg: #ffffff;--input-border: #cbd5e1;--input-focus-ring: rgba(59, 130, 246, .3);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .1), 0 10px 10px rgba(0, 0, 0, .04);--scrollbar-track: #f1f5f9;--scrollbar-thumb: #cbd5e1;--scrollbar-thumb-hover: #94a3b8;--card-bg: #ffffff;--card-border: #e2e8f0;--card-header-bg: #f1f5f9;--table-header-bg: #f1f5f9;--table-row-hover: rgba(0, 0, 0, .04);--table-stripe: rgba(0, 0, 0, .02);--badge-primary-bg: #dbeafe;--badge-primary-text: #1d4ed8;--badge-success-bg: #dcfce7;--badge-success-text: #15803d;--badge-warning-bg: #fef3c7;--badge-warning-text: #b45309;--badge-danger-bg: #fee2e2;--badge-danger-text: #b91c1c;--badge-gray-bg: #f1f5f9;--badge-gray-text: #475569;--modal-bg: #ffffff;--modal-header-bg: #f8fafc;--modal-footer-bg: #f8fafc;--modal-overlay: rgba(0, 0, 0, .4);--glass-bg: rgba(255, 255, 255, .9);--glass-border: #e2e8f0;--app-gradient-start: #f8fafc;--app-gradient-end: #f1f5f9}.app-container[data-theme=dark]{--bg-app: #0a0f1a;--bg-surface: #0f172a;--bg-elevated: #1e293b;--bg-overlay: #334155;--bg-hover: rgba(255, 255, 255, .05);--bg-active: rgba(255, 255, 255, .1);--bg-selected: rgba(59, 130, 246, .15);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--text-disabled: #475569;--text-inverse: #0f172a;--color-text-main: #f1f5f9;--color-text-muted: #94a3b8;--color-bg-panel: #0f172a;--color-bg-app: #0a0f1a;--color-bg-hover: rgba(255, 255, 255, .05);--color-border: rgba(255, 255, 255, .08);--border-default: rgba(255, 255, 255, .08);--border-subtle: rgba(255, 255, 255, .04);--border-strong: rgba(255, 255, 255, .15);--input-bg: #1e293b;--input-border: #334155;--input-focus-ring: rgba(59, 130, 246, .4);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .3), 0 2px 4px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .3), 0 4px 6px rgba(0, 0, 0, .2);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .3), 0 10px 10px rgba(0, 0, 0, .2);--scrollbar-track: #0f172a;--scrollbar-thumb: rgba(255, 255, 255, .15);--scrollbar-thumb-hover: #64748b;--card-bg: #0f172a;--card-border: rgba(255, 255, 255, .08);--card-header-bg: #1e293b;--table-header-bg: #1e293b;--table-row-hover: rgba(255, 255, 255, .05);--table-stripe: rgba(255, 255, 255, .02);--badge-primary-bg: rgba(59, 130, 246, .2);--badge-primary-text: #60a5fa;--badge-success-bg: rgba(34, 197, 94, .2);--badge-success-text: #4ade80;--badge-warning-bg: rgba(245, 158, 11, .2);--badge-warning-text: #fbbf24;--badge-danger-bg: rgba(239, 68, 68, .2);--badge-danger-text: #f87171;--badge-gray-bg: rgba(148, 163, 184, .2);--badge-gray-text: #94a3b8;--modal-bg: #0f172a;--modal-header-bg: #1e293b;--modal-footer-bg: #1e293b;--modal-overlay: rgba(0, 0, 0, .6);--glass-bg: rgba(15, 23, 42, .85);--glass-border: rgba(255, 255, 255, .08);--app-gradient-start: #0a0f1a;--app-gradient-end: #1e293b}:root{--color-primary: var(--brand-primary);--color-primary-light: var(--brand-primary-light);--color-primary-dark: var(--brand-primary-dark);--color-secondary: var(--brand-secondary);--color-accent: var(--color-danger);--color-bg-app: var(--bg-app);--color-bg-panel: var(--bg-surface);--color-bg-hover: var(--bg-hover);--color-text-main: var(--text-primary);--color-text-muted: var(--text-secondary);--color-border: var(--border-default);--font-main: var(--font-sans);--spacing-xs: var(--space-1);--spacing-sm: var(--space-2);--spacing-md: var(--space-4);--spacing-lg: var(--space-6);--spacing-xl: var(--space-8)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-app);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-y:auto;transition:background-color var(--transition-normal),color var(--transition-normal)}h1,h2,h3,h4,h5,h6{font-weight:400}button{font-family:inherit;cursor:pointer;border:none;background:none;touch-action:manipulation}input,select,textarea{font-family:inherit;background-color:var(--input-bg);color:var(--text-primary);border:1px solid var(--input-border);border-radius:var(--radius-md);padding:10px 12px;font-size:14px;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px var(--input-focus-ring)}input::placeholder,textarea::placeholder{color:var(--text-muted);opacity:1}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 10px center;background-repeat:no-repeat;background-size:16px;padding-right:36px;cursor:pointer}input[type=checkbox],input[type=radio]{width:18px;height:18px;padding:0;cursor:pointer;accent-color:var(--color-primary)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}textarea{min-height:80px;resize:vertical;line-height:1.5}input:disabled,select:disabled,textarea:disabled{background-color:var(--bg-hover)!important;color:var(--text-muted)!important;cursor:not-allowed;opacity:.7}input:read-only:not(:disabled),textarea:read-only:not(:disabled){background-color:var(--bg-elevated)!important;cursor:default}input.input-error,select.input-error,textarea.input-error{border-color:var(--color-danger);box-shadow:0 0 0 3px #ef444426}input[type=search]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3e%3cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3e%3c/svg%3e");background-position:left 10px center;background-repeat:no-repeat;background-size:18px;padding-left:36px}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.grow{flex-grow:1}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.panel{background:var(--color-bg-panel);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.text-primary{color:var(--color-primary)}.text-danger{color:var(--color-accent)}.text-muted{color:var(--color-text-muted)}.font-bold{font-weight:400}.text-lg{font-size:1rem}.text-xl{font-size:1.1rem}.text-2xl{font-size:1.25rem}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-content{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:fadeIn .2s ease-out}.batch-modal{background:#fff;width:400px;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);display:flex;flex-direction:column;overflow:hidden;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.modal-header{padding:16px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;background:var(--bg-elevated)}.header-title{display:flex;align-items:center;gap:10px;color:var(--color-primary)}.close-btn{color:var(--color-text-muted);padding:4px}.close-btn:hover{color:var(--color-danger)}.product-summary{padding:16px;background:var(--brand-primary-subtle);border-bottom:1px solid var(--color-border)}.product-summary h3{margin:0;font-size:1rem;color:var(--color-text-main)}.aic{font-size:.85rem;color:var(--color-text-muted);font-family:monospace}.toast-container{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:10000;display:flex;flex-direction:column;gap:10px;pointer-events:none}@media(hover:none)and (pointer:coarse){button,.product-card,.action-btn{min-height:44px;min-width:44px}button:active,.product-card:active{transform:scale(.98)}}.app-container{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden;background-color:var(--bg-app)}@media(max-width:1024px)and (orientation:portrait){.app-container{flex-direction:column;height:auto;min-height:100vh}.main-content{flex-direction:column;flex:1;overflow:visible}.product-section{width:100%;max-height:none;overflow:visible}.ai-panel-column{width:100%;max-height:300px}.right-panel{position:fixed;bottom:0;left:0;right:0;width:100%;height:70vh;max-height:70vh;transform:translateY(calc(100% - 60px));transition:transform .3s ease-out;z-index:999;box-shadow:0 -4px 12px #00000026;border-radius:16px 16px 0 0}.right-panel.mobile-open{transform:translateY(0)}.right-panel:before{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:40px;height:4px;background:var(--color-border);border-radius:2px}.action-bar{padding:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}.action-btn{min-width:80px;flex-shrink:0}}@media(min-width:1024px)and (max-width:1366px)and (orientation:landscape){.product-section{width:55%}.ai-panel-column{width:20%}.right-panel{width:25%}.action-bar{padding:10px 16px}.action-btn{padding:8px 12px;font-size:.85rem}}@media(max-width:768px){.app-container,.main-content{flex-direction:column}.product-section{width:100%;padding:8px}.product-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.product-card{padding:10px}.product-name{font-size:.85rem}.product-price{font-size:1rem}.ai-panel-column{width:100%;max-height:250px;padding:8px}.right-panel{position:fixed;bottom:0;left:0;right:0;width:100%;height:75vh;transform:translateY(calc(100% - 50px));z-index:999;border-radius:20px 20px 0 0}.right-panel.mobile-open{transform:translateY(0)}.action-bar{padding:6px;gap:4px;flex-wrap:nowrap;overflow-x:auto}.action-btn{min-width:70px;padding:8px 10px;font-size:.8rem}.key-badge{font-size:.65rem;padding:2px 6px}.modal-content{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:fadeIn .2s ease-out;width:95vw!important;max-width:95vw!important;height:90vh!important;max-height:90vh!important;margin:5vh auto}.header{padding:12px 16px}.header h1{font-size:1.15rem}.search-bar input{font-size:.9rem}}@media(max-width:480px){.product-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.action-bar{padding:4px}.action-btn{min-width:60px;padding:6px 8px;font-size:.75rem}.action-btn .label{display:none}.key-badge{margin-right:0}}@media(max-height:500px)and (orientation:landscape){.right-panel{height:85vh;transform:translateY(calc(100% - 40px))}.modal-content{height:95vh!important;margin:2.5vh auto}}.batches-list{padding:16px;display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.batches-list h4{margin:0 0 8px;font-size:.8rem;text-transform:uppercase;color:var(--color-text-muted)}.batch-row{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s}.batch-row:hover{background:var(--bg-elevated);border-color:var(--color-primary-light)}.batch-row.selected{background:var(--color-success-subtle);border-color:var(--color-primary);box-shadow:0 0 0 1px var(--color-primary)}.batch-info{display:flex;flex-direction:column;gap:4px}.batch-code{display:flex;align-items:center;gap:6px;font-weight:500;color:var(--color-text-main)}.batch-expiry{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--color-text-muted)}.batch-stock{font-size:.9rem;font-weight:500;color:var(--color-text-muted)}.qty-selection{padding:0 16px 16px;display:flex;align-items:center;justify-content:space-between}.qty-controls{display:flex;align-items:center;gap:12px;background:var(--bg-elevated);border-radius:var(--radius-md);padding:4px}.qty-controls button{width:32px;height:32px;background:#fff;border:1px solid var(--color-border);border-radius:4px;font-weight:700}.qty-controls span{font-weight:700;min-width:24px;text-align:center}.modal-footer{padding:16px;background:var(--bg-elevated);border-top:1px solid var(--color-border);display:flex;justify-content:flex-end;gap:12px}.btn-secondary{padding:10px 16px;border:1px solid var(--color-border);background:#fff;border-radius:var(--radius-md)}.btn-primary{padding:10px 20px;background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-weight:500}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.app-loading-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;gap:16px;color:var(--text-secondary)}.loading-spinner{width:40px;height:40px;border:3px solid var(--border-default);border-top-color:var(--brand-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app-error-boundary{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;gap:16px;padding:24px;text-align:center}.app-error-boundary h2{color:var(--color-danger);font-size:1.25rem}.app-error-boundary p{color:var(--text-secondary);max-width:400px}.app-error-boundary button{padding:10px 20px;border-radius:var(--radius-md);cursor:pointer;font-weight:500}.app-error-boundary button:first-of-type{background:var(--brand-primary);color:#fff;border:none}.app-error-boundary button:last-of-type{background:transparent;border:1px solid var(--border-default);color:var(--text-primary)}