/* ═══════════ NEORP Module Explorer ═══════════ */
.nx-app{display:grid;grid-template-columns:214px 1fr;gap:18px;max-width:1120px;margin:clamp(38px,5vw,54px) auto 0}
.nx-rail{display:flex;flex-direction:column;gap:7px}
.nx-tab{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:12px;cursor:pointer;
  background:#fff;border:1px solid var(--line2);color:var(--body);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:13.5px;text-align:left;
  transition:background .3s,border-color .3s,color .3s,transform .3s var(--ease)}
.nx-tab:hover{color:var(--ink);border-color:var(--acc);transform:translateX(3px)}
.nx-tab.active{color:var(--ink);background:rgba(var(--glow),.13);border-color:var(--acc);
  box-shadow:0 6px 18px -10px rgba(var(--glow),.7)}
.nx-ti{display:grid;place-items:center;width:28px;height:28px;flex:0 0 28px;border-radius:8px;color:var(--acc);
  background:rgba(var(--glow),.14);transition:background .3s,transform .3s var(--ease)}
.nx-ti svg{width:15px;height:15px}
.nx-tab.active .nx-ti{background:rgba(var(--glow),.28);transform:scale(1.06)}

.nx-screen{border-radius:18px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-lg)}
.nx-bar{display:flex;align-items:center;gap:8px;padding:0 15px;height:44px;border-bottom:1px solid var(--line);
  background:#F1F4F8}
.nx-bar i{width:9px;height:9px;border-radius:50%;background:#CFD6E0}
.nx-bar i:first-child{background:var(--accl)}
.nx-url{flex:1;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--dim);margin-left:8px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-live{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.14em;color:var(--acc);
  padding:4px 9px;border-radius:100px;background:rgba(var(--glow),.14);flex:none}
.nx-body{position:relative;min-height:430px;padding:22px 24px 24px}
.nx-panel{display:none;animation:nxIn .45s var(--ease) both}
.nx-panel.active{display:block}
@keyframes nxIn{from{opacity:0;transform:translateY(10px)}}

.nx-h{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--acc);margin-bottom:16px}
.nx-idle{font-size:13.5px;color:var(--dim);padding:22px 0}
.nx-idle b{color:var(--ink)}
.nx-note{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);
  font-size:12.5px;line-height:1.65;color:var(--dim)}
.nx-note b{color:var(--ink);font-weight:700}
.nx-note.ok{border-top-color:rgba(var(--glow),.4);color:var(--body)}
.nx-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13.5px;color:#fff;background:var(--acc);
  padding:11px 18px;border-radius:9px;border:0;cursor:pointer;min-height:42px;
  transition:transform .25s var(--ease),box-shadow .25s,opacity .25s}
.nx-go svg{width:14px;height:14px}
.nx-go:hover{transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(var(--glow),.8)}
.nx-go[disabled]{opacity:.5;cursor:default;transform:none;box-shadow:none}
.em-lab{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--body);margin-bottom:9px}

/* ── 1. SALES FINDER ── */
.fd-ctl{padding:15px 16px;border-radius:13px;background:var(--soft);border:1px solid var(--line);margin-bottom:16px}
.fd-lbl{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--body);margin-bottom:10px}
.fd-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:13px}
.fd-chip{padding:7px 13px;border-radius:100px;cursor:pointer;font-size:12.5px;font-weight:500;
  color:var(--body);background:#fff;border:1px solid var(--line2);transition:.25s var(--ease)}
.fd-chip:hover{border-color:var(--acc);color:var(--acc)}
.fd-chip.on{color:#fff;background:var(--acc);border-color:var(--acc);font-weight:600}

.fd-flow{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.fd-st{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;padding:6px 11px;border-radius:100px;
  color:var(--dim);background:var(--soft);border:1px solid var(--line);white-space:nowrap;transition:.3s var(--ease)}
.fd-st.key{border-style:dashed;border-color:var(--line2)}
.fd-st.run{color:var(--acc);background:rgba(var(--glow),.14);border-color:var(--acc);
  box-shadow:0 0 0 3px rgba(var(--glow),.14)}
.fd-st.done{color:var(--acc);background:rgba(var(--glow),.1);border-color:rgba(var(--glow),.5)}
.fd-ar{width:14px;height:1px;background:var(--line2);flex:none}

.fd-list{display:flex;flex-direction:column;gap:8px;min-height:150px}
.fd-cand{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:11px 14px;
  border-radius:11px;background:#fff;border:1px solid var(--line2);box-shadow:0 1px 2px rgba(11,17,32,.05);
  animation:nxIn .4s var(--ease) both}
.fd-dot{width:8px;height:8px;border-radius:50%;background:var(--line2);flex:none;transition:.3s}
.fd-cand.ok .fd-dot{background:var(--accl)}
.fd-cand.no .fd-dot{background:var(--danger)}
.fd-nm{min-width:0}
.fd-nm b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13.5px;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fd-nm span{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--dim);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fd-cand.no .fd-nm b{color:var(--dim)}
.fd-cand.no .fd-nm span{text-decoration:line-through;opacity:.75}
.fd-tag{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.09em;
  padding:4px 9px;border-radius:100px;white-space:nowrap;flex:none}
.fd-tag.wait{color:var(--dim);background:var(--soft);border:1px solid var(--line)}
.fd-tag.ok{color:var(--acc);background:rgba(var(--glow),.14)}
.fd-tag.no{color:var(--danger);background:rgba(220,38,38,.09)}
.fd-why{grid-column:1/-1;font-size:11.5px;color:var(--danger);padding-left:20px;margin-top:-2px}
.fd-sum{margin-top:14px;padding:12px 15px;border-radius:11px;background:rgba(var(--glow),.09);
  border:1px solid rgba(var(--glow),.4);font-size:13px;color:var(--ink);line-height:1.6}
.fd-sum b{font-weight:700}

/* ── 2. PENAWARAN ── */
.qt-in{padding:15px 16px;border-radius:13px;background:var(--soft);border:1px solid var(--line);margin-bottom:14px}
.qt-lab{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--body);margin-bottom:9px}
#qtText{width:100%;padding:12px 14px;border-radius:10px;background:#fff;border:1px solid var(--line2);
  color:var(--ink);font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.6;resize:vertical;
  transition:border-color .3s}
#qtText:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(var(--glow),.16)}
.qt-row{display:flex;align-items:center;gap:14px;margin-top:11px;flex-wrap:wrap}
.qt-hint{flex:1;min-width:210px;font-size:11.5px;line-height:1.55;color:var(--dim)}
.qt-hint b{color:var(--acc);font-family:'JetBrains Mono',monospace;font-size:11px}
.qt-tok{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:14px}
.qt-tk{font-family:'JetBrains Mono',monospace;font-size:10.5px;padding:5px 10px;border-radius:7px;
  color:var(--acc);background:rgba(var(--glow),.13);border:1px solid rgba(var(--glow),.45);
  animation:nxIn .35s var(--ease) both}
.qt-tkl{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.12em;color:var(--dim);
  text-transform:uppercase;margin-right:3px}

.qt-doc{border-radius:13px;overflow:hidden;border:1px solid var(--line2);background:#fff;
  box-shadow:0 2px 6px rgba(11,17,32,.05);animation:nxIn .45s var(--ease) both}
.qt-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 17px;
  border-bottom:1px solid var(--line);background:var(--soft)}
