/* Client Sentiment card — the gauge, client tabs, signal chips and drill-down.
   Card chrome (.rc) comes from today.html; tokens from tokens.css. */

.cs-card .rc__hd{align-items:baseline}
.cs-src{margin-left:auto;font-size:11.5px;color:var(--ink-3);white-space:nowrap}

/* ── gauge ── */
.cs-gauge{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-top:12px}
.cs-gtop{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cs-gnum{font-size:38px;font-weight:750;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cs-gslash{font-size:13px;color:var(--ink-4)}
.cs-glab{font-size:14px;font-weight:700;color:var(--ink);margin-left:2px}
.cs-gtrend{margin-left:auto;font-size:12.5px;font-weight:600;white-space:nowrap}
.cs-up{color:var(--green)} .cs-dn{color:var(--red)} .cs-flat{color:var(--ink-4)}
.cs-gbar{position:relative;margin:12px 0 6px}
.cs-gtrack{display:flex;height:9px;border-radius:6px;overflow:hidden}
.cs-gtrack span{flex:1}
.cs-gmarker{position:absolute;top:-4px;transform:translateX(-50%)}
.cs-gmarker span{display:block;width:3px;height:17px;border-radius:2px;background:var(--ink);box-shadow:0 0 0 2px var(--surface-1)}
.cs-gends{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-3)}
.cs-gends span:nth-child(2){margin-right:8%}

/* ── expand toggle ── */
.cs-toggle{display:flex;align-items:center;gap:8px;width:100%;margin-top:14px;padding:9px 2px;
  background:none;border:none;border-top:1px solid var(--border);font:inherit;font-size:13px;font-weight:650;color:var(--ink);cursor:pointer}
.cs-chev{color:var(--ink-4);font-size:15px;width:12px;display:inline-block}
.cs-sum{margin-left:auto;display:flex;gap:14px;font-size:11.5px;font-weight:600;color:var(--ink-3)}
.cs-sum span{display:inline-flex;align-items:center;gap:5px}
.cs-sum .d{width:7px;height:7px;border-radius:50%}

/* ── client tabs ── */
.cs-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin:4px 0 12px;flex-wrap:wrap}
.cs-tab{background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;
  font:inherit;font-size:13px;font-weight:650;color:var(--ink-3);padding:9px 13px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.cs-tab:hover{color:var(--ink)}
.cs-ct{font-size:11px;font-weight:700;border-radius:20px;padding:1px 8px}

/* ── signal chips ── */
.cs-lensrow{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:7px}
.cs-lenslbl{font-size:11.5px;color:var(--ink-3);font-weight:600}
.cs-lens{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:11.5px;font-weight:600;
  padding:5px 11px;border:1px solid var(--border-2);border-radius:999px;background:var(--surface);color:var(--ink-2);cursor:pointer;white-space:nowrap}
.cs-lens:hover{background:var(--surface-1)}
.cs-lens.on{border-color:var(--ink);color:var(--ink)}
.cs-ld{width:7px;height:7px;border-radius:50%}
.cs-lc{color:var(--ink-3)}
.cs-lenscap{font-size:11.5px;color:var(--ink-3);margin-bottom:10px}

/* ── client rows ── */
.cs-row{display:flex;align-items:flex-start;gap:14px;padding:12px 12px;border:1px solid var(--border);
  border-radius:var(--radius);margin-bottom:8px;cursor:pointer;background:var(--surface)}
.cs-row:hover{background:var(--surface-1)}
.cs-row.is-open{border-color:var(--border-2);background:var(--surface-1)}
.cs-row:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cs-rowmain{flex:1;min-width:0}
.cs-nm{font-size:13.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.cs-read{font-size:12.5px;color:var(--ink-2);line-height:1.5;margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cs-row.is-open .cs-read{-webkit-line-clamp:unset;overflow:visible}
.cs-fault{display:flex;align-items:center;gap:7px;margin-top:6px;font-size:11px;color:var(--ink-3)}
.cs-bdg{font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px}
.cs-ftag{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:5px}
.cs-spark{flex:0 0 auto;display:flex;align-items:center}
.cs-score{flex:0 0 auto;font-size:20px;font-weight:750;font-variant-numeric:tabular-nums;min-width:52px;text-align:right}
.cs-trend{flex:0 0 auto;font-size:12px;font-weight:650;color:var(--ink-3);min-width:52px;text-align:right}

/* ── drill-down timeline ── */
.cs-drill{border:1px solid var(--border);border-top:none;border-radius:0 0 var(--radius) var(--radius);
  background:var(--surface-1);padding:12px 14px;margin:-8px 0 8px}
.cs-also{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:var(--ink-3);margin-bottom:10px}
.cs-ltag{font-size:10.5px;font-weight:700;border:1px solid currentColor;border-radius:5px;padding:1px 7px}
.cs-tl{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--border)}
.cs-tl:first-of-type{border-top:none}
.cs-tlic{flex:0 0 auto;font-size:13px;line-height:1.5}
.cs-tlbd{flex:1;min-width:0}
.cs-tltop{font-size:12px;color:var(--ink-2);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cs-tltop a{color:var(--accent);text-decoration:none;font-weight:600}
.cs-tldot{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.cs-tlr{font-size:12.5px;color:var(--ink-3);line-height:1.5;margin-top:2px}

.cs-empty{padding:18px 4px;text-align:center;color:var(--ink-4);font-size:12.5px}
.cs-updated{font-size:11px;color:var(--ink-4);margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}

@media (max-width:640px){ .cs-src{margin-left:0;white-space:normal} .cs-sum{display:none} }

/* ── Compliance Pipeline strip ── */
.cp-strip{display:flex;align-items:stretch;gap:6px;overflow-x:auto;padding-bottom:4px}
.cp-stage{flex:1 1 0;min-width:104px;border:1px solid var(--border);border-radius:11px;background:var(--surface-1);padding:11px 12px}
.cp-ph{font-size:9px;letter-spacing:.11em;text-transform:uppercase;font-weight:700}
.cp-stage[data-ph="pc"] .cp-ph{color:var(--green)}
.cp-stage[data-ph="qc"] .cp-ph{color:var(--violet)}
.cp-stage[data-ph="fp"] .cp-ph{color:var(--accent)}
.cp-sn{font-size:11.5px;color:var(--ink-3);margin-top:5px;line-height:1.25}
.cp-sc{font-size:22px;font-weight:750;margin-top:6px;font-variant-numeric:tabular-nums;color:var(--ink)}
.cp-stage.is-empty{opacity:.55}
.cp-stage.is-attn{border-color:rgba(199,126,11,.4);background:var(--amber-bg)}
.cp-stage.is-attn .cp-sc{color:var(--amber)}
.cp-div{width:1px;background:var(--border);margin:6px 4px;flex:0 0 auto}
.cp-arrow{display:flex;align-items:center;color:var(--ink-4);font-size:15px;flex:0 0 auto}

/* ── per-card freshness stamp ── */
.rc-upd{font-size:11px;color:var(--ink-4);margin-top:14px;padding-top:10px;border-top:1px solid var(--border)}
