/* 260923-dash: closer portal design layer for DASHBOARD, MY WORK and MY NUMBERS.
 * Loaded LAST via <link> in index.html. Pure CSS over the existing render functions
 * (app.js hero/leaderboard, 260920-rjc Do Now + Red Zone + tab re-homing, selfset-progress.js,
 * closer-metrics.js, rep-intel.js). No JS, no markup change. Remove the <link> to roll back.
 *
 * Specificity note: 260920-rjc and selfset-progress inject <style> AFTER this file, so anything
 * they set with an ID selector is overridden here with TWO ids (#view-dashboard #x ...).
 * The rjc block order (inline style.order) and #riShowRatePanel{display:contents} are kept.
 */
:is(#view-dashboard, #view-my-work, #view-my-numbers) {
  --d-card: var(--card, #fff);
  --d-line: hsl(214 32% 91%);
  --d-line-soft: hsl(214 32% 94%);
  --d-ink: hsl(215 28% 17%);
  --d-ink-2: hsl(215 16% 47%);
  --d-ink-3: hsl(215 14% 62%);
  --d-tint: hsl(210 33% 97.5%);
  --d-accent: #155eef;
  --d-accent-soft: rgba(21, 94, 239, 0.08);
  --d-green: hsl(160 84% 36%);
  --d-green-soft: hsla(160 84% 39% / 0.10);
  --d-red: #e03e3e;
  --d-red-soft: rgba(224, 62, 62, 0.08);
  --d-amber: #d98a1e;
  --d-amber-soft: rgba(246, 173, 85, 0.16);
  --d-radius: 14px;
  --d-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.04);
  max-width: 1120px;
  font-variant-numeric: tabular-nums;
}
:is(#view-dashboard, #view-my-work, #view-my-numbers).active {
  display: flex; flex-direction: column; gap: 18px; padding: 24px 28px 40px;
}

/* ── shared card + header language ─────────────────────────────────────── */
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.cm-panel, .ri-panel, .hitlist-section),
#view-dashboard .dashboard-footer > section,
#view-dashboard #ssbPanel,
#view-dashboard #attentionRow.dn-panel {
  background: var(--d-card);
  border: 1px solid var(--d-line);
  border-radius: var(--d-radius);
  box-shadow: var(--d-shadow);
  padding: 0;
  margin: 0;
}
:is(#view-dashboard, #view-my-work, #view-my-numbers) #riShowRatePanel { display: contents; }
:is(#view-dashboard, #view-my-work, #view-my-numbers) #riShowRatePanel > .ri-panel:first-child { display: none; }
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(#cmPanel, #hitListPanel):empty { display: none; }

:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.cm-h, .ri-panel > h3, .hitlist-head, .dn-head, .ssb-head),
#view-dashboard .dashboard-footer > section > .section-header {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px;
  margin: 0;
  padding: 16px 20px 14px;
  border: 0; border-bottom: 1px solid var(--d-line-soft); border-image: none;
  font-size: 14px; font-weight: 700; letter-spacing: 0;
  text-transform: none;
  color: var(--d-ink);
  line-height: 1.3;
  background: none;
}
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.ri-panel > h3, .hitlist-head, .dn-head)::first-letter { text-transform: uppercase; }

