.cf-voices{
  --cfv-accent:#e58a24;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:.75rem;
  align-items:center;
  padding:1rem;
  background:#fbf7f1;
  border:1px solid rgba(0,0,0,.07);
  border-radius:12px;
  box-shadow: inset 0 0 12px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.08);
}
.cf-voices.is-compact{ grid-template-columns:auto 1fr; }
.cf-voices.is-compact .cfv-actions{ margin-top:.5rem; grid-column:1 / -1; }

.cfv-icon{
  width:64px; height:64px; border-radius:50%; object-fit:cover;
  border:2px solid var(--cfv-accent);
}
.cfv-meta{ display:flex; flex-direction:column; gap:.25rem; }
.cfv-name{ font-weight:700; line-height:1.1; color:#3b2a1a; }
.cfv-tag{ font-size:.92rem; opacity:.85; color:#3b2a1a; }
.cfv-link{ font-size:.82rem; text-decoration:underline; color:#3b2a1a; opacity:.8; }

.cfv-actions{ display:flex; align-items:center; gap:.5rem; }
.cfv-btn{
  appearance:none; border:1px solid rgba(0,0,0,.15); background:#fff;
  padding:.5rem .75rem; border-radius:999px; cursor:pointer;
}
.cfv-btn[aria-pressed="true"]{ background:var(--cfv-accent); color:#fff; border-color:var(--cfv-accent); }

.cfv-ring{ width:40px; height:40px; }
.cfv-ring-fill{
  stroke:var(--cfv-accent); stroke-width:4; fill:none; stroke-linecap:round;
  transform:rotate(-90deg); transform-origin:50% 50%;
}

@media (max-width: 600px){
  .cf-voices{ grid-template-columns:1fr; text-align:center; }
  .cfv-actions{ justify-content:center; }
  .cfv-icon{ margin:0 auto; }
}

/* Buttons: readable by default */
.cfv-btn{
  appearance:none;
  border:1px solid rgba(0,0,0,.15);
  background:#fff;
  color:#3b2a1a;           /* NEW: text visible on white */
  font-weight:600;         /* NEW: nicer contrast */
  padding:.5rem .75rem;
  border-radius:999px;
  cursor:pointer;
}
.cfv-btn:hover{ filter:brightness(0.98); }
.cfv-btn:focus-visible{
  outline:2px solid var(--cfv-accent);
  outline-offset:2px;
}

/* Active state stays as-is */
.cfv-btn[aria-pressed="true"]{
  background:var(--cfv-accent);
  color:#fff;
  border-color:var(--cfv-accent);
}

/* Compact tweaks (good for sidebar) */
.cf-voices.is-compact .cfv-icon{ width:56px; height:56px; }
.cf-voices.is-compact .cfv-ring{ width:28px; height:28px; }
