/* Progress ("İlerleme") screen + the live bias guard.

   This file was written for the deep-DNA screen -- hero gauge, radar, per-axis
   cards, Ghost Trader, insights. That screen was replaced by the simpler
   progress view, whose styles live in academy.css under .prog-*, so the ~130
   rules that only targeted the removed markup went with it.

   Reuses the global --qq-* design tokens from styles.css. Everything here is
   namespaced .dna-*. */

/* ---- Stage ------------------------------------------------------------- */
.dna-stage{display:flex;flex-direction:column;gap:20px}
.dna-note{display:flex;gap:9px;align-items:flex-start;margin-top:16px;padding:12px 14px;border-radius:14px;background:rgba(56,189,248,.06);border:1px solid rgba(56,189,248,.16);font-size:12px;line-height:1.6;color:#bae6fd}
.dna-note svg,.dna-note i{color:var(--qq-accent);flex-shrink:0;margin-top:1px}
.dna-note b{color:#e0f2fe}

/* ---- Live bias guard (checkBiasGuard, before an Arena decision) --------- */
.dna-guard-clean{display:flex;align-items:center;gap:10px;color:#6ee7b7;font-weight:800}
.dna-guard-alert{padding:13px 15px;border-radius:14px;margin-top:8px}
.dna-guard-alert.red{background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.34)}
.dna-guard-alert.orange{background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.3)}
.dna-guard-alert .t{font-family:Outfit,sans-serif;font-weight:800;font-size:13.5px}
.dna-guard-alert.red .t{color:#fca5a5}
.dna-guard-alert.orange .t{color:#fcd34d}
.dna-guard-alert .m{font-size:12px;line-height:1.55;color:var(--qq-text-2);margin-top:4px}

/* ---- Empty state (not enough Arena trades yet) ------------------------- */
.dna-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:26px 20px 30px}

/* ---- Skeleton loader --------------------------------------------------- */
.dna-skel{border-radius:24px;background:linear-gradient(100deg,rgba(148,163,184,.05) 30%,rgba(148,163,184,.11) 50%,rgba(148,163,184,.05) 70%);background-size:220% 100%;animation:dnaShimmer 1.5s linear infinite}
.dna-skel-row{height:120px;margin-bottom:16px}
@keyframes dnaShimmer{0%{background-position:180% 0}100%{background-position:-180% 0}}