/* chips */
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.cm-chip, .ri-chip, .rjc-chip, .chip-count, .ssb-rate) {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: none;
  padding: 3px 9px; border-radius: 999px; margin: 0; line-height: 1.2;
  background: var(--d-tint); color: var(--d-ink-2);
  border: 1px solid var(--d-line);
  white-space: nowrap;
}
:is(#view-dashboard, #view-my-work, #view-my-numbers) .ri-g { background: var(--d-green-soft); color: var(--d-green); border-color: hsla(160 84% 39% / 0.25); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .ri-r { background: var(--d-red-soft); color: var(--d-red); border-color: rgba(224, 62, 62, 0.22); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .ri-y { background: var(--d-amber-soft); color: var(--d-amber); border-color: rgba(217, 138, 30, 0.25); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .ri-b { background: var(--d-accent-soft); color: var(--d-accent); border-color: rgba(21, 94, 239, 0.22); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .cm-chip { background: var(--d-accent-soft); color: var(--d-accent); border-color: rgba(21, 94, 239, 0.18); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .cm-chip-y { background: var(--d-amber-soft); color: var(--d-amber); border-color: rgba(217, 138, 30, 0.25); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .cm-chip-g { background: var(--d-tint); color: var(--d-ink-2); border-color: var(--d-line); }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .rjc-chip { background: var(--d-green-soft); color: var(--d-green); border-color: hsla(160 84% 39% / 0.25); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
:is(#view-dashboard, #view-my-work, #view-my-numbers) .cm-range { font-size: 12px; font-weight: 500; color: var(--d-ink-3); margin-left: auto; }

/* footnotes + empties */
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.cm-note, .ri-note) {
  margin: 0; padding: 10px 20px 12px;
  font-size: 11.5px; line-height: 1.5; color: var(--d-ink-3);
  border-top: 1px solid var(--d-line-soft);
}
:is(#view-dashboard, #view-my-work, #view-my-numbers) :is(.cm-none, .ri-none, .hitlist-empty) {
  padding: 22px 20px; font-size: 13px; font-style: normal; text-align: left; color: var(--d-ink-2);
}

/* ── hero ───────────────────────────────────────────────────────────────── */
#view-dashboard .dashboard-hero.data-card {
  border-radius: var(--d-radius);
  border: 1px solid var(--d-line);
  box-shadow: var(--d-shadow);
  cursor: default;
  background: var(--d-card);
}
#view-dashboard .dashboard-hero.data-card::before { display: none; }
#view-dashboard .dashboard-hero.data-card:hover { transform: none; box-shadow: var(--d-shadow); border-color: var(--d-line); }
#view-dashboard .dh-strip { min-height: 96px; }
#view-dashboard .dh-strip .dh-identity {
  flex: 0 0 280px;
  padding: 18px 22px;
  gap: 14px;
  border-right: 1px solid var(--d-line-soft);
  background: linear-gradient(135deg, rgba(21, 94, 239, 0.07) 0%, rgba(21, 94, 239, 0) 65%);
}
#view-dashboard .dh-strip .dh-avatar-sm { width: 46px; height: 46px; font-size: 16px; font-weight: 700; box-shadow: 0 4px 12px rgba(21, 94, 239, 0.28); }
#view-dashboard .dh-strip .dh-name-block { gap: 5px; }
#view-dashboard .dh-strip .dh-name-text { font-size: 17px; font-weight: 700; letter-spacing: -0.01em; }
#view-dashboard .dh-strip .dh-name-block::after { content: 'Closer'; font-size: 11.5px; font-weight: 500; color: var(--d-ink-2); white-space: nowrap; }
#view-dashboard .dh-strip .dh-period-chip-sm { display: none; } /* period already in the top-bar dropdown */
#view-dashboard .dh-strip .dh-kpi { align-items: flex-start; gap: 6px; padding: 18px 22px; border-right: 1px solid var(--d-line-soft); }
#view-dashboard .dh-strip .dh-kpi-val { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; }
#view-dashboard .dh-strip .dh-kpi-val.dh-kpi-cash, #view-dashboard .dh-strip .dh-kpi-val.dh-kpi-paid { color: var(--d-green); }
#view-dashboard .dh-strip .dh-kpi-val.dh-kpi-pending { color: var(--d-amber); }
#view-dashboard .dh-strip .dh-kpi-val.dh-kpi-none { color: var(--d-ink-3); }
#view-dashboard .dh-strip .dh-kpi-lbl { font-size: 11px; letter-spacing: .06em; font-weight: 600; color: var(--d-ink-2); }

