:root{--ink:#14231d;--muted:#66736d;--line:#dce5df;--paper:#f4f6f2;--white:#fff;--green:#0f6b4f;--green2:#155a45;--lime:#d9ee9f;--amber:#b86b00;--red:#b42318;--blue:#2463a8;--shadow:0 10px 30px rgba(20,35,29,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}.shell{min-height:100vh}.top{background:linear-gradient(125deg,#0e3e32,#12654d 65%,#1b7557);color:#fff;padding:20px 28px 78px}.topbar{max-width:1480px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:13px}.logo{width:44px;height:44px;border-radius:11px;background:var(--lime);color:#164631;display:grid;place-items:center;font-weight:900;font-size:20px}.brand h1{font-size:20px;margin:0}.brand p{margin:2px 0 0;color:#cfe3d9;font-size:12px}.updated{text-align:right;color:#d8e6df;font-size:12px}.demo-banner{max-width:1480px;margin:18px auto 0;background:#fff5d6;color:#704d00;border:1px solid #f0d277;border-radius:10px;padding:11px 14px;font-weight:650}.layout{max-width:1480px;margin:-56px auto 40px;padding:0 22px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px}.side{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow);align-self:start;position:sticky;top:16px}.navbtn{display:flex;width:100%;gap:10px;align-items:center;border:0;background:transparent;color:#415048;padding:11px 12px;border-radius:9px;text-align:left;cursor:pointer;font-weight:600}.navbtn:hover,.navbtn.active{background:#e8f2ed;color:var(--green)}.role{margin-top:12px;border-top:1px solid var(--line);padding:14px 10px 4px}.role select,select,input{width:100%;border:1px solid #cdd9d2;border-radius:8px;padding:9px;background:#fff;color:var(--ink)}.content{min-width:0}.section{display:none}.section.active{display:block}.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin:3px 0 14px;gap:15px}.section-head h2{font-size:24px;margin:0}.section-head p{color:var(--muted);margin:3px 0 0}.grid{display:grid;gap:14px}.metrics{grid-template-columns:repeat(5,minmax(130px,1fr))}.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 4px 16px rgba(20,35,29,.045);padding:17px}.metric small{color:var(--muted);display:block}.metric strong{font-size:27px;display:block;margin-top:4px}.metric.alert strong{color:var(--red)}.split{grid-template-columns:1.35fr 1fr;margin-top:14px}.card h3{margin:0 0 12px;font-size:16px}.warehouse-list{grid-template-columns:repeat(2,1fr)}.warehouse{position:relative}.badge{display:inline-flex;align-items:center;border-radius:99px;padding:3px 8px;font-size:12px;font-weight:700;background:#e8f2ed;color:var(--green)}.badge.warn{background:#fff0cf;color:#815400}.badge.red{background:#fee4e2;color:var(--red)}.badge.blue{background:#e5effb;color:var(--blue)}.warehouse h3{margin:11px 0 5px}.warehouse dl{display:grid;grid-template-columns:76px 1fr;gap:7px 10px;margin:12px 0 0}.warehouse dt{color:var(--muted)}.warehouse dd{margin:0}.filters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px}table{width:100%;border-collapse:collapse;white-space:nowrap;background:#fff}th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #edf1ee}th{font-size:12px;color:#536159;background:#f8faf8;position:sticky;top:0}tr:last-child td{border-bottom:0}.number{font-variant-numeric:tabular-nums;font-weight:650}.workflow-list{display:grid;gap:13px}.workflow .row{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.steps{display:flex;gap:4px;margin:14px 0;overflow:auto}.step{min-width:93px;padding:8px 6px;border-radius:7px;background:#edf1ee;color:#738078;text-align:center;font-size:12px}.step.done{background:#ddefe5;color:#0c684b}.step.current{outline:2px solid #0f6b4f;font-weight:800}.btn{border:0;border-radius:8px;padding:9px 13px;background:var(--green);color:#fff;font-weight:700;cursor:pointer}.btn:hover{background:var(--green2)}.btn.secondary{background:#e8f2ed;color:var(--green)}.btn:disabled{opacity:.45;cursor:not-allowed}.shipment{border-left:4px solid var(--green)}.timeline{border-left:2px solid #cfe0d7;margin:14px 0 0 7px;padding-left:17px}.timeline li{margin:7px 0}.promise{background:#fff8e5;border:1px solid #eed28b}.sop-grid{grid-template-columns:repeat(2,1fr)}.sop ol{padding-left:20px}.evidence{grid-template-columns:repeat(3,1fr)}.evidence .card{min-height:180px}.proof-table td:nth-child(1){font-weight:700}.status-true{color:var(--green)}.status-false{color:var(--red)}.footer{text-align:center;color:var(--muted);padding:10px 20px 30px}.mobile-nav{display:none}.toast{position:fixed;right:22px;bottom:22px;background:#173b30;color:#fff;padding:12px 16px;border-radius:10px;box-shadow:var(--shadow);z-index:5}
@media(max-width:1050px){.metrics{grid-template-columns:repeat(3,1fr)}.evidence{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.top{padding:16px 16px 70px}.topbar{align-items:flex-start}.brand h1{font-size:16px}.updated{display:none}.layout{display:block;padding:0 12px}.side{display:none}.mobile-nav{display:flex;position:sticky;top:0;z-index:4;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px;margin-bottom:12px}.mobile-nav .navbtn{width:auto;min-width:max-content}.metrics{grid-template-columns:repeat(2,1fr)}.split,.warehouse-list,.sop-grid,.evidence{grid-template-columns:1fr}.filters{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-direction:column}.card{padding:14px}.demo-banner{font-size:12px}.logo{width:38px;height:38px}.metric strong{font-size:23px}}
.qty{width:72px;padding:7px}.edit-warehouse{min-width:150px}.save-stock{margin-left:8px;padding:6px 9px}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#0e3e32,#12654d)}.login-card{width:min(420px,100%);background:#fff;border-radius:18px;padding:32px;box-shadow:var(--shadow)}.login-card .logo{margin-bottom:18px}.login-card h1{margin:0}.login-card p{color:var(--muted);margin:5px 0 24px}.login-card label{display:block;font-weight:700;margin:14px 0}.login-card label input{margin-top:6px}.login-card .btn{width:100%;margin-top:8px;padding:12px}.login-card #loginError{color:var(--red);margin-top:12px}
