:root{--ink:#17202d;--muted:#657184;--line:#e6e9ee;--soft:#f5f7fa;--card:#fff;--accent:#dc2626;--accent2:#9f1239;--green:#0f9f6e;--amber:#d97706;--blue:#2563eb;--shadow:0 8px 28px rgba(16,24,40,.07)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f5f7;color:var(--ink)}button,input,select{font:inherit}.app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.sidebar{background:#101722;color:#e8edf5;padding:22px 16px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;padding:0 8px 25px}.brand-mark{height:38px;width:38px;border-radius:11px;background:linear-gradient(145deg,#ef4444,#991b1b);display:grid;place-items:center;font-weight:900;color:white}.brand strong{display:block;font-size:14px}.brand span{font-size:11px;color:#94a3b8}.nav-label{font-size:10px;letter-spacing:.14em;color:#64748b;margin:20px 12px 7px}.nav-item{width:100%;background:transparent;color:#acb7c7;border:0;border-radius:9px;text-align:left;padding:11px 12px;margin:2px 0;cursor:pointer;display:flex;gap:11px;align-items:center}.nav-item:hover{background:#1b2533;color:white}.nav-item.active{background:#283446;color:white;box-shadow:inset 3px 0 var(--accent)}.nav-item span{width:18px;text-align:center}.demo-note{margin-top:auto;background:#192331;border:1px solid #2d394a;border-radius:12px;padding:13px}.demo-note b,.demo-note span{display:block}.demo-note b{font-size:12px;color:#fff;margin-bottom:5px}.demo-note span{font-size:10px;line-height:1.45;color:#94a3b8}main{min-width:0}.topbar{height:82px;background:white;border-bottom:1px solid var(--line);padding:0 30px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:5}.topbar h1{font-size:20px;margin:0 0 3px}.topbar p{font-size:12px;color:var(--muted);margin:0}.top-actions{display:flex;align-items:center;gap:12px}.plant{font-size:12px;border:1px solid var(--line);padding:8px 12px;border-radius:8px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#111827;color:white;font-size:11px;font-weight:700}.mobile-menu{display:none;border:0;background:none;font-size:22px}.content{padding:28px 30px 48px;max-width:1500px;margin:auto}.hero{background:linear-gradient(125deg,#171f2c,#26364b);border-radius:18px;color:white;padding:26px 28px;display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:250px;height:250px;border:55px solid rgba(239,68,68,.17);border-radius:50%;right:-70px;top:-95px}.hero h2{font-size:24px;margin:0 0 7px}.hero p{color:#bec8d6;font-size:13px;margin:0;max-width:650px}.hero .btn{position:relative;z-index:1}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.stat,.card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.stat{padding:17px}.stat .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.stat strong{font-size:25px;display:block;margin:6px 0 3px}.stat small{font-size:11px;color:var(--green)}.grid-2{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}.card{padding:20px}.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.card-head h3{font-size:15px;margin:0}.card-head p{font-size:11px;color:var(--muted);margin:3px 0 0}.btn{border:0;border-radius:9px;padding:10px 14px;cursor:pointer;font-weight:650;font-size:12px}.btn-primary{background:var(--accent);color:white}.btn-secondary{background:white;border:1px solid var(--line);color:var(--ink)}.btn-ghost{background:var(--soft);color:var(--ink)}.btn:hover{filter:brightness(.97)}table{width:100%;border-collapse:collapse}th{text-align:left;color:#758195;font-size:10px;text-transform:uppercase;letter-spacing:.045em;border-bottom:1px solid var(--line);padding:10px 9px}td{font-size:12px;padding:12px 9px;border-bottom:1px solid #eef0f3}tr:last-child td{border-bottom:0}.badge{font-size:10px;padding:4px 8px;border-radius:999px;font-weight:700;white-space:nowrap}.green{background:#dcfce7;color:#08734d}.amber{background:#fff3cf;color:#9a5a00}.blue{background:#e5edff;color:#1d4ed8}.grey{background:#edf0f4;color:#526072}.red{background:#fee2e2;color:#b91c1c}.steps{display:flex;flex-direction:column;gap:2px}.step{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;padding:11px;border-radius:10px}.step:hover{background:var(--soft)}.step-no{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:#eef2f7;color:#405069;font-size:11px;font-weight:800}.step b{font-size:12px;display:block}.step span{font-size:10px;color:var(--muted)}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.section-title h2{font-size:21px;margin:0 0 4px}.section-title p{font-size:12px;color:var(--muted);margin:0}.filters{display:flex;gap:8px;align-items:center}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:10px;color:#596579;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.field input,.field select{height:39px;border:1px solid #d9dee6;border-radius:8px;padding:0 11px;background:white;color:var(--ink);font-size:12px}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.form-grid .wide{grid-column:span 2}.form-grid .full{grid-column:1/-1}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:20px 0 16px}.tab{background:none;border:0;padding:11px 14px;color:var(--muted);font-size:12px;cursor:pointer;border-bottom:2px solid transparent}.tab.active{color:var(--accent);border-color:var(--accent);font-weight:700}.switch-row{display:flex;gap:14px;flex-wrap:wrap}.check{background:var(--soft);padding:10px 12px;border-radius:8px;font-size:11px}.check input{vertical-align:middle}.form-actions{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.callout{padding:13px 15px;border-radius:10px;background:#fff8e6;border:1px solid #f7d687;font-size:11px;color:#7c5205;margin-bottom:16px}.callout.bluebox{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}.bom-tree{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.node{padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:white;font-size:11px}.arrow{color:#a5afbd}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}.metric{background:var(--soft);border-radius:9px;padding:12px}.metric span{display:block;color:var(--muted);font-size:10px}.metric b{font-size:16px}.progress{height:7px;background:#e9edf2;border-radius:8px;overflow:hidden}.progress i{height:100%;display:block;background:var(--accent);border-radius:8px}.color-dot{width:11px;height:11px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:-1px;border:1px solid rgba(0,0,0,.12)}.empty-pad{padding:35px;text-align:center;color:var(--muted)}.flow-lanes{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:stretch}.flow-card{padding:14px;border-radius:12px;background:white;border:1px solid var(--line);position:relative}.flow-card:not(:last-child):after{content:"→";position:absolute;right:-10px;top:42%;z-index:2;color:#a7b1c0}.flow-card .n{color:var(--accent);font-weight:900;font-size:11px}.flow-card b{display:block;font-size:12px;margin:6px 0}.flow-card span{font-size:10px;color:var(--muted);line-height:1.4;display:block}.toast{position:fixed;right:22px;bottom:22px;background:#111827;color:white;padding:12px 16px;border-radius:10px;font-size:12px;opacity:0;transform:translateY(10px);transition:.25s;pointer-events:none;z-index:20}.toast.show{opacity:1;transform:none}@media(max-width:1000px){.stats{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.form-grid{grid-template-columns:repeat(2,1fr)}.flow-lanes{grid-template-columns:1fr 1fr}.flow-card:after{display:none}}@media(max-width:720px){.app-shell{display:block}.sidebar{position:fixed;z-index:12;transform:translateX(-100%);transition:.2s;width:260px}.sidebar.open{transform:none}.mobile-menu{display:block}.topbar{padding:0 16px;justify-content:flex-start;gap:14px}.top-actions{margin-left:auto}.plant{display:none}.content{padding:20px 14px}.hero{display:block}.hero .btn{margin-top:16px}.stats{grid-template-columns:1fr 1fr;gap:10px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.section-title{align-items:flex-start;gap:10px}.filters{flex-wrap:wrap}.flow-lanes{grid-template-columns:1fr}table{min-width:680px}.table-wrap{overflow:auto}}