/* ── self-set bonus (selfset-progress.js) ───────────────────────────────── */
#view-dashboard #ssbPanel { padding: 0; }
#view-dashboard #ssbPanel .ssb-head { margin: 0; align-items: center; }
#view-dashboard #ssbPanel .ssb-title { font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--d-ink); }
#view-dashboard #ssbPanel .ssb-title::first-letter { text-transform: uppercase; }
#view-dashboard #ssbPanel .ssb-days { font-size: 12px; color: var(--d-ink-3); }
#view-dashboard #ssbPanel .ssb-main { padding: 18px 20px 0; align-items: center; gap: 8px 18px; }
#view-dashboard #ssbPanel .ssb-count { font-size: 30px; letter-spacing: -0.02em; }
#view-dashboard #ssbPanel .ssb-count small { font-size: 13px; font-weight: 600; color: var(--d-ink-2); }
#view-dashboard #ssbPanel .ssb-msg { font-size: 13.5px; font-weight: 500; color: var(--d-ink); }
#view-dashboard #ssbPanel .ssb-rate { font-size: 11px; }
#view-dashboard #ssbPanel .ssb-rate--on { background: var(--d-green-soft); color: var(--d-green); border-color: hsla(160 84% 39% / 0.3); }
#view-dashboard #ssbPanel .ssb-track { margin: 16px 20px 6px; }
#view-dashboard #ssbPanel .ssb-seg { height: 8px; background: var(--d-line); }
#view-dashboard #ssbPanel .ssb-seg--on { background: var(--d-accent); }
#view-dashboard #ssbPanel .ssb-seg--gold { background: var(--d-green); }
#view-dashboard #ssbPanel .ssb-labels { margin: 0 20px; font-size: 11px; color: var(--d-ink-2); }
#view-dashboard #ssbPanel .ssb-foot { margin: 14px 0 0; padding: 12px 20px; border-top: 1px solid var(--d-line-soft); font-size: 12px; color: var(--d-ink-2); }
#view-dashboard #ssbPanel .ssb-deals { margin: 0; padding: 0 20px 14px; }
#view-dashboard #ssbPanel .ssb-chip { font-size: 11px; background: var(--d-tint); }
#view-dashboard #ssbPanel .ssb-foot + .ssb-deals { margin-top: -2px; }

/* ── Do Now (260920-rjc paints #attentionRow as .dn-panel) ──────────────── */
#view-dashboard #attentionRow.dn-panel { gap: 0; margin: 0; }
#view-dashboard #attentionRow.dn-panel .dn-head { color: var(--d-ink); }
#view-dashboard #attentionRow.dn-panel .dn-head::after {
  content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--d-red);
  box-shadow: 0 0 0 3px var(--d-red-soft); margin-left: 2px;
}
#view-dashboard #attentionRow.dn-panel .dn-row {
  border: 0; border-top: 1px solid var(--d-line-soft); border-radius: 0;
  padding: 12px 20px; gap: 14px; background: var(--d-card);
  transition: background 120ms ease;
}
#view-dashboard #attentionRow.dn-panel .dn-head + .dn-row { border-top: 0; }
#view-dashboard #attentionRow.dn-panel .dn-row:last-child { border-radius: 0 0 var(--d-radius) var(--d-radius); }
#view-dashboard #attentionRow.dn-panel .dn-row[role="button"]:hover { background: var(--d-tint); border-color: var(--d-line-soft); }
#view-dashboard #attentionRow.dn-panel .dn-row.urgent { background: rgba(224, 62, 62, 0.035); }
#view-dashboard #attentionRow.dn-panel .dn-row.urgent:hover { background: rgba(224, 62, 62, 0.07); }
#view-dashboard #attentionRow.dn-panel .dn-row.urgent::before {
  content: ''; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 999px; background: var(--d-red);
}
#view-dashboard #attentionRow.dn-panel .dn-text { font-size: 13.5px; }
#view-dashboard #attentionRow.dn-panel .dn-sub { font-size: 12px; color: var(--d-ink-2); margin-left: 6px; }
#view-dashboard #attentionRow.dn-panel .dn-act {
  height: 30px; padding: 0 14px; border-radius: 8px; font-size: 12px; font-weight: 700;
  background: var(--d-red); color: #fff; transition: filter 120ms ease;
}
#view-dashboard #attentionRow.dn-panel .dn-act:hover { filter: brightness(0.92); }
#view-dashboard #attentionRow.dn-panel .dn-clear {
  padding: 14px 20px; font-size: 13px; font-weight: 600; color: var(--d-green);
}
#view-dashboard #attentionRow.dn-panel:has(.dn-clear) { margin: 0; gap: 0; }