.qt-head b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:15px;color:var(--ink)}
.qt-head span{display:block;font-size:11.5px;color:var(--dim);margin-top:2px}
.qt-no{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;color:var(--acc);
  padding:5px 10px;border-radius:100px;background:rgba(var(--glow),.14);flex:none}
.qt-tab{width:100%;border-collapse:collapse;font-size:13px}
.qt-tab th{text-align:left;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding:10px 17px;border-bottom:1px solid var(--line)}
.qt-tab th:nth-child(n+2),.qt-tab td:nth-child(n+2){text-align:right}
.qt-tab td{padding:11px 17px;border-bottom:1px solid var(--line);color:var(--body)}
.qt-tab td:first-child{color:var(--ink);font-weight:600}
.qt-tab td:nth-child(n+3){font-family:'JetBrains Mono',monospace;font-size:12px}
.qt-tab tbody tr{animation:nxIn .4s var(--ease) both}
.qt-tot{display:flex;align-items:center;justify-content:space-between;padding:14px 17px;background:var(--soft)}
.qt-tot span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.qt-tot b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:19px;color:var(--acc);letter-spacing:-.02em}

/* ── 3. EMAIL ── */
.em-grid{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start}
.em-side{display:flex;flex-direction:column;gap:7px}
.em-t,.em-r{padding:10px 13px;border-radius:10px;cursor:pointer;text-align:left;background:#fff;
  border:1px solid var(--line2);transition:.25s var(--ease)}
.em-t:hover,.em-r:hover{border-color:var(--acc)}
.em-t.on,.em-r.on{background:rgba(var(--glow),.12);border-color:var(--acc)}
.em-t b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13px;color:var(--ink)}
.em-t em{display:block;font-style:normal;font-size:11px;color:var(--dim);margin-top:2px}
.em-r{font-size:12.5px;color:var(--body)}
.em-r.on{color:var(--ink);font-weight:600}
.em-main{display:grid;gap:14px;min-width:0}
.em-win{border-radius:13px;overflow:hidden;border:1px solid var(--line2);background:#fff;
  box-shadow:0 2px 6px rgba(11,17,32,.05)}
.em-wh{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 15px;
  border-bottom:1px solid var(--line);background:var(--soft)}
.em-from{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--body);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-mode{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.12em;
  color:#A16207;background:rgba(161,98,7,.11);padding:4px 9px;border-radius:100px;flex:none}
.em-sub{padding:13px 15px 0;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:14.5px;color:var(--ink)}
.em-body{padding:9px 15px 16px;font-size:13px;line-height:1.75;color:var(--body);white-space:pre-line}
.em-body mark{background:rgba(var(--glow),.3);color:var(--ink);font-weight:600;padding:1px 4px;border-radius:4px}
.em-thread{padding:14px 15px;border-radius:13px;background:var(--soft);border:1px solid var(--line)}
.em-msg{display:flex;align-items:baseline;gap:9px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.em-msg:last-child{border-bottom:0}
.em-msg b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:11.5px;flex:none;
  padding:3px 9px;border-radius:100px}
.em-msg span{color:var(--body);min-width:0}
.em-msg.out b{color:var(--body);background:var(--line)}
.em-msg.in b{color:var(--acc);background:rgba(var(--glow),.16)}
.em-msg.auto b{color:#8B4BFF;background:rgba(139,75,255,.11)}

/* ── 4. DOKUMEN HR ── */
.hr-grid{display:grid;grid-template-columns:212px 1fr;gap:18px;align-items:start}
.hr-side{display:flex;flex-direction:column;gap:7px}
.hr-t{padding:10px 13px;border-radius:10px;cursor:pointer;text-align:left;background:#fff;
  border:1px solid var(--line2);transition:.25s var(--ease)}
.hr-t:hover{border-color:var(--acc)}
.hr-t.on{background:rgba(var(--glow),.12);border-color:var(--acc)}
.hr-t b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:13.5px;color:var(--ink)}
.hr-t em{display:block;font-style:normal;font-size:11px;color:var(--dim);margin-top:2px}
.hr-ocr{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:10px;cursor:pointer;width:100%;
  color:var(--acc);background:rgba(var(--glow),.08);border:1px dashed var(--acc);
  font-family:'Inter',sans-serif;font-weight:600;font-size:12.5px;transition:.25s var(--ease);min-height:42px}
.hr-ocr:hover{background:rgba(var(--glow),.16)}
.hr-ocr[disabled]{opacity:.55;cursor:default}
.hr-ocri{display:grid;place-items:center;flex:none}
.hr-ocri svg{width:17px;height:17px}
.hr-fields{margin-top:11px;display:flex;flex-direction:column;gap:0;width:100%}
.hr-f{display:flex;align-items:baseline;gap:8px;padding:7px 0;border-bottom:1px solid var(--line);font-size:11.5px}
.hr-f:last-child{border-bottom:0}
.hr-f > span{flex:0 0 62px;color:var(--dim)}
.hr-f > b{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:11px;color:var(--ink);min-width:0;
  word-break:break-word}
.hr-f.fill > b{animation:isi .5s var(--ease) both}
@keyframes isi{from{opacity:0;transform:translateX(-6px)}}

.hr-doc{border-radius:13px;overflow:hidden;border:1px solid var(--line2);background:#fff;
  box-shadow:0 2px 6px rgba(11,17,32,.05);min-width:0}
.hr-paper{padding:24px 26px;font-size:12.5px;line-height:1.75;color:var(--body)}
.hr-ttl{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:14px;letter-spacing:.02em;
  color:var(--ink);text-align:center}
.hr-sub{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--dim);text-align:center;
  margin:4px 0 18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.hr-par{margin-bottom:11px}
.hr-par b{color:var(--ink);font-weight:700}
.hr-blk{margin:0 0 13px;padding:12px 14px;border-radius:9px;background:var(--soft);border:1px solid var(--line)}
.hr-blk div{display:flex;gap:10px;padding:3px 0;font-size:12px}
.hr-blk span{flex:0 0 64px;color:var(--dim)}
.hr-blk b{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:11.5px;color:var(--ink);min-width:0;
  word-break:break-word}
.hr-cl{display:flex;flex-direction:column;gap:9px}
.hr-cl div{display:flex;gap:10px;font-size:12.5px;animation:nxIn .4s var(--ease) both}
.hr-cl i{font-style:normal;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:10.5px;color:var(--acc);
  flex:0 0 46px;white-space:nowrap}
.hr-cl b{color:var(--ink);font-weight:700}
.hr-act{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 17px;border-top:1px solid var(--line);background:var(--soft)}
.hr-badge{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--acc);background:rgba(var(--glow),.14);padding:5px 10px;border-radius:100px}
.hr-dl{font-size:11.5px;color:var(--dim)}

