:root{--bg: #f3f4f5;--panel: #ffffff;--panel2: #f4f6f8;--border: #e1e5e9;--text: #1f2933;--muted: #5b6770;--navy: #0f2b46;--accent: #0f2b46;--accent2: #c9a227;--good: #00713f;--bad: #b3261e;--warn: #9a6b00;--shadow: 0 1px 2px rgba(15, 43, 70, .06), 0 1px 6px rgba(15, 43, 70, .05)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,sans-serif;font-size:14px;-webkit-text-size-adjust:100%}.app{display:flex;flex-direction:column;min-height:100%}header.topbar{display:flex;align-items:center;gap:14px;padding:12px 22px;background:var(--navy);color:#fff;position:sticky;top:0;z-index:30}.topbar h1{font-size:17px;margin:0;font-weight:600;letter-spacing:.4px}.topbar .tagline{font-size:11px;color:#b7c4d2;letter-spacing:1.2px;text-transform:uppercase}.topbar .logo{width:30px;height:30px}.badge{font-size:10.5px;padding:3px 10px;border-radius:999px;letter-spacing:.4px;border:1px solid #3b536d;color:#b7c4d2;white-space:nowrap}.badge.cloud{color:#7fd6a9;border-color:#2e6e4e}.topbar select,.topbar button.btn{background:#1c3d5e;color:#fff;border:1px solid #345578}.topbar button.btn:hover{border-color:#fff}nav.tabs{display:flex;gap:2px;overflow-x:auto;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:54px;z-index:29;scrollbar-width:none}nav.tabs::-webkit-scrollbar{display:none}nav.tabs button{background:none;border:none;color:var(--muted);padding:12px 16px;font-size:13px;cursor:pointer;white-space:nowrap;border-bottom:2.5px solid transparent;font-weight:500}nav.tabs button:hover{color:var(--navy)}nav.tabs button.active{color:var(--navy);border-bottom-color:var(--good);font-weight:600}main{flex:1;padding:20px;max-width:1240px;width:100%;margin:0 auto}.grid{display:grid;gap:16px}.grid.cols2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.grid.cols3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.grid.kpis{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.card{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:18px;box-shadow:var(--shadow)}.card h3{margin:0 0 12px;font-size:12px;color:var(--navy);font-weight:700;text-transform:uppercase;letter-spacing:1px;padding-bottom:8px;border-bottom:2px solid var(--navy)}.card h4{margin:14px 0 6px;font-size:13px;color:var(--text);font-weight:600}.kpi{text-align:left}.kpi .label{color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:1px;font-weight:600}.kpi .value{font-size:24px;font-weight:650;margin-top:6px;color:var(--navy);font-variant-numeric:tabular-nums}.kpi .sub{font-size:11.5px;color:var(--muted);margin-top:3px}.kpi .value.good{color:var(--good)}.kpi .value.bad{color:var(--bad)}.kpi .value.warn{color:var(--warn)}.page-head{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:4px}.page-head .titles{flex:1;min-width:220px}.page-head h2{margin:0;font-size:22px;font-weight:650;color:var(--navy);letter-spacing:.2px}.page-head .desc{color:var(--muted);font-size:13px;margin-top:3px}.backlink{background:none;border:none;color:var(--muted);cursor:pointer;font-size:12.5px;padding:0 0 6px;display:inline-flex;align-items:center;gap:4px}.backlink:hover{color:var(--navy);text-decoration:underline}.subtabs{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid var(--border);margin-bottom:16px;scrollbar-width:none}.subtabs::-webkit-scrollbar{display:none}.subtabs button{background:none;border:none;color:var(--muted);cursor:pointer;white-space:nowrap;padding:10px 14px;font-size:13px;font-weight:500;border-bottom:2.5px solid transparent}.subtabs button.active{color:var(--navy);border-bottom-color:var(--good);font-weight:600}.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:6px 2px 0;flex-wrap:wrap}.section-title h2{margin:0;font-size:16px;font-weight:650;color:var(--navy)}.section-title .hint{font-size:12px;color:var(--muted)}table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}th,td{padding:9px 10px;text-align:right;border-bottom:1px solid var(--border)}th:first-child,td:first-child{text-align:left}th{color:var(--muted);font-weight:650;font-size:10.5px;text-transform:uppercase;letter-spacing:.8px;border-bottom:2px solid var(--navy)}tr.total td{font-weight:700;border-top:2px solid var(--navy);border-bottom:none}tr.clickable{cursor:pointer}tr.clickable:hover td{background:var(--panel2)}.scroll-x{overflow-x:auto}input,select,button.btn,label.btn{background:#fff;color:var(--text);border:1px solid #c8d0d8;border-radius:5px;padding:7px 10px;font-size:13px;font-family:inherit}input:focus,select:focus{outline:2px solid #2c5d8f33;border-color:var(--navy)}input[type=number]{width:110px;text-align:right}input[type=range]{width:100%;padding:0;accent-color:var(--navy)}button.btn,label.btn{cursor:pointer;font-weight:500;display:inline-block}button.btn:hover,label.btn:hover{border-color:var(--navy)}button.btn.primary,label.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy);font-weight:600}button.btn.primary:hover,label.btn.primary:hover{background:#163a5e}button.btn.danger{border-color:#e4b6b2;color:var(--bad);background:#fff}button.btn.danger:hover{border-color:var(--bad)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:4px}.field label{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;font-weight:600}.muted{color:var(--muted)}.good{color:var(--good)}.bad{color:var(--bad)}.small{font-size:12px}.mt{margin-top:12px}.note{background:#faf6e9;border-left:3px solid var(--accent2);padding:9px 13px;border-radius:4px;font-size:12.5px;color:#5a4d24}.chip{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;background:#fff;border:1px solid #c8d0d8;color:var(--muted);margin-right:4px;cursor:pointer;font-weight:500}.chip.active{color:#fff;border-color:var(--navy);background:var(--navy)}.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}.pill.good{background:#e3f1ea;color:var(--good)}.pill.warn{background:#f8efd4;color:var(--warn)}.pill.bad{background:#f9e5e3;color:var(--bad)}.pill.neutral{background:var(--panel2);color:var(--muted)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f1c2a73;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:6vh 14px 14px;overflow-y:auto}.modal{background:#fff;border-radius:10px;box-shadow:0 18px 50px #0a162359;width:100%;max-width:640px;padding:22px}.modal h2{margin:0 0 4px;font-size:18px;color:var(--navy);font-weight:650}.modal .sub{color:var(--muted);font-size:12.5px;margin-bottom:16px}.modal .grid.form{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.modal footer{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.login-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;background:linear-gradient(160deg,#0f2b46,#15324f 38%,#f3f4f5 38%,#f3f4f5)}.login-card{background:#fff;border-radius:12px;box-shadow:0 18px 50px #0a162347;width:100%;max-width:400px;padding:28px}.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:22px}.login-brand img{width:40px;height:40px}.login-brand h1{margin:0;font-size:19px;color:var(--navy);font-weight:700}.login-brand .tagline{font-size:9px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase}.login-card h2{margin:0 0 4px;font-size:17px;color:var(--navy);font-weight:650}.login-card .sub{color:var(--muted);font-size:12.5px;margin:0 0 18px}.login-card .field input{width:100%}.login-error{margin-top:14px;background:#f9e5e3;border:1px solid #e4b6b2;color:var(--bad);padding:8px 12px;border-radius:6px;font-size:12.5px}.login-info{margin-top:14px;background:#e3f1ea;border:1px solid #b6d8c4;color:var(--good);padding:8px 12px;border-radius:6px;font-size:12.5px}.login-foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:18px;font-size:12.5px;color:var(--muted)}.linkbtn{background:none;border:none;color:var(--navy);cursor:pointer;font-size:12.5px;font-weight:600;padding:0;text-decoration:underline}.linkbtn:disabled{opacity:.5;cursor:default}.login-note{color:var(--muted);font-size:11.5px;max-width:400px;text-align:center}.flow{display:flex;flex-direction:column;align-items:stretch;max-width:780px;margin:0 auto}.flow-inputs{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.flow-chip{display:flex;flex-direction:column;gap:1px;background:var(--panel2);border:1px solid var(--border);border-radius:6px;padding:6px 10px;min-width:110px}.flow-chip .name{font-size:11px;font-weight:600;color:var(--navy)}.flow-chip .qty{font-size:10px;color:var(--muted)}.flow-chip .cost{font-size:11px;color:#7a6212;font-weight:600}.flow-arrow{text-align:center;color:var(--muted);font-size:12px;padding:4px 0}.flow-step{border:1px solid var(--navy);border-left:4px solid var(--navy);border-radius:8px;background:#fff;padding:12px 16px;box-shadow:var(--shadow)}.flow-step-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.flow-step-head b{color:var(--navy)}.flow-step-stats{display:flex;gap:22px;margin-top:8px;flex-wrap:wrap}.flow-step-stats span{display:flex;flex-direction:column;font-weight:650;font-size:13.5px;color:var(--text)}.flow-step-stats label{font-size:9.5px;color:var(--muted);text-transform:uppercase;font-weight:600;letter-spacing:.6px}.flow-intermediate{align-self:center;text-align:center;border:1px dashed #b7c1cb;background:#fff;border-radius:999px;padding:7px 20px;display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted)}.flow-intermediate b{color:var(--navy)}.flow-intermediate.final{border:1.5px solid var(--good);color:var(--good);background:#f2faf6}.flow-intermediate.final b{color:var(--good)}.flow-tail{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.flow-tail-item{display:flex;flex-direction:column;gap:2px;font-size:13px;font-weight:650;background:#fff;border:1px solid var(--border);border-radius:6px;padding:7px 12px;color:var(--navy)}.flow-tail-item label{font-size:9.5px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.flow-tail-item.strong{border-color:var(--navy);border-left:3px solid var(--navy)}.flow-tail-item.good{border-color:var(--good);border-left:3px solid var(--good);color:var(--good)}@media(max-width:640px){main{padding:12px}.kpi .value{font-size:19px}th,td{padding:7px 6px;font-size:12px}.page-head h2{font-size:18px}header.topbar{padding:10px 14px}nav.tabs{top:50px}}