/* Komponen bersama: dashboard web & laporan PDF. Ukuran dasar = ukuran slide 1280x720. */
:root{
  --ink:#0f2742; --mute:#627589; --line:#e2e9f0; --teal:#12a5b5; --teal2:#d9f2f5; --lime:#9dbd2f;
  --pos:#0f9d58; --neg:#d93025; --blue:#1d6fb8; --surf:rgba(255,255,255,.88); --card:#fff;
  --head:#0f2742; --headink:#fff; --track:#e6edf3; --posbg:#e2f5ea; --negbg:#fdeae8; --totbg:rgba(18,165,181,.09); --pin:#e8362d;
}
*{box-sizing:border-box;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.panel{background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:0 1px 2px rgba(15,39,66,.04),0 6px 16px -8px rgba(15,39,66,.12)}
.panel h2{margin:0 0 6px;font-size:11.5px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:var(--ink);display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.panel h2 span{font-weight:500;letter-spacing:0;text-transform:none;color:var(--mute);font-size:10.5px}

/* kolom peta */
.mapcol{padding:8px 10px;display:flex;flex-direction:column}
.lines line{stroke:#9fb0c0;stroke-width:.8}
.card.air{border:1px solid var(--line);box-shadow:0 2px 6px -2px rgba(15,39,66,.18);border-radius:7px;font-size:2.1cqw;line-height:1.28;padding:1.9cqw 2.6cqw;color:var(--ink)}
.card.air small{font-size:1.9cqw}
.card.air b{color:var(--teal);font-weight:800}
.pin path{fill:var(--pin)}
.pin{width:7.2cqw;height:9.2cqw}.pin i{font-size:2cqw}
.airlist{display:none}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}
.facts div{display:flex;gap:8px;align-items:center}
.facts svg{width:22px;height:22px;flex:none;stroke:var(--teal);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.facts span{display:flex;flex-direction:column;font-size:8.5px;color:var(--mute);line-height:1.25}
.facts b{font-size:11px;color:var(--ink)}

/* kolom kanan */
.rightcol{display:flex;flex-direction:column;gap:10px;min-width:0}
.kpis{display:grid;grid-template-columns:1.25fr 1.25fr 1fr 1fr;gap:10px}
.kpi{background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;gap:12px;align-items:center;box-shadow:0 6px 16px -8px rgba(15,39,66,.12);min-width:0}
.kpi small{display:block;font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--mute);font-weight:700}
.kpi b{display:block;font-size:30px;line-height:1.1;font-weight:800;letter-spacing:-.5px}
.kpi.gauge b{font-size:23px}
.vs{display:none}
.ic{width:42px;height:42px;border-radius:12px;background:var(--teal2);display:flex;align-items:center;justify-content:center;flex:none}
.ic svg{width:22px;height:22px;stroke:var(--teal);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ic.sm{width:30px;height:30px;border-radius:9px}.ic.sm svg{width:17px;height:17px}
.pill{display:inline-block;font-style:normal;font-size:10px;font-weight:800;border-radius:20px;padding:2px 8px;margin-top:2px;white-space:nowrap}
.pill.pos{background:var(--posbg);color:var(--pos)}.pill.neg{background:var(--negbg);color:var(--neg)}
.ring{width:54px;height:54px;flex:none}
.ring circle{fill:none;stroke-width:7}
.ring .bg{stroke:var(--track)}.ring .fg{stroke-linecap:round}
.ring.lf .fg{stroke:var(--blue)}.ring.otp .fg{stroke:var(--teal)}

.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:10.8px;font-variant-numeric:tabular-nums}
.tbl thead th{font-size:9.5px;font-weight:800;letter-spacing:.8px;color:var(--headink);background:var(--head);padding:4px 0}
.tbl thead th:first-child{border-radius:7px 0 0 7px}.tbl thead th:last-child{border-radius:0 7px 7px 0}
.tbl td,.tbl tbody th{padding:8px 3px;border-bottom:1px solid var(--line);text-align:right}
.tbl td.p{padding-right:7px;font-weight:600}
.tbl td.f{color:var(--mute);border-left:1px solid var(--line)}
.tbl tbody th{text-align:left;font-weight:700;color:var(--mute);padding-left:4px;background:var(--card)}
.tbl tr.tot td,.tbl tr.tot th{font-weight:800;color:var(--ink);background:var(--totbg);border-bottom:0}
.tbl tr.tot td.f{color:var(--ink)}
.scroll{overflow-x:auto}

.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.accmain{display:flex;align-items:center;gap:10px}
.accmain b{font-size:27px;font-weight:800;letter-spacing:-.4px}
.accmain .pill{margin-left:auto}
.prog{height:6px;border-radius:6px;background:var(--track);margin:7px 0 3px;overflow:hidden}
.prog div{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--teal),var(--lime))}
.mini{margin:0 0 5px;font-size:9.3px;color:var(--mute)}
.refs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:4px;border-top:1px solid var(--line);padding-top:5px}
.refs small{display:block;font-size:8.3px;color:var(--mute);line-height:1.2}
.refs b{font-size:12px}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.trio small{display:block;font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);font-weight:700}
.trio b{font-size:24px;font-weight:800;letter-spacing:-.3px}
.trio b.hl{color:var(--teal)}
.so .prog{margin-bottom:0}
