/* vendor_detail_view.css
 *
 * Lifted out of scripts/templates/viewer.html (the inline <style> at
 * the top of the #view-vendor section) so the customer dossier at
 * /dashboard/vendors/<id> can reuse it.
 *
 * Tokens: keeps the operator-viewer's --coa-* prefix to avoid
 * collision with the customer Tabler shell's --tl-* tokens. The
 * file ALSO defines fallbacks for --panel / --row-alt / --accent /
 * --muted at the :root scope for the customer surface (which
 * doesn't have these legacy globals; the operator viewer does).
 */

:root {
  /* Primary token namespace — referenced by every .vd-* selector. */
  --coa-gap:           14px;
  --coa-gap-sm:        8px;
  --coa-gap-lg:        22px;
  --coa-radius:        8px;
  --coa-radius-sm:     4px;
  --coa-surface:       #1a2d56;
  --coa-border:        rgba(218, 165, 32, 0.22);
  --coa-border-strong: rgba(218, 165, 32, 0.4);
  --coa-muted:         rgba(250, 250, 247, 0.55);
  --coa-text:          #FAFAF7;
  --coa-head:          rgba(255, 255, 255, 0.04);
  --coa-stripe:        rgba(255, 255, 255, 0.025);
}

/* Customer-surface fallbacks for the legacy `--panel` / `--row-alt` /
 * `--accent` / `--muted` vars used inline below. Operator viewer.html
 * defines these at :root already; the customer Tabler shell does not,
 * so without this block the customer dossier would render with empty
 * background colours on .vd-card / .vd-stat / .coa-tbl. We use @supports
 * (selector(:has)) as a no-cost wrapper so the fallback only applies
 * when the customer-dashboard wrapper is present (avoids leaking the
 * legacy var defaults into the operator viewer where the operator
 * `--panel` is expected to win). The operator viewer DOES define these
 * in its own :root, so its specificity wins anyway — this block is
 * defensive only. */
