/* ================================================================
   Classification — Score badge, status display, metadata
   ================================================================ */

.cls-box { text-align: center; padding: 32px 20px; }

.cls-badge {
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  padding: 14px 32px;
  border-radius: var(--radius);
  letter-spacing: .5px;
}
.cls-badge.successful {
  background: var(--success-bg);
  color: var(--success);
  border: 1.5px solid var(--success-border);
  box-shadow: 0 0 20px rgba(52, 211, 153, .1);
}
.cls-badge.unsuccessful {
  background: var(--danger-bg);
  color: var(--danger);
  border: 1.5px solid var(--danger-border);
  box-shadow: 0 0 20px rgba(248, 113, 113, .1);
}
.cls-badge.unknown {
  background: var(--unknown-bg);
  color: var(--unknown);
  border: 1.5px solid var(--unknown-border);
  box-shadow: 0 0 20px rgba(167, 139, 250, .1);
}
.cls-badge.pending {
  background: var(--surface-2);
  color: var(--text-4);
  border: 1.5px solid var(--border);
}

/* DFS classification badges */
.cls-badge.domain-blind {
  background: var(--danger-bg);
  color: var(--danger);
  border: 1.5px solid var(--danger-border);
  box-shadow: 0 0 20px rgba(248, 113, 113, .1);
}
.cls-badge.surface-level {
  background: var(--warning-bg);
  color: var(--warning);
  border: 1.5px solid var(--warning-border);
  box-shadow: 0 0 20px rgba(251, 191, 36, .1);
}
.cls-badge.domain-competent {
  background: var(--accent-bg);
  color: var(--accent);
  border: 1.5px solid rgba(225, 29, 72, .3);
  box-shadow: 0 0 20px rgba(225, 29, 72, .1);
}
.cls-badge.domain-fluent {
  background: var(--success-bg);
  color: var(--success);
  border: 1.5px solid var(--success-border);
  box-shadow: 0 0 20px rgba(52, 211, 153, .1);
}

/* Classification metadata row */
.cls-meta {
  display: flex;
  justify-content: center;
  gap: 36px;
  margin-top: 20px;
}
.cm-i { text-align: center; }
.cm-v {
  font-family: var(--mono);
  font-size: 22px;
  font-weight: 600;
  color: var(--text);
}
.cm-l {
  font-size: 10px;
  color: var(--text-4);
  text-transform: uppercase;
  letter-spacing: .8px;
  margin-top: 2px;
}

/* 2×2 grid variant for sidebars with 4+ meta items (e.g. DFS levels) */
.cls-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
}

/* ================================================================
   Scorecard Layout — Two-column with sticky sidebar
   ================================================================ */

.scorecard-layout {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 24px;
  align-items: start;
}
.sc-form { min-width: 0; }
.sc-sidebar { position: sticky; top: 24px; }