:root{
  --ccg-comic-cut-info: rgba(154,139,255,.90);
  --ccg-comic-cut-info-soft: rgba(154,139,255,.095);
  --ccg-specific-trading-card: rgba(255,214,120,.90);
  --ccg-specific-trading-card-soft: rgba(255,214,120,.082);
  --ccg-set-card-details: rgba(95,238,218,.84);
  --ccg-set-card-details-soft: rgba(95,238,218,.072);
  --ccg-comic-book-details: rgba(80,220,125,.88);
  --ccg-comic-book-details-soft: rgba(80,220,125,.072);
  --ccg-private-information: rgba(255,146,95,.86);
  --ccg-private-information-soft: rgba(255,146,95,.070);
  --ccg-image-details: rgba(120,170,255,.88);
  --ccg-image-details-soft: rgba(120,170,255,.074);
  --ccg-personal-information: rgba(210,203,255,.88);
  --ccg-personal-information-soft: rgba(210,203,255,.074);
}

/* Field-group colors follow the same Edit Card sections. */
.card .pill.ccg-comic-cut-info,
.card .more .kv.ccg-comic-cut-info,
.card .cc-highlight-row.ccg-comic-cut-info{ --ccg-accent: var(--ccg-comic-cut-info); --ccg-soft: var(--ccg-comic-cut-info-soft); }
.card .pill.ccg-specific-trading-card,
.card .more .kv.ccg-specific-trading-card,
.card .cc-highlight-row.ccg-specific-trading-card{ --ccg-accent: var(--ccg-specific-trading-card); --ccg-soft: var(--ccg-specific-trading-card-soft); }
.card .pill.ccg-set-card-details,
.card .more .kv.ccg-set-card-details,
.card .cc-highlight-row.ccg-set-card-details{ --ccg-accent: var(--ccg-set-card-details); --ccg-soft: var(--ccg-set-card-details-soft); }
.card .pill.ccg-comic-book-details,
.card .more .kv.ccg-comic-book-details,
.card .cc-highlight-row.ccg-comic-book-details{ --ccg-accent: var(--ccg-comic-book-details); --ccg-soft: var(--ccg-comic-book-details-soft); }
.card .pill.ccg-private-information,
.card .more .kv.ccg-private-information,
.card .cc-highlight-row.ccg-private-information{ --ccg-accent: var(--ccg-private-information); --ccg-soft: var(--ccg-private-information-soft); }
.card .pill.ccg-image-details,
.card .more .kv.ccg-image-details,
.card .cc-highlight-row.ccg-image-details{ --ccg-accent: var(--ccg-image-details); --ccg-soft: var(--ccg-image-details-soft); }
.card .pill.ccg-personal-information,
.card .more .kv.ccg-personal-information,
.card .cc-highlight-row.ccg-personal-information{ --ccg-accent: var(--ccg-personal-information); --ccg-soft: var(--ccg-personal-information-soft); }

.card .pill.ccg-comic-cut-info,
.card .pill.ccg-specific-trading-card,
.card .pill.ccg-set-card-details,
.card .pill.ccg-comic-book-details,
.card .pill.ccg-private-information,
.card .pill.ccg-image-details,
.card .pill.ccg-personal-information{
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 84px at 0% 0%, var(--ccg-soft, rgba(154,139,255,.075)), transparent 72%) !important;
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 42%, transparent) !important;
}
.card .pill.ccg-comic-cut-info label,
.card .pill.ccg-specific-trading-card label,
.card .pill.ccg-set-card-details label,
.card .pill.ccg-comic-book-details label,
.card .pill.ccg-private-information label,
.card .pill.ccg-image-details label,
.card .pill.ccg-personal-information label{
  color: color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 78%, rgba(255,255,255,.72)) !important;
}

/* Additional Information rows: color the label only, keep values readable. */
.card .more .kv.ccg-comic-cut-info .k,
.card .more .kv.ccg-specific-trading-card .k,
.card .more .kv.ccg-set-card-details .k,
.card .more .kv.ccg-comic-book-details .k,
.card .more .kv.ccg-private-information .k,
.card .more .kv.ccg-image-details .k,
.card .more .kv.ccg-personal-information .k{
  color: color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 76%, rgba(255,255,255,.68)) !important;
}
.card .more .kv .v{
  color: rgba(242,243,255,.96) !important;
}

/* Value Highlights: icon/title use the field-group color; results stay white. */
.card .cc-highlight-row.ccg-comic-cut-info .cc-highlight-icon,
.card .cc-highlight-row.ccg-comic-cut-info .cc-highlight-label,
.card .cc-highlight-row.ccg-specific-trading-card .cc-highlight-icon,
.card .cc-highlight-row.ccg-specific-trading-card .cc-highlight-label,
.card .cc-highlight-row.ccg-set-card-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-set-card-details .cc-highlight-label,
.card .cc-highlight-row.ccg-comic-book-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-comic-book-details .cc-highlight-label,
.card .cc-highlight-row.ccg-private-information .cc-highlight-icon,
.card .cc-highlight-row.ccg-private-information .cc-highlight-label,
.card .cc-highlight-row.ccg-image-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-image-details .cc-highlight-label,
.card .cc-highlight-row.ccg-personal-information .cc-highlight-icon,
.card .cc-highlight-row.ccg-personal-information .cc-highlight-label{
  color: var(--ccg-accent, rgba(154,139,255,.84)) !important;
}
.card .cc-highlight-row .cc-highlight-value,
.card .cc-highlight-age-of-book-series .cc-highlight-value,
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-value{
  color: rgba(242,243,255,.96) !important;
}

/* Keep owner pill hover-only highlight behavior intact. */
.card .pillgrid .pill.owner-pill{
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 84px at 0% 0%, var(--ccg-soft, rgba(154,139,255,.075)), transparent 72%) !important;
}
.card .pillgrid .pill.owner-pill:hover,
.card .pillgrid .pill.owner-pill:focus-visible{
  border-color: rgba(255,255,255,.60) !important;
  background: rgba(255,255,255,.08) !important;
}