/* Word Counter — workspace-specific styles (flagship Wave 1).
   Shared tokens and components come from the site stylesheet; only
   the live stats grid and the density-table layout that are unique
   to this workspace live here. Colours use the var(--color-…)
   tokens: navy #142B4A, blue #2563EB (hover #1D4ED8), teal #14B8A6
   fills only, teal text #0F766E, background #F8FAFC, surface #FFFFFF,
   text #334155, muted #64748B, border #E2E8F0, success #15803D,
   warning #B45309, error #B91C1C. */

.wc-stats {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, 1fr);
  margin: 24px 0;
}
@media (min-width: 768px) { .wc-stats { grid-template-columns: repeat(4, 1fr); } }

.wc-stat {
  background: var(--color-surface, #FFFFFF);
  border: 1px solid var(--color-border, #E2E8F0);
  border-radius: 12px;
  padding: 16px;
  display: flex; flex-direction: column; gap: 4px;
}

.wc-stat-value {
  color: var(--color-navy, #142B4A);
  font-size: 24px; font-weight: 700; line-height: 1.2;
  word-break: break-word;
}

.wc-stat-label {
  color: var(--color-muted, #64748B);
  font-size: 14px; line-height: 1.4;
}

#wc-workspace textarea {
  min-height: 46px;
  border-radius: 10px;
  color: var(--color-text, #334155);
}

.wc-density-grid { display: grid; gap: 16px; }
@media (min-width: 1024px) { .wc-density-grid { grid-template-columns: repeat(3, 1fr); } }

.wc-density-grid .table caption {
  caption-side: top;
  text-align: left;
  font-weight: 600;
  color: var(--color-teal-text, #0F766E);
  padding: 8px 0;
}

.wc-density-grid .table td:first-child { word-break: break-word; }

#wc-workspace .status-line.is-ok { color: var(--color-success, #15803D); }
#wc-workspace .status-line.is-error { color: var(--color-error, #B91C1C); }
