:root{--ink:#162840;--muted:#718096;--line:#e4eaf1;--bg:#f4f7fb;--nav:#10243d;--blue:#2563eb;--green:#047857}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);font-size:14px}a{color:var(--blue);text-decoration:none}.shell,.sidebar{min-height:100vh;display:flex}.sidebar{width:245px;flex-shrink:0;background:var(--nav);color:white;flex-direction:column;padding:28px 16px 18px;position:-webkit-sticky;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center;color:white;font-size:21px;font-weight:800;padding:0 10px 34px}.brand-icon{background:#3979fa;border-radius:12px;padding:10px;font-size:22px}.brand-light{font-weight:400;color:#b9d2ff}.brand small{display:block;font-size:9px;letter-spacing:1.6px;color:#89a3c5;margin-top:3px}.nav-caption{font-size:10px;letter-spacing:2px;color:#7690ae;padding:12px 16px}.sidenav{display:grid;grid-gap:5px;gap:5px}.sidenav a{display:flex;gap:13px;align-items:center;padding:13px 15px;color:#b8cbe0;border-radius:11px;font-weight:600}.sidenav a.active,.sidenav a:hover{background:#254465;color:#fff}.sidenav a.active{box-shadow:inset 3px 0 #65a3ff}.navicon{font-size:21px;width:25px;text-align:center}.sidebar-bottom{margin-top:auto;border-top:1px solid #2a405b;padding:20px 8px 0;display:flex;gap:10px;align-items:center;min-width:0}.avatar{background:#3e6cb2;border-radius:12px;padding:12px;font-weight:800}.sidebar-user{min-width:0}.sidebar-user small,.sidebar-user strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-user small{color:#8ca5c2;margin-top:4px}.workspace{flex:1 1;min-width:0}.topbar{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 38px;color:#52657e;font-weight:600}.topbadge{font-size:12px;color:#047857;background:#e7f7ee;border-radius:20px;padding:8px 13px}main{max-width:1300px;margin:0 auto;padding:36px 38px 70px}.eyebrow{text-transform:uppercase;letter-spacing:1.7px;font-weight:800;color:#4075ce;font-size:11px;margin:0 0 10px}.page-title{font-size:31px;letter-spacing:-1px;margin:0 0 8px}.lead{color:var(--muted);margin:0 0 26px;line-height:1.6}.page-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:26px;flex-wrap:wrap}.page-head .lead{margin:0}.card,section.panel{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 4px 22px #17304b08;padding:24px;margin-bottom:20px}.panel h2{margin:0 0 17px;font-size:19px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:16px;gap:16px;margin-bottom:23px}.stat{background:#fff;border:1px solid var(--line);padding:22px;border-radius:16px;box-shadow:0 4px 20px #17304b08}.stat-label{color:#708198;font-weight:600}.stat-number{font-size:30px;font-weight:800;margin-top:9px;letter-spacing:-1px}.stat-note{color:#8795a6;font-size:12px;margin-top:4px}.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:20px}.search{flex:1 1;min-width:220px}.input,input,select{border:1px solid #d8e1ed;background:white;color:var(--ink);padding:12px 13px;border-radius:10px;outline:none;font:inherit;min-width:0;max-width:100%}input:focus,select:focus{border-color:#6495ee;box-shadow:0 0 0 3px #2563eb18}.field{display:grid;grid-gap:7px;gap:7px;min-width:0}.field label{font-weight:650;color:#43566f;font-size:12px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:14px;gap:14px}.button,button{border:0;border-radius:10px;background:var(--blue);color:#fff;padding:12px 18px;font:inherit;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.button:hover,button:hover{filter:brightness(.95)}button:disabled{opacity:.55;cursor:not-allowed}.button.secondary,button.secondary{background:#eaf0f9;color:#234266}.button.ghost,button.ghost{background:#fff;border:1px solid #d8e1ed;color:#4e6078}.button.danger,button.danger{background:#fff0ef;color:#c23b38}.notice{padding:12px 15px;border-radius:10px;margin:14px 0;background:#edf4ff;color:#2457a1}.notice.error{background:#fff0ef;color:#aa302e}.notice.success{background:#e8f8ef;color:#087548}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:13px;background:white}table{width:100%;border-collapse:collapse}th{text-align:left;background:#f8fafd;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#74849a}td,th{padding:15px 18px;border-bottom:1px solid #edf1f6}tr:last-child td{border-bottom:0}.product{gap:12px}.product,.thumb{display:flex;align-items:center}.thumb{width:48px;height:48px;border-radius:11px;background:#eaf1fb;justify-content:center;overflow:hidden;color:#7492b9;font-size:22px;flex-shrink:0}.thumb img{width:100%;height:100%;object-fit:cover}.sku{color:#72839a;font-size:12px;margin-top:3px}.pill{display:inline-block;padding:7px 11px;border-radius:8px;background:#e9f7f0;color:#06744b;font-weight:700;white-space:nowrap}.pill.zero{background:#fff0ed;color:#b45335}.muted{color:#75859a}.empty{text-align:center;padding:46px 18px;color:#718096}.empty strong{display:block;color:#293b52;margin-bottom:6px;font-size:16px}.row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.row .grow{flex:1 1;min-width:180px}.transaction-line{display:grid;grid-template-columns:minmax(0,2fr) minmax(120px,1fr) auto;grid-gap:12px;gap:12px;align-items:end;margin-bottom:12px}.line-unit{color:#64748b;margin-left:6px}.summary{background:#f6f9fe;border:1px solid #e2ebf6;padding:18px;border-radius:12px;margin:20px 0}.summary strong{display:block;margin-bottom:7px}.summary ul{margin:8px 0;padding-left:20px}.summary li{padding:3px 0}.history-card{background:white;border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:13px}.history-top{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;align-items:center}.history-items{margin-top:15px;border-top:1px solid var(--line);padding-top:10px}.history-item{display:flex;justify-content:space-between;gap:15px;padding:8px 0}.history-meta{color:#7b8aa0;font-size:12px;overflow-wrap:anywhere;margin-top:8px}.login-box{max-width:470px;margin:55px auto}.login-box .field{margin-bottom:16px}.quick-links{display:flex;gap:10px;flex-wrap:wrap}.helper{color:#74839a;font-size:12px;margin:10px 0 0}@media(max-width:850px){.shell{display:block}.sidebar{width:100%;height:auto;min-height:0;position:static;padding:12px 15px}.brand{padding:0 0 12px;font-size:19px}.brand small,.nav-caption,.sidebar-bottom{display:none}.sidenav{display:flex;overflow:auto;gap:6px}.sidenav a{padding:10px 12px;white-space:nowrap;font-size:12px}.navicon{font-size:16px;width:auto}.topbar{height:48px;padding:0 20px}main{padding:25px 18px 50px}.page-title{font-size:26px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat:last-child{grid-column:1/-1}.transaction-line{grid-template-columns:1fr 1fr}.transaction-line .article-select{grid-column:1/-1}.form-grid{grid-template-columns:1fr}}@media(max-width:520px){.stats{grid-template-columns:1fr}.stat:last-child{grid-column:auto}.page-head{align-items:stretch}.page-head .quick-links{width:100%}.page-head .button{flex:1 1}.card,section.panel{padding:17px}.hide-mobile{display:none}.transaction-line{grid-template-columns:1fr auto}.transaction-line .article-select{grid-column:1/-1}.table-wrap td,.table-wrap th{padding:12px 10px}.topbadge{display:none}}.mobile-nav-head{display:contents}.mobile-menu-toggle{display:none}img{max-width:100%}.product strong{overflow-wrap:anywhere}@media(max-width:850px){.sidebar{padding:12px 16px;position:relative;z-index:10}.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.mobile-nav-head .brand{margin:0;padding:0;min-width:0;font-size:19px}.mobile-nav-head .brand-icon{padding:8px;font-size:19px}.mobile-menu-toggle{display:inline-flex;flex-shrink:0;min-height:44px;padding:9px 13px;background:#254465;border:1px solid #4e6482;color:#fff}.sidenav{display:none;overflow:visible;flex-direction:column;gap:5px;margin-top:12px}.sidenav.mobile-open{display:flex}.sidenav a{min-height:46px;padding:12px 14px;font-size:15px;white-space:normal}.navicon{width:24px;font-size:19px}.topbar{min-height:58px;height:auto;gap:10px;padding:10px 18px}.topbar img{max-height:48px;width:auto;object-fit:contain}main{padding:23px 16px 52px}.toolbar{align-items:stretch}.toolbar .search,.toolbar input,.toolbar select{min-width:0;flex:1 1 100%;width:100%}.quick-links .button,.quick-links button,.toolbar button,input,select{min-height:44px}input,select{font-size:16px}.table-wrap{-webkit-overflow-scrolling:touch}.transaction-line button{min-height:44px;min-width:44px}}@media(max-width:520px){.page-title{font-size:25px;line-height:1.2}.topbar{padding:8px 14px;flex-wrap:wrap}.topbar img{max-height:42px}.stats{gap:10px}.stat{padding:16px}.stat-number{font-size:27px}.card,section.panel{padding:16px;border-radius:13px}.quick-links{width:100%}.quick-links .button,.quick-links button{flex:1 1 auto}.table-wrap table{min-width:0;width:100%}.table-wrap td,.table-wrap th{padding:12px 10px}.table-wrap .hide-mobile{display:none}.thumb{width:42px;height:42px}.product{gap:8px}.transaction-line{gap:9px}.history-item{flex-wrap:wrap}.login-box{margin:18px auto}}@media (max-width:600px){.table-wrap,.workspace,main,section.panel{min-width:0;max-width:100%}.table-wrap{overflow-x:hidden}.table-wrap table{display:block;width:100%;min-width:0}.table-wrap thead{display:none}.table-wrap tbody{display:grid;grid-gap:10px;gap:10px;padding:10px}.table-wrap tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-gap:8px 10px;gap:8px 10px;border:1px solid var(--line);border-radius:12px;padding:12px;min-width:0}.table-wrap tbody td{display:block;padding:0;border:0;min-width:0}.table-wrap tbody td:first-child{grid-column:1;grid-row:1}.table-wrap tbody td:nth-child(2){display:none}.table-wrap tbody td:nth-child(3){grid-column:2;grid-row:1;align-self:center}.table-wrap tbody td:nth-child(4){grid-column:1/-1;grid-row:2}.table-wrap tbody td:nth-child(4) button{min-height:44px;margin-top:4px;white-space:normal}.table-wrap .product{min-width:0;align-items:center}.table-wrap .product>div:last-child{min-width:0;overflow-wrap:anywhere}.table-wrap .pill{font-size:12px;padding:7px 8px}.transaction-line{grid-template-columns:minmax(0,1fr) auto}.transaction-line .article-select{grid-column:1/-1}.transaction-line .field{min-width:0}.transaction-line input,.transaction-line select{width:100%}.quick-links .button,.quick-links button{max-width:100%}}