/* ── 5. ABSENSI ── */
.ab-grid{display:grid;grid-template-columns:250px 1fr;gap:24px;align-items:start}
.ab-phone{border:7px solid #0B1120;border-radius:26px;overflow:hidden;background:#0B1120;
  box-shadow:0 22px 50px -16px rgba(4,8,18,.4)}
.ab-scr{background:#F6F3EC;padding:16px 15px 18px}
.ab-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:13px}
.ab-top span:first-child{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:26px;
  letter-spacing:-.03em;color:var(--ink);line-height:1}
.ab-day{font-size:11px;color:var(--dim)}
.ab-cam{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;margin-bottom:12px;
  background:linear-gradient(160deg,#2B3444,#141B27);display:grid;place-items:center}
.ab-face{width:56%;aspect-ratio:3/4;border-radius:50%/44% 44% 56% 56%;
  border:2px dashed rgba(255,255,255,.5);animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.9;transform:scale(1.03)}}
.ab-camlab{position:absolute;bottom:9px;left:0;right:0;text-align:center;font-size:9.5px;
  font-family:'JetBrains Mono',monospace;letter-spacing:.06em;color:rgba(255,255,255,.75)}
.ab-stat{display:flex;flex-direction:column;gap:6px;margin-bottom:13px}
.ab-line{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;font-size:11.5px;
  background:#fff;border:1px solid var(--line);color:var(--body);transition:.3s var(--ease)}
.ab-line i{width:7px;height:7px;border-radius:50%;flex:none;background:var(--accl)}
.ab-line.bad{background:rgba(220,38,38,.06);border-color:rgba(220,38,38,.3);color:var(--danger)}
.ab-line.bad i{background:var(--danger)}
.ab-line.warn{background:rgba(180,83,9,.07);border-color:rgba(180,83,9,.3);color:var(--warn)}
.ab-line.warn i{background:var(--warn)}
.ab-btn{width:100%;padding:13px;border-radius:12px;border:0;cursor:pointer;color:#fff;background:var(--acc);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:14px;min-height:46px;transition:.25s var(--ease)}
.ab-btn:hover{transform:translateY(-1px)}
.ab-btn.blok{background:var(--dim);cursor:not-allowed}
.ab-btn.done{background:#0F7A4A}
.ab-info{min-width:0}
.ab-toggles{display:flex;gap:7px;margin-bottom:9px;flex-wrap:wrap}
.ab-tg{padding:8px 14px;border-radius:100px;cursor:pointer;font-size:12.5px;font-weight:500;color:var(--body);
  background:#fff;border:1px solid var(--line2);transition:.25s var(--ease);min-height:38px}
.ab-tg:hover{border-color:var(--acc)}
.ab-tg.on{color:#fff;background:var(--acc);border-color:var(--acc);font-weight:600}
.ab-list{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column}
.ab-list li{padding:9px 0 9px 20px;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--body);
  line-height:1.6;position:relative}
.ab-list li:last-child{border-bottom:0}
.ab-list li::before{content:"";position:absolute;left:2px;top:16px;width:7px;height:7px;border-radius:50%;
  background:rgba(var(--glow),.65)}
.ab-list b{color:var(--ink);font-weight:700}
.ab-hist{padding:13px 15px;border-radius:12px;background:var(--soft);border:1px solid var(--line)}
.ab-h{display:flex;align-items:center;gap:11px;padding:8px 0;border-bottom:1px solid var(--line)}
.ab-h:last-child{border-bottom:0}
.ab-hp{width:34px;height:34px;border-radius:9px;flex:none;background:linear-gradient(160deg,#2B3444,#141B27)}
.ab-h div{flex:1;min-width:0}
.ab-h b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12.5px;color:var(--ink)}
.ab-h em{display:block;font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--dim);margin-top:1px}
.ab-tag{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.08em;
  padding:4px 9px;border-radius:100px;flex:none}
.ab-tag.ok{color:var(--acc);background:rgba(var(--glow),.15)}
.ab-tag.late{color:var(--warn);background:rgba(180,83,9,.1)}

/* ── 6. PEMBUKUAN ── */
.fn-grid{display:grid;grid-template-columns:274px 1fr;gap:18px;align-items:start}
.fn-jur{display:flex;flex-direction:column;gap:7px}
.fn-j{display:grid;gap:2px;padding:11px 13px;border-radius:10px;cursor:pointer;text-align:left;background:#fff;
  border:1px solid var(--line2);transition:.25s var(--ease)}
.fn-j:hover{border-color:var(--acc)}
.fn-j.on{background:rgba(var(--glow),.12);border-color:var(--acc)}
.fn-jn{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:10px;letter-spacing:.1em;color:var(--acc)}
.fn-jm{font-size:12.5px;color:var(--ink);font-weight:600}
.fn-ja{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--dim)}
.fn-out{display:grid;gap:14px;min-width:0}
.fn-ent{border-radius:12px;overflow:hidden;border:1px solid var(--line2);background:#fff}
.fn-er{display:grid;grid-template-columns:1fr auto auto;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line);
  font-size:12.5px;animation:nxIn .35s var(--ease) both}
.fn-er:last-child{border-bottom:0}
.fn-er.hd span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fn-er.hd{background:var(--soft);font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.fn-er.tot{background:var(--soft);font-weight:700;color:var(--ink)}
.fn-er span:first-child{color:var(--ink);min-width:0}
.fn-er span:nth-child(n+2){font-family:'JetBrains Mono',monospace;font-size:11.5px;text-align:right;
  min-width:96px;color:var(--body)}
.fn-er.hd span:nth-child(n+2){font-size:9.5px}
.fn-er.tot span:nth-child(n+2){color:var(--acc);font-weight:600}
.fn-bal{display:flex;align-items:center;gap:7px;padding:9px 14px;font-family:'JetBrains Mono',monospace;
  font-size:10.5px;letter-spacing:.05em;color:var(--acc);background:rgba(var(--glow),.09)}
.fn-bal i{width:6px;height:6px;border-radius:50%;background:var(--accl);flex:none}
.fn-rep{border-radius:12px;overflow:hidden;border:1px solid var(--line2);background:#fff}
.fn-rt{display:flex;gap:0;border-bottom:1px solid var(--line);background:var(--soft)}
.fn-r{flex:1;padding:10px 8px;border:0;cursor:pointer;background:transparent;font-family:'Plus Jakarta Sans',sans-serif;
  font-weight:600;font-size:12.5px;color:var(--dim);border-bottom:2px solid transparent;transition:.25s}
.fn-r:hover{color:var(--ink)}
.fn-r.on{color:var(--acc);border-bottom-color:var(--acc);background:#fff}
.fn-rb{padding:6px 14px 12px}
.fn-l{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;
  border-bottom:1px solid var(--line);font-size:12.5px;color:var(--body);animation:nxIn .35s var(--ease) both}
.fn-l:last-child{border-bottom:0}
.fn-l b{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:12px;color:var(--ink)}
.fn-l.hi{color:var(--acc)}
.fn-l.hi b{color:var(--acc)}
.fn-l.sum{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;color:var(--ink);border-top:1px solid var(--line2);
  border-bottom:0;margin-top:2px;padding-top:11px}
.fn-l.sum b{font-size:14px}

/* ── 7. PROYEK & ASET ── */
.pj-board{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.pj-col{padding:12px;border-radius:12px;background:var(--soft);border:1px solid var(--line2);min-height:158px}
.pj-cl{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--body);margin-bottom:10px}
.pj-in{display:flex;flex-direction:column;gap:7px}
.pj-card{padding:10px 12px;border-radius:9px;background:#fff;border:1px solid var(--line2);
  box-shadow:0 1px 2px rgba(11,17,32,.06);font-size:12px;color:var(--body);animation:nxIn .4s var(--ease) both;
  transition:transform .45s var(--ease),border-color .3s}
.pj-card b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12.5px;
  color:var(--ink);margin-bottom:3px}
.pj-card.hi{border-color:var(--acc);background:rgba(var(--glow),.1)}
.pj-act{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:14px}
.pj-reset{padding:10px 15px;border-radius:9px;cursor:pointer;background:#fff;border:1px solid var(--line2);
  color:var(--body);font-family:'Inter',sans-serif;font-size:12.5px;min-height:42px;transition:.25s}
.pj-reset:hover{border-color:var(--acc);color:var(--acc)}
.pj-tasks{margin-bottom:16px}
.pj-tl{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}
.pj-tk{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border-radius:9px;background:#fff;
  border:1px solid var(--line2);font-size:12px;color:var(--body);animation:nxIn .4s var(--ease) both}
.pj-tk em{display:block;font-style:normal;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;
  letter-spacing:.1em;color:var(--acc);margin-bottom:3px}
.pj-tk i{width:15px;height:15px;border-radius:4px;border:1.5px solid var(--line2);flex:none;margin-top:1px}
.pj-inv{padding:13px 15px;border-radius:12px;background:var(--soft);border:1px solid var(--line)}
.pj-iv{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.pj-iv:last-child{border-bottom:0}
.pj-iv span:first-child{flex:1;color:var(--ink);font-weight:600;min-width:0}
.pj-iv em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--dim)}
.pj-pill{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.08em;
  padding:4px 9px;border-radius:100px;flex:none}
.pj-pill.ok{color:var(--acc);background:rgba(var(--glow),.15)}
.pj-pill.warn{color:var(--warn);background:rgba(180,83,9,.1)}

/* ── 8. VINDO AI ── */
.vd-ask{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.vd-q{padding:9px 15px;border-radius:100px;cursor:pointer;font-size:12.5px;color:var(--body);background:#fff;
  border:1px solid var(--line2);transition:.25s var(--ease);text-align:left;min-height:38px}
.vd-q:hover{border-color:var(--acc);color:var(--acc)}
.vd-q.on{color:#fff;background:var(--acc);border-color:var(--acc);font-weight:600}
.vd-chat{display:flex;flex-direction:column;gap:10px;min-height:190px;margin-bottom:18px}
.vd-m{max-width:600px;padding:12px 15px;border-radius:13px;font-size:13px;line-height:1.7;
  animation:nxIn .4s var(--ease) both}
.vd-m.u{align-self:flex-end;background:rgba(var(--glow),.15);border:1px solid rgba(var(--glow),.4);
  color:var(--ink);border-bottom-right-radius:5px}
.vd-m.a{align-self:flex-start;background:var(--soft);border:1px solid var(--line2);color:var(--body);
  border-bottom-left-radius:5px}
.vd-m.a b{color:var(--ink);font-weight:700}
.vd-tool{align-self:flex-start;display:inline-flex;align-items:center;gap:9px;padding:7px 12px;border-radius:100px;
  font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--acc);background:rgba(var(--glow),.11);
  border:1px solid rgba(var(--glow),.4);animation:nxIn .35s var(--ease) both}
.vd-tool i{width:6px;height:6px;border-radius:50%;background:var(--accl);flex:none;animation:blink 1.2s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:.35}50%{opacity:1}}
.vd-tool.done i{animation:none;opacity:1}
.vd-dots{align-self:flex-start;display:flex;gap:5px;padding:13px 16px;border-radius:13px;background:var(--soft);
  border:1px solid var(--line2)}
.vd-dots span{width:7px;height:7px;border-radius:50%;background:var(--acc);animation:blink 1.3s ease-in-out infinite}
.vd-dots span:nth-child(2){animation-delay:.18s}.vd-dots span:nth-child(3){animation-delay:.36s}
.vd-card{align-self:flex-start;max-width:600px;width:100%;border-radius:13px;overflow:hidden;background:#fff;
  border:1px solid var(--warn);animation:nxIn .45s var(--ease) both}
.vd-ch{display:flex;align-items:center;gap:9px;padding:11px 15px;background:rgba(180,83,9,.08);
  border-bottom:1px solid rgba(180,83,9,.22);font-family:'JetBrains Mono',monospace;font-weight:600;
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--warn)}
.vd-cb{padding:14px 15px;font-size:13px;line-height:1.7;color:var(--body)}
.vd-cb b{color:var(--ink);font-weight:700}
.vd-cd{display:flex;gap:9px;padding:0 15px 14px}
.vd-ok,.vd-no{padding:9px 17px;border-radius:9px;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;
  font-weight:700;font-size:12.5px;min-height:40px;transition:.25s var(--ease)}
.vd-ok{color:#fff;background:var(--acc);border:0}
.vd-no{color:var(--body);background:#fff;border:1px solid var(--line2)}
.vd-ok:hover,.vd-no:hover{transform:translateY(-1px)}
.vd-hasil{align-self:flex-start;padding:10px 15px;border-radius:11px;font-size:12.5px;
  background:rgba(var(--glow),.11);border:1px solid rgba(var(--glow),.45);color:var(--ink);
  animation:nxIn .4s var(--ease) both}
.vd-pagar{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;
  padding-top:16px;border-top:1px solid var(--line)}
.vd-p{padding:13px 15px;border-radius:11px;background:var(--soft);border:1px solid var(--line)}
.vd-p b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12.5px;
  color:var(--acc);margin-bottom:5px}
.vd-p span{font-size:11.5px;line-height:1.6;color:var(--body)}

/* ── responsif ── */
@media(max-width:980px){
  .nx-app{grid-template-columns:1fr}
  .nx-rail{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nx-rail::-webkit-scrollbar{display:none}
  .nx-tab{flex:0 0 auto;padding:10px 14px}
  .nx-tab:hover{transform:none}
  .nx-tab span:last-child{white-space:nowrap}
  .em-grid,.hr-grid,.ab-grid,.fn-grid{grid-template-columns:1fr}
  .em-side,.hr-side{flex-direction:row;flex-wrap:wrap}
  .em-side .em-lab,.hr-side .em-lab{flex:1 0 100%;margin-top:0 !important}
  .em-t,.em-r,.hr-t{flex:1 1 150px}
  .hr-ocr,.hr-fields{flex:1 0 100%}
  .ab-phone{max-width:260px;margin:0 auto}
}
@media(max-width:640px){
  .nx-body{min-height:auto;padding:18px 16px 20px}
  .pj-board{grid-template-columns:1fr}
  .pj-col{min-height:auto}
  .fd-flow{gap:5px}
  .fd-ar{display:none}
  .qt-tab th:nth-child(2),.qt-tab td:nth-child(2),
  .qt-tab th:nth-child(3),.qt-tab td:nth-child(3){display:none}
  .fn-er span:nth-child(n+2){min-width:74px}
  .vd-ask{flex-direction:column}
  .vd-q{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .nx-panel,.fd-cand,.qt-tk,.qt-doc,.qt-tab tbody tr,.hr-cl div,.pj-card,.pj-tk,
  .vd-m,.vd-tool,.vd-card,.vd-hasil,.fn-er,.fn-l{animation:none}
  .ab-face,.vd-tool i,.vd-dots span{animation:none}
  .hr-f.fill > b{animation:none}
}

/* atribut hidden harus menang atas display:flex/grid di atas */
.nx-panel[hidden],.fd-sum[hidden],.qt-tok[hidden],.qt-doc[hidden],
.pj-tasks[hidden],#qtIdle[hidden],#qtSaved[hidden]{display:none !important}

/* ═══════════ 0. OWNER VIEW ═══════════ */
.ov-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.ov-per{display:flex;gap:6px;flex-wrap:wrap}
.ov-p{padding:8px 15px;border-radius:100px;cursor:pointer;font-size:12.5px;font-weight:500;color:var(--body);
  background:#fff;border:1px solid var(--line2);transition:.25s var(--ease);min-height:38px}
.ov-p:hover{border-color:var(--acc);color:var(--acc)}
.ov-p.on{color:#fff;background:var(--acc);border-color:var(--acc);font-weight:600}
.ov-act{display:flex;align-items:center;gap:8px}
.ov-ro{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;letter-spacing:.14em;
  color:var(--acc);background:rgba(var(--glow),.14);padding:5px 10px;border-radius:100px}
.ov-dl{font-size:11.5px;color:var(--dim);padding:6px 11px;border-radius:8px;border:1px solid var(--line2);
  background:#fff}

.ov-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.ov-k{padding:14px 15px;border-radius:12px;background:#fff;border:1px solid var(--line2);
  box-shadow:0 1px 2px rgba(11,17,32,.05);animation:nxIn .4s var(--ease) both}
.ov-k span{display:block;font-size:10.5px;color:var(--dim);margin-bottom:5px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ov-k b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:19px;
  letter-spacing:-.03em;color:var(--ink);line-height:1.15}
.ov-k em{display:block;font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10px;margin-top:4px}
.ov-k em.naik{color:var(--acc)}
.ov-k em.turun{color:var(--danger)}
.ov-k.pokok b{color:var(--acc)}

.ov-mid{display:grid;grid-template-columns:1.35fr 1fr;gap:12px;margin-bottom:12px}
.ov-low{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ov-box{padding:14px 16px;border-radius:12px;background:var(--soft);border:1px solid var(--line)}

.ov-chart{display:flex;align-items:flex-end;gap:8px;height:132px;padding-top:6px}
.ov-cb{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;height:100%}
.ov-cb i{display:block;width:100%;border-radius:5px 5px 0 0;height:var(--h);transform-origin:bottom;
  background:linear-gradient(180deg,var(--acc),rgba(var(--glow),.4));animation:tumbuh .75s var(--ease) both}
.ov-cb.puncak i{background:var(--acc);box-shadow:0 -2px 14px -2px rgba(var(--glow),.7)}
.ov-cb u{text-decoration:none;font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--dim)}
@keyframes tumbuh{from{transform:scaleY(0);opacity:0}}

.ov-fun{display:flex;flex-direction:column;gap:7px;padding-top:4px}
.ov-fr{display:grid;grid-template-columns:78px 1fr auto;gap:9px;align-items:center;font-size:11.5px}
.ov-fr span:first-child{color:var(--body);white-space:nowrap}
.ov-fr u{text-decoration:none;display:block;height:16px;border-radius:5px;width:var(--w);min-width:6px;
  background:linear-gradient(90deg,var(--acc),rgba(var(--glow),.45));animation:lebar .8s var(--ease) both}
.ov-fr.won u{background:var(--acc);box-shadow:0 0 12px -2px rgba(var(--glow),.8)}
.ov-fr b{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:11px;color:var(--ink);min-width:26px;
  text-align:right}
@keyframes lebar{from{width:0}}

.ov-pair{display:flex;flex-direction:column}
.ov-pr{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:7px 0;
  border-bottom:1px solid var(--line);font-size:11.5px;color:var(--body)}
.ov-pr:last-child{border-bottom:0}
.ov-pr b{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:11.5px;color:var(--ink);
  white-space:nowrap}
.ov-pr.kuat b{color:var(--acc);font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:14px}

@media(max-width:980px){
  .ov-kpi{grid-template-columns:repeat(2,1fr)}
  .ov-mid,.ov-low{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.ov-k,.ov-cb i,.ov-fr u{animation:none}}

/* ═══════════ SECTION HAK AKSES ═══════════ */
.ak-app{display:grid;grid-template-columns:198px 1fr;gap:16px;max-width:1000px;
  margin:clamp(36px,4.5vw,48px) auto 0;text-align:left;align-items:start}
.ak-roles{display:flex;flex-direction:column;gap:6px}
.ak-role{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:11px;cursor:pointer;
  background:#fff;border:1px solid var(--line2);text-align:left;transition:.25s var(--ease)}
.ak-role:hover{border-color:var(--acc);transform:translateX(3px)}
.ak-role.on{background:rgba(var(--glow),.13);border-color:var(--acc)}
.ak-role b{flex:1;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13.5px;color:var(--ink)}
.ak-role em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--dim)}
.ak-role.on em{color:var(--acc);font-weight:600}
.ak-role .mahkota{width:14px;height:14px;flex:none;color:var(--acc);opacity:0;transition:opacity .3s}
.ak-role.super .mahkota{opacity:1}

.ak-panel{border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.ak-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;
  border-bottom:1px solid var(--line);background:var(--soft);flex-wrap:wrap}
.ak-who{font-size:13.5px;color:var(--body)}
.ak-who b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:15px;color:var(--ink)}
.ak-count{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:10px;letter-spacing:.1em;
  color:var(--acc);background:rgba(var(--glow),.14);padding:5px 11px;border-radius:100px}
.ak-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding:16px 18px}
.ak-m{display:flex;align-items:center;gap:9px;padding:12px 13px;border-radius:10px;font-size:12.5px;
  border:1px solid var(--line2);background:#fff;color:var(--body);
  transition:background .35s var(--ease),border-color .35s,color .35s,opacity .35s,transform .35s var(--ease)}
.ak-m i{display:grid;place-items:center;width:24px;height:24px;flex:none;border-radius:7px;
  background:var(--soft);color:var(--dim);transition:.35s var(--ease)}
.ak-m i svg{width:13px;height:13px}
.ak-m.buka{color:var(--ink);font-weight:600;border-color:var(--acc);background:rgba(var(--glow),.1)}
.ak-m.buka i{background:rgba(var(--glow),.24);color:var(--acc)}
.ak-m.tutup{opacity:.42;border-style:dashed}
.ak-note{margin:0;padding:0 18px 16px;font-size:12.5px;line-height:1.65;color:var(--dim)}
.ak-note b{color:var(--ink);font-weight:700}

.ak-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  max-width:1000px;margin:clamp(28px,3.5vw,38px) auto 0;padding:22px 26px;border-radius:16px;
  background:linear-gradient(100deg,rgba(var(--glow),.13),rgba(var(--glow),.05));
  border:1px solid rgba(var(--glow),.4);text-align:left}
.ak-cta b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:17px;
  color:var(--ink);letter-spacing:-.02em;margin-bottom:4px}
.ak-cta span{font-size:14px;color:var(--body)}
@media(max-width:820px){
  .ak-app{grid-template-columns:1fr}
  .ak-roles{flex-direction:row;flex-wrap:wrap}
  .ak-role{flex:1 1 138px}
  .ak-role:hover{transform:none}
  .ak-grid{grid-template-columns:repeat(2,1fr)}
  .ak-cta{flex-direction:column;align-items:stretch;text-align:center}
  .ak-cta .btn{width:100%}
}
@media(max-width:520px){.ak-grid{grid-template-columns:1fr}}

/* ── CTA setelah module explorer ── */
.mod-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  max-width:1120px;margin:clamp(26px,3.2vw,36px) auto 0;padding:26px 30px;border-radius:18px;text-align:left;
  background:var(--ink);color:#fff;position:relative;overflow:hidden}
.mod-cta::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 130% at 88% 0%,rgba(var(--glow),.3),transparent 62%)}
.mod-cta-t{position:relative;flex:1;min-width:280px}
.mod-cta-t b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;
  font-size:clamp(17px,2vw,21px);letter-spacing:-.02em;color:#fff;margin-bottom:6px}
.mod-cta-t span{font-size:14px;line-height:1.6;color:rgba(255,255,255,.7)}
.mod-cta-b{position:relative;display:flex;gap:10px;flex-wrap:wrap;flex:none}
.mod-cta-b .btn-o{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}
.mod-cta-b .btn-o:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.6);color:#fff}
@media(max-width:760px){
  .mod-cta{flex-direction:column;align-items:stretch;padding:22px 20px}
  .mod-cta-b{flex-direction:column}
  .mod-cta-b .btn{width:100%}
}

/* ═══════════ SECTION PILIH MODUL ═══════════ */
.pk-app{display:grid;grid-template-columns:1fr 372px;gap:18px;max-width:1100px;
  margin:clamp(34px,4.5vw,46px) auto 0;text-align:left;align-items:start}
.pk-pilih{padding:20px 22px;border-radius:18px;background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow)}
.pk-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.pk-semua{padding:7px 13px;border-radius:100px;cursor:pointer;font-size:12px;font-weight:600;
  color:var(--acc);background:rgba(var(--glow),.11);border:1px solid rgba(var(--glow),.4);
  transition:.25s var(--ease);min-height:34px}
.pk-semua:hover{background:rgba(var(--glow),.2)}
.pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.pk-m{display:flex;flex-direction:column;gap:7px;padding:14px 13px;border-radius:13px;cursor:pointer;
  text-align:left;background:#fff;border:1.5px solid var(--line2);position:relative;overflow:hidden;
  transition:border-color .3s var(--ease),background .3s,transform .3s var(--ease),opacity .3s}
.pk-m:hover{border-color:var(--acc);transform:translateY(-2px)}
.pk-m i{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;flex:none;
  background:var(--soft);color:var(--dim);transition:.3s var(--ease)}
.pk-m i svg{width:15px;height:15px}
.pk-m b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13.5px;color:var(--ink);
  letter-spacing:-.015em;line-height:1.3}
.pk-m span{font-size:11.5px;line-height:1.5;color:var(--dim)}
.pk-m .pk-cek{position:absolute;top:11px;right:11px;width:19px;height:19px;border-radius:50%;
  border:1.5px solid var(--line2);display:grid;place-items:center;transition:.3s var(--ease)}
.pk-m .pk-cek svg{width:10px;height:10px;color:#fff;opacity:0;transition:opacity .25s}
.pk-m.on{border-color:var(--acc);background:rgba(var(--glow),.08)}
.pk-m.on i{background:rgba(var(--glow),.22);color:var(--acc)}
.pk-m.on .pk-cek{background:var(--acc);border-color:var(--acc)}
.pk-m.on .pk-cek svg{opacity:1}
.pk-m.off{opacity:.5}
.pk-m.off b{color:var(--body)}

.pk-nota{border-radius:18px;overflow:hidden;background:var(--ink);color:#fff;position:sticky;top:92px;
  box-shadow:0 26px 60px -22px rgba(4,8,18,.5)}
.pk-nota-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:radial-gradient(120% 160% at 90% 0%,rgba(var(--glow),.26),transparent 62%)}
.pk-nota-t{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:16px;letter-spacing:-.02em}
.pk-hit{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:10px;letter-spacing:.12em;
  color:var(--accl);background:rgba(var(--glow),.18);padding:5px 11px;border-radius:100px;white-space:nowrap}
.pk-nota-b{padding:16px 20px 4px;max-height:340px;overflow-y:auto;scrollbar-width:thin}
.pk-blok + .pk-blok{margin-top:18px;padding-top:16px;border-top:1px dashed rgba(255,255,255,.14)}
.pk-blok-l{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9px;
  letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:10px;line-height:1.5}
.pk-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:7px}
.pk-list li{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.4;
  animation:nxIn .35s var(--ease) both}