.tl-vendor-detail-customer-frame {
  /* T1-3 (2026-05-31): reconcile the dossier to the shell ladder — same card
     surface (#16264a) + radii (10/6px) as every other dashboard card, instead
     of the off-token #1a2d56 / 8px that read as "a second designer." Scoped to
     the customer frame so the operator viewer (its own :root) is untouched. */
  --panel:         var(--tl-navy-700, #16264a);
  --coa-surface:   var(--tl-navy-700, #16264a);
  --coa-radius:    var(--tl-radius-md, 10px);
  --coa-radius-sm: var(--tl-radius-sm, 6px);
  --row-alt:  rgba(255, 255, 255, 0.03);
  --accent:   #DAA520;
  --muted:    rgba(250, 250, 247, 0.6);
}

/* T1-2: kill the leaked LIGHT-THEME pastel flag boxes (#ffedd5 / #dbeafe /
   #dcfce7 on navy) — the loudest "unfinished" tell on the flagship Pro
   dossier. Scoped overrides keep the operator viewer's own treatment intact. */
.tl-vendor-detail-customer-frame .vd-flag.medium { background: rgba(245, 158, 11, 0.14); color: #fcd9a0; border-left-color: #ea580c; }
.tl-vendor-detail-customer-frame .vd-flag.info   { background: rgba(173, 189, 232, 0.14); color: var(--tl-info, #adbde8); border-left-color: var(--accent); }
.tl-vendor-detail-customer-frame .vd-flag-none   { background: rgba(74, 222, 128, 0.12); color: #86efac; }
/* Same lit-from-above material as the shell cards. */
.tl-vendor-detail-customer-frame .vd-card,
.tl-vendor-detail-customer-frame .vd-stat {
  box-shadow: var(--tl-shadow-sm, 0 1px 2px rgba(0,0,0,0.2)), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* ── Vendor detail layout ─────────────────────────────────────── */
.vd-crumb { font-size: 12px; color: var(--coa-muted); margin-bottom: var(--coa-gap); }
.vd-crumb a { color: var(--accent, #2563eb); cursor: pointer; text-decoration: none; }
.vd-crumb a:hover { text-decoration: underline; }

.vd-hero {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--coa-gap-lg);
  align-items: center;
  padding: 18px 22px;
  background: var(--panel);
  border: 1px solid var(--coa-border);
  border-radius: var(--coa-radius);
  margin-bottom: var(--coa-gap);
}
.vd-hero .badge {
  display: flex; flex-direction: column; align-items: center;
  min-width: 92px;
}
.vd-hero .badge .letter {
  display: inline-flex; align-items: center; justify-content: center;
  width: 72px; height: 72px; border-radius: 14px; font-size: 32px;
  font-weight: 700; color: white;
}
.vd-hero .badge .score { font-size: 18px; font-weight: 700; margin-top: 6px; }
.vd-hero .badge .lbl { font-size: 11px; color: var(--coa-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-top: 2px; }
.vd-hero .identity h1 { margin: 0; font-size: 24px; font-weight: 700; line-height: 1.15; }
.vd-hero .identity .meta { color: var(--coa-muted); font-size: 13px; margin-top: 6px; display: flex; gap: 14px; flex-wrap: wrap; }
.vd-hero .identity .meta a { color: var(--accent, #2563eb); text-decoration: none; }
.vd-hero .identity .meta a:hover { text-decoration: underline; }
.vd-hero .peer {
  text-align: right; font-size: 12px; color: var(--coa-muted);
}
.vd-hero .peer .rank { font-size: 20px; font-weight: 700; color: var(--coa-text); }

/* Quick stats strip — four even cells */
.vd-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--coa-gap-sm);
  margin-bottom: var(--coa-gap);
}
.vd-stat {
  background: var(--panel); border: 1px solid var(--coa-border); border-radius: var(--coa-radius);
  padding: 12px 14px;
}
.vd-stat .v { font-size: 20px; font-weight: 700; line-height: 1.1; }
.vd-stat .l { font-size: 11px; color: var(--coa-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-top: 4px; }
.vd-stat .sub { font-size: 11px; color: var(--coa-muted); margin-top: 2px; }

/* Grid for primary content — two columns on wide, single on narrow */
.vd-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--coa-gap);
  margin-bottom: var(--coa-gap);
}
@media (max-width: 1024px) {
  .vd-grid { grid-template-columns: 1fr; }
}

.vd-card {
  background: var(--panel); border: 1px solid var(--coa-border);
  border-radius: var(--coa-radius);
  padding: 14px 18px;
}
.vd-card h3 { margin: 0 0 10px 0; font-size: 14px; font-weight: 600; color: var(--coa-text); }
.vd-card .sub { font-size: 12px; color: var(--coa-muted); margin-top: -4px; margin-bottom: 10px; }

/* Component breakdown inside trust card */
.vd-comp-row { display: grid; grid-template-columns: 90px 30px 48px 1fr 54px; gap: 8px; align-items: center; padding: 5px 0; font-size: 12px; }
.vd-comp-row:not(:last-child) { border-bottom: 1px dashed var(--coa-border); }
.vd-comp-row .name { font-weight: 500; }
.vd-comp-row .weight { color: var(--coa-muted); font-size: 11px; text-align: right; }
.vd-comp-row .score-v { text-align: right; font-weight: 600; }
.vd-comp-row .bar { height: 6px; background: var(--row-alt); border-radius: 3px; overflow: hidden; }
.vd-comp-row .bar > span { display: block; height: 100%; }
.vd-comp-row .contrib { text-align: right; color: var(--coa-muted); font-size: 11px; }

/* Red flag list */
.vd-flag-list { display: flex; flex-direction: column; gap: 6px; }
.vd-flag { display: flex; gap: 8px; padding: 6px 10px; border-radius: var(--coa-radius-sm); font-size: 12px; border-left: 3px solid; }
.vd-flag.high { background: rgba(220, 38, 38, 0.18); color: #fca5a5; border-left-color: #dc2626; }
.vd-flag.medium { background: #ffedd5; color: #9a3412; border-left-color: #ea580c; }
.vd-flag.info { background: #dbeafe; color: #1e40af; border-left-color: var(--accent); }
.vd-flag strong { text-transform: uppercase; font-size: 10px; letter-spacing: 0.04em; margin-right: 4px; }
.vd-flag-none { color: #16a34a; padding: 8px; text-align: center; background: #dcfce7; border-radius: var(--coa-radius-sm); font-size: 12px; }

/* Grade comparison box */
.vd-gcompare { display: flex; gap: 8px; align-items: center; justify-content: center; padding: 10px; background: var(--coa-surface); border-radius: var(--coa-radius-sm); margin-top: var(--coa-gap-sm); }
.vd-gcompare .label { font-size: 10px; color: var(--coa-muted); text-transform: uppercase; }
.vd-gcompare .arrow { color: var(--coa-muted); font-weight: bold; }
.vd-gcompare.shifted .arrow { color: #ea580c; }

/* Data table (shared across vendor detail + list views) */
.coa-tbl { width: 100%; border-collapse: collapse; font-size: 12px; }
.coa-tbl th { text-align: left; padding: 8px 10px; background: var(--coa-head); border-bottom: 2px solid var(--coa-border-strong); font-size: 11px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--coa-muted); font-weight: 600; position: sticky; top: 0; z-index: 2; user-select: none; }
.coa-tbl th.sortable { cursor: pointer; white-space: nowrap; }
.coa-tbl th.sortable:hover { background: var(--coa-border); color: var(--coa-text); }
.coa-tbl th .sort-ind { margin-left: 4px; font-size: 10px; color: var(--accent, #2563eb); opacity: 0; }
.coa-tbl th.sorted .sort-ind { opacity: 1; }
.coa-tbl td { padding: 7px 10px; border-bottom: 1px solid var(--coa-border); vertical-align: middle; color: var(--coa-text); }
.coa-tbl tbody tr:nth-child(even) td { background: var(--coa-stripe); }
.coa-tbl tbody tr.clickable { cursor: pointer; transition: background 0.08s; }
.coa-tbl tbody tr.clickable:hover td { background: rgba(37, 99, 235, 0.06); }
.coa-tbl .num { text-align: right; font-variant-numeric: tabular-nums; font-family: monospace; font-size: 11.5px; }
.coa-tbl .ctr { text-align: center; }

/* Pagination strip */
.coa-pag { display: flex; justify-content: space-between; align-items: center; padding: 10px 4px; font-size: 12px; color: var(--coa-muted); gap: var(--coa-gap); }
.coa-pag .info { color: var(--coa-muted); }
.coa-pag .nav { display: flex; align-items: center; gap: 6px; }
.coa-pag button { background: var(--panel); border: 1px solid var(--coa-border); padding: 4px 10px; border-radius: var(--coa-radius-sm); cursor: pointer; font-size: 12px; color: var(--coa-text); }
.coa-pag button:hover:not(:disabled) { background: var(--coa-head); border-color: var(--coa-border-strong); }
.coa-pag button:disabled { opacity: 0.4; cursor: not-allowed; }
.coa-pag .size select { border: 1px solid var(--coa-border); padding: 3px 6px; border-radius: var(--coa-radius-sm); font-size: 12px; }
.coa-pag .pgn { font-variant-numeric: tabular-nums; min-width: 38px; text-align: center; font-weight: 600; color: var(--coa-text); }

/* ── Per-vendor alert/sentiment feed ──────────────────────────────
   Renders aggregated signals from intel_alerts + wallet_alerts +
   vendor_announcements + vendor_trust_meta + watchlist_alerts.
   The "scam warning" banner surfaces only when any feed item is
   severity=high (i.e. summary.any_high === true). */
.vd-alerts-feed { margin-bottom: var(--coa-gap); }
.vd-alerts-loading {
  padding: 14px 18px; background: var(--panel);
  border: 1px dashed var(--coa-border); border-radius: var(--coa-radius);
  font-size: 12px; color: var(--coa-muted); text-align: center;
}
.vd-alerts-error {
  padding: 10px 14px; background: rgba(220, 38, 38, 0.10);
  border: 1px solid rgba(220, 38, 38, 0.4); border-radius: var(--coa-radius-sm);
  font-size: 12px; color: #fca5a5;
}
.vd-alerts-empty {
  padding: 14px 18px; background: var(--panel);
  border: 1px solid var(--coa-border); border-radius: var(--coa-radius);
  font-size: 12px; color: #86efac; text-align: center;
}
.vd-scam-banner {
  background: rgba(220, 38, 38, 0.20);
  border: 2px solid #dc2626;
  border-radius: var(--coa-radius);
  padding: 14px 20px;
  margin-bottom: var(--coa-gap);
  display: flex; align-items: center; gap: 14px;
  animation: vd-scam-pulse 2.5s ease-in-out infinite;
}
@keyframes vd-scam-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4); }
  50% { box-shadow: 0 0 0 8px rgba(220, 38, 38, 0); }
}
.vd-scam-banner .icon { font-size: 28px; line-height: 1; flex-shrink: 0; }
.vd-scam-banner .body { flex: 1; }
.vd-scam-banner .title { font-size: 14px; font-weight: 700; color: #fca5a5; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 4px; }
.vd-scam-banner .sub { font-size: 12px; color: rgba(252, 165, 165, 0.85); }
.vd-warning-banner {
  background: rgba(234, 88, 12, 0.15);
  border: 1px solid rgba(234, 88, 12, 0.5);
  border-radius: var(--coa-radius);
  padding: 10px 16px;
  margin-bottom: var(--coa-gap);
  font-size: 12px;
  color: #fdba74;
}

.vd-feed-list { display: flex; flex-direction: column; gap: 6px; }
.vd-feed-item {
  background: var(--panel);
  border: 1px solid var(--coa-border);
  border-left-width: 4px;
  border-radius: var(--coa-radius-sm);
  padding: 10px 14px;
  font-size: 12px;
  cursor: pointer;
  transition: background 0.08s;
}
.vd-feed-item:hover { background: var(--coa-head); }
.vd-feed-item.high   { border-left-color: #dc2626; background: rgba(220, 38, 38, 0.08); }
.vd-feed-item.medium { border-left-color: #ea580c; background: rgba(234, 88, 12, 0.06); }
.vd-feed-item.low    { border-left-color: #ca8a04; }
.vd-feed-item.info   { border-left-color: var(--coa-border-strong); }
.vd-feed-row { display: flex; align-items: baseline; gap: 10px; }
.vd-feed-icon { font-size: 14px; flex-shrink: 0; width: 16px; text-align: center; color: var(--coa-text); }
.vd-feed-headline { flex: 1; font-weight: 500; color: var(--coa-text); }
.vd-feed-meta { font-size: 11px; color: var(--coa-muted); flex-shrink: 0; font-variant-numeric: tabular-nums; }
.vd-feed-detail {
  margin-top: 6px; padding-top: 6px; padding-left: 26px;
  border-top: 1px dashed var(--coa-border);
  font-size: 11px; color: var(--coa-muted); white-space: pre-wrap;
  display: none;
}
.vd-feed-item.expanded .vd-feed-detail { display: block; }

.vd-feed-summary {
  display: flex; gap: 12px; flex-wrap: wrap;
  font-size: 11px; color: var(--coa-muted); margin-top: 8px;
}
.vd-feed-summary .pill {
  padding: 2px 8px; border-radius: 10px;
  background: var(--coa-head); border: 1px solid var(--coa-border);
}
.vd-feed-summary .pill.high   { color: #fca5a5; border-color: rgba(220, 38, 38, 0.5); }
.vd-feed-summary .pill.medium { color: #fdba74; border-color: rgba(234, 88, 12, 0.5); }

/* ── Trend chart axis (used by SVG generated via coaTrendChart) ──── */
.coa-trend-axis { stroke: var(--coa-border); stroke-width: 1; }
.coa-trend-sparkline { fill: none; stroke: var(--accent, #DAA520); stroke-width: 1.6; }
.coa-trend-point { fill: var(--accent, #DAA520); }

/* ── Per-vendor paywall footer (Free tier customer surface) ─────── */
.vd-paywall-footer {
  margin-top: var(--coa-gap-sm);
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(218, 165, 32, 0.12), rgba(218, 165, 32, 0.04));
  border: 1px solid var(--coa-border-strong);
  border-radius: var(--coa-radius-sm);
  display: flex; flex-wrap: wrap; gap: 12px;
  align-items: center; justify-content: space-between;
}
.vd-paywall-copy { font-size: 13px; color: var(--coa-text); flex: 1 1 240px; }
.vd-paywall-cta {
  display: inline-block;
  background: var(--accent, #DAA520);
  color: #1a2d56;
  font-weight: 600;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: var(--coa-radius-sm);
  text-decoration: none;
  transition: filter 120ms;
}
.vd-paywall-cta:hover { filter: brightness(1.08); text-decoration: none; }

/* ── COA source badge (used by recent-tests Source column) ─────── */
.coa-src-badge {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 600;
  background: var(--coa-head);
  border: 1px solid var(--coa-border);
  color: var(--coa-text);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.coa-src-badge.lab       { background: rgba(16, 185, 129, 0.15); border-color: rgba(16, 185, 129, 0.4); color: #6ee7b7; }
.coa-src-badge.community { background: rgba(99, 102, 241, 0.15); border-color: rgba(99, 102, 241, 0.4); color: #a5b4fc; }
.coa-src-badge .kind { margin-left: 4px; opacity: 0.7; font-weight: 400; }

/* ── COA grade pill (also used by trust-card grade-shift) ────────── */
.coa-grade {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  color: white;
  font-weight: 700;
  font-size: 13px;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
}

/* ── Per-peptide → recent-tests filter (customer surface, 2026-05-12)
   ──────────────────────────────────────────────────────────────────
   Clicking a row in the Per-peptide breakdown table filters the
   Recent-tests table inline. The active row gets a gold highlight; a
   chip above the recent-tests table shows the filter + Clear button.
*/

/* Active per-peptide row — gold left border + soft gold tint so the
   row reads as "selected" even after the user sorts/pages the table.
   Uses the page's existing --accent token (resolves to --tl-gold via
   the .tl-vendor-detail-customer-frame fallback). */
#vd-peptides-tbl tbody tr.tl-peptide-row-active {
  background: rgba(218, 165, 32, 0.12);
  box-shadow: inset 3px 0 0 var(--accent, #DAA520);
}
#vd-peptides-tbl tbody tr.tl-peptide-row-active:hover {
  background: rgba(218, 165, 32, 0.18);
}

/* Filter chip — sits above the recent-tests table when a peptide is
   selected. Pill shape, gold-tinted, includes peptide name + count +
   close button. Inline-flex so it sizes to its content and doesn't
   stretch full-width of the card. */
.vd-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 var(--coa-gap-sm) 0;
  padding: 6px 6px 6px 12px;
  border-radius: 999px;
  background: rgba(218, 165, 32, 0.14);
  border: 1px solid var(--coa-border-strong);
  color: var(--coa-text);
  font-size: 12px;
  line-height: 1.4;
}
.vd-filter-chip-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.vd-filter-chip-icon { font-size: 13px; }
.vd-filter-chip-label strong {
  color: var(--accent, #DAA520);
  font-weight: 600;
}
.vd-filter-chip-count {
  font-variant-numeric: tabular-nums;
  color: var(--coa-muted);
  margin-left: 4px;
}
.vd-filter-chip-clear {
  display: inline-flex;
  align-items: center;
  background: var(--accent, #DAA520);
  color: #1a2d56;
  font-weight: 600;
  font-size: 11px;
  padding: 3px 10px;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: filter 120ms;
  font-family: inherit;
}
.vd-filter-chip-clear:hover { filter: brightness(1.08); }
.vd-filter-chip-clear:focus-visible {
  outline: 2px solid var(--accent, #DAA520);
  outline-offset: 2px;
}

/* ── Pulse-mentions section (2026-05-12) ──────────────────────────────
   Editorial pulse coverage cards — distinct semantic tier from the
   alerts feed above. Sits between the alerts feed and the per-peptide
   table. Card-style blocks (not bullets) — pulses deserve more visual
   weight than alert bullets. */

.vd-pulse-mentions { margin-bottom: var(--coa-gap); }

.vd-pulse-loading {
  padding: 14px 18px; background: var(--panel);
  border: 1px dashed var(--coa-border); border-radius: var(--coa-radius);
  font-size: 12px; color: var(--coa-muted); text-align: center;
}
.vd-pulse-error {
  padding: 10px 14px; background: rgba(220, 38, 38, 0.10);
  border: 1px solid rgba(220, 38, 38, 0.4); border-radius: var(--coa-radius-sm);
  font-size: 12px; color: #fca5a5;
}
.vd-pulse-empty {
  padding: 14px 18px; background: var(--panel);
  border: 1px solid var(--coa-border); border-radius: var(--coa-radius);
  font-size: 12px; color: #86efac; text-align: center;
}

.vd-pulse-header {
  margin-bottom: 10px;
  padding: 4px 2px;
}
.vd-pulse-title {
  margin: 0 0 2px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--coa-text);
  display: flex; align-items: center; gap: 8px;
}
.vd-pulse-sub {
  font-size: 12px; color: var(--coa-muted);
}

.vd-pulse-list {
  display: flex; flex-direction: column;
  gap: 10px;
}

.vd-pulse-card {
  background: var(--panel);
  border: 1px solid var(--coa-border);
  border-radius: var(--coa-radius);
  padding: 14px 16px;
  transition: background 0.08s, border-color 0.08s;
}
.vd-pulse-card[data-kind="lead_investigation"] {
  border-left: 3px solid #DAA520;
}
.vd-pulse-card[data-kind="notable_quote"] {
  border-left: 3px solid var(--coa-border-strong);
}
.vd-pulse-card[data-kind="top_vendors"] {
  border-left: 3px solid rgba(99, 102, 241, 0.4);
}
.vd-pulse-card-expandable {
  cursor: pointer;
}
.vd-pulse-card-expandable:hover {
  background: var(--coa-head);
  border-color: var(--coa-border-strong);
}

.vd-pulse-card-meta {
  display: flex; flex-wrap: wrap;
  align-items: center; gap: 8px;
  margin-bottom: 6px;
  font-size: 11px;
  color: var(--coa-muted);
}
.vd-pulse-date {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--coa-head);
  border: 1px solid var(--coa-border);
  color: var(--coa-text);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}
.vd-pulse-rank {
  margin-left: auto;
  color: var(--coa-muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.vd-pulse-chip {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 600;
  border: 1px solid var(--coa-border);
  background: var(--coa-head);
  color: var(--coa-text);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.vd-pulse-chip-gold {
  background: rgba(218, 165, 32, 0.18);
  border-color: rgba(218, 165, 32, 0.5);
  color: #facc15;
}
.vd-pulse-chip-blue {
  background: rgba(99, 102, 241, 0.16);
  border-color: rgba(99, 102, 241, 0.4);
  color: #a5b4fc;
}
.vd-pulse-chip-green {
  background: rgba(16, 185, 129, 0.16);
  border-color: rgba(16, 185, 129, 0.4);
  color: #6ee7b7;
}
.vd-pulse-chip-purple {
  background: rgba(168, 85, 247, 0.16);
  border-color: rgba(168, 85, 247, 0.4);
  color: #d8b4fe;
}
.vd-pulse-chip-neutral {
  background: var(--coa-head);
  border-color: var(--coa-border);
  color: var(--coa-text);
}
.vd-pulse-chip-outline {
  background: transparent;
  border-color: var(--coa-border-strong);
  color: var(--coa-muted);
}

.vd-pulse-headline {
  font-size: 14px;
  font-weight: 600;
  color: var(--coa-text);
  line-height: 1.35;
  margin-bottom: 4px;
}
.vd-pulse-body-excerpt {
  font-size: 12px;
  color: var(--coa-muted);
  line-height: 1.5;
  margin-bottom: 6px;
}
.vd-pulse-body-full {
  display: none;
  font-size: 12px;
  color: var(--coa-muted);
  line-height: 1.5;
  margin-bottom: 6px;
  padding: 6px 0 0;
  border-top: 1px dashed var(--coa-border);
  margin-top: 6px;
  white-space: pre-wrap;
}
.vd-pulse-card.expanded .vd-pulse-body-excerpt { display: none; }
.vd-pulse-card.expanded .vd-pulse-body-full { display: block; }

.vd-pulse-footer {
  display: flex; align-items: center; justify-content: flex-end;
  margin-top: 4px;
}
.vd-pulse-link {
  font-size: 11px;
  color: var(--accent, #DAA520);
  text-decoration: none;
  font-weight: 500;
}
.vd-pulse-link:hover {
  text-decoration: underline;
}