/* ═══════════════════════════════════════
   KPI CARDS
═══════════════════════════════════════ */
.kpi-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 20px; }
.kpi-card {
  background: var(--bg2); border: 1px solid var(--line);
  border-radius: var(--radius2); padding: 18px;
  position: relative; overflow: hidden;
  transition: border-color 0.2s;
}
.kpi-card:hover { border-color: var(--line2); }
.kpi-label { font-size: 11px; color: var(--txt2); font-family: var(--mono); letter-spacing: 0.05em; margin-bottom: 10px; }
.kpi-value { font-size: 28px; font-weight: 700; letter-spacing: -0.05em; line-height: 1; margin-bottom: 8px; }
.kpi-change { display: flex; align-items: center; gap: 4px; font-size: 11px; }
.kpi-change.up { color: var(--green); }
.kpi-change.down { color: var(--red); }
.kpi-change.neutral { color: var(--txt3); }
.kpi-accent-bar { position: absolute; bottom: 0; left: 0; right: 0; height: 2px; opacity: 0.6; }
.kpi-spark { position: absolute; right: 12px; bottom: 14px; opacity: 0.15; }

/* ═══════════════════════════════════════
   ANALYTICS PAGE
═══════════════════════════════════════ */
.chart-wrap { position: relative; height: 200px; }
.chart-wrap.tall { height: 260px; }

/* ═══════════════════════════════════════
   WORD CLOUD / KEYWORD CHART
═══════════════════════════════════════ */
.keyword-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.keyword-chip {
  padding: 5px 12px; border-radius: 20px;
  font-size: 12px; font-weight: 500; cursor: default;
  transition: transform 0.15s;
}
.keyword-chip:hover { transform: scale(1.05); }

/* ═══════════════════════════════════════
   SCORE INDICATOR RING
═══════════════════════════════════════ */
.score-ring-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.score-ring-val { font-size: 28px; font-weight: 700; letter-spacing: -0.04em; }
.score-ring-lbl { font-size: 11px; color: var(--txt3); font-family: var(--mono); }