@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500&display=swap";:root{--app-bg:#f4f5f7;--surface:#fff;--border:#e2e8f0;--text-main:#0f172a;--text-muted:#64748b;--blue:#2563eb;--blue-soft:#eff6ff;--orange:#f59e0b;--red:#ef4444;--green:#10b981}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--app-bg);color:var(--text-main);font-family:Plus Jakarta Sans,sans-serif;overflow:hidden}.layout{flex-direction:column;height:100vh;display:flex}.top-bar{background:var(--surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;height:64px;padding:0 32px;display:flex}.logo{align-items:center;gap:12px;font-size:18px;font-weight:700;display:flex}.logo-box{background:var(--blue);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.nav-links{gap:32px;display:flex}.n-link{color:var(--text-muted);cursor:pointer;font-size:14px;font-weight:600;text-decoration:none}.n-link.active{color:var(--text-main);border-bottom:2px solid var(--blue);margin-bottom:-22px;padding-bottom:20px}.content-area{flex:1;padding:32px;overflow:auto}.page-header{justify-content:space-between;align-items:flex-end;margin-bottom:32px;display:flex}.stat-grid{grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:32px;display:grid}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;box-shadow:0 1px 2px #00000005}.s-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;font-size:13px;font-weight:600}.s-val{font-size:28px;font-weight:700}.s-change{align-items:center;gap:4px;margin-top:8px;font-size:13px;font-weight:600;display:flex}.c-up{color:var(--green)}.c-down{color:var(--red)}.main-split{gap:24px;display:flex}.left-table{flex:2}.right-sidebar{flex-direction:column;flex:1;gap:24px;display:flex}table{background:var(--surface);border:1px solid var(--border);border-collapse:separate;border-spacing:0;border-radius:12px;width:100%;overflow:hidden}th{color:var(--text-muted);text-transform:uppercase;text-align:left;border-bottom:1px solid var(--border);background:#f8fafc;padding:16px 24px;font-size:12px;font-weight:600}td{border-bottom:1px solid var(--border);padding:16px 24px;font-size:14px;font-weight:500}tr:last-child td{border-bottom:none}.sku{color:var(--text-muted);font-family:IBM Plex Mono,monospace;font-size:13px}.status-pill{color:var(--text-muted);background:#f1f5f9;border-radius:20px;padding:4px 10px;font-size:12px;font-weight:700}.status-pill.low{color:var(--red);background:#fef2f2}.status-pill.ok{color:var(--green);background:#ecfdf5}.status-pill.sync{background:var(--blue-soft);color:var(--blue)}.automation-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px}.automation-card h3{margin-bottom:16px;font-size:16px}.auto-step{opacity:.4;gap:16px;margin-bottom:16px;transition:opacity .3s;display:flex}.auto-step.active{opacity:1}.auto-step.done{opacity:.8}.step-dot{background:var(--border);color:#fff;z-index:2;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:700;display:flex;position:relative}.auto-step.active .step-dot{background:var(--blue);box-shadow:0 0 0 4px var(--blue-soft)}.auto-step.done .step-dot{background:var(--green)}.step-content{border-left:2px solid var(--border);flex:1;margin-left:-13px;padding-bottom:16px;padding-left:24px}.auto-step:last-child .step-content{border-left:none}.step-title{font-size:14px;font-weight:600}.step-desc{color:var(--text-muted);margin-top:4px;font-size:13px}.btn-primary{background:var(--text-main);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-weight:600;display:flex}.btn-primary:active{transform:scale(.98)}