:root{--ink-900: #0f151c;--ink-800: #1b232d;--ink-700: #28323f;--ink-600: #3c4858;--ink-500: #5a6675;--ink-400: #828e9c;--ink-300: #aab3bf;--ink-200: #d7dce2;--line: #e6e9ee;--line-strong: #d3d9e0;--bg: #f4f6f8;--bg-sunken: #eef1f4;--surface: #ffffff;--surface-2: #fbfcfd;--surface-hover: #f5f7f9;--brand-800: #07433b;--brand-700: #0a564d;--brand-600: #0d6e63;--brand-500: #14857a;--brand-300: #6fb3aa;--brand-100: #d7ebe7;--brand-50: #eaf4f2;--ok-600: #067a57;--ok-50: #e7f4ee;--warn-700: #92400e;--warn-600: #b45309;--warn-50: #fbf1e1;--danger-600: #b42318;--danger-700: #912018;--danger-50: #fbeae8;--info-600: #0b6bb4;--info-50: #e6f1f9;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "Roboto Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--r-xs: 4px;--r-sm: 6px;--r-md: 8px;--r-lg: 12px;--r-pill: 999px;--shadow-1: 0 1px 2px rgba(15, 21, 28, .06), 0 1px 1px rgba(15, 21, 28, .04);--shadow-2: 0 4px 12px rgba(15, 21, 28, .08), 0 1px 3px rgba(15, 21, 28, .06);--shadow-3: 0 16px 40px rgba(15, 21, 28, .16), 0 4px 12px rgba(15, 21, 28, .08);--sidebar-w: 244px;--topbar-h: 58px;--maxw: 1280px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-sans);font-size:14px;line-height:1.5;color:var(--ink-700);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--brand-600);text-decoration:none}a:hover{color:var(--brand-700)}h1,h2,h3,h4{margin:0;color:var(--ink-900);font-weight:600;letter-spacing:-.01em}h1{font-size:22px}h2{font-size:17px}h3{font-size:15px}p{margin:0}button{font-family:inherit}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right}.muted{color:var(--ink-500)}.faint{color:var(--ink-400)}.nowrap{white-space:nowrap}.right{text-align:right}.center{text-align:center}.spread{display:flex;align-items:center;justify-content:space-between;gap:12px}.row{display:flex;align-items:center;gap:10px}.col{display:flex;flex-direction:column}.gap-4{gap:4px}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.gap-24{gap:24px}.grow{flex:1}.wrap{flex-wrap:wrap}@media (max-width: 720px){.hide-sm{display:none!important}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 14px;border-radius:var(--r-sm);font-size:13.5px;font-weight:600;letter-spacing:.01em;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,color .12s ease}.btn:disabled{opacity:.55;cursor:not-allowed}.btn svg{width:16px;height:16px}.btn-primary{background:var(--brand-600);color:#fff}.btn-primary:hover:not(:disabled){background:var(--brand-700)}.btn-primary:active:not(:disabled){background:var(--brand-800)}.btn-secondary{background:var(--surface);color:var(--ink-700);border-color:var(--line-strong);box-shadow:var(--shadow-1)}.btn-secondary:hover:not(:disabled){background:var(--surface-hover);border-color:var(--ink-200)}.btn-ghost{background:transparent;color:var(--ink-600)}.btn-ghost:hover:not(:disabled){background:var(--bg-sunken)}.btn-danger{background:var(--danger-600);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-700)}.btn-sm{height:30px;padding:0 10px;font-size:12.5px}.btn-lg{height:42px;padding:0 20px;font-size:14.5px}.btn-block{width:100%}.btn-icon{width:34px;height:34px;padding:0}.field{display:flex;flex-direction:column;gap:6px}.field>label{font-size:12.5px;font-weight:600;color:var(--ink-600)}.field .hint{font-size:12px;color:var(--ink-400)}.input,.select,textarea.input{height:38px;padding:0 12px;width:100%;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--ink-800);font-size:14px;font-family:inherit;transition:border-color .12s ease,box-shadow .12s ease}textarea.input{height:auto;padding:9px 12px;resize:vertical;line-height:1.5}.input:focus,.select:focus,textarea.input:focus{outline:none;border-color:var(--brand-500);box-shadow:0 0 0 3px var(--brand-50)}.input::placeholder{color:var(--ink-300)}.input-qty{font-family:var(--font-mono);text-align:right;font-weight:500}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235a6675' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:34px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-1)}.panel-head{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-body{padding:18px}.panel-body.flush{padding:0}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;box-shadow:var(--shadow-1)}.stat .label{font-size:12px;font-weight:600;color:var(--ink-500);text-transform:uppercase;letter-spacing:.04em}.stat .value{font-size:26px;font-weight:700;color:var(--ink-900);margin-top:6px;font-variant-numeric:tabular-nums}.stat .value small{font-size:14px;font-weight:600;color:var(--ink-400)}.stat .sub{font-size:12.5px;color:var(--ink-500);margin-top:2px}.table-wrap{width:100%;overflow:auto}table.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px}.tbl thead th{position:sticky;top:0;z-index:1;background:var(--surface-2);color:var(--ink-500);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:10px 14px;border-bottom:1px solid var(--line-strong);white-space:nowrap}.tbl thead th.num{text-align:right}.tbl tbody td{padding:10px 14px;border-bottom:1px solid var(--line);color:var(--ink-700);vertical-align:middle}.tbl tbody tr:hover td{background:var(--surface-hover)}.tbl tbody tr:last-child td{border-bottom:none}.tbl td.num{font-family:var(--font-mono);text-align:right;font-variant-numeric:tabular-nums}.tbl .strong{font-weight:600;color:var(--ink-900)}.tbl tr.row-newbatch td{background:var(--brand-50)}.tbl tr.row-newbatch:hover td{background:var(--brand-100)}.tbl tr.row-locked td{color:var(--ink-400)}.badge{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:600;white-space:nowrap;border:1px solid transparent}.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}.badge-neutral{background:var(--bg-sunken);color:var(--ink-600)}.badge-ok{background:var(--ok-50);color:var(--ok-600)}.badge-warn{background:var(--warn-50);color:var(--warn-700)}.badge-danger{background:var(--danger-50);color:var(--danger-600)}.badge-info{background:var(--info-50);color:var(--info-600)}.badge-brand{background:var(--brand-50);color:var(--brand-700)}.progress{height:7px;border-radius:var(--r-pill);background:var(--bg-sunken);overflow:hidden}.progress>span{display:block;height:100%;background:var(--brand-500);border-radius:var(--r-pill);transition:width .4s ease}.progress.full>span{background:var(--ok-600)}.shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100%}.sidebar{background:var(--ink-900);color:#c8d0da;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.sidebar .brand{display:flex;align-items:center;gap:11px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.07)}.sidebar .brand .mark{width:32px;height:32px;border-radius:8px;background:var(--brand-600);display:grid;place-items:center;color:#fff;font-weight:700;flex:none}.sidebar .brand .name{font-size:14.5px;font-weight:700;color:#fff;letter-spacing:-.01em;line-height:1.1}.sidebar .brand .org{font-size:11px;color:#8b97a5}.nav{padding:12px 10px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}.nav .group-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6c7785;padding:14px 10px 6px}.nav a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r-sm);color:#c0c9d3;font-size:13.5px;font-weight:500;transition:background .12s,color .12s}.nav a svg{width:17px;height:17px;opacity:.85}.nav a:hover{background:#ffffff0f;color:#fff}.nav a.active{background:var(--brand-600);color:#fff}.nav a.active svg{opacity:1}.sidebar .foot{margin-top:auto;padding:12px;border-top:1px solid rgba(255,255,255,.07)}.main{display:flex;flex-direction:column;min-width:0}.topbar{height:var(--topbar-h);position:sticky;top:0;z-index:20;background:#ffffffd9;-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 22px}.topbar .crumb{font-size:13px;color:var(--ink-500)}.topbar .crumb b{color:var(--ink-900);font-weight:600}.content{padding:22px;max-width:var(--maxw);width:100%;margin:0 auto}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}.page-head .sub{color:var(--ink-500);font-size:13.5px;margin-top:3px}.usermenu{position:relative}.avatar{width:32px;height:32px;border-radius:50%;background:var(--brand-600);color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px;cursor:pointer}.menu-pop{position:absolute;right:0;top:42px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-2);min-width:200px;padding:6px;z-index:50}.menu-pop .item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--r-sm);font-size:13.5px;color:var(--ink-700);cursor:pointer}.menu-pop .item:hover{background:var(--surface-hover)}.menu-pop .sep{height:1px;background:var(--line);margin:5px 0}.sync{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 11px;border-radius:var(--r-pill);font-size:12.5px;font-weight:600;border:1px solid var(--line-strong);background:var(--surface)}.sync .dot{width:8px;height:8px;border-radius:50%}.sync.synced{color:var(--ok-600)}.sync.synced .dot{background:var(--ok-600)}.sync.syncing{color:var(--info-600)}.sync.syncing .dot{background:var(--info-600);animation:pulse 1s infinite}.sync.local{color:var(--warn-700)}.sync.local .dot{background:var(--warn-600)}.sync.offline{color:var(--ink-500)}.sync.offline .dot{background:var(--ink-400)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f151c6b;display:grid;place-items:center;z-index:100;padding:20px}.modal{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-3);width:100%;max-width:520px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.modal.lg{max-width:860px}.modal-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.modal-body{padding:20px;overflow:auto}.modal-foot{padding:14px 20px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px;background:var(--surface-2)}.toasts{position:fixed;right:18px;bottom:18px;z-index:200;display:flex;flex-direction:column;gap:10px;max-width:360px}.toast{background:var(--ink-900);color:#fff;border-radius:var(--r-md);padding:12px 14px;box-shadow:var(--shadow-3);display:flex;gap:10px;align-items:flex-start;font-size:13.5px;animation:slidein .2s ease}.toast.ok{border-left:3px solid var(--ok-600)}.toast.err{border-left:3px solid var(--danger-600)}.toast.info{border-left:3px solid var(--info-600)}@keyframes slidein{0%{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}.empty{text-align:center;padding:54px 20px;color:var(--ink-500)}.empty svg{width:34px;height:34px;color:var(--ink-300);margin-bottom:12px}.empty h3{color:var(--ink-700);margin-bottom:4px}.spinner{width:18px;height:18px;border:2px solid var(--brand-100);border-top-color:var(--brand-600);border-radius:50%;animation:spin .7s linear infinite}.spinner.lg{width:30px;height:30px;border-width:3px}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen{display:grid;place-items:center;height:60vh}.segmented{display:inline-flex;background:var(--bg-sunken);border-radius:var(--r-sm);padding:3px;gap:2px}.segmented button{border:none;background:transparent;height:30px;padding:0 12px;border-radius:var(--r-xs);font-size:12.5px;font-weight:600;color:var(--ink-500);cursor:pointer}.segmented button.active{background:var(--surface);color:var(--ink-900);box-shadow:var(--shadow-1)}.auth{min-height:100vh;display:grid;grid-template-columns:1.05fr 1fr}.auth .brandpane{background:radial-gradient(1200px 500px at -10% -10%,rgba(255,255,255,.08),transparent 60%),linear-gradient(160deg,var(--brand-800),var(--brand-700) 55%,#06352f);color:#eaf4f2;padding:56px 60px;display:flex;flex-direction:column;position:relative;overflow:hidden}.auth .brandpane:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.14;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(620px 520px at 75% 30%,#000,transparent 75%);mask-image:radial-gradient(620px 520px at 75% 30%,#000,transparent 75%)}.auth .brandpane .wm{display:flex;align-items:center;gap:12px}.auth .brandpane .wm .mark{width:40px;height:40px;border-radius:10px;background:#ffffff24;display:grid;place-items:center;font-weight:700;font-size:17px}.auth .brandpane .wm .org{font-weight:700;font-size:15px;letter-spacing:.01em}.auth .brandpane h1{color:#fff;font-size:34px;line-height:1.12;letter-spacing:-.02em;margin-top:auto;max-width:16ch}.auth .brandpane .lead{color:#b8d8d2;font-size:15px;margin-top:16px;max-width:42ch}.auth .brandpane .ticks{margin-top:30px;display:flex;flex-direction:column;gap:11px}.auth .brandpane .ticks div{display:flex;align-items:center;gap:10px;color:#d3e7e3;font-size:13.5px}.auth .brandpane .ticks svg{width:18px;height:18px;color:var(--brand-300)}.auth .brandpane .legal{margin-top:34px;color:#7fa8a1;font-size:12px}.auth .formpane{display:grid;place-items:center;padding:40px;background:var(--surface)}.auth .formcard{width:100%;max-width:380px}.auth .formcard h2{font-size:21px}.auth .formcard .intro{color:var(--ink-500);margin:6px 0 26px}.auth .demo{margin-top:22px;border:1px dashed var(--line-strong);border-radius:var(--r-md);padding:13px 14px;background:var(--surface-2);font-size:12.5px;color:var(--ink-500)}.auth .demo b{color:var(--ink-700)}.auth .demo .creds{display:grid;gap:4px;margin-top:7px}.auth .demo code{font-family:var(--font-mono);color:var(--brand-700);cursor:pointer}.formerr{background:var(--danger-50);color:var(--danger-700);border:1px solid #f3c7c1;border-radius:var(--r-sm);padding:9px 12px;font-size:13px;margin-bottom:14px}@media (max-width: 880px){.auth{grid-template-columns:1fr}.auth .brandpane{display:none}}.thumbs{display:flex;gap:6px;flex-wrap:wrap}.thumb{width:40px;height:40px;border-radius:var(--r-sm);object-fit:cover;border:1px solid var(--line-strong);cursor:pointer;background:var(--bg-sunken)}.thumb-add{width:40px;height:40px;border-radius:var(--r-sm);border:1px dashed var(--line-strong);display:grid;place-items:center;color:var(--ink-400);cursor:pointer;background:var(--surface)}.thumb-add:hover{border-color:var(--brand-500);color:var(--brand-600)}.spin{animation:spin .7s linear infinite}@media (max-width: 720px){.shell{grid-template-columns:1fr}.sidebar{display:none}.content{padding:14px}}.actionbar{position:sticky;bottom:0;background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:12px 16px;display:flex;gap:10px;align-items:center;justify-content:space-between;margin:0 -22px -22px}.kpi-inline{display:flex;gap:18px}.kpi-inline .k{font-size:12px;color:var(--ink-500)}.kpi-inline .k b{display:block;font-size:18px;color:var(--ink-900);font-variant-numeric:tabular-nums}
