/* ---------------------------------------------------------
   Nutrient analysis panel — SHARED COMPONENT.

   Single source of truth for the "Not a tracker" visual. Used by:
     - the landing page  (public/index.html, .ln-nottracker)
     - the partners page (public/partners.html, hero)

   Rules below are lifted verbatim from home.css so the landing page
   renders byte-identically; do not fork them per page. Page-specific
   sizing belongs in that page's own stylesheet, scoped under a wrapper.

   --fs-caption is referenced but never defined anywhere (pre-existing);
   left as-is rather than given a fallback, which would change the
   landing page's caption size.
   --------------------------------------------------------- */

.analysis-card {
  background: #ffffff;
  border: 0.5px solid #d9d5c8;
  border-radius: 12px;
  padding: 14px;
  box-shadow: none;
  max-width: 640px;
}

.analysis-card-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  max-width: 640px;
}

.analysis-metric-label {
  font-size: 12px;
  font-weight: 400;
  color: #94a3b8;
  text-transform: none;
  letter-spacing: normal;
}

.analysis-status {
  font-size: 14px;
  font-weight: 500;
  margin: 4px 0 8px;
}

.analysis-status--ok {
  color: #10B981;
}

.analysis-status--watch {
  color: #d97706;
}

.analysis-nutrient {
  font-size: 12px;
  font-weight: 400;
  color: #475569;
  margin-bottom: 4px;
  margin-top: 8px;
}

.analysis-bar {
  height: 4px;
  background: #f1f5f9;
  border-radius: 2px;
  overflow: hidden;
}

.analysis-bar-fill {
  height: 100%;
  background: #10B981;
  border-radius: 2px;
}

.analysis-bar-fill--watch {
  background: #d97706;
}

/* ---------- Dark panel skin ---------- */

.ln-panelcard {
  background: var(--stakes-bg);
  border: 1px solid rgba(215, 226, 217, 0.18);
  border-radius: 20px;
  padding: 28px;
}
.ln-panelcard .analysis-card-pair { max-width: none; grid-template-columns: 1fr; gap: 14px; }
.ln-panelcard .analysis-card {
  background: rgba(244, 240, 232, 0.05);
  border-color: rgba(215, 226, 217, 0.2);
  padding: 18px;
}
.ln-panelcard .analysis-metric-label,
.ln-panelcard .analysis-nutrient { color: var(--muted-sage); }
.ln-panelcard .analysis-bar { background: rgba(244, 240, 232, 0.16); }
.ln-panelcard__cap {
  margin: 18px 0 0;
  font-size: var(--fs-caption);
  color: var(--dark-secondary);
  text-align: center;
}