/* ── Leaderboard (headline on the closer dashboard; outranks rjc-style) ─── */
#view-dashboard .dashboard-footer { margin: 0; }
#view-dashboard .dashboard-footer > section > .section-header { margin: 0; font-size: 14px; letter-spacing: 0; }
#view-dashboard .dashboard-footer > section > .section-header::first-letter { text-transform: uppercase; }
#view-dashboard #leaderboardGrid { padding: 20px 20px 16px; }
#view-dashboard #leaderboardGrid .lb-podium { grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: stretch; margin-bottom: 14px; }
#view-dashboard #leaderboardGrid .lb-card {
  border: 1px solid var(--d-line);
  border-radius: 12px;
  background: var(--d-card);
  box-shadow: none;
  padding: 22px 20px 20px;
  gap: 4px;
  transform: none;
  align-items: flex-start; text-align: left;
  position: relative; overflow: hidden;
}
#view-dashboard #leaderboardGrid .lb-card::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px; }
#view-dashboard #leaderboardGrid .lb-card-1::before { background: linear-gradient(90deg, #f3b73f, #f6ad55); }
#view-dashboard #leaderboardGrid .lb-card-2::before { background: linear-gradient(90deg, #9aa5b5, #c3cbd6); }
#view-dashboard #leaderboardGrid .lb-card-3::before { background: linear-gradient(90deg, #b8702e, #cd8c4c); }
#view-dashboard #leaderboardGrid .lb-card.is-me { outline: none; border-color: rgba(21, 94, 239, 0.45); box-shadow: 0 0 0 3px var(--d-accent-soft); }
#view-dashboard #leaderboardGrid .lb-medal { font-size: 0; line-height: 0; height: 32px; width: 32px; border-radius: 999px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
#view-dashboard #leaderboardGrid .lb-medal::before { font-size: 14px; font-weight: 800; line-height: 1; }
#view-dashboard #leaderboardGrid .lb-card-1 .lb-medal { font-size: 0; background: #fbe9c4; color: #8a5a06; }
#view-dashboard #leaderboardGrid .lb-card-2 .lb-medal { background: #e8ecf1; color: #4b5563; }
#view-dashboard #leaderboardGrid .lb-card-3 .lb-medal { background: #f4dfcb; color: #7c4413; }
#view-dashboard #leaderboardGrid .lb-card-1 .lb-medal::before { content: '1'; }
#view-dashboard #leaderboardGrid .lb-card-2 .lb-medal::before { content: '2'; }
#view-dashboard #leaderboardGrid .lb-card-3 .lb-medal::before { content: '3'; }
#view-dashboard #leaderboardGrid .lb-name { font-size: 16px; font-weight: 700; color: var(--d-ink); }
#view-dashboard #leaderboardGrid .lb-card-1 .lb-name { font-size: 17px; }
#view-dashboard #leaderboardGrid .lb-you-pill { position: absolute; top: 20px; right: 18px; font-size: 10px; letter-spacing: .06em; padding: 3px 8px; background: var(--d-accent); color: #fff; }
#view-dashboard #leaderboardGrid .lb-cash { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; color: var(--d-green); margin-top: 8px; }
#view-dashboard #leaderboardGrid .lb-card-1 .lb-cash { font-size: 38px; }
#view-dashboard #leaderboardGrid .lb-deals { font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--d-ink-2); }
#view-dashboard #leaderboardGrid .lb-rest { gap: 0; border: 1px solid var(--d-line); border-radius: 12px; overflow: hidden; }
#view-dashboard #leaderboardGrid .lb-rest .lb-row {
  grid-template-columns: 40px minmax(0, 1fr) auto auto;
  gap: 14px; padding: 12px 16px;
  border: 0; border-top: 1px solid var(--d-line-soft); border-radius: 0;
  background: var(--d-card); font-size: 13px;
}
#view-dashboard #leaderboardGrid .lb-rest .lb-row:first-child { border-top: 0; }
#view-dashboard #leaderboardGrid .lb-rest .lb-row.is-me { background: var(--d-accent-soft); }
#view-dashboard #leaderboardGrid .lb-rank { font-size: 12px; font-weight: 700; color: var(--d-ink-3); }
#view-dashboard #leaderboardGrid .lb-row-name { font-weight: 600; color: var(--d-ink); }
#view-dashboard #leaderboardGrid .lb-row .lb-you-pill { position: static; }
#view-dashboard #leaderboardGrid .lb-row-cash { color: var(--d-green); font-weight: 700; font-size: 14px; }
#view-dashboard #leaderboardGrid .lb-row-deals { font-size: 12px; color: var(--d-ink-2); min-width: 70px; }
#view-dashboard #leaderboardGrid .lb-empty { padding: 28px 20px; color: var(--d-ink-2); }

