*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f6f8fc;color:#0b1b3a}.app{display:flex;min-height:100vh}.sidebar{width:270px;background:linear-gradient(180deg,#071a3a,#020b1c);color:white;padding:24px 16px;position:fixed;inset:0 auto 0 0}.brand{font-size:24px;font-weight:900;display:flex;gap:12px;align-items:center;margin-bottom:28px}.logo{font-size:31px}.nav a{display:flex;align-items:center;gap:12px;color:#d7e3ff;text-decoration:none;padding:14px 16px;border-radius:12px;margin:7px 0;font-weight:750}.nav a:hover{background:#155bff;color:#fff}.main{margin-left:270px;padding:28px;width:calc(100% - 270px)}.top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}h1{margin:0;font-size:31px}.muted{color:#5b6b86}.small{font-size:13px}.btn{border:0;border-radius:12px;padding:13px 18px;font-weight:900;cursor:pointer;background:#155bff;color:white;text-decoration:none;display:inline-block}.btn.danger{background:#dc2626}.btn.dark{background:#071a3a}.panel{background:white;border:1px solid #dbe4f3;border-radius:18px;padding:20px;margin-bottom:18px;box-shadow:0 8px 25px rgba(15,36,75,.04)}.upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.upload-card{border:2px dashed #bfd2f5;border-radius:16px;padding:18px;background:linear-gradient(135deg,#f7fbff,#fff)}.upload-card h3{margin:5px 0 8px}.upload-card input,.input{width:100%;background:#fff;border:1px solid #dbe4f3;border-radius:10px;padding:12px}.ok{color:#139c55;font-weight:900}.warn{color:#d97706;font-weight:900}.dangerText{color:#dc2626;font-weight:900}.kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.kpi{background:#fff;border:1px solid #dde7f6;border-radius:16px;padding:18px}.kpi b{font-size:22px;display:block;margin-top:8px}.grid{display:grid;grid-template-columns:2fr 1fr;gap:16px}.chart-box{height:330px}.insight li{margin:12px 0;line-height:1.45}table{width:100%;border-collapse:collapse;font-size:14px;background:white}th,td{padding:11px;border-bottom:1px solid #e7edf8;text-align:left;vertical-align:top}th{background:#f4f7fd}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}.tab{border:1px solid #dbe4f3;background:#fff;border-radius:999px;padding:9px 13px;font-weight:800;cursor:pointer}.tab.active{background:#155bff;color:#fff}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.login{max-width:420px;margin:8vh auto}.badge{display:inline-block;border-radius:999px;padding:5px 10px;background:#eef4ff;font-weight:800}.progress{height:12px;border-radius:999px;background:#e7edf8;overflow:hidden}.bar{height:100%;background:#155bff}.notice{background:#fff7ed;border:1px solid #fed7aa;padding:12px;border-radius:12px;margin:10px 0}@media(max-width:1280px){.kpi-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:1180px){.upload-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:980px){.sidebar{position:static;width:100%}.app{display:block}.main{margin:0;width:100%}.upload-grid,.kpi-grid,.grid,.two{grid-template-columns:1fr}.top{display:block}.btn{margin-top:10px}}
.kpi-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.kpiDetail{border:1px solid #dbe4f3;border-radius:16px;padding:16px;background:#fff}.kpiDetail h3{margin:0 0 8px}.badge{display:inline-block;padding:5px 10px;border-radius:999px;font-weight:800;font-size:12px}.badge.baik{background:#dcfce7;color:#166534}.badge.waspada{background:#fef3c7;color:#92400e}.badge.bahaya,.badge.kritis{background:#fee2e2;color:#991b1b}.strategyBox{display:grid;gap:14px}.strategyCard{border:1px solid #dbe4f3;border-radius:16px;padding:16px;background:#fff}.strategyCard h3{margin:0 0 8px}.strategySteps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.step{background:#f8fbff;border:1px solid #dbe4f3;border-radius:12px;padding:12px}.textarea{width:100%;border:1px solid #dbe4f3;border-radius:14px;padding:14px;font-family:Consolas,monospace}.dangerBox{border-color:#fecaca;background:#fff7f7}.printOnly{display:none}@media(max-width:980px){.kpi-detail-grid,.strategySteps{grid-template-columns:1fr}}@media print{.sidebar,.top .btn,.upload-grid,.tabs button,.nav,.notice,button{display:none!important}.main{margin:0!important;width:100%!important}.panel{box-shadow:none;break-inside:avoid}.printOnly{display:block}}