.pk-list li svg{width:13px;height:13px;flex:none}
.pk-list.ya li{color:#fff;font-weight:600}
.pk-list.ya li svg{color:var(--accl)}
.pk-list.tidak li{color:rgba(255,255,255,.4);text-decoration:line-through}
.pk-list.tidak li svg{color:rgba(255,255,255,.28)}
.pk-kosong{font-size:12.5px;color:rgba(255,255,255,.45);font-style:italic}
.pk-nota-f{padding:16px 20px 20px;border-top:1px solid rgba(255,255,255,.12);margin-top:14px}
.pk-nota-f p{font-size:13px;line-height:1.65;color:rgba(255,255,255,.74);margin:0 0 14px}
.pk-nota-f p b{color:#fff;font-weight:700}
.pk-nota-f .btn{width:100%}

.pk-banding{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:1100px;
  margin:clamp(22px,3vw,30px) auto 0;text-align:left}
.pk-b{padding:22px 24px;border-radius:16px;border:1px solid var(--line)}
.pk-b-lain{background:#fff}
.pk-b-kami{background:rgba(var(--glow),.07);border-color:rgba(var(--glow),.45)}
.pk-b-l{display:block;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:9.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:9px}
.pk-b-kami .pk-b-l{color:var(--acc)}
.pk-b b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:17px;
  color:var(--ink);letter-spacing:-.02em;margin-bottom:8px}
.pk-b p{font-size:13.5px;line-height:1.7;color:var(--body);margin:0}

@media(max-width:980px){
  .pk-app{grid-template-columns:1fr}
  .pk-nota{position:static}
  .pk-grid{grid-template-columns:repeat(2,1fr)}
  .pk-banding{grid-template-columns:1fr}
}
@media(max-width:560px){.pk-grid{grid-template-columns:1fr}.pk-pilih{padding:16px}}
@media(prefers-reduced-motion:reduce){.pk-list li{animation:none}}

/* ═══════════ BAND DEMO + STRIP TIM ═══════════ */
.ap-duo{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,4.5vw,60px);align-items:center;
  text-align:left}
.ap-t h2{margin-bottom:16px}
.ap-t .lead{margin:0 0 20px}
.ap-list{list-style:none;padding:0;margin:0 0 26px;display:flex;flex-direction:column;gap:0}
.ap-list li{position:relative;padding:10px 0 10px 26px;border-bottom:1px solid var(--line);
  font-size:14px;color:var(--body)}
.ap-list li:last-child{border-bottom:0}
.ap-list li::before{content:"";position:absolute;left:2px;top:17px;width:9px;height:9px;border-radius:3px;
  background:var(--acc)}
.ap-cta{display:flex;gap:11px;flex-wrap:wrap}

.ap-v{position:relative}
.ap-win{border-radius:14px;overflow:hidden;background:#fff;
  box-shadow:0 40px 90px -30px rgba(4,8,18,.5),0 3px 8px rgba(4,8,18,.12)}
.ap-bar{display:flex;align-items:center;gap:7px;padding:10px 13px;background:#EEF1F6;
  border-bottom:1px solid #E0E5ED}
.ap-bar i{width:9px;height:9px;border-radius:50%;background:#D2D8E2;flex:none}
.ap-bar span{flex:1;margin-left:8px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--dim)}
.ap-win img{width:100%;height:auto;display:block}
/* ═══════ iPhone 17 Pro Max: bingkai + layar hidup ═══════
   Dulu <img> screenshot 104px yang dipepetkan — isinya tidak terbaca sama sekali.
   Sekarang UI-nya digambar sungguhan, jadi tetap tajam di ukuran berapa pun dan
   bisa memainkan urutan clock-in yang sebenarnya. Rasio layar 1320x2868 (2.172). */
.ap-hp{position:absolute;left:-44px;bottom:-52px;width:clamp(206px,21vw,268px);
  border:0;background:none;overflow:visible;box-shadow:none}
.ip{position:relative;border-radius:15.6%/7.2%;padding:3.2%;
  background:linear-gradient(150deg,#8E9298 0%,#3D4147 22%,#22262B 50%,#4A4E54 78%,#75797F 100%);
  box-shadow:0 30px 70px -20px rgba(4,8,18,.62),0 2px 5px rgba(0,0,0,.4)}
.ip::after{content:"";position:absolute;inset:1.4%;border-radius:14.4%/6.6%;
  border:1px solid rgba(255,255,255,.16);pointer-events:none}
.ip-island{position:absolute;top:3.6%;left:50%;transform:translateX(-50%);z-index:3;
  width:31%;height:3.1%;border-radius:100px;background:#07090C}
.ip-scr{container-type:inline-size;position:relative;aspect-ratio:1320/2868;border-radius:13.2%/6.1%;overflow:hidden;
  background:linear-gradient(180deg,#F4F8F7 0%,#FFF 42%);display:flex;flex-direction:column;
  padding:9.6% 6.4% 5.4%;gap:4.4%}

.ip-bar{display:flex;align-items:center;justify-content:space-between;
  font-family:'JetBrains Mono',monospace;font-size:4.1cqw;font-weight:600;color:#0B1120}
.ip-sig{width:11%;height:3.6cqw;border-radius:2px;background:#0B1120;opacity:.75}

.ip-h{display:flex;align-items:center;gap:5%}
.ip-logo{width:16%;flex:none;display:block}
.ip-logo svg{width:100%;height:auto;display:block}
.ip-h-t{min-width:0;line-height:1.25}
.ip-h-t b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;
  font-size:5.4cqw;color:#0B1120;letter-spacing:-.01em}
.ip-h-t em{display:block;font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:3.9cqw;color:#7C8798}

.ip-clock{text-align:center;padding:3% 0 1%}
.ip-clock b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;
  font-size:15cqw;line-height:1;letter-spacing:-.04em;color:#0B1120;
  font-variant-numeric:tabular-nums}
.ip-clock span{display:block;margin-top:2%;font-family:'JetBrains Mono',monospace;
  font-size:3.9cqw;color:#7C8798}

.ip-cam{position:relative;aspect-ratio:1/.92;border-radius:9%;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 12%,#20343A,#0C1A1E);
  display:grid;place-items:center}
.ip-ring{width:46%;aspect-ratio:1/1.22;border-radius:50%;
  border:1.6px dashed rgba(56,225,198,.55);transition:border-color .5s,transform .5s}
.ip-cam.tangkap .ip-ring{border-style:solid;border-color:#38E1C6;transform:scale(1.04)}
.ip-sweep{position:absolute;left:6%;right:6%;height:1.6px;top:14%;opacity:0;
  background:linear-gradient(90deg,transparent,#38E1C6,transparent)}
.ip-cam.pindai .ip-sweep{opacity:1;animation:ipSapu 1.5s cubic-bezier(.5,0,.5,1) 2}
@keyframes ipSapu{0%,100%{transform:translateY(0)}50%{transform:translateY(560%)}}
.ip-camlab{position:absolute;left:0;right:0;bottom:6%;text-align:center;
  font-family:'JetBrains Mono',monospace;font-size:3.7cqw;letter-spacing:.04em;
  color:rgba(255,255,255,.82)}

.ip-stat{display:flex;flex-direction:column;gap:4.4cqw}
.ip-line{display:flex;align-items:center;gap:5%;
  font-family:'JetBrains Mono',monospace;font-size:3.7cqw;line-height:1.4;color:#7C8798}
.ip-line i{width:3.4cqw;height:3.4cqw;border-radius:50%;flex:none;background:#C6CEDA;
  transition:background .45s}
.ip-line.ok{color:#0B1120}
.ip-line.ok i{background:#0FA37F;box-shadow:0 0 0 2px rgba(15,163,127,.18)}

.ip-btn{margin-top:auto;padding:4.6% 0;border-radius:100px;border:0;width:100%;
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:5.2cqw;color:#fff;
  background:linear-gradient(135deg,#0FA37F,#057E6B);
  transition:transform .3s cubic-bezier(.16,1,.3,1),background .4s,opacity .3s}
.ip-btn.tekan{transform:scale(.96)}
.ip-btn.sukses{background:linear-gradient(135deg,#0B1120,#1E2A33)}

@media(prefers-reduced-motion:reduce){
  .ip-sweep{display:none}
  .ip-btn,.ip-ring{transition:none}
}

.ap-tim{display:flex;align-items:center;gap:22px;flex-wrap:wrap;text-align:left;
  margin:clamp(46px,6vw,74px) auto 0;max-width:820px;padding:22px 26px;border-radius:16px;
  background:var(--soft);border:1px solid var(--line)}
.ap-tim-f{display:flex;flex:none}
.ap-tim-f img{width:56px;height:56px;border-radius:50%;object-fit:cover;background:#DDE3EA;
  border:3px solid var(--soft)}
.ap-tim-f img + img{margin-left:-16px}
.ap-tim-t{flex:1;min-width:220px}
.ap-tim-t b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:16px;
  color:var(--ink);letter-spacing:-.02em;margin-bottom:5px}
.ap-tim-t span{font-size:13.5px;line-height:1.7;color:var(--body)}

@media(max-width:900px){
  .ap-duo{grid-template-columns:1fr}
  .ap-hp{left:8px;bottom:-22px}
  .ap-cta .btn{flex:1}
  .ap-tim{flex-direction:column;text-align:center;align-items:center}
  .ap-tim-t{min-width:0}
}

/* ============================================================
   PERAPIAN PONSEL UNTUK MODUL DEMO
   Diaudit pada 390px: tombol di dalam modul demo berkisar 26 sampai
   41px tinggi, di bawah ambang 44px untuk jari, dan sejumlah label
   turun sampai 9px. Diperbaiki hanya di bawah 760px supaya tampilan
   desktop yang sudah padat tidak ikut membesar.
   ============================================================ */
@media(max-width:760px){
  .ov-p,.ip-btn,.pk-semua,.ak-role,.nx-tab,.ov-dl,.fn-b,.ep-b,
  .em-b,.hr-b,.ab-b,.pj-b,.ai-b{min-height:44px}
  .ov-p,.pk-semua,.ov-dl{padding:11px 15px}
  .ip-btn{padding:10px 14px}
  /* Label mono di modul demo: 9 sampai 10,5px tidak terbaca di genggam. */
  .nx-live,.nx-h,.sx-p,.em-lab,.ov-sub,.fn-jm,.pk-lab,.ak-lab,
  .nx-badge,.dm-tenant,.dm-peran span{font-size:11px}
  /* Baris yang berisi angka tetap rata kanan tapi tidak lagi mepet. */
  .ov-kpi{gap:10px}
}

@media(max-width:760px){
  /* Sisa audit: label di modul Paket turun sampai 9px, dan dua tautan
     (FAQ "lihat semua" 42px, tautan grup di footer 36px) masih di bawah
     ambang sentuh 44px. */
  .pk-hit,.pk-blok-l,.pk-b-l,.pk-n,.pk-sub{font-size:11px}
}

/* Label sumbu grafik di demo: data yang dibaca orang, bukan tiruan. */
@media(max-width:760px){.ov-cb u{font-size:11px}}