/* ── MY NUMBERS (closer-metrics.js) ─────────────────────────────────────── */
#view-my-numbers .cm-tiles, #view-my-numbers .cm-tiles2 { gap: 0; padding: 0; border-bottom: 1px solid var(--d-line-soft); }
#view-my-numbers .cm-tile { border: 0; border-right: 1px solid var(--d-line-soft); border-radius: 0; padding: 18px 20px 16px; gap: 6px; }
#view-my-numbers :is(.cm-tiles, .cm-tiles2) > .cm-tile:last-child { border-right: 0; }
#view-my-numbers .cm-lbl { font-size: 11px; letter-spacing: .06em; font-weight: 600; color: var(--d-ink-2); }
#view-my-numbers .cm-big { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; color: var(--d-ink); }
#view-my-numbers .cm-mid { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; color: var(--d-ink); }
#view-my-numbers .cm-sub { font-size: 12px; line-height: 1.45; color: var(--d-ink-2); }
#view-my-numbers .cm-warn { color: var(--d-amber); font-weight: 600; }
#view-my-numbers .cm-team { margin-top: auto; padding-top: 10px; font-size: 12px; color: var(--d-ink-2); display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
#view-my-numbers :is(.cm-up, .cm-down) { display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 999px; }
#view-my-numbers .cm-up { color: var(--d-green); background: var(--d-green-soft); }
#view-my-numbers .cm-down { color: var(--d-red); background: var(--d-red-soft); }
#view-my-numbers .cm-sec { margin: 0; padding: 0; border-top: 0; }
#view-my-numbers .cm-sec-h {
  margin: 0; padding: 14px 20px 12px; gap: 8px;
  font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--d-ink-2);
  border-top: 1px solid var(--d-line-soft); background: var(--d-tint);
}
#view-my-numbers .cm-sec .cm-tiles2 { border-top: 1px solid var(--d-line-soft); }
#view-my-numbers .cm-panel > .cm-note { border-top: 0; }
#view-my-numbers .cm-sec > .cm-note:last-child { border-top: 1px solid var(--d-line-soft); }
#view-my-numbers .cm-sec > .cm-note:empty { display: none; }
/* shows missing the offer answer */
#view-my-numbers .cm-grp-h {
  margin: 0; padding: 12px 20px 6px;
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--d-ink-2);
  border-top: 1px solid var(--d-line-soft);
}
#view-my-numbers .cm-sec-h + .cm-grp-h { border-top: 1px solid var(--d-line-soft); }
#view-my-numbers .cm-list { max-height: 300px; }
#view-my-numbers .cm-li {
  flex-wrap: nowrap; gap: 8px 16px; padding: 10px 20px;
  border-top: 1px solid var(--d-line-soft); font-size: 13px; color: var(--d-ink);
  transition: background 120ms ease;
}
#view-my-numbers .cm-li:first-child { border-top: 0; }
#view-my-numbers .cm-li:hover { background: var(--d-tint); }
#view-my-numbers .cm-when { flex: 0 0 124px; min-width: 0; font-weight: 600; font-size: 12.5px; color: var(--d-ink); }
#view-my-numbers .cm-who { flex: 1 1 auto; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#view-my-numbers .cm-who .cm-sub { font-size: 12px; }
#view-my-numbers .cm-fill {
  flex: 0 0 auto; height: 30px; padding: 0 12px; border-radius: 8px; font-size: 12px; font-weight: 600;
  transition: filter 120ms ease, background 120ms ease;
}
#view-my-numbers .cm-fill:hover:not([disabled]) { filter: brightness(0.94); }
#view-my-numbers .cm-fill[data-mode="edit"] { background: var(--d-card); }
#view-my-numbers .cm-fill[data-mode="edit"]:hover:not([disabled]) { background: var(--d-accent-soft); }

