.mis-dash{--bg:#f4f8fd;--card:#fff;--card-bg:#d7e3ec;--text:#12295b;--muted:#71809d;--line:#d5dbe3;--blue:#1f7ae0;--green:#24b47e;--orange:#f3a52b;--purple:#8061d7;--red:#ef4e58;color:var(--text);font-family:Poppins,Segoe UI,Arial,sans-serif;font-size:14px;background:var(--bg)}
.mis-dash *{box-sizing:border-box}
.mis-dash select,.mis-dash .btn{border:1px solid var(--line);background:#fff;border-radius:7px;padding:9px 11px;color:#24416f;cursor:pointer;font-size:inherit}
.mis-dash .btn{font-weight:600;border:1px solid #dce5f1}
.mis-dash .live{background:#e7f8ef!important;color:#0b9c62!important;border-color:#cdeedc!important;font-weight:700!important}
.mis-dash .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.mis-dash .card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;box-shadow:0 2px 10px rgba(29,62,105,.04)}.mis-dash .kpi.card{padding:11px}
.mis-dash a.card{text-decoration:none;color:inherit;display:grid;cursor:pointer;transition:box-shadow .15s ease,transform .15s ease}
.mis-dash a.card:hover{box-shadow:0 4px 14px rgba(29,62,105,.14);transform:translateY(-1px)}
.mis-dash .kpi{display:grid;grid-template-columns:36px 1fr;gap:9px;align-items:center;background: var(--card-bg);}
.mis-dash .icon{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px;background:#edf5ff;color:#3f8de3;flex-shrink:0}
.mis-dash .kpi:nth-child(2n) .icon{background:#ecfaf5;color:#38b982}
.mis-dash .kpi:nth-child(3n) .icon{background:#f4efff;color:#8663dc}
.mis-dash .kpi > div:nth-child(2) > div:first-child{font-size:12px;color:#5d6f8c;font-weight:500;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mis-dash .kpi .value{font-size:20px;font-weight:800;line-height:1.2;white-space:nowrap}
.mis-dash .kpi .cust-sep{margin:0 5px;color:#c3ccdb;font-weight:500}
.mis-dash .kpi .wrap-label{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25}
.mis-dash .delta{font-size:10px;margin-top:3px;line-height:1.3}.mis-dash .up{color:#0ca66a}.mis-dash .down{color:#e44545}.mis-dash .flat{color:#8a96ac}
.mis-dash .grid{display:grid;gap:12px;margin-top:12px}
.mis-dash .g4{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.mis-dash .g3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.mis-dash .g2{grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}
.mis-dash .card h3{font-size:15px;margin:0 0 10px;font-weight:600}
.mis-dash .chart{min-height:200px;position:relative;width:100%}
.mis-dash .chart.sm{min-height:160px}
.mis-dash table{width:100%;border-collapse:collapse;font-size:13px}
.mis-dash th,.mis-dash td{padding:8px 6px;text-align:left;border-bottom:1px solid #edf1f6;word-break:break-word}
.mis-dash th{background:#f8fafd;color:#586b88;font-weight:600}
.mis-dash td{font-size:12px}
.mis-dash .progress{height:6px;background:#edf2f7;border-radius:6px;overflow:hidden;min-width:50px;display:inline-block;margin:2px 0}
.mis-dash .progress i{display:block;height:100%;background:#39b981;border-radius:6px;animation:grow 1.6s ease both}
.mis-dash .bucket-mix{display:flex;flex-direction:column;gap:11px;padding:6px 2px 2px}
.mis-dash .bucket-row{display:flex;flex-direction:column;gap:5px}
.mis-dash .bucket-label{display:flex;align-items:center;font-size:12px;color:var(--text);font-weight:600}
.mis-dash .bucket-dot{width:9px;height:9px;border-radius:50%;margin-right:7px;flex-shrink:0}
.mis-dash .bucket-val{margin-left:auto;font-weight:700}
.mis-dash .bucket-bar{height:7px;background:#edf2f7;border-radius:5px;overflow:hidden}
.mis-dash .bucket-fill{height:100%;border-radius:5px;animation:grow 1.2s ease both}
.mis-dash .bucket-insight{margin-top:2px;font-size:12px;color:#e44545;}
@keyframes grow{from{width:0!important}}
.mis-dash .counter.pulse{animation:pulse .65s ease}
@keyframes pulse{0%{transform:scale(.94);opacity:.65}100%{transform:scale(1);opacity:1}}
.mis-dash .att-wrap{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:600px){.mis-dash .att-wrap{grid-template-columns:minmax(150px,auto) 1fr}}
.mis-dash .summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:8px}.mis-dash .mini{border-radius:8px;padding:10px;background:#f7faff;border: 1px solid #e7eef7;text-align:center}.mis-dash .mini span{font-size:12px;display:block;margin-bottom:4px}.mis-dash .mini b{font-size:18px;display:block;margin-top:5px}
.mis-dash .alert{display:flex;justify-content:space-between;padding:12px 2px;margin:0;border-bottom:1px solid #edf1f6;font-size:12px;align-items:center;gap:8px}
.mis-dash a.alert{text-decoration:none;color:inherit;cursor:pointer;border-radius:6px}
.mis-dash a.alert:hover{background:#f8fafd}
.mis-dash .alert span{flex:1;min-width:0}
.mis-dash .red{color:#e3444c}.mis-dash .orange{color:#e88d00}
.mis-dash .view-report{font-size:11px;font-weight:600;color:var(--blue);text-decoration:none;white-space:nowrap}
.mis-dash .view-report:hover{text-decoration:underline}
.mis-dash .funnel-section{display:grid;grid-template-columns:1fr .7fr;gap:20px;align-items:center}
.mis-dash .funnel{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:8px 0}
.mis-dash .funnel-stage{min-height:40px;min-width:200px;max-width:100%;color:#fff;border-radius:8px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 18px;font-weight:700;box-shadow:0 4px 10px rgba(30,70,130,.08);font-size:12px;animation:slideIn .8s ease both;white-space:nowrap}
.mis-dash .funnel-stage small{font-weight:500;opacity:.9;font-size:11px}
.mis-dash .funnel-stage .funnel-amt{font-size:13px}
@keyframes slideIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.mis-dash .funnel-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.mis-dash .fmetric{background:#f8fbff;border:1px solid #e7eef7;border-radius:8px;padding:10px;text-align:center}.mis-dash .fmetric span{font-size:12px;color:#687892;display:block;margin-bottom:4px}.mis-dash .fmetric b{display:block;font-size:16px;font-weight:700}
@media(max-width:1400px){
  .mis-dash .kpis{grid-template-columns:repeat(auto-fit,minmax(145px,1fr))}
  .mis-dash .g4{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
  .mis-dash .g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  .mis-dash .g2{grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}
}
@media(max-width:1024px){
  .mis-dash .kpis{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}
  .mis-dash .g4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .mis-dash .g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .mis-dash .g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
  .mis-dash .funnel-section{grid-template-columns:1fr}
  .mis-dash .funnel-stage{font-size:11px;padding:0 12px}
  .mis-dash .funnel-stage small{font-size:10px}
}
@media(max-width:768px){
  .mis-dash .kpis{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}
  .mis-dash .card{padding:12px}
  .mis-dash .card h3{font-size:12px}
  .mis-dash .kpi > div:nth-child(2) > div:first-child{font-size:10px}
  .mis-dash .kpi .value{font-size:16px}
  .mis-dash .delta{font-size:9px}
  .mis-dash .icon{width:36px;height:36px;font-size:16px}
  .mis-dash .g4,.mis-dash .g3,.mis-dash .g2{grid-template-columns:1fr}
  .mis-dash .funnel-stage{min-height:42px;min-width:0;font-size:10px;padding:0 10px}
  .mis-dash .funnel-stage span{white-space:normal}
  .mis-dash .funnel-stage small{font-size:9px}
  .mis-dash .funnel{gap:4px}
  .mis-dash .funnel-metrics{grid-template-columns:repeat(2,1fr)}
  .mis-dash .fmetric{padding:8px;font-size:9px}
  .mis-dash .fmetric b{font-size:14px}
  .mis-dash .chart{min-height:180px}
  .mis-dash .chart.sm{min-height:140px}
  .mis-dash table{font-size:10px}
  .mis-dash th,.mis-dash td{padding:6px 4px}
  .mis-dash .mini{padding:8px}
  .mis-dash .mini b{font-size:16px}
}