/* IUPWATCH sea traffic (AIS) and satellite trackers (Iridium Edge Solar) panel */
#btn-lalin{display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line2);color:var(--cy);height:34px;padding:0 12px;
  border-radius:10px;cursor:pointer;font:800 10.5px system-ui;letter-spacing:1.5px;}
#btn-lalin:hover{background:#0e2a40}
#lalin-n{font-style:normal;background:#0e2a40;color:var(--cy);border:1px solid var(--line2);border-radius:9px;padding:0 6px;font:800 10px var(--mono);min-width:18px;text-align:center}
#lalin-n:empty{display:none}#lalin-n.waspada{background:#ffb23f;color:#1a1200;border-color:#ffb23f}
#lalin{position:fixed;z-index:41;top:76px;right:14px;bottom:14px;width:min(620px,calc(100vw - 350px));display:flex;flex-direction:column;
  background:var(--panel2);border:1px solid var(--line2);border-radius:18px;box-shadow:0 24px 80px #000a;animation:naik .3s both;overflow:hidden}
.ll-kepala{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.ll-kepala h3{font-size:12px;letter-spacing:2.4px;color:#fff}
#ll-tab{display:flex;gap:6px}
#ll-tab button{background:#0a1a29;border:1px solid var(--line);color:var(--mut);border-radius:8px;padding:5px 10px;font-size:11px;cursor:pointer;font-weight:700}
#ll-tab button.on{background:#0e2a40;color:var(--cy);border-color:var(--line2)}
#ll-tutup{margin-left:auto;background:#0a1a29;border:1px solid var(--line);color:var(--mut);width:30px;height:30px;border-radius:9px;cursor:pointer}
#ll-ringkas{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:10px 14px;border-bottom:1px solid var(--line)}
#ll-ringkas .st{min-width:0;padding:5px 6px}#ll-ringkas .st b{font-size:15px}#ll-ringkas .st span{font-size:8px;white-space:normal;line-height:1.25;display:block}
#ll-isi{flex:1;overflow-y:auto;padding:12px 14px;scrollbar-width:thin}
/* sources */
.ll-sumber{display:grid;gap:6px;margin-bottom:10px}
.ll-sb{display:flex;gap:10px;align-items:flex-start;background:#08131f;border:1px solid var(--line);border-radius:11px;padding:8px 10px}
.ll-sb>i{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:0 0 auto;background:var(--ab)}
.ll-sb>i.hj{background:var(--hj);box-shadow:0 0 8px var(--hj);animation:denyut 1.8s infinite}.ll-sb>i.kn{background:var(--kn)}.ll-sb>i.mr{background:var(--mr);box-shadow:0 0 8px var(--mr)}
.ll-sb b{font-size:12px;color:#fff;display:block}.ll-sb span{font-size:10.5px;color:var(--mut);display:block}
.ll-area{color:#9fd8ef!important}
/* tools */
.ll-alat{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.ll-chip{display:flex;gap:5px;flex-wrap:wrap}
.ll-chip button{background:#0a1a29;border:1px solid var(--line);color:var(--mut);border-radius:999px;padding:4px 10px;font-size:10.5px;cursor:pointer;font-weight:700}
.ll-chip button.on{background:#0e2a40;color:var(--cy);border-color:var(--line2)}
#ll-cari{flex:1 1 150px;min-width:0;background:#081422;color:var(--tx);border:1px solid var(--line);border-radius:8px;padding:6px 9px;font-size:12px}
#ll-jam{background:#081422;color:var(--tx);border:1px solid var(--line);border-radius:8px;padding:5px 6px;font-size:11.5px}
#ll-cari:focus,#ll-jam:focus{outline:none;border-color:var(--cy)}
.ll-legenda{display:flex;gap:12px;flex-wrap:wrap;font-size:10px;color:var(--mut);margin-bottom:10px}
.ll-legenda i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;transform:rotate(45deg);vertical-align:-1px}
.ll-legenda i.cincin{border-radius:50%;transform:none;border:1.5px solid #ffd97a;background:none}
/* vessel card */
.ll-kapal{display:flex;gap:11px;align-items:center;background:#0a1826;border:1px solid var(--line);border-left:3px solid #7fd3ff;border-radius:12px;padding:9px 11px;margin-bottom:7px;
  cursor:pointer;transition:transform .15s,border-color .15s}
.ll-kapal.wiup{border-left-color:#ffb23f}.ll-kapal.mitra{border-left-color:#6ff0a8}
.ll-kapal:hover,.ll-kapal:focus-visible{transform:translateX(-3px);border-color:var(--line2);outline:none}
.ll-k-tx{min-width:0;flex:1}.ll-k-tx>span{display:block;font-size:10.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ll-k-atas{display:flex;gap:7px;align-items:center;min-width:0}.ll-k-atas b{font-size:12.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ll-kompas{flex:0 0 auto;width:30px;height:30px;border-radius:50%;border:1px solid var(--line2);background:radial-gradient(circle,#0e2a40 0,#08131f 70%);position:relative;
  display:grid;place-items:center;color:#7fd3ff;font-size:11px}
.ll-kompas i{position:absolute;left:50%;top:4px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:16px solid var(--cy);
  transform-origin:50% 11px;transform:translateX(-50%) rotate(var(--a))}
.ll-kompas.diam i{border-bottom-color:#5f7f96}
/* detail */
.ll-kembali{background:none;border:0;color:var(--cy);font-size:11.5px;font-weight:700;cursor:pointer;padding:2px 0 10px}
.ll-detail{background:#0a1826;border:1px solid var(--line2);border-radius:14px;padding:12px 13px}
.ll-d-kepala{display:flex;gap:12px;align-items:center}.ll-d-kepala .ll-kompas{width:46px;height:46px}
.ll-d-kepala .ll-kompas i{top:6px;border-left-width:7px;border-right-width:7px;border-bottom-width:24px;transform-origin:50% 17px}
.ll-d-kepala h4{font-size:16px;color:#fff;letter-spacing:.3px}.ll-d-kepala span{font-size:11px;color:var(--mut)}
.ll-d-kepala span i{display:inline-block;width:8px;height:8px;border-radius:2px;transform:rotate(45deg);margin-right:6px}
.ll-catat{margin:10px 0 0;font-size:11px;line-height:1.5;color:#ffd9a0;background:#2b1f0d;border:1px solid #4a3512;border-radius:9px;padding:7px 9px}
.ll-catat.hj{color:#bff5d6;background:#0f2a1d;border-color:#1d4a33}.ll-catat.mr{color:#ffb4b4;background:#2e1212;border-color:#5a1e1e}
.ll-besar{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}
.ll-besar div{background:#08131f;border:1px solid var(--line);border-radius:10px;padding:7px 8px;text-align:center}
.ll-besar b{display:block;font:700 17px var(--mono);color:#fff}.ll-besar span{font-size:9px;color:var(--mut);letter-spacing:.6px;text-transform:uppercase}
.ll-grid{margin-top:4px}
.ll-detail .pop-aksi{margin-top:12px}
/* Iridium unit card */
.ll-unit{background:#0a1826;border:1px solid var(--line);border-left:3px solid var(--hj);border-radius:12px;padding:10px 12px;margin-bottom:9px;cursor:pointer}
.ll-unit.kn{border-left-color:var(--kn)}.ll-unit.mr{border-left-color:var(--mr)}.ll-unit.ab{border-left-color:var(--ab);opacity:.8}
.ll-unit:hover,.ll-unit:focus-visible{border-color:var(--line2);outline:none}
.ll-u-atas{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.ll-u-atas b{font-size:12.5px;color:#fff;margin-right:auto}
.ll-u-sub{font-size:10.5px;color:var(--mut);margin-top:2px}
.ll-u-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-top:8px}
.ll-u-grid span{display:block;font-size:9px;color:var(--mut);letter-spacing:.6px;text-transform:uppercase}.ll-u-grid b{font-size:11.5px;color:#dbeaf5;font-weight:600}
.ll-u-grid b.hj{color:var(--hj)}
.ll-meter{display:grid;grid-template-columns:62px 1fr 40px;gap:8px;align-items:center;margin-top:7px;font-size:10.5px;color:var(--mut)}
.ll-meter div{height:7px;background:#08131f;border:1px solid var(--line);border-radius:99px;overflow:hidden}
.ll-meter i{display:block;height:100%;background:var(--hj)}.ll-meter i.kn{background:var(--kn)}.ll-meter i.mr{background:var(--mr)}
.ll-meter b{font:700 11px var(--mono);color:#fff;text-align:right}
.ll-peristiwa{margin-top:8px;display:grid;gap:3px}
.ll-peristiwa span{font-size:10.5px;color:#b8cfe0}.ll-peristiwa i{font-style:normal;color:var(--mut);margin-left:4px}
.ll-kosong{background:#08131f;border:1px dashed var(--line2);border-radius:12px;padding:14px;margin:6px 0 10px}
.ll-kosong b{display:block;color:#fff;font-size:12.5px;margin-bottom:4px}.ll-kosong span{font-size:11px;color:var(--mut);line-height:1.55}
@media (max-width:900px){
  #btn-lalin span{display:none}#btn-lalin{padding:0 9px}
  #lalin{top:0;left:0;right:0;bottom:0;width:auto;border-radius:0;z-index:46}
  #ll-ringkas{grid-template-columns:repeat(3,1fr)}
  .ll-besar{grid-template-columns:repeat(2,1fr)}
  .ll-u-grid{grid-template-columns:1fr}
  .ll-detail .pop-aksi{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .ll-detail .pop-aksi>*{text-align:center;justify-content:center;white-space:nowrap}
}
@media (max-width:420px){#btn-lalin{padding:0 6px}}
@media (prefers-reduced-motion:reduce){#lalin{animation:none}.ll-sb>i.hj{animation:none}.ll-kapal{transition:none}}