/* ── MY WORK: upcoming calls + no-shows (rep-intel.js) ──────────────────── */
#view-my-work .ri-list { display: flex; flex-direction: column; padding: 4px 0; }
#view-my-work .ri-li {
  display: flex; flex-wrap: nowrap; align-items: center; gap: 8px 16px;
  padding: 11px 20px; border-top: 1px solid var(--d-line-soft);
  font-size: 13px; color: var(--d-ink); transition: background 120ms ease;
}
#view-my-work .ri-li:first-child { border-top: 0; }
#view-my-work .ri-li:hover { background: var(--d-tint); }
#view-my-work .ri-when { flex: 0 0 124px; min-width: 0; font-weight: 600; font-size: 12.5px; color: var(--d-ink); }
#view-my-work .ri-who { flex: 1 1 auto; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#view-my-work .ri-who .ri-sub { font-weight: 400; font-size: 12px; color: var(--d-ink-2); }
#view-my-work .ri-li > .ri-chip { flex: 0 0 auto; }
#view-my-work .ri-li > .ri-chip + .ri-chip { margin-left: -8px; }
#view-my-work .ri-li > a {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 12px; border: 1px solid var(--d-line); border-radius: 8px;
  background: var(--d-card); color: var(--d-ink) !important;
  font-size: 12px; font-weight: 600; line-height: 1; text-decoration: none;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
#view-my-work .ri-li > a:is([href^="tel:"], [href*="/conversations/"], [href*="/contacts/detail/"]) { font-size: 0; }
#view-my-work .ri-li > a:is([href^="tel:"], [href*="/conversations/"], [href*="/contacts/detail/"])::before {
  content: ''; width: 14px; height: 14px; flex: 0 0 14px; background: currentColor;
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
#view-my-work .ri-li > a::after { font-size: 12px; }
#view-my-work .ri-li > a[href^="tel:"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
#view-my-work .ri-li > a[href^="tel:"]::after { content: 'Call'; }
#view-my-work .ri-li > a[href*="/conversations/"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E"); }
#view-my-work .ri-li > a[href*="/conversations/"]::after { content: 'Text'; }
#view-my-work .ri-li > a[href*="/contacts/detail/"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E"); }
#view-my-work .ri-li > a[href*="/contacts/detail/"]::after { content: 'GHL'; }
#view-my-work .ri-li > a:hover { background: var(--d-accent); border-color: var(--d-accent); color: #fff !important; }
#view-my-work .ri-li > a[href^="tel:"]:hover { background: var(--d-green); border-color: var(--d-green); }
#view-my-work .ri-li > a + a { margin-left: -8px; }

