/* DI-Task — area internal (tema gelap, mobile-first) */
:root {
  --di-accent: #00e5a0;
  --di-cyan: #22d3ee;
}
body { background: #0b0f16; }
.app-navbar { background: rgba(13, 17, 26, .92); backdrop-filter: blur(8px); }
.app-main { max-width: 1400px; }
.brand-dot {
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--di-accent);
  box-shadow: 0 0 10px var(--di-accent);
  display: inline-block;
}
.navbar-dark .nav-link { color: #9fb0c3; }
.navbar-dark .nav-link.active { color: var(--di-accent); font-weight: 600; }
.card { background: #111826; border-color: #1f2a3d; }
.stat-card { border-left: 3px solid var(--di-accent); }
.stat-card .stat-num { font-size: 1.75rem; font-weight: 700; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

/* Stepper PDCA */
.pdca-stepper { display: flex; gap: .5rem; flex-wrap: wrap; }
.pdca-step {
  flex: 1 1 0; min-width: 90px; text-align: center; padding: .5rem .25rem;
  border: 1px solid #2a3550; border-radius: .5rem; color: #7f8ba0; font-size: .8rem;
}
.pdca-step .lbl { display: block; font-weight: 700; font-size: .72rem; letter-spacing: .08em; }
.pdca-step.done { border-color: var(--di-accent); color: var(--di-accent); }
.pdca-step.now  { border-color: var(--di-cyan); color: var(--di-cyan); box-shadow: 0 0 0 1px var(--di-cyan) inset; }

/* Timeline riwayat */
.audit-list { list-style: none; padding-left: 0; }
.audit-list li { border-left: 2px solid #26314a; padding: .15rem 0 .85rem 1rem; position: relative; }
.audit-list li::before {
  content: ''; position: absolute; left: -5px; top: .45rem;
  width: 8px; height: 8px; border-radius: 50%; background: var(--di-cyan);
}
.avatar {
  width: 32px; height: 32px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; font-size: .75rem; font-weight: 700;
  background: #1d2940; color: var(--di-cyan); border: 1px solid #2c3a58;
}
.progress { background: #1c2536; }
.table { --bs-table-bg: transparent; }
@media (max-width: 576px) {
  .stat-card .stat-num { font-size: 1.35rem; }
  .pdca-step { min-width: 70px; font-size: .72rem; }
}