/* ── MY WORK: Red Zone (260920-rjc renderHitList) ───────────────────────── */
#view-my-work #hitListPanel { display: flex; flex-direction: column; gap: 10px; }
#view-my-work #hitListPanel .hitlist-grid { display: block; margin: 0; padding: 0; overflow: visible; }
#view-my-work #hitListPanel .hitlist-section { width: auto; flex-basis: auto; max-width: none; padding: 0; }
#view-my-work #hitListPanel .hitlist-head { justify-content: flex-start; }
#view-my-work #hitListPanel .hitlist-head .chip-count { margin: 0; }
#view-my-work #hitListPanel .hitlist-rows { max-height: 360px; gap: 0; padding: 4px 0; }
#view-my-work #hitListPanel .hitlist-row {
  gap: 14px; padding: 10px 20px; border-radius: 0; border-top: 1px solid var(--d-line-soft);
  transition: background 120ms ease;
}
#view-my-work #hitListPanel .hitlist-row:first-child { border-top: 0; }
#view-my-work #hitListPanel .hitlist-row:hover { background: var(--d-tint); }
#view-my-work #hitListPanel .hitlist-row.overdue { background: rgba(224, 62, 62, 0.035); }
#view-my-work #hitListPanel .hitlist-row.overdue:hover { background: rgba(224, 62, 62, 0.07); }
#view-my-work #hitListPanel .hitlist-name { font-size: 13px; font-weight: 600; color: var(--d-ink); }
#view-my-work #hitListPanel a.hitlist-name:hover { color: var(--d-accent); text-decoration: none; }
#view-my-work #hitListPanel .hitlist-value { font-size: 13px; color: var(--d-green); }
#view-my-work #hitListPanel .hitlist-daychip { font-size: 11px; padding: 3px 9px; background: var(--d-tint); border-color: var(--d-line); color: var(--d-ink-2); }
#view-my-work #hitListPanel .hitlist-daychip.overdue { background: var(--d-red-soft); border-color: rgba(224, 62, 62, 0.3); color: var(--d-red); }
#view-my-work #hitListPanel .hitlist-samplebar { margin: 0; padding: 8px 12px; border-radius: 10px; border: 1px dashed rgba(217, 138, 30, 0.5); color: var(--d-amber); font-size: 11px; letter-spacing: .04em; }
#view-my-work #hitListPanel .rjc-more { margin: 0; padding: 0 4px; font-size: 12.5px; }

/* ── responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  :is(#view-dashboard, #view-my-work, #view-my-numbers).active { padding: 14px 12px 32px; gap: 14px; }
  #view-dashboard .dh-strip .dh-identity { flex: none; border-right: 0; border-bottom: 1px solid var(--d-line-soft); }
  #view-dashboard .dh-strip .dh-kpi { padding: 14px 16px; }
  #view-dashboard .dh-strip .dh-kpi-val { font-size: 24px; }
  #view-my-numbers .cm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-my-numbers .cm-tiles > .cm-tile:nth-child(2n) { border-right: 0; }
  #view-my-numbers .cm-tiles > .cm-tile:nth-child(-n+2) { border-bottom: 1px solid var(--d-line-soft); }
  :is(#view-my-work .ri-li, #view-my-numbers .cm-li) { flex-wrap: wrap; padding: 12px 16px; gap: 8px 10px; }
  :is(#view-my-work .ri-when, #view-my-numbers .cm-when) { flex: 1 1 100%; font-size: 12px; color: var(--d-ink-2); }
  :is(#view-my-work .ri-who, #view-my-numbers .cm-who) { flex: 1 1 100%; white-space: normal; }
  #view-my-work .ri-li > a + a { margin-left: 0; }
  #view-dashboard #leaderboardGrid .lb-podium { grid-template-columns: 1fr; }
  #view-dashboard #leaderboardGrid .lb-card-1 .lb-cash { font-size: 32px; }
  #view-dashboard #leaderboardGrid { padding: 14px 14px 10px; }
  #view-dashboard #ssbPanel .ssb-days { margin-left: 0; width: 100%; }
}
@media (max-width: 520px) {
  #view-my-numbers .cm-tiles, #view-my-numbers .cm-tiles2 { grid-template-columns: 1fr; }
  #view-my-numbers .cm-tile { border-right: 0 !important; border-bottom: 1px solid var(--d-line-soft); }
  #view-my-numbers :is(.cm-tiles, .cm-tiles2) > .cm-tile:last-child { border-bottom: 0; }
}