/**
 * /crypto/all-coins â€” Crypto Discovery Hub sections (scoped).
 */

.crypto-discovery-hub .crypto-discovery-block {
  margin-bottom: 1.75rem;
}

/* â”€â”€ Page hero + section tabs (overview-style, scoped) â”€â”€ */
.crypto-discovery-hub .cdh-page-hero {
  padding-top: 1.5rem;
  padding-bottom: 0.5rem;
  text-align: center;
}

.crypto-discovery-hub .cdh-page-title {
  font-size: clamp(2rem, 3.6vw, 3.375rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0;
  margin: 0;
  color: var(--zs-text-primary);
}

.crypto-discovery-hub .cdh-page-subtitle {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.65);
  max-width: 45rem;
  margin: 0.75rem auto 0;
}

.crypto-discovery-hub.page-ltr .cdh-page-hero,
.crypto-discovery-hub.page-ltr .cdh-page-title,
.crypto-discovery-hub.page-ltr .cdh-page-subtitle {
  text-align: center;
}

.crypto-discovery-hub .cdh-section-tabs {
  position: relative;
  margin-top: 1.5rem;
  margin-bottom: 2rem;
  height: 60px;
  min-height: 58px;
  max-height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: clamp(1.25rem, 4vw, 4.5rem);
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
  border-bottom: 1px solid rgba(255, 255, 255, 0.055);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  max-width: 100%;
}

.crypto-discovery-hub .cdh-section-tabs::-webkit-scrollbar {
  display: none;
}

.crypto-discovery-hub .cdh-section-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  cursor: pointer;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.15;
  color: rgba(255, 255, 255, 0.72);
  transition: color 160ms ease;
}

.crypto-discovery-hub .cdh-section-tab:hover {
  color: rgba(255, 255, 255, 0.92);
}

.crypto-discovery-hub .cdh-section-tab--active,
.crypto-discovery-hub .cdh-section-tab--active:hover {
  color: #8cff5a;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.crypto-discovery-hub .cdh-section-tab::after {
  content: none;
}

.crypto-discovery-hub .cdh-section-tab--active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: #8cff5a;
  border-radius: 1px;
}

.crypto-discovery-hub .cdh-section-tab:focus {
  outline: none;
}

.crypto-discovery-hub .cdh-section-tab:focus-visible {
  outline: 2px solid rgba(140, 255, 90, 0.45);
  outline-offset: 2px;
}

html.light .crypto-discovery-hub .cdh-page-subtitle,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-page-subtitle {
  color: rgba(15, 23, 42, 0.62);
}

html.light .crypto-discovery-hub .cdh-section-tabs,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tabs {
  border-top-color: rgba(15, 23, 42, 0.08);
  border-bottom-color: rgba(15, 23, 42, 0.08);
}

html.light .crypto-discovery-hub .cdh-section-tab,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tab {
  color: rgba(15, 23, 42, 0.72);
}

html.light .crypto-discovery-hub .cdh-section-tab:hover,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tab:hover {
  color: rgba(15, 23, 42, 0.92);
}

html.light .crypto-discovery-hub .cdh-section-tab--active,
html.light .crypto-discovery-hub .cdh-section-tab--active:hover,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tab--active,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tab--active:hover {
  color: var(--zs-green-primary, #18c37e);
}

html.light .crypto-discovery-hub .cdh-section-tab--active::after,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section-tab--active::after {
  background: var(--zs-green-primary, #18c37e);
}

@media (max-width: 767px) {
  .crypto-discovery-hub .cdh-section-tabs {
    justify-content: flex-start;
    padding-inline: 0.25rem;
    gap: 1.75rem;
  }

  .crypto-discovery-hub .cdh-section-tab {
    font-size: 0.9375rem;
  }
}

.cdh-section {
  padding: 1.25rem 1rem;
  border-radius: 0.85rem;
  background: var(--zs-surface-1, rgba(12, 16, 14, 0.92));
  box-shadow: var(--crypto-card-shadow, 0 1px 0 rgba(255, 255, 255, 0.04));
}

.cdh-section-head {
  margin-bottom: 1rem;
}

.cdh-section-head--row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.cdh-section-title {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--zs-text-primary);
  letter-spacing: -0.02em;
  margin: 0 0 0.35rem;
}

.cdh-section-sub {
  font-size: 0.8rem;
  color: var(--zs-text-secondary);
  margin: 0;
  line-height: 1.5;
}

.cdh-text-btn {
  border: 1px solid var(--zs-border-mid, rgba(255, 255, 255, 0.08));
  background: var(--zs-surface-2, rgba(255, 255, 255, 0.04));
  color: var(--zs-green-primary, #18c37e);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, border-color 0.15s;
}

.cdh-text-btn:hover {
  background: var(--zs-green-soft, rgba(24, 195, 126, 0.12));
  border-color: var(--zs-green-primary, #18c37e);
}

/* â”€â”€ ZeroSpread Brand Design System (csd-*) â”€â”€ */
.csd-dashboard {
  font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
  font-synthesis: none;
  text-rendering: geometricPrecision;
  --zs-accent: var(--zs-green-primary, #a3ff12);
  --zs-accent-soft: color-mix(in srgb, var(--zs-green-primary, #a3ff12) 12%, transparent);
  --zs-accent-line: color-mix(in srgb, var(--zs-green-primary, #a3ff12) 35%, transparent);
  --zs-negative: var(--zs-red, #ef4444);
  --zs-negative-soft: color-mix(in srgb, var(--zs-red, #ef4444) 12%, transparent);

  --csd-bg: #050505;
  --csd-bg-veil: #090909;
  --csd-surface: #0b0b0b;
  --csd-surface-mid: #0b0b0b;
  --csd-surface-high: #101010;
  --csd-card: #0b0b0b;
  --csd-elevated: #101010;

  --csd-text: #f4f4f5;
  --csd-text-soft: #9a9a9f;
  --csd-muted: #666a73;
  --csd-desc: #9a9a9f;
  --csd-positive: var(--zs-success, #18c37e);
  --csd-up: var(--csd-positive);
  --csd-down: var(--zs-red, #ef4444);

  --csd-radius: 14px;
  --csd-radius-sm: 10px;
  --csd-border: rgba(255, 255, 255, 0.055);
  --csd-highlight: rgba(255, 255, 255, 0.05);
  --csd-highlight-soft: rgba(255, 255, 255, 0.025);

  --csd-shadow-ambient: none;
  --csd-shadow-elevated: none;
  --csd-shadow-inner: none;
  --csd-shadow-well: none;
  --csd-shadow: none;

  --csd-coins-cols: 48px minmax(200px, 1.2fr) minmax(120px, 1fr) minmax(110px, 0.9fr) minmax(140px, 1fr);
  --csd-gradient-surface: linear-gradient(
    168deg,
    var(--csd-surface-high) 0%,
    var(--csd-surface) 48%,
    var(--csd-bg-veil) 100%
  );
  --csd-gradient-hero: linear-gradient(
    155deg,
    rgba(26, 26, 34, 0.95) 0%,
    rgba(15, 15, 19, 0.98) 55%,
    rgba(10, 10, 13, 1) 100%
  );

  /* Type scale â€” Heading 18/700 Â· Subheading 13/500 Â· Label 12 Â· Metric 36 */
  --csd-type-lh: 1.35;
  --csd-type-ls: 0;

  /* Vertical rhythm â€” 8 / 16 / 24 / 32 / 40 / 48 / 64 */
  --csd-space-1: 8px;
  --csd-space-2: 16px;
  --csd-space-3: 24px;
  --csd-space-4: 32px;
  --csd-space-5: 40px;
  --csd-space-6: 48px;
  --csd-space-7: 64px;

  width: 100%;
  max-width: 1600px;
  margin-inline: auto;
  min-width: 0;
  overflow-x: clip;
  padding-inline: var(--csd-space-4);
  background: var(--csd-bg);
  color: var(--csd-text);
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .csd-dashboard {
    padding-inline: var(--csd-space-2);
  }
}

/* Institutional surfaces â€” spacing over boxes */
.csd-comp-pill,
.csd-treemap-cell {
  background: var(--csd-surface);
  border: 1px solid rgba(255, 255, 255, 0.04);
}

.cdh-section-switcher {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  width: 100%;
  margin: 0 0 16px;
  padding: 0;
  min-height: 36px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  box-sizing: border-box;
}

.cdh-section-switcher::-webkit-scrollbar {
  display: none;
}

.cdh-section-switcher-tab {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  min-height: 36px;
  padding-inline: 14px;
  border: 1px solid var(--zs-border-soft, var(--zs-light-border, #e5e7eb));
  border-radius: 999px;
  background: var(--zs-surface-2, var(--zs-light-surface, #ffffff));
  color: var(--zs-text-primary, var(--zs-light-ink, #0f172a));
  font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
  font-size: 13px;
  font-weight: 500;
  font-synthesis: none;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
  cursor: pointer;
}

html.light .cdh-section-switcher-tab,
[data-zs-crypto-root][data-zs-theme='light'] .cdh-section-switcher-tab {
  border-color: var(--zs-light-border, #e5e7eb);
  background: var(--zs-light-surface, #ffffff);
  color: var(--zs-light-ink, #0f172a);
}

.cdh-section-switcher-tab.is-active {
  font-weight: 600;
  background: var(--zs-surface-3, #141916);
  border-color: var(--zs-border-mid, rgba(255, 255, 255, 0.12));
  color: var(--zs-text-primary, #f5f7fa);
  box-shadow: none;
}

html.light .cdh-section-switcher-tab.is-active,
[data-zs-crypto-root][data-zs-theme='light'] .cdh-section-switcher-tab.is-active {
  background: #ffffff;
  border-color: #94a3b8;
  color: #0f172a;
}

.csd-chip-bar {
  position: relative;
  margin-bottom: var(--csd-space-4);
  min-height: 44px;
  min-width: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.csd-chip-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--csd-space-1);
  min-width: 0;
}

.csd-chip {
  display: inline-flex;
  align-items: center;
  flex-direction: row;
  gap: var(--csd-space-1);
  flex-shrink: 0;
  height: 44px;
  min-height: 44px;
  padding: var(--csd-space-1) var(--csd-space-2);
  border-radius: 999px;
  border: 1px solid #242424;
  background: transparent;
  color: #b8b8b8;
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  cursor: pointer;
  transition:
    background 160ms ease,
    color 160ms ease,
    border-color 160ms ease;
  white-space: nowrap;
}

.csd-chip-label {
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
}

.csd-chip-icon,
.csd-chip-chevron {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: currentColor;
  stroke: currentColor;
  opacity: 0.9;
}

.csd-chip-chevron {
  transition: transform 180ms ease;
}

.csd-chip-chevron.is-open {
  transform: rotate(180deg);
}

.csd-chip:hover {
  color: #d4d4d4;
  background: rgba(255, 255, 255, 0.03);
  border-color: #323232;
}

.csd-chip.is-active {
  color: var(--zs-text-primary, #f5f7fa);
  border-color: var(--zs-border-soft, var(--zs-light-border, #e5e7eb));
  background: var(--zs-surface-3, var(--zs-light-surface, #ffffff));
  font-weight: 600;
  box-shadow: none;
}

html.light .csd-chip.is-active,
[data-zs-crypto-root][data-zs-theme='light'] .csd-chip.is-active {
  color: var(--zs-light-ink, #0f172a);
  border-color: var(--zs-light-border, #e5e7eb);
  background: var(--zs-light-surface, #ffffff);
}

.csd-chip.is-active .csd-chip-icon,
.csd-chip.is-active .csd-chip-chevron {
  color: currentColor;
  opacity: 1;
}

.csd-chip-more {
  position: relative;
  flex-shrink: 0;
}

.csd-chip--more {
  padding-inline: var(--csd-space-2);
}

.csd-chip-menu {
  position: absolute;
  top: calc(100% + var(--csd-space-1));
  inset-inline-end: 0;
  z-index: 30;
  min-width: 220px;
  max-width: min(280px, calc(100vw - 2rem));
  max-height: 320px;
  overflow-y: auto;
  padding: var(--csd-space-1);
  border-radius: 12px;
  background: var(--csd-elevated);
  border: 1px solid var(--csd-border);
  box-shadow: var(--csd-shadow-elevated);
  scrollbar-width: thin;
}

.csd-chip-menu-item {
  display: flex;
  align-items: center;
  gap: var(--csd-space-1);
  width: 100%;
  padding: var(--csd-space-1) var(--csd-space-2);
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #b8b8b8;
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  text-align: start;
  cursor: pointer;
  transition:
    background 140ms ease,
    color 140ms ease;
}

.csd-chip-menu-item:hover {
  background: rgba(255, 255, 255, 0.04);
  color: #d4d4d4;
}

.csd-chip-menu-item.is-active {
  color: var(--zs-accent);
  background: var(--zs-accent-soft);
}

.csd-chip-menu-icon {
  flex-shrink: 0;
  color: currentColor;
  opacity: 0.9;
}

.csd-shell {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

/* â”€â”€ Zone ownership contract â”€â”€ */
.csd-zone {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  padding-inline: 0;
  box-sizing: border-box;
}

.csd-zone-header,
.csd-zone-body {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.csd-zone-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0 var(--csd-space-3);
  min-height: var(--csd-space-4);
  margin: 0 0 var(--csd-space-3);
  padding-top: var(--csd-space-5);
  direction: rtl;
}

.csd-zone-header::before {
  content: '';
  flex: 0 0 100%;
  width: 100%;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  margin-bottom: var(--csd-space-3);
}

.csd-zone-heading {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  text-align: right;
}

.csd-zone-title {
  margin: 0;
  font-size: 18px;
  line-height: var(--csd-type-lh);
  font-weight: 700;
  color: #f4f4f5;
  letter-spacing: var(--csd-type-ls);
  text-transform: none;
}

.csd-zone-subtitle {
  margin: var(--csd-space-1) 0 0;
  font-size: 13px;
  line-height: var(--csd-type-lh);
  font-weight: 500;
  color: #fff;
  opacity: 0.55;
  letter-spacing: var(--csd-type-ls);
}

.csd-zone-action {
  border: 0;
  background: transparent;
  color: var(--csd-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  cursor: pointer;
  padding: 0;
  white-space: nowrap;
  transition: color 160ms ease;
  flex-shrink: 0;
}

.csd-zone-action:hover {
  color: var(--zs-accent);
}

.csd-footer-zone {
  margin-top: var(--csd-space-4);
  padding: 0;
  width: 100%;
}

/* â”€â”€ Overview (hero) zone â”€â”€ */
.csd-overview-zone {
  margin-top: 0;
}

.csd-overview-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: var(--csd-space-3);
  min-height: 0;
  margin: 0 0 var(--csd-space-3);
  padding-top: var(--csd-space-5);
  width: 100%;
  direction: rtl;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .csd-overview-header {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--csd-space-4);
    min-height: 0;
  }
}

.csd-overview-heading {
  min-width: 0;
  text-align: right;
}

.csd-overview-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-text);
}

.csd-overview-timestamp {
  margin: var(--csd-space-1) 0 0;
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: #fff;
  opacity: 0.6;
  text-align: right;
}

.csd-overview-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--csd-space-4);
  align-items: end;
  justify-items: start;
  min-width: 0;
  width: 100%;
  direction: rtl;
}

.csd-overview-kpi {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  min-width: 0;
  width: 100%;
  text-align: left;
}

.csd-overview-kpi-label {
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: rgba(255, 255, 255, 0.48);
  margin: 0 0 var(--csd-space-1);
}

.csd-overview-kpi-value {
  margin: 0;
  font-size: clamp(24px, 2vw, 28px);
  font-weight: 700;
  line-height: var(--csd-type-lh);
  color: #f4f4f5;
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.csd-overview-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--csd-space-3);
  align-items: start;
  min-width: 0;
  margin: 0;
  padding: 0;
}

@media (min-width: 768px) {
  .csd-overview-body {
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: var(--csd-space-3);
    align-items: stretch;
    direction: ltr;
  }

  .csd-overview-body > .csd-chart-wrap,
  .csd-overview-body > .csd-movers-rail {
    direction: rtl;
    align-self: stretch;
    height: 100%;
  }
}

.csd-state {
  margin: 0;
  padding: var(--csd-space-4) var(--csd-space-2);
  text-align: center;
  color: var(--csd-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
}

.csd-state--limited {
  padding: var(--csd-space-6) var(--csd-space-2);
}

.csd-chart-wrap {
  position: relative;
  min-width: 0;
  width: 100%;
  height: 360px;
  margin: 0;
  overflow: hidden;
  padding: var(--csd-space-2) var(--csd-space-4);
  border-radius: 14px;
  background: var(--csd-surface);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 768px) {
  .csd-chart-wrap {
    height: 500px;
    padding: var(--csd-space-2) var(--csd-space-4);
  }
}

.csd-chart-wrap > * {
  width: 100%;
  height: 100%;
  min-width: 0;
}

.csd-chart-interactive {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 0;
  overflow: hidden;
}

.csd-chart-svg {
  width: 100%;
  height: 100%;
  display: block;
  cursor: crosshair;
}

.csd-chart-grid {
  stroke: rgba(255, 255, 255, 0.02);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.csd-chart-avg {
  stroke: rgba(255, 255, 255, 0.07);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.csd-chart-crosshair {
  stroke: rgba(255, 255, 255, 0.08);
  stroke-width: 1;
  stroke-dasharray: 3 5;
  vector-effect: non-scaling-stroke;
}

.csd-chart-labels {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.csd-chart-label {
  position: absolute;
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-desc);
  padding: var(--csd-space-1) var(--csd-space-2);
  border-radius: 8px;
  background: rgba(9, 9, 9, 0.92);
  border: none;
  box-shadow: none;
  white-space: nowrap;
  /* Default; SectorLineChart overrides via boundary-aware inline transform */
  transform: translate(-50%, -50%);
  font-variant-numeric: tabular-nums;
  max-width: calc(100% - var(--csd-space-2));
  box-sizing: border-box;
  unicode-bidi: isolate;
}

.csd-chart-label--start {
  left: var(--csd-space-1);
  bottom: var(--csd-space-1);
  top: auto;
  transform: none;
}

.csd-chart-label--last {
  color: var(--csd-text);
}

.csd-chart-label--avg {
  color: var(--csd-muted);
}

.csd-chart-label--high {
  color: var(--csd-muted);
}

.csd-chart-label--low {
  color: var(--csd-muted);
}

.csd-chart-tooltip {
  position: absolute;
  transform: translate(-50%, calc(-100% - var(--csd-space-2)));
  padding: var(--csd-space-1) var(--csd-space-2);
  border-radius: 8px;
  background: rgba(9, 9, 9, 0.96);
  border: none;
  box-shadow: none;
  pointer-events: none;
  white-space: nowrap;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--csd-space-1);
  font-variant-numeric: tabular-nums;
  max-width: calc(100% - var(--csd-space-4));
  transition: left 80ms ease, top 80ms ease;
}

.csd-chart-tooltip-price {
  font-size: 13px;
  font-weight: 700;
  color: var(--csd-text);
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
  font-variant-numeric: tabular-nums;
}

.csd-chart-tooltip-time {
  font-size: 12px;
  font-weight: 500;
  color: var(--csd-desc);
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
}

.csd-chart-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-width: 0;
  color: var(--csd-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
}

/* Movers rail â€” subordinate to chart */
.csd-movers-rail {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .csd-movers-rail {
    width: 240px;
    min-height: 0;
    height: 100%;
    align-self: stretch;
    padding-inline-start: var(--csd-space-3);
    border-inline-start: 1px solid rgba(255, 255, 255, 0.06);
  }
}

.csd-movers-title {
  margin: 0 0 var(--csd-space-2);
  padding: 0;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  color: rgba(255, 255, 255, 0.55);
  letter-spacing: var(--csd-type-ls);
  text-align: start;
}

.csd-movers-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  flex: none;
}

@media (min-width: 768px) {
  .csd-movers-list {
    flex: 1 1 auto;
    min-height: 0;
  }
}

.csd-mover-row {
  display: flex;
  align-items: center;
  height: 72px;
  min-height: 72px;
  padding: 0;
  text-decoration: none;
  color: inherit;
  border-top: none;
  transition: opacity 160ms ease;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .csd-mover-row {
    flex: 1 1 0;
    height: auto;
    min-height: 0;
  }
}

.csd-mover-row + .csd-mover-row {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.csd-mover-row:hover {
  opacity: 0.88;
}

.csd-mover-row-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--csd-space-2);
  min-width: 0;
  width: 100%;
}

.csd-mover-row-identity {
  display: inline-flex;
  align-items: center;
  gap: var(--csd-space-2);
  min-width: 0;
  justify-self: start;
}

.csd-mover-row-logo {
  width: var(--csd-space-3);
  height: var(--csd-space-3);
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}

.csd-mover-row-sym {
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
  color: var(--csd-text);
  text-align: start;
}

.csd-mover-row-chg {
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
  text-align: end;
  min-width: var(--csd-space-7);
  justify-self: end;
}

.csd-mover-row-chg.is-up {
  color: var(--csd-positive);
}

.csd-mover-row-chg.is-down {
  color: var(--zs-negative);
}

/* â”€â”€ Metrics zone â€” section spacing via shared header contract â”€â”€ */
.csd-intelligence-zone,
.csd-analysis-zone {
  margin-top: 0;
}

.csd-analytics-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  align-items: stretch;
}

@media (min-width: 900px) {
  .csd-analytics-metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.csd-stat-block {
  display: grid;
  grid-template-rows: auto auto auto;
  align-content: start;
  justify-items: start;
  gap: var(--csd-space-1);
  min-width: 0;
  min-height: 0;
  padding: var(--csd-space-2);
  background: transparent;
  border: none;
  box-shadow: none;
}

@media (min-width: 900px) {
  .csd-stat-block {
    padding: var(--csd-space-1) var(--csd-space-3);
  }

  .csd-stat-block:first-child {
    padding-inline-start: 0;
  }

  .csd-stat-block:last-child {
    padding-inline-end: 0;
  }

  .csd-stat-block + .csd-stat-block {
    border-inline-start: 1px solid rgba(255, 255, 255, 0.05);
  }
}

.csd-stat-label {
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  color: var(--csd-desc);
  letter-spacing: var(--csd-type-ls);
}

.csd-stat-value {
  font-size: clamp(24px, 2vw, 28px);
  font-weight: 700;
  line-height: var(--csd-type-lh);
  color: var(--csd-text);
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--csd-type-ls);
  white-space: nowrap;
}

.csd-stat-helper {
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  color: var(--csd-muted);
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--csd-type-ls);
  min-height: var(--csd-space-1);
}

.csd-stat-value.is-up {
  color: var(--csd-positive);
}

.csd-stat-value.is-down {
  color: var(--zs-negative);
}

.csd-analysis-panels {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--csd-space-4);
  min-width: 0;
  align-items: stretch;
}

@media (min-width: 900px) {
  .csd-analysis-panels {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--csd-space-4);
    direction: ltr;
  }

  .csd-analysis-panel {
    direction: rtl;
  }
}

.csd-analysis-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 280px;
  height: 100%;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.csd-panel-header {
  display: flex;
  align-items: center;
  margin: 0 0 var(--csd-space-2);
  width: 100%;
  min-height: calc(18px * var(--csd-type-lh));
  flex-shrink: 0;
}

.csd-panel-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-text);
  text-align: right;
  width: 100%;
}

.csd-panel-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
}

.csd-analytics-meta {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-muted);
}

.csd-comp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--csd-space-1);
  flex: 1;
  justify-content: space-between;
  min-height: 0;
}

.csd-comp-list li {
  min-width: 0;
  flex: 1 1 0;
  min-height: var(--csd-space-5);
  display: flex;
  align-items: center;
}

.csd-comp-row {
  display: grid;
  grid-template-columns: var(--csd-space-6) minmax(0, 1fr) var(--csd-space-6);
  align-items: center;
  gap: var(--csd-space-2);
  width: 100%;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

.csd-comp-row-pct {
  font-size: 13px;
  font-weight: 700;
  color: var(--csd-text);
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
  text-align: start;
  min-width: 0;
}

.csd-comp-row-bar {
  height: var(--csd-space-1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  overflow: hidden;
  min-width: 0;
}

.csd-comp-row-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.22);
}

.csd-comp-row-sym {
  font-size: 13px;
  font-weight: 700;
  color: var(--csd-text);
  letter-spacing: var(--csd-type-ls);
  line-height: var(--csd-type-lh);
  text-align: end;
}

.csd-breadth-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--csd-space-2);
  flex: 1;
  min-height: 0;
}

.csd-breadth-value {
  font-size: 36px;
  font-weight: 700;
  line-height: var(--csd-type-lh);
  color: var(--csd-text);
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
  text-align: start;
}

.csd-breadth-bar {
  display: flex;
  width: 100%;
  height: var(--csd-space-1);
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
}

.csd-breadth-bar-up {
  display: block;
  height: 100%;
  background: var(--csd-positive);
  opacity: 0.9;
}

.csd-breadth-bar-flat {
  display: block;
  height: 100%;
  background: rgba(255, 255, 255, 0.14);
}

.csd-breadth-bar-down {
  display: block;
  height: 100%;
  background: var(--zs-negative);
  opacity: 0.75;
}

.csd-breadth-counts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--csd-space-2);
  margin: 0;
}

.csd-breadth-count {
  display: flex;
  flex-direction: column;
  gap: var(--csd-space-1);
  min-width: 0;
  align-items: flex-start;
}

.csd-breadth-count-value {
  font-size: 18px;
  font-weight: 700;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-text);
  font-variant-numeric: tabular-nums;
  width: 100%;
  text-align: start;
}

.csd-breadth-count-label {
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-muted);
  width: 100%;
  text-align: start;
}

.csd-breadth-sep {
  color: rgba(255, 255, 255, 0.18);
  font-size: 12px;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
}

/* â”€â”€ Coins zone â€” section spacing via shared header contract â”€â”€ */
.csd-coins-zone {
  margin-top: 0;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.csd-coins-table-wrap {
  overflow-x: auto;
  min-width: 0;
  -webkit-overflow-scrolling: touch;
}

.csd-coins-grid {
  min-width: 720px;
  width: 100%;
  font-variant-numeric: tabular-nums;
}

.csd-coins-grid-head,
.csd-coins-grid-row {
  display: grid;
  grid-template-columns: var(--csd-coins-cols);
  align-items: center;
  column-gap: var(--csd-space-2);
}

.csd-coins-grid-head {
  height: var(--csd-space-6);
  min-height: var(--csd-space-6);
  color: var(--csd-desc);
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  border-bottom: 1px solid var(--csd-border);
}

.csd-coins-grid-body {
  display: flex;
  flex-direction: column;
}

.csd-coins-grid-row {
  height: var(--csd-space-7);
  min-height: var(--csd-space-7);
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-text);
  border-bottom: 1px solid rgba(255, 255, 255, 0.03);
  transition: background 140ms ease;
}

.csd-coins-grid-body .csd-coins-grid-row:first-child {
  margin-top: var(--csd-space-1);
}

.csd-coins-grid-row:hover {
  background: rgba(255, 255, 255, 0.02);
}

.csd-coins-grid-row:last-child {
  border-bottom: none;
}

.csd-coins-grid-cell {
  min-width: 0;
  padding-inline: var(--csd-space-1);
}

.csd-coins-grid-cell--rank {
  text-align: center;
  color: var(--csd-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
}

.csd-coins-grid-cell--coin {
  text-align: start;
}

.csd-coins-grid-cell--num {
  text-align: left;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.csd-coins-coin {
  display: inline-flex;
  align-items: center;
  gap: var(--csd-space-1);
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

.csd-coins-coin img {
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: none;
}

.csd-coins-sym {
  font-weight: 700;
  font-size: 13px;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  flex-shrink: 0;
}

.csd-coins-name {
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.csd-coins-num,
.csd-coins-grid-cell--num.is-up,
.csd-coins-grid-cell--num.is-down {
  font-weight: 700;
  font-size: 13px;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Legacy aliases kept for unused surfaces elsewhere in hub */
.csd-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--csd-space-2);
  margin-bottom: var(--csd-space-2);
}

.csd-link-btn {
  border: 0;
  background: transparent;
  color: var(--csd-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  cursor: pointer;
  padding: 0;
  transition: color 160ms ease;
}

.csd-link-btn:hover {
  color: var(--zs-accent);
}

.csd-comp-pills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--csd-space-1);
  min-width: 0;
}

.csd-comp-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--csd-space-1);
  height: 34px;
  padding: 0 var(--csd-space-2);
  border-radius: 999px;
  color: inherit;
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  font-variant-numeric: tabular-nums;
  transition:
    background 200ms ease,
    border-color 200ms ease,
    box-shadow 200ms ease;
}

.csd-comp-pill:hover {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: var(--csd-shadow-elevated), var(--csd-shadow-inner);
}

.csd-comp-pill span:last-child {
  color: var(--csd-text-soft);
  font-weight: 700;
}

.csd-treemap {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--csd-space-1);
  height: 110px;
  max-height: 110px;
  min-width: 0;
  overflow: hidden;
}

.csd-treemap-cell {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--csd-space-1);
  min-width: 56px;
  min-height: 0;
  padding: var(--csd-space-1);
  border-radius: var(--csd-radius-sm);
  text-decoration: none;
  color: inherit;
  transition:
    background 200ms ease,
    border-color 200ms ease,
    box-shadow 200ms ease;
}

.csd-treemap-cell.is-up,
.csd-treemap-cell.is-down {
  background: var(--csd-gradient-surface);
}

.csd-treemap-cell.is-largest {
  min-width: 88px;
}

.csd-treemap-cell:hover {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: var(--csd-shadow-elevated), var(--csd-shadow-inner);
}

.csd-treemap-sym {
  font-size: 13px;
  font-weight: 700;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
}

.csd-treemap-share {
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-text-soft);
  font-variant-numeric: tabular-nums;
}

.csd-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--csd-space-1);
  padding: var(--csd-space-2) 0 0;
  margin-top: 0;
  text-align: center;
}

.csd-footer p {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: var(--csd-type-lh);
  letter-spacing: var(--csd-type-ls);
  color: var(--csd-muted);
}

.is-up {
  color: var(--csd-positive);
}

.is-down {
  color: var(--zs-negative);
}

.csd-chip:focus-visible,
.csd-chip-menu-item:focus-visible,
.csd-cta:focus-visible,
.csd-link-btn:focus-visible,
.csd-zone-action:focus-visible,
.csd-mover-row:focus-visible,
.csd-comp-row:focus-visible,
.csd-coins-coin:focus-visible,
.csd-comp-pill:focus-visible,
.csd-treemap-cell:focus-visible {
  outline: 2px solid var(--zs-accent-line);
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .csd-zone-header {
    align-items: flex-start;
    gap: var(--csd-space-2);
    margin-bottom: var(--csd-space-3);
  }

  .csd-overview-header {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--csd-space-2);
    margin-bottom: var(--csd-space-3);
    padding-top: var(--csd-space-5);
    min-height: 0;
  }

  .csd-overview-heading {
    width: 100%;
    text-align: right;
  }

  .csd-overview-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--csd-space-2);
    width: 100%;
  }

  .csd-overview-kpi {
    min-width: 0;
  }

  .csd-overview-body {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--csd-space-3);
    direction: rtl;
  }

  .csd-chart-wrap {
    height: 360px;
    padding: var(--csd-space-2) var(--csd-space-4);
  }

  .csd-movers-rail {
    width: 100%;
    min-height: 0;
    height: auto;
    padding-inline-start: 0;
    border-inline-start: none;
  }

  .csd-movers-title {
    margin-bottom: var(--csd-space-1);
  }

  .csd-movers-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    overflow: hidden;
    flex: none;
  }

  .csd-mover-row {
    height: auto;
    min-height: 72px;
    padding: var(--csd-space-1);
    border-top: none;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.05);
  }

  .csd-mover-row + .csd-mover-row {
    border-top: none;
  }

  .csd-mover-row:last-child {
    border-inline-end: none;
  }

  .csd-mover-row-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--csd-space-1);
    text-align: center;
  }

  .csd-mover-row-identity {
    flex-direction: column;
    gap: var(--csd-space-1);
  }

  .csd-mover-row-sym {
    text-align: center;
  }

  .csd-mover-row-chg {
    min-width: 0;
    text-align: center;
    justify-self: center;
  }

  .csd-stat-block {
    padding: var(--csd-space-2);
  }

  .csd-analysis-panels {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--csd-space-4);
  }

  .csd-analysis-panel {
    min-height: 0;
  }

  .csd-breadth-body {
    min-height: 0;
  }
}


/* legacy hero (unused) */
.csd-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.55rem;
  max-height: none;
  padding: 0;
  min-width: 0;
}

@media (min-width: 1024px) {
  .csd-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.2fr);
    align-items: stretch;
    max-height: 300px;
  }
}

.csd-hero-signals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
  min-width: 0;
  direction: ltr;
}

.csd-hero-tile {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  min-width: 0;
  height: 100%;
  min-height: 88px;
  padding: 0.55rem 0.6rem;
  border-radius: var(--csd-radius);
  background: var(--csd-card);
  box-shadow: var(--csd-shadow);
  text-decoration: none;
  color: inherit;
}

.csd-hero-tile-label {
  font-size: 0.58rem;
  font-weight: 700;
  color: var(--csd-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.csd-hero-tile-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.csd-hero-tile-logo {
  border-radius: 50%;
  flex-shrink: 0;
}

.csd-hero-tile-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.csd-hero-tile-sym {
  font-size: 0.82rem;
  font-weight: 800;
}

.csd-hero-tile-chg,
.csd-hero-tile-big {
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.15;
}

.csd-hero-tile-chg.is-up,
.csd-hero-tile-big.is-up,
.is-up {
  color: var(--csd-up);
}

.csd-hero-tile-chg.is-down,
.csd-hero-tile-big.is-down,
.is-down {
  color: var(--csd-down);
}

.csd-hero-tile-sub {
  font-size: 0.62rem;
  color: var(--csd-muted);
}

.csd-hero-main {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
  padding: 0.6rem 0.7rem;
  border-radius: var(--csd-radius);
  background: var(--csd-card);
  box-shadow: var(--csd-shadow);
}

.csd-hero-title-row {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  min-width: 0;
}

.csd-hero-emoji {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--csd-elevated);
  font-size: 1.15rem;
  flex-shrink: 0;
}

.csd-hero-main .csd-hero-title {
  margin: 0 0 0.2rem;
  font-size: clamp(1.05rem, 1.8vw, 1.35rem);
  font-weight: 700;
  line-height: 1.2;
}

.csd-hero-desc {
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--csd-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.csd-kpi-row,
.csd-analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
  min-width: 0;
  align-items: stretch;
}

@media (min-width: 640px) {
  .csd-kpi-row {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .csd-analytics-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.csd-kpi {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.14rem;
  min-width: 0;
  height: 58px;
  padding: 0.4rem 0.5rem;
  border-radius: 10px;
  background: var(--csd-elevated);
  border: 1px solid rgba(255, 255, 255, 0.04);
}

.csd-kpi-label {
  font-size: 0.54rem;
  font-weight: 700;
  color: var(--csd-muted);
  line-height: 1.2;
}

.csd-kpi-value {
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.1;
  color: var(--csd-text);
  font-variant-numeric: tabular-nums;
}

.csd-kpi-value.is-up {
  color: var(--csd-up);
}

.csd-kpi-value.is-down {
  color: var(--csd-down);
}

.csd-analytics-card {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  min-width: 0;
  height: 86px;
  padding: 0.55rem 0.65rem;
  border-radius: var(--csd-radius);
  background: var(--csd-card);
  border: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: var(--csd-shadow);
}

.csd-analytics-icon {
  font-size: 0.78rem;
  line-height: 1;
  color: var(--csd-muted);
}

.csd-analytics-icon.is-up {
  color: var(--csd-up);
}

.csd-analytics-icon.is-down {
  color: var(--csd-down);
}

.csd-analytics-label {
  font-size: 0.56rem;
  font-weight: 700;
  color: var(--csd-muted);
  line-height: 1.2;
}

.csd-analytics-value {
  margin-top: auto;
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.1;
  color: var(--csd-text);
  font-variant-numeric: tabular-nums;
}

.csd-analytics-value.is-up {
  color: var(--csd-up);
}

.csd-analytics-value.is-down {
  color: var(--csd-down);
}

.csd-analytics-sub {
  font-size: 0.52rem;
  font-weight: 600;
  color: var(--csd-muted);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.csd-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
  min-height: 38px;
  margin-top: auto;
  padding: 0.45rem 0.75rem;
  border: 1px solid rgba(24, 195, 126, 0.45);
  border-radius: 10px;
  background: transparent;
  color: var(--csd-up);
  font-size: 0.74rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 180ms ease;
}

.csd-cta:hover {
  background: rgba(24, 195, 126, 0.08);
}

/* â”€â”€ Section 3: Top Coins â”€â”€ */
.csd-section {
  min-width: 0;
}

.csd-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.csd-link-btn {
  border: 0;
  background: transparent;
  color: var(--csd-muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
}

.csd-link-btn:hover {
  color: var(--zs-accent);
}

.csd-top-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.55rem;
  min-width: 0;
  align-items: stretch;
}

@media (min-width: 640px) {
  .csd-top-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .csd-top-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.csd-top-card {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  min-width: 0;
  height: 100%;
  min-height: 156px;
  padding: 0.6rem 0.65rem;
  border-radius: var(--csd-radius);
  background: var(--csd-card);
  box-shadow: var(--csd-shadow);
  text-decoration: none;
  color: inherit;
  transition: transform 180ms ease, background 180ms ease;
}

.csd-top-card:hover {
  transform: translateY(-2px);
  background: var(--csd-elevated);
}

.csd-top-card-head {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.csd-top-card-logo {
  border-radius: 50%;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.csd-top-card-meta {
  flex: 1;
  min-width: 0;
}

.csd-top-card-sym {
  display: block;
  font-size: 0.78rem;
  font-weight: 800;
}

.csd-top-card-name {
  display: block;
  font-size: 0.56rem;
  color: var(--csd-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.csd-top-card-chg {
  font-size: 0.68rem;
  font-weight: 800;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}

.csd-sparkline {
  width: 100%;
  height: 52px;
  display: block;
  margin: 0.1rem 0;
}

.csd-top-card-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.25rem;
  align-items: baseline;
  font-variant-numeric: tabular-nums;
}

.csd-top-card-price {
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.csd-top-card-cap,
.csd-top-card-vol {
  font-size: 0.62rem;
  font-weight: 700;
  color: var(--csd-muted);
  text-align: end;
}

.csd-top-card-cap {
  text-align: center;
}

.csd-top-card-strength {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: auto;
  font-size: 0.54rem;
  font-weight: 700;
  color: var(--csd-muted);
}

.csd-strength-bar {
  flex: 1;
  height: 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.csd-strength-bar > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(24, 195, 126, 0.55), #18c37e);
}

.csd-strength-val {
  min-width: 1.4rem;
  text-align: end;
  color: var(--csd-text);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* â”€â”€ Ready lists (large dashboard cards â€” collections layout) â”€â”€ */
.crypto-discovery-hub .crypto-discovery-block--lists {
  margin-top: 0.25rem;
  margin-bottom: 2.5rem;
  padding-top: 0.5rem;
  padding-bottom: 1.5rem;
}

.crypto-discovery-hub .cdh-section--lists {
  padding: 1.75rem 1.5rem;
  border-radius: 1rem;
}

.crypto-discovery-hub .cdh-section-head--lists {
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .crypto-discovery-hub .cdh-section-head--lists {
    margin-bottom: 1.75rem;
  }
}

.crypto-discovery-hub .cdh-section-title--lists {
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
}

@media (min-width: 640px) {
  .crypto-discovery-hub .cdh-section-title--lists {
    font-size: 1.375rem;
  }
}

.crypto-discovery-hub .cdh-section-sub--lists {
  font-size: 0.6875rem;
}

@media (min-width: 640px) {
  .crypto-discovery-hub .cdh-section-sub--lists {
    font-size: 0.75rem;
  }
}

.crypto-discovery-hub .cdh-lists-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
}

@media (min-width: 400px) {
  .crypto-discovery-hub .cdh-lists-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
}

@media (min-width: 1024px) {
  .crypto-discovery-hub .cdh-lists-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.crypto-discovery-hub .cdh-list-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: inherit;
  gap: 0;
  min-height: 8.5rem;
  padding: 1.25rem;
  border-radius: 1rem;
  border: 0;
  background: var(--crypto-coll-card-bg, linear-gradient(145deg, rgba(7, 11, 10, 0.88), rgba(3, 5, 4, 0.92)));
  box-shadow: var(--crypto-coll-card-shadow, 0 10px 30px rgba(0, 0, 0, 0.35));
  transition: box-shadow 0.2s ease-out, transform 0.2s ease-out;
}

.crypto-discovery-hub .cdh-list-card-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: inherit;
  color: inherit;
}

.crypto-discovery-hub .cdh-list-card .cdh-filter-view-btn {
  margin-top: 0.65rem;
}

.crypto-discovery-hub .cdh-list-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--crypto-coll-card-shadow-hover, 0 12px 36px rgba(0, 0, 0, 0.5), 0 0 24px rgba(163, 255, 18, 0.06));
}

.crypto-discovery-hub .cdh-list-card.is-active {
  box-shadow: var(--crypto-coll-card-shadow-active, 0 14px 40px rgba(0, 0, 0, 0.5), 0 0 36px rgba(163, 255, 18, 0.1));
}

.crypto-discovery-hub .cdh-list-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 0.75rem;
  border-radius: 999px;
  background: var(--crypto-coll-tile-bg, rgba(255, 255, 255, 0.04));
  box-shadow: var(--crypto-coll-tile-shadow, 0 4px 14px rgba(0, 0, 0, 0.25));
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}

.crypto-discovery-hub .cdh-list-card:hover .cdh-list-icon-wrap {
  transform: scale(1.05);
  box-shadow: var(--crypto-coll-tile-shadow-hover, 0 6px 18px rgba(0, 0, 0, 0.35));
}

.crypto-discovery-hub .cdh-list-icon {
  width: 1.375rem;
  height: 1.375rem;
  flex-shrink: 0;
  background: var(--crypto-coll-icon-mask, rgba(163, 255, 18, 0.85));
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

.crypto-discovery-hub .cdh-list-card:hover .cdh-list-icon {
  background: var(--crypto-coll-icon-mask-hover, rgba(196, 255, 61, 0.95));
}

.crypto-discovery-hub .cdh-list-label {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--crypto-coll-text, var(--zs-text-primary));
}

.crypto-discovery-hub .cdh-list-count {
  display: block;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--crypto-coll-muted, var(--zs-text-secondary));
}

.crypto-discovery-hub .cdh-list-footer {
  display: flex;
  width: 100%;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: auto;
  padding-top: 0.125rem;
}

.crypto-discovery-hub .cdh-list-change {
  font-size: 0.875rem;
  font-weight: 700;
}

.crypto-discovery-hub .cdh-list-change.is-up {
  color: var(--crypto-coll-ok, var(--zs-success, #18c37e));
}

.crypto-discovery-hub .cdh-list-change.is-down {
  color: var(--crypto-coll-bad, var(--zs-red, #ef4444));
}

.crypto-discovery-hub .cdh-list-status {
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--crypto-coll-muted, var(--zs-text-secondary));
}

.crypto-discovery-hub .cdh-list-status.is-up {
  color: var(--crypto-coll-ok, var(--zs-success, #18c37e));
}

.crypto-discovery-hub .cdh-list-status.is-down {
  color: var(--crypto-coll-bad, var(--zs-red, #ef4444));
}

html.light .crypto-discovery-hub .cdh-section--lists,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section--lists {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

html.light .crypto-discovery-hub .cdh-list-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-list-card {
  background: linear-gradient(145deg, #f8faf9, #fff);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

/* â”€â”€ Ready list detail panel (adaptive layout) â”€â”€ */
.crypto-discovery-hub .cdh-list-detail {
  margin-top: 1.25rem;
  padding: 1rem 0.9rem;
  border-radius: 1rem;
  background: var(--crypto-coll-panel-bg, rgba(8, 12, 10, 0.95));
  box-shadow: var(--crypto-coll-panel-shadow, 0 12px 40px rgba(0, 0, 0, 0.35));
  overflow: hidden;
}

@media (min-width: 640px) {
  .crypto-discovery-hub .cdh-list-detail {
    margin-top: 1.5rem;
    padding: 1.25rem 1.15rem;
  }
}

.crypto-discovery-hub .cdh-list-detail--compact {
  padding: 0.85rem 0.8rem;
}

.crypto-discovery-hub .cdh-list-detail-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  grid-auto-rows: auto;
}

@media (min-width: 768px) {
  .crypto-discovery-hub .cdh-list-detail-shell {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 16px;
    align-items: start;
  }
}

.crypto-discovery-hub .cdh-list-detail-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  height: auto;
  min-height: 0;
  align-self: start;
}

.crypto-discovery-hub .cdh-list-detail-info {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.65rem 0.7rem;
  border-radius: 0.75rem;
  background: var(--crypto-coll-surface, rgba(255, 255, 255, 0.03));
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-info {
  gap: 0.5rem;
  padding: 0.55rem 0.6rem;
}

.crypto-discovery-hub .cdh-list-detail-head-main {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 999px;
  background: var(--crypto-coll-tile-bg, rgba(255, 255, 255, 0.04));
  box-shadow: var(--crypto-coll-tile-shadow, 0 4px 14px rgba(0, 0, 0, 0.25));
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-icon-wrap {
  width: 2.15rem;
  height: 2.15rem;
}

.crypto-discovery-hub .cdh-list-detail-icon {
  width: 1.35rem;
  height: 1.35rem;
  background: var(--crypto-coll-icon-mask, rgba(163, 255, 18, 0.85));
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

.crypto-discovery-hub .cdh-list-detail-title {
  margin: 0 0 0.25rem;
  font-size: 1.0625rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--crypto-coll-text, var(--zs-text-primary));
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-title {
  font-size: 0.9375rem;
}

.crypto-discovery-hub .cdh-list-detail-desc {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--crypto-coll-muted, var(--zs-text-secondary));
}

.crypto-discovery-hub .cdh-list-detail-block--why {
  margin: 0;
}

.crypto-discovery-hub .cdh-list-detail-block-title {
  margin: 0 0 0.3rem;
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--zs-text-primary);
  opacity: 0.85;
}

.crypto-discovery-hub .cdh-list-detail-block-text {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--zs-text-secondary);
}

.crypto-discovery-hub .cdh-list-detail-info-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem 0.65rem;
  margin: 0;
  padding-top: 0.45rem;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.crypto-discovery-hub .cdh-list-detail-info-stat {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail-info-stat dt {
  margin: 0;
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--zs-text-secondary);
}

.crypto-discovery-hub .cdh-list-detail-info-stat dd {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--zs-text-primary);
}

.crypto-discovery-hub .cdh-list-detail-info-stat dd.is-up {
  color: var(--crypto-coll-ok, #18c37e);
}

.crypto-discovery-hub .cdh-list-detail-info-stat dd.is-down {
  color: var(--crypto-coll-bad, #ef4444);
}

.crypto-discovery-hub .cdh-list-detail-analysis {
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail-analysis-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.5rem;
  align-content: start;
}

@media (min-width: 480px) {
  .crypto-discovery-hub .cdh-list-detail-analysis-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.crypto-discovery-hub .cdh-list-analytic-card {
  padding: 0.65rem 0.7rem;
  border-radius: 0.65rem;
  background: var(--crypto-coll-surface, rgba(255, 255, 255, 0.03));
  border: 1px solid rgba(255, 255, 255, 0.06);
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-analytic-card {
  padding: 0.5rem 0.55rem;
}

.crypto-discovery-hub .cdh-list-analytic-card--preview {
  grid-column: 1 / -1;
}

.crypto-discovery-hub .cdh-list-analytic-card-title {
  margin: 0 0 0.4rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--zs-text-primary);
  opacity: 0.85;
}

.crypto-discovery-hub .cdh-list-analytic-summary {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.crypto-discovery-hub .cdh-list-analytic-summary-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.6875rem;
}

.crypto-discovery-hub .cdh-list-analytic-summary-row dt {
  margin: 0;
  color: var(--zs-text-secondary);
  font-weight: 500;
}

.crypto-discovery-hub .cdh-list-analytic-summary-row dd {
  margin: 0;
  font-weight: 700;
  color: var(--zs-text-primary);
}

.crypto-discovery-hub .cdh-list-analytic-summary-row dd.is-up {
  color: var(--crypto-coll-ok, #18c37e);
}

.crypto-discovery-hub .cdh-list-analytic-summary-row dd.is-down {
  color: var(--crypto-coll-bad, #ef4444);
}

.crypto-discovery-hub .cdh-list-analytic-empty,
.crypto-discovery-hub .cdh-list-analytic-risk-reason {
  margin: 0.35rem 0 0;
  font-size: 0.625rem;
  line-height: 1.45;
  color: var(--zs-text-secondary);
}

.crypto-discovery-hub .cdh-list-analytic-coins {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.crypto-discovery-hub .cdh-list-analytic-coin {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.3rem 0.4rem;
  padding: 0.25rem 0.3rem;
  border-radius: 0.4rem;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease;
}

.crypto-discovery-hub .cdh-list-analytic-coin--dense {
  gap: 0.25rem 0.35rem;
  padding: 0.2rem 0.25rem;
}

.crypto-discovery-hub .cdh-list-analytic-coin:hover {
  background: rgba(163, 255, 18, 0.06);
}

.crypto-discovery-hub .cdh-list-analytic-coin--compact {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.crypto-discovery-hub .cdh-list-analytic-coin-meta {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-analytic-coin-logo {
  border-radius: 999px;
  object-fit: cover;
}

.crypto-discovery-hub .cdh-list-analytic-coin-sym {
  font-size: 0.6875rem;
  font-weight: 700;
}

.crypto-discovery-hub .cdh-list-analytic-coin-name {
  font-size: 0.5625rem;
  color: var(--zs-text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crypto-discovery-hub .cdh-list-analytic-coin-price {
  font-size: 0.625rem;
  color: var(--zs-text-secondary);
  justify-self: end;
}

.crypto-discovery-hub .cdh-list-analytic-coin-chg {
  font-size: 0.625rem;
  font-weight: 700;
  justify-self: end;
}

.crypto-discovery-hub .cdh-list-analytic-coin-chg.is-up {
  color: var(--crypto-coll-ok, #18c37e);
}

.crypto-discovery-hub .cdh-list-analytic-coin-chg.is-down {
  color: var(--crypto-coll-bad, #ef4444);
}

.crypto-discovery-hub .cdh-list-analytic-risk-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 700;
}

.crypto-discovery-hub .cdh-list-analytic-risk-badge.is-low {
  background: rgba(24, 195, 126, 0.12);
  color: var(--crypto-coll-ok, #18c37e);
  border: 1px solid rgba(24, 195, 126, 0.25);
}

.crypto-discovery-hub .cdh-list-analytic-risk-badge.is-medium {
  background: rgba(245, 158, 11, 0.12);
  color: #f59e0b;
  border: 1px solid rgba(245, 158, 11, 0.25);
}

.crypto-discovery-hub .cdh-list-analytic-risk-badge.is-high {
  background: rgba(239, 68, 68, 0.12);
  color: var(--crypto-coll-bad, #ef4444);
  border: 1px solid rgba(239, 68, 68, 0.25);
}

/* Smart preview grids â€” cards never stretch full width alone */
.crypto-discovery-hub .cdh-list-detail-preview-grid {
  display: grid;
  gap: 0.45rem;
  width: 100%;
  align-items: stretch;
}

.crypto-discovery-hub .cdh-list-detail-preview-grid--n2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crypto-discovery-hub .cdh-list-detail-preview-grid--n3 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crypto-discovery-hub .cdh-list-detail-preview-grid--n4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crypto-discovery-hub .cdh-list-detail-preview-grid--n6 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crypto-discovery-hub .cdh-list-detail-preview-grid--n8 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 640px) {
  .crypto-discovery-hub .cdh-list-detail-preview-grid--n6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .crypto-discovery-hub .cdh-list-detail-preview-grid--n8 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.crypto-discovery-hub .cdh-list-detail-preview-item {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  height: 100%;
  padding: 0.45rem 0.5rem;
  border-radius: 0.55rem;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.05);
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease, border-color 0.15s ease;
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail-preview-item--dense {
  gap: 0.28rem;
  padding: 0.38rem 0.42rem;
}

.crypto-discovery-hub .cdh-list-detail-preview-item:hover {
  background: rgba(163, 255, 18, 0.06);
  border-color: rgba(163, 255, 18, 0.15);
}

.crypto-discovery-hub .cdh-list-detail-preview-logo {
  border-radius: 999px;
  object-fit: cover;
}

.crypto-discovery-hub .cdh-list-detail-preview-meta {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}

.crypto-discovery-hub .cdh-list-detail-preview-sym {
  font-size: 0.6875rem;
  font-weight: 700;
}

.crypto-discovery-hub .cdh-list-detail-preview-name {
  font-size: 0.5625rem;
  color: var(--zs-text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crypto-discovery-hub .cdh-list-detail-preview-quote {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.25rem;
  margin-top: auto;
}

.crypto-discovery-hub .cdh-list-detail-preview-price {
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--zs-text-primary);
}

.crypto-discovery-hub .cdh-list-detail-preview-chg {
  font-size: 0.625rem;
  font-weight: 600;
}

.crypto-discovery-hub .cdh-list-detail-preview-chg.is-up {
  color: var(--crypto-coll-ok, #18c37e);
}

.crypto-discovery-hub .cdh-list-detail-preview-chg.is-down {
  color: var(--crypto-coll-bad, #ef4444);
}

/* Compact density: tighter 2-col analysis, inline preview */
.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-analysis-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-analytic-card--preview {
  grid-column: 1 / -1;
}

.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-preview-grid--n2,
.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-preview-grid--n3,
.crypto-discovery-hub .cdh-list-detail--compact .cdh-list-detail-preview-grid--n4 {
  max-width: none;
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
}

/* Medium density */
.crypto-discovery-hub .cdh-list-detail--medium .cdh-list-detail-analysis-grid {
  gap: 0.55rem;
}

@media (min-width: 768px) {
  .crypto-discovery-hub .cdh-list-detail--medium .cdh-list-detail-analysis-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Full density */
.crypto-discovery-hub .cdh-list-detail--full .cdh-list-detail-analysis-grid {
  gap: 0.6rem;
}

@media (min-width: 768px) {
  .crypto-discovery-hub .cdh-list-detail--full .cdh-list-detail-analysis-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .crypto-discovery-hub .cdh-list-detail--full .cdh-list-detail-analysis-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crypto-discovery-hub .cdh-list-detail--full .cdh-list-analytic-card--preview {
    grid-column: 1 / -1;
  }
}

.crypto-discovery-hub .cdh-list-detail--empty {
  padding: 1.25rem 1rem;
  text-align: center;
}

.crypto-discovery-hub .cdh-list-detail-empty-msg {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--zs-text-secondary);
}

.crypto-discovery-hub .cdh-list-card.is-muted {
  opacity: 0.72;
}

.crypto-discovery-hub .cdh-list-detail-pulse {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.crypto-discovery-hub .cdh-list-detail-pulse-label {
  margin-bottom: 0.35rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--crypto-coll-muted, var(--zs-text-secondary));
}

.crypto-discovery-hub .cdh-list-detail-pulse .mt-4 {
  margin-top: 0 !important;
}

.crypto-discovery-hub .cdh-list-detail-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.65rem;
  padding-top: 0.65rem;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.crypto-discovery-hub .cdh-list-detail-view-btn {
  padding: 0.5rem 1rem;
  border-radius: 0.55rem;
  border: 1px solid rgba(163, 255, 18, 0.35);
  background: rgba(163, 255, 18, 0.1);
  color: var(--crypto-coll-ok, #18c37e);
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.crypto-discovery-hub .cdh-list-detail-view-btn:hover {
  background: rgba(163, 255, 18, 0.16);
  border-color: rgba(163, 255, 18, 0.5);
}

html.light .crypto-discovery-hub .cdh-list-detail,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-list-detail {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

html.light .crypto-discovery-hub .cdh-list-detail-info,
html.light .crypto-discovery-hub .cdh-list-analytic-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-list-detail-info,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-list-analytic-card {
  background: rgba(0, 0, 0, 0.02);
  border-color: rgba(0, 0, 0, 0.06);
}

html.light .crypto-discovery-hub .cdh-list-detail-preview-item,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-list-detail-preview-item {
  background: rgba(0, 0, 0, 0.02);
  border-color: rgba(0, 0, 0, 0.06);
}


/* â”€â”€ Table filter bar â”€â”€ */
.cdh-table-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.85rem;
  padding: 0.55rem 0.75rem;
  border-radius: 0.55rem;
  background: rgba(24, 195, 126, 0.08);
  border: 1px solid rgba(24, 195, 126, 0.22);
}

.cdh-table-filter-label {
  font-size: 0.78rem;
  color: var(--zs-text-secondary);
}

.cdh-table-filter-label strong {
  color: var(--zs-green-primary, #18c37e);
}

.cdh-table-filter-clear {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--zs-green-primary, #18c37e);
  background: transparent;
  border: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* â”€â”€ New coins row â”€â”€ */
.cdh-scroll-wrap {
  position: relative;
}

.cdh-scroll-btn {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.55);
  color: var(--zs-text-primary);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}

.cdh-scroll-btn:focus {
  outline: none;
}

.cdh-scroll-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-green, #18c37e) 45%, transparent);
  outline-offset: 2px;
}

@media (min-width: 768px) {
  .cdh-scroll-btn {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cdh-scroll-btn--prev {
    inset-inline-start: 0;
  }
  .cdh-scroll-btn--next {
    inset-inline-end: 0;
  }
}

.cdh-new-row {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 4px 2px 8px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.cdh-new-row::-webkit-scrollbar {
  display: none;
}

/* Professional responsive grid for newest coins */
.ncd-coins-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.ncd-section-count {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.42);
  font-variant-numeric: tabular-nums;
}

.ncd-show-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

.ncd-show-more {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(255, 255, 255, 0.88);
  border-radius: 999px;
  padding: 0.55rem 1.35rem;
  font-size: 0.8125rem;
  font-weight: 650;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease;
}

.ncd-show-more:hover {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.055);
}

.ncd-show-more:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-green, #18c37e) 45%, transparent);
  outline-offset: 2px;
}

/* Institutional launch cards (newest-coins grid) */
.ncd-coin-card {
  flex: initial;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  max-height: none;
  box-sizing: border-box;
  scroll-snap-align: unset;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 8px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.055);
  background: #0a0d0b;
  box-shadow: none;
  cursor: pointer;
  text-align: start;
  color: inherit;
  font: inherit;
  overflow: hidden;
  transform: none;
  transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.ncd-coin-card:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 255, 255, 0.11);
  background: #0c100d;
}

.ncd-coin-card:focus {
  outline: none;
}

.ncd-coin-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-green, #18c37e) 45%, transparent);
  outline-offset: 2px;
}

.ncd-coin-card--skel {
  animation: cdh-pulse 1.2s ease-in-out infinite;
  cursor: default;
  pointer-events: none;
}

.ncd-coin-card--skel:hover {
  transform: none;
  border-color: rgba(255, 255, 255, 0.055);
  background: #0a0d0b;
}

@keyframes cdh-pulse {
  0%,
  100% {
    opacity: 0.45;
  }
  50% {
    opacity: 0.85;
  }
}

.ncd-coin-top {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  width: 100%;
  text-align: start;
}

.ncd-coin-id {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
  gap: 0;
}

.ncd-coin-primary {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.ncd-coin-stats {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px 12px;
  width: 100%;
  margin: 0;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
}

/* Shared circular token logo containment â€” never let artwork size layout */
.new-token-logo {
  position: relative;
  width: 36px;
  height: 36px;
  min-width: 36px;
  flex: 0 0 36px;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-sizing: border-box;
}

.new-token-logo img,
.new-token-logo-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  opacity: 0;
  transition: opacity 220ms ease;
}

.new-token-logo-img.is-loaded {
  opacity: 1;
}

.new-token-logo-fallback {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  overflow: hidden;
  opacity: 0;
  animation: ntl-fallback-in 240ms ease forwards;
  background:
    radial-gradient(120% 90% at 28% 18%, color-mix(in srgb, var(--ntl-c0, #2a2e34) 88%, transparent) 0%, transparent 58%),
    linear-gradient(152deg, var(--ntl-c0, #2a2e34) 0%, var(--ntl-c1, #16191e) 48%, var(--ntl-c2, #1c2026) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-sizing: border-box;
}

.new-token-logo-fallback-pattern {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0.35;
  background-image:
    radial-gradient(circle at 70% 78%, rgba(255, 255, 255, 0.06) 0%, transparent 42%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, transparent 46%),
    repeating-linear-gradient(
      -28deg,
      transparent 0,
      transparent 5px,
      rgba(255, 255, 255, 0.018) 5px,
      rgba(255, 255, 255, 0.018) 6px
    );
  mix-blend-mode: soft-light;
}

.new-token-logo-fallback-glyph {
  position: relative;
  z-index: 1;
  display: block;
  font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  line-height: 1;
  color: var(--ntl-ink, rgba(226, 232, 240, 0.78));
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  user-select: none;
  transform: translateY(0.5px);
}

.new-token-logo.is-mono-1 .new-token-logo-fallback-glyph {
  font-size: 0.8rem;
  letter-spacing: 0.02em;
  font-weight: 600;
}

.new-token-logo.is-mono-2 .new-token-logo-fallback-glyph {
  font-size: 0.62rem;
  letter-spacing: 0.06em;
}

.new-token-logo.is-fallback {
  background: transparent;
  border-color: transparent;
}

.new-token-logo--carousel .new-token-logo-fallback-glyph {
  font-size: 0.78rem;
}

.new-token-logo--carousel.is-mono-2 .new-token-logo-fallback-glyph {
  font-size: 0.68rem;
}

.new-token-logo--rank .new-token-logo-fallback-glyph {
  font-size: 0.58rem;
}

.new-token-logo--rank.is-mono-2 .new-token-logo-fallback-glyph {
  font-size: 0.5rem;
  letter-spacing: 0.04em;
}

.new-token-logo--table .new-token-logo-fallback-glyph {
  font-size: 0.64rem;
}

.new-token-logo--table.is-mono-2 .new-token-logo-fallback-glyph {
  font-size: 0.55rem;
}

@keyframes ntl-fallback-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.new-token-logo-src {
  position: absolute;
  right: -2px;
  bottom: -2px;
  z-index: 2;
  min-width: 14px;
  padding: 1px 3px;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.75);
  color: #9ae6b4;
  font-size: 7px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  pointer-events: none;
  text-transform: uppercase;
}

.new-token-logo-skel {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, 0.04) 20%,
    rgba(255, 255, 255, 0.1) 40%,
    rgba(255, 255, 255, 0.04) 60%
  );
  background-size: 200% 100%;
  animation: cdh-pulse 1.2s ease-in-out infinite;
}

.new-token-logo--carousel {
  width: 40px;
  height: 40px;
  min-width: 40px;
  flex: 0 0 40px;
}

.new-token-logo--rank {
  width: 28px;
  height: 28px;
  min-width: 28px;
  flex: 0 0 28px;
}

.new-token-logo--table {
  width: 32px;
  height: 32px;
  min-width: 32px;
  flex: 0 0 32px;
}

.ncd-coin-sym {
  display: block;
  margin-top: 0;
  max-width: 100%;
  min-width: 0;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.25;
  color: #f5f5f5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: start;
}

.ncd-coin-name {
  display: block;
  margin-top: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font-size: 11px;
  line-height: 1.3;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.48);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: start;
}

.ncd-coin-price {
  margin-top: 0;
  min-width: 0;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.2;
  color: #f5f5f5;
  font-variant-numeric: tabular-nums;
  unicode-bidi: isolate;
  text-align: start;
}

.ncd-coin-change {
  margin-top: 0;
  flex: 0 0 auto;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  unicode-bidi: isolate;
  text-align: end;
  color: rgba(255, 255, 255, 0.46);
}

.ncd-coin-change.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.ncd-coin-change.is-down {
  color: var(--zs-red, #ef4444);
}

.ncd-coin-genesis {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  margin-top: 10px;
  min-width: 0;
  width: 100%;
}

.ncd-coin-genesis-label {
  font-size: 10px;
  font-weight: 500;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.42);
}

.ncd-coin-genesis-value {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.72);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.ncd-page-empty {
  width: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 40px;
  padding: 32px 24px;
  background: #090b0a;
  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 14px;
  box-sizing: border-box;
}

.ncd-coin-change.is-flat {
  color: rgba(255, 255, 255, 0.46);
}

.ncd-coin-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
  min-width: 0;
}

.ncd-coin-meta--single {
  grid-template-columns: minmax(0, 1fr);
}

.ncd-coin-meta-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 0;
  text-align: start;
}

.ncd-coin-meta-label {
  display: block;
  margin-bottom: 2px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
  color: rgba(255, 255, 255, 0.38);
}

.ncd-coin-meta-value {
  display: block;
  margin-top: 0;
  min-width: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  color: rgba(255, 255, 255, 0.82);
  font-variant-numeric: tabular-nums;
  unicode-bidi: isolate;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (prefers-reduced-motion: reduce) {
  .ncd-coin-card,
  .cdh-scroll-btn {
    transition: none;
  }

  .ncd-coin-card:hover {
    transform: none;
  }

  .ncd-coin-card--skel {
    animation: none;
  }
}

@media (max-width: 1099px) {
  .ncd-coins-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ncd-coin-card {
    min-height: 0;
  }
}

@media (max-width: 699px) {
  .ncd-coins-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .ncd-coin-card {
    min-height: 0;
    padding: 14px;
  }
}

/* ── New Coins Dashboard (ncd-*) — foundation / header / KPI / section rhythm ── */
.ncd-page {
  /* Match healthy tab shells: fill the discovery wrapper, no nested 1500px island */
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding: 32px 32px 48px;
  direction: rtl;
  box-sizing: border-box;
  overflow-x: clip;
  min-width: 0;
  text-align: right;
}

.ncd-page > * {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.ncd-header {
  text-align: right;
  padding: 8px 0 0;
  margin: 0 0 32px;
}

.ncd-title {
  margin: 0;
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.15;
  font-weight: 700;
  color: #f5f5f5;
}

.ncd-subtitle {
  margin: 10px 0 0;
  max-width: 680px;
  font-size: 14px;
  line-height: 1.75;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.56);
}

.ncd-disclosure {
  margin: 12px 0 0;
  max-width: 720px;
  font-size: 12px;
  line-height: 1.65;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.42);
}

.ncd-kpi-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 1px;
  padding: 0;
  margin: 0 0 40px;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 12px;
  overflow: hidden;
}

.ncd-kpi {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  min-height: 108px;
  padding: 20px 22px;
  background: #0a0a0a;
  border: none;
  box-shadow: none;
  transform: none;
}

.ncd-kpi-label {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.48);
}

.ncd-kpi-value {
  margin: 10px 0 0;
  font-size: clamp(25px, 2vw, 32px);
  line-height: 1;
  font-weight: 700;
  color: #f5f5f5;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-kpi-hint {
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.46);
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-kpi-value.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.ncd-kpi-value.is-down {
  color: var(--zs-red, #ef4444);
}

.ncd-featured,
.ncd-insights,
.ncd-lists,
.ncd-table-section {
  width: 100%;
  min-width: 0;
  margin: 0 0 40px;
  padding: 0;
}

.ncd-table-section {
  margin-bottom: 0;
}

.ncd-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 16px;
  min-width: 0;
  text-align: right;
}

.ncd-section-heading {
  min-width: 0;
  text-align: right;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.ncd-section-title {
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #f5f5f5;
  text-align: right;
}

.ncd-section-subtitle {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.6;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
  text-align: right;
}

.ncd-featured {
  padding: 16px;
  background: #090b0a;
  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 14px;
  overflow: hidden;
}

.ncd-insights {
  display: grid;
  /*
   * 6-track board: each panel spans 2 → 3 equal columns.
   * With 5 panels (category widget removed), last two span 3 each
   * so the final row fills the full content width — no phantom empty track.
   */
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.ncd-lists {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.ncd-insights > .ncd-section-header,
.ncd-lists > .ncd-section-header {
  grid-column: 1 / -1;
}

.ncd-insights > .ncd-insight-panel {
  grid-column: span 2;
  min-width: 0;
}

/* Incomplete last row after category removal: two panels → half / half */
.ncd-insights > .ncd-insight-panel:nth-child(5),
.ncd-insights > .ncd-insight-panel:nth-child(6) {
  grid-column: span 3;
}

.ncd-insight-panel,
.ncd-list-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 22px;
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 12px;
  box-sizing: border-box;
}

.ncd-insight-panel {
  min-height: 240px;
  height: 100%;
}

.ncd-list-panel {
  /* Fits widget header + divider + five 48px rows */
  min-height: 348px;
  height: 100%;
}

.ncd-widget-header {
  flex-shrink: 0;
  min-width: 0;
  text-align: right;
}

.ncd-widget-title {
  margin: 0;
  font-size: 18px;
  line-height: 1.3;
  font-weight: 700;
  color: #f5f5f5;
  text-align: right;
}

.ncd-widget-subtitle {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
  text-align: right;
}

.ncd-widget-divider {
  flex-shrink: 0;
  height: 1px;
  margin: 14px 0 0;
  background: rgba(255, 255, 255, 0.055);
  border: 0;
}

.ncd-widget-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  justify-content: center;
}

.ncd-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 0;
  padding: 8px 6px;
  text-align: center;
}

.ncd-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: rgba(255, 255, 255, 0.34);
}

.ncd-empty-icon svg {
  width: 100%;
  height: 100%;
}

.ncd-empty-title {
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}

.ncd-empty-desc {
  margin: 6px 0 0;
  max-width: 220px;
  font-size: 11px;
  line-height: 1.55;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.42);
}

/* Compact ranked lists â€” never image galleries */
.ncd-rank-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
  flex: 1;
  justify-content: flex-start;
}

.ncd-rank-list > li {
  min-width: 0;
  width: 100%;
}

.ncd-rank-row {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 52px;
  min-height: 52px;
  max-height: 52px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0 2px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: start;
  font: inherit;
}

.ncd-rank-list > li:last-child .ncd-rank-row {
  border-bottom: 0;
}

.ncd-rank-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.ncd-rank-sym {
  display: block;
  max-width: 100%;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  color: #f5f5f5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-rank-name {
  display: block;
  max-width: 100%;
  font-size: 11px;
  line-height: 1.3;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ncd-rank-value {
  margin-inline-start: auto;
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
  color: rgba(255, 255, 255, 0.82);
}

.ncd-rank-value.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.ncd-rank-value.is-down {
  color: var(--zs-red, #ef4444);
}

.ncd-rank-value.is-flat {
  color: rgba(255, 255, 255, 0.46);
}

/* Active networks â€” compact name â€¦ count rows */
.ncd-network-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
  flex: 1;
  justify-content: flex-start;
}

.ncd-network-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.ncd-network-list > .ncd-network-row:last-child {
  border-bottom: 0;
}

.ncd-network-name {
  min-width: 0;
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: #f5f5f5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-network-count {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
  color: rgba(255, 255, 255, 0.88);
}

.ncd-pulse-list,
.ncd-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
  flex: 1;
  justify-content: flex-start;
}

.ncd-pulse-row,
.ncd-list-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.ncd-pulse-row {
  min-height: 28px;
  padding: 4px 0;
}

.ncd-pulse-row:last-child,
.ncd-list li:last-child .ncd-list-row {
  border-bottom: 0;
}

.ncd-list-row {
  height: 48px;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0 4px;
  margin: 0 -4px;
  text-align: start;
  font: inherit;
  border-radius: 6px;
  transition: background-color 160ms ease;
}

.ncd-list-row:hover {
  background: rgba(255, 255, 255, 0.025);
}

.ncd-list-row:focus {
  outline: none;
}

.ncd-list-row:focus-visible {
  background: rgba(255, 255, 255, 0.035);
  outline: 2px solid color-mix(in srgb, var(--brand-green, #18c37e) 45%, transparent);
  outline-offset: 0;
}

.ncd-list-primary {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.ncd-pulse-label,
.ncd-list-sym {
  font-size: 13px;
  font-weight: 500;
  min-width: 0;
  color: rgba(255, 255, 255, 0.78);
}

.ncd-list-sym {
  font-weight: 700;
  color: #f5f5f5;
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-list-name {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font-size: 11px;
  line-height: 1.3;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.42);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ncd-pulse-value,
.ncd-list-meta {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
  direction: ltr;
  unicode-bidi: isolate;
  color: #f5f5f5;
}

.ncd-pulse-value.is-up,
.ncd-list-meta.is-up,
.ncd-table-cell--change.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.ncd-pulse-value.is-down,
.ncd-list-meta.is-down,
.ncd-table-cell--change.is-down {
  color: var(--zs-red, #ef4444);
}

.ncd-list-meta.is-flat {
  color: rgba(255, 255, 255, 0.46);
}

@media (prefers-reduced-motion: reduce) {
  .ncd-list-row {
    transition: none;
  }
}

.ncd-table-section {
  padding: 24px;
  background: #090909;
  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 14px;
  min-width: 0;
}

.ncd-table-section-header {
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 16px;
}

.ncd-table-sort {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 0.85rem;
}

.ncd-table-sort-btn {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: transparent;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.3;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  cursor: pointer;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease;
}

.ncd-table-sort-btn:hover {
  color: rgba(255, 255, 255, 0.88);
  border-color: rgba(255, 255, 255, 0.18);
}

.ncd-table-sort-btn.is-active {
  color: #0f172a;
  border-color: rgba(22, 163, 74, 0.35);
  background: rgba(22, 163, 74, 0.12);
}

.ncd-table-sort-btn:focus-visible {
  outline: 2px solid rgba(22, 163, 74, 0.45);
  outline-offset: 2px;
}

.ncd-table-count {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.46);
}

.ncd-table-count-value {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.78);
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-table-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ncd-table {
  --ncd-table-cols: minmax(220px, 1.5fr) minmax(130px, 0.8fr) minmax(120px, 0.7fr)
    minmax(140px, 0.8fr) minmax(150px, 0.9fr);
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.ncd-table--onchain {
  /*
   * Institutional explorer contract (RTL visual order R→L):
   * Asset absorbs leftover width; Network/Age stay compact fixed tracks;
   * numeric columns stay compact with modest fr — never give Network a large fr.
   */
  --ncd-table-cols: minmax(220px, 2.8fr) minmax(92px, 108px) minmax(104px, 0.55fr)
    minmax(92px, 0.45fr) minmax(88px, 0.5fr) minmax(96px, 0.55fr) minmax(88px, 108px);
  /* Prefer local horizontal scroll over crushing cells until values collide */
  min-width: 920px;
}

.ncd-table-head,
.ncd-table-row {
  display: grid;
  grid-template-columns: var(--ncd-table-cols);
  align-items: center;
  width: 100%;
  min-width: 0;
  padding-inline: 16px;
  box-sizing: border-box;
  column-gap: 12px;
}

.ncd-table-head {
  min-height: 48px;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.ncd-table-head .ncd-table-cell {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.46);
  text-transform: none;
}

.ncd-table-row {
  min-height: 60px;
  margin: 0;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.045);
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
  box-shadow: none;
  transform: none;
  transition: background-color 160ms ease;
}

.ncd-table-row:hover {
  background: rgba(255, 255, 255, 0.022);
}

.ncd-table-row:focus {
  outline: none;
}

.ncd-table-row:focus-visible {
  background: rgba(255, 255, 255, 0.035);
  outline: 2px solid color-mix(in srgb, var(--brand-green, #18c37e) 45%, transparent);
  outline-offset: -2px;
}

.ncd-table-cell {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: start;
  padding-inline: 4px;
  box-sizing: border-box;
  font-variant-numeric: tabular-nums;
  unicode-bidi: isolate;
}

.ncd-table-cell--network {
  direction: ltr;
  unicode-bidi: isolate;
  justify-content: flex-end;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}

.ncd-table-cell--price,
.ncd-table-cell--change,
.ncd-table-cell--vol,
.ncd-table-cell--mcap,
.ncd-table-cell--liq {
  font-weight: 600;
  direction: ltr;
  unicode-bidi: isolate;
  /* Keep LTR finance tokens on the trailing edge so they never kiss the next RTL cell */
  justify-content: flex-end;
  text-align: end;
  white-space: nowrap;
}

.ncd-table-cell--price {
  font-size: 13px;
  color: #f5f5f5;
}

.ncd-table-cell--change {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.46);
}

.ncd-table-cell--change.is-flat,
.ncd-table-cell.is-empty {
  color: rgba(255, 255, 255, 0.38);
  font-weight: 600;
}

.ncd-table-cell--vol,
.ncd-table-cell--mcap,
.ncd-table-cell--liq {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.82);
}

.ncd-table-cell--age {
  direction: rtl;
  unicode-bidi: isolate;
  justify-content: flex-start;
  text-align: start;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}

.ncd-table-coin {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
}

.ncd-table-coin-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  max-width: 100%;
}

.ncd-table-sym {
  display: block;
  max-width: 100%;
  min-width: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  color: #f5f5f5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: ltr;
  unicode-bidi: isolate;
}

.ncd-table-name {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font-size: 11px;
  line-height: 1.3;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ncd-table-genesis {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.4);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ncd-table-mobile-meta {
  display: none;
  align-items: center;
  gap: 4px;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.42);
  font-variant-numeric: tabular-nums;
}

.ncd-table-mobile-sep {
  opacity: 0.7;
}

.ncd-table-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 96px;
  padding: 24px 16px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
}

@media (prefers-reduced-motion: reduce) {
  .ncd-table-row {
    transition: none;
  }
}

@media (max-width: 767px) {
  .ncd-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ncd-table,
  .ncd-table--onchain {
    --ncd-table-cols: minmax(0, 1.5fr) minmax(100px, 0.75fr) minmax(88px, 0.65fr);
    min-width: 0;
  }

  .ncd-table-col--desktop {
    display: none;
  }

  .ncd-table-mobile-meta {
    display: inline-flex;
  }

  .ncd-table-head,
  .ncd-table-row {
    padding-inline: 12px;
  }
}

@media (max-width: 1099px) {
  .ncd-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ncd-kpi-strip > .ncd-kpi:last-child {
    grid-column: 1 / -1;
  }

  .ncd-insights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ncd-insights > .ncd-insight-panel,
  .ncd-insights > .ncd-insight-panel:nth-child(5),
  .ncd-insights > .ncd-insight-panel:nth-child(6) {
    grid-column: auto;
  }

  .ncd-lists {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ncd-insights > .ncd-insight-panel:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 699px) {
  .ncd-page {
    padding: 24px 16px 40px;
  }

  .ncd-header {
    margin-bottom: 24px;
  }

  .ncd-kpi-strip,
  .ncd-insights,
  .ncd-lists {
    grid-template-columns: 1fr;
  }

  .ncd-kpi-strip > .ncd-kpi:last-child,
  .ncd-insights > .ncd-insight-panel,
  .ncd-insights > .ncd-insight-panel:nth-child(5),
  .ncd-insights > .ncd-insight-panel:nth-child(6),
  .ncd-insights > .ncd-insight-panel:last-child {
    grid-column: auto;
  }

  .new-token-logo--carousel {
    width: 32px;
    height: 32px;
    min-width: 32px;
    flex: 0 0 32px;
  }

  .new-token-logo--table {
    width: 30px;
    height: 30px;
    min-width: 30px;
    flex: 0 0 30px;
  }

  .ncd-network-row {
    min-height: 40px;
    gap: 10px;
  }

  .ncd-rank-row {
    gap: 8px;
  }

  .ncd-rank-value,
  .ncd-network-count {
    font-size: 12px;
  }

  .ncd-featured,
  .ncd-table-section {
    padding: 16px;
  }
}

/* ── Ideas (Market Intelligence cards — premium polish) ── */
.cdh-ideas-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.85rem;
  min-height: 0;
  height: auto;
  align-content: start;
  align-items: stretch;
  justify-content: stretch;
  justify-items: stretch;
}

/*
 * Ideas-only vertical rhythm (do not change global tab margins for other tabs).
 * Target: tabs → heading ≈ 48–64px; heading → sub ≈ 8px; sub/meta → cards ≈ 28–36px.
 */
.crypto-discovery-hub:has(.cdh-ideas-section) .cdh-section-tabs {
  margin-bottom: 1rem;
}

.cdh-ideas-section {
  padding: 0 0 1.25rem;
  overflow: hidden;
}

.crypto-discovery-hub .cdh-section.cdh-ideas-section {
  padding-top: 2rem;
  padding-bottom: 2.5rem;
}

.cdh-ideas-section > .cdh-ideas-grid {
  margin: 2rem clamp(16px, 2vw, 24px) 0;
}

.cdh-ideas-section > .cdh-ideas-empty {
  margin-inline: clamp(16px, 2vw, 24px);
}

@media (min-width: 768px) {
  .cdh-ideas-grid,
  .cdh-ideas-grid[data-count='2'],
  .cdh-ideas-grid[data-count='3'],
  .cdh-ideas-grid[data-count='4'],
  .cdh-ideas-grid[data-count='5'],
  .cdh-ideas-grid[data-count='6plus'] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
    justify-content: stretch;
    justify-items: stretch;
  }

  /* Single card keeps institutional width — never full-bleed */
  .cdh-ideas-grid[data-count='1'] {
    grid-template-columns: minmax(0, 34rem);
    max-width: 34rem;
    width: 100%;
  }
}

/*
 * Desktop adaptive columns from rendered count:
 * 1 → one institutional-width card
 * 2 → 2 cols
 * 3 → 3 cols
 * 4 → 2×2 balanced
 * 5 / 6+ → 3 cols (incomplete rows stay on start tracks)
 */
@media (min-width: 1280px) {
  .cdh-ideas-grid[data-count='1'] {
    grid-template-columns: minmax(0, 34rem);
    max-width: 34rem;
    width: 100%;
  }

  .cdh-ideas-grid[data-count='2'],
  .cdh-ideas-grid[data-count='4'] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
    justify-content: stretch;
    justify-items: stretch;
  }

  .cdh-ideas-grid[data-count='3'],
  .cdh-ideas-grid[data-count='5'],
  .cdh-ideas-grid[data-count='6plus'] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: none;
    justify-content: stretch;
    justify-items: stretch;
  }
}

.cdh-ideas-head {
  display: block;
  margin: 0;
  padding: 0 clamp(16px, 2vw, 24px);
  text-align: start;
}

.cdh-ideas-head-copy {
  min-width: 0;
}

.cdh-ideas-head .cdh-section-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--zs-text-primary);
}

.cdh-ideas-head .cdh-section-sub {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.58);
}

.cdh-ideas-head-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 20px;
  margin-top: 8px;
}

.cdh-ideas-head-meta .cdh-idea-source-pill--section {
  margin-top: 0;
}

.cdh-ideas-head-meta .cdh-idea-source-pill--section:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.35);
  outline-offset: 2px;
}

.cdh-ideas-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  min-height: 0;
  margin: 0 24px;
  padding-block: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
  border-bottom: 1px solid rgba(255, 255, 255, 0.055);
  min-width: 0;
}

.cdh-ideas-sort {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-shrink: 0;
}

.cdh-ideas-group-label {
  flex-shrink: 0;
  margin-inline-end: 6px;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.38);
  white-space: nowrap;
}

.cdh-ideas-sort-dropdown {
  position: relative;
  min-width: 154px;
  max-width: min(100%, 14rem);
}

.cdh-ideas-sort-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  height: 34px;
  padding-inline: 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.88);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  text-align: start;
  cursor: pointer;
}

.cdh-ideas-sort-trigger:hover {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.055);
}

.cdh-ideas-sort-trigger:focus-visible,
.cdh-ideas-sort-option:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.35);
  outline-offset: 2px;
}

.cdh-ideas-sort-chevron {
  width: 7px;
  height: 7px;
  flex-shrink: 0;
  border-inline-end: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  opacity: 0.6;
}

.cdh-ideas-sort-menu {
  position: absolute;
  z-index: 40;
  inset-block-start: calc(100% + 5px);
  inset-inline: 0;
  width: 100%;
  max-height: min(260px, calc(100vh - 32px));
  overflow-y: auto;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 0.5rem;
  background: #111412;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
}

.cdh-ideas-sort-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  width: 100%;
  min-height: 34px;
  padding: 0.45rem 0.55rem;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: rgba(255, 255, 255, 0.68);
  font: inherit;
  font-size: 0.76rem;
  font-weight: 500;
  line-height: 1.3;
  text-align: start;
  cursor: pointer;
}

.cdh-ideas-sort-option:hover,
.cdh-ideas-sort-option:focus-visible {
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.92);
}

.cdh-ideas-sort-option.is-selected {
  background: rgba(255, 255, 255, 0.085);
  color: #fff;
}

.cdh-ideas-sort-check {
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.7);
}

.cdh-ideas-filter-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.cdh-ideas-filter-chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.cdh-ideas-filter-chip {
  flex-shrink: 0;
  height: 30px;
  margin: 0;
  padding-inline: 11px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: transparent;
  color: rgba(255, 255, 255, 0.68);
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
  white-space: nowrap;
}

.cdh-ideas-filter-chip.is-active {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.055);
  color: rgba(255, 255, 255, 0.94);
}

.cdh-ideas-filter-clear {
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.5);
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}

.cdh-ideas-filter-clear:hover {
  color: rgba(255, 255, 255, 0.72);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.cdh-ideas-filter-chip:focus-visible,
.cdh-ideas-filter-clear:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.35);
  outline-offset: 2px;
}

.cdh-ideas-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  width: 100%;
  min-height: 0;
  margin: 0.35rem 0 0.5rem;
  padding: 1.5rem 1rem;
  text-align: center;
}

.cdh-ideas-empty strong {
  font-size: 0.95rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.88);
}

.cdh-ideas-empty p {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.52);
}

.cdh-ideas-empty button {
  margin-top: 0.35rem;
  padding: 0.42rem 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.45rem;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.78);
  font: inherit;
  font-size: 0.74rem;
  font-weight: 600;
  cursor: pointer;
}

.cdh-ideas-empty button:hover {
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.cdh-ideas-empty button:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.35);
  outline-offset: 2px;
}

.cdh-idea-card--mi {
  display: flex;
  flex-direction: column;
  min-height: 17.5rem;
  height: 100%;
  border-radius: 0.65rem;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.055);
  background: linear-gradient(168deg, #121212 0%, #0a0a0a 72%, #080808 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 8px 20px rgba(0, 0, 0, 0.28);
  text-decoration: none;
  font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
  font-synthesis: none;
  letter-spacing: 0;
  text-rendering: geometricPrecision;
  transition:
    border-color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}

.cdh-idea-card--mi:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 12px 28px rgba(0, 0, 0, 0.38);
}

.cdh-idea-card-hit {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
  padding: 0.8rem 0.85rem 0.7rem;
  margin: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
  font: inherit;
}

/*
 * Hit target is a <button> inside overflow:hidden card chrome.
 * UA :focus-visible outline (auto / rgb(16,16,16)) clips to a harsh
 * black top/side edge — replace with institutional focus on the card.
 */
.cdh-idea-card-hit:focus {
  outline: none;
}

.cdh-idea-card-hit:focus-visible {
  outline: none;
}

.cdh-idea-card--mi:has(> .cdh-idea-card-hit:focus-visible) {
  outline: 2px solid rgba(163, 255, 18, 0.45);
  outline-offset: 2px;
}

.cdh-idea-mi-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.55rem;
  margin-bottom: 0.42rem;
}

.cdh-idea-mi-asset {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.cdh-idea-mi-logo,
.cdh-idea-mi-logo-fallback {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.cdh-idea-mi-logo {
  object-fit: cover;
  background: transparent;
  display: block;
  opacity: 1;
}

.cdh-idea-mi-logo-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.06);
  font-size: 0.68rem;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.55);
}

.cdh-idea-mi-asset-text {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0;
}

.cdh-idea-mi-symbol {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.15;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-mi-quote {
  display: flex;
  align-items: baseline;
  gap: 0.32rem;
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-mi-price {
  font-size: 12.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.cdh-idea-mi-quote .is-up,
.cdh-idea-mi-quote .is-down {
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.cdh-idea-mi-quote--pending {
  color: rgba(255, 255, 255, 0.35);
}

.cdh-idea-mi-quote .is-up {
  color: #4ade80;
}

.cdh-idea-mi-quote .is-down {
  color: #f87171;
}

.cdh-idea-mi-scoreblock {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.22rem;
  flex-shrink: 0;
}

.cdh-idea-status {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem 0.38rem;
  border-radius: 0.25rem;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  border: 1px solid transparent;
  white-space: nowrap;
}

.cdh-idea-status--strong {
  color: #4ade80;
  background: rgba(74, 222, 128, 0.08);
  border-color: rgba(74, 222, 128, 0.26);
}

.cdh-idea-status--developing {
  color: #facc15;
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.26);
}

.cdh-idea-status--needs_confirmation {
  color: #60a5fa;
  background: rgba(96, 165, 250, 0.08);
  border-color: rgba(96, 165, 250, 0.26);
}

.cdh-idea-status--new {
  color: #a78bfa;
  background: rgba(167, 139, 250, 0.08);
  border-color: rgba(167, 139, 250, 0.26);
}

.cdh-idea-card--skeleton {
  min-height: 17.5rem;
  opacity: 0.45;
  pointer-events: none;
  background: linear-gradient(110deg, #121212 20%, #1a1a1a 40%, #121212 60%);
  background-size: 200% 100%;
}

.cdh-idea-mi-quality {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1;
}

.cdh-idea-mi-quality strong {
  font-size: 26px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-mi-quality strong span {
  font-size: 11px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.38);
  margin-inline-start: 0.08rem;
  letter-spacing: 0;
}

.cdh-idea-mi-quality em {
  font-style: normal;
  font-size: 11px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.4);
  margin-top: 0.14rem;
  letter-spacing: 0;
}

/* 1) Primary — Trading Thesis (denser institutional scale) */
.cdh-idea-mi-thesis {
  margin: 0 0 0.3rem;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0;
  color: #ffffff;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: calc(1.6em * 2);
  min-height: calc(1.6em * 2);
}

.cdh-idea-card--mi:hover .cdh-idea-mi-thesis {
  color: #f4faf7;
}

/* 2) Why Now — real subsection, single line body */
.cdh-idea-mi-whynow {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-bottom: 0.3rem;
  max-height: 2.55rem;
  /* Predictable start line across a row without inventing huge spacers */
  min-height: 2.35rem;
  flex-shrink: 0;
}

.cdh-idea-mi-whynow-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  color: #4ade80;
  line-height: 1.2;
}

.cdh-idea-mi-whynow-text {
  margin: 0;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.68);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cdh-idea-mi-chips {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.28rem;
  margin-bottom: 0.38rem;
  max-height: 1.45rem;
  min-height: 1.35rem;
  overflow: hidden;
  flex-shrink: 0;
}

.cdh-idea-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.16rem 0.42rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.035);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.72);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.cdh-idea-chip--lead {
  border-color: rgba(74, 222, 128, 0.22);
  background: rgba(74, 222, 128, 0.06);
  color: rgba(220, 252, 231, 0.92);
}

/* Footer — premium strip, not a table */
.cdh-idea-mi-foot {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin-top: auto;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
  flex-shrink: 0;
}

.cdh-idea-mi-metric {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  min-width: 0;
  padding-inline: 0.45rem;
  position: relative;
}

.cdh-idea-mi-metric:first-child {
  padding-inline-start: 0;
}

.cdh-idea-mi-metric:last-child {
  padding-inline-end: 0;
}

.cdh-idea-mi-metric:not(:first-child)::before {
  content: '';
  position: absolute;
  inset-block: 0.1rem 0.15rem;
  inset-inline-start: 0;
  width: 1px;
  background: rgba(255, 255, 255, 0.07);
}

.cdh-idea-mi-metric > span {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.38);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.cdh-idea-mi-metric > strong {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.94);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}

.cdh-idea-mi-metric > strong.is-live {
  color: rgba(255, 255, 255, 0.82);
}

.cdh-idea-risk {
  display: inline-flex;
  align-items: center;
  gap: 0.26rem;
}

.cdh-idea-risk i {
  width: 0.32rem;
  height: 0.32rem;
  border-radius: 999px;
  background: currentColor;
  flex-shrink: 0;
}

.cdh-idea-risk--low {
  color: #4ade80;
}

.cdh-idea-risk--medium {
  color: #fb923c;
}

.cdh-idea-risk--high {
  color: #f87171;
}

.cdh-idea-source-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.62rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
  white-space: nowrap;
}

.cdh-idea-source-pill--section {
  margin-top: 0.15rem;
}

/* â”€â”€ Idea Intelligence Modal â€” Institutional Art Direction â”€â”€ */
.cdh-idea-modal-root {
  position: fixed;
  inset: 0;
  z-index: var(--zs-z-d-modal, 2000); /* Desktop V2: modal layer (was 1200) */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  pointer-events: none;
}

.cdh-idea-modal-root.is-open {
  pointer-events: auto;
}

.cdh-idea-modal-overlay {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.78);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity 200ms ease;
}

.cdh-idea-modal-root.is-open .cdh-idea-modal-overlay {
  opacity: 1;
}

.cdh-idea-modal {
  --zs-report-bg: #070908;
  --zs-report-surface: #0b0e0c;
  --zs-report-surface-2: #101411;
  --zs-report-line: rgba(255, 255, 255, 0.055);
  --zs-report-line-strong: rgba(255, 255, 255, 0.09);
  --zs-report-text: rgba(255, 255, 255, 0.96);
  --zs-report-muted: rgba(255, 255, 255, 0.56);
  --zs-report-subtle: rgba(255, 255, 255, 0.34);
  --zs-report-accent: #a3ff12;
  --zs-report-amber: #d6a84a;
  --zs-report-red: #d26a6a;
  --zs-report-dur: 200ms;
  --zs-report-ease: ease;
  position: relative;
  z-index: 1;
  width: min(1080px, calc(100vw - 64px));
  max-height: min(88vh, 940px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: var(--zs-report-bg);
  color: var(--zs-report-muted);
  font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
  font-synthesis: none;
  letter-spacing: 0;
  font-feature-settings: 'kern' 1, 'liga' 1;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 32px 96px rgba(0, 0, 0, 0.72);
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--zs-report-dur) var(--zs-report-ease),
    transform var(--zs-report-dur) var(--zs-report-ease);
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

.cdh-idea-modal-root.is-open .cdh-idea-modal {
  opacity: 1;
  transform: translateY(0);
}

.cdh-idea-modal-head {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 88px;
  padding: 16px 24px;
  flex-shrink: 0;
  background: var(--zs-report-surface);
  border-bottom: 1px solid var(--zs-report-line);
}

/* Dark: head-main is just the asset cluster */
.cdh-idea-modal-head-main {
  display: flex;
  align-items: center;
  min-width: 0;
  flex: 0 1 auto;
}

.cdh-idea-modal-asset {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.cdh-idea-modal-logo,
.cdh-idea-modal-logo-fallback {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  flex-shrink: 0;
  border: 1px solid var(--zs-report-line);
  background: var(--zs-report-surface-2);
}

.cdh-idea-modal-logo {
  object-fit: cover;
  display: block;
  background: transparent;
  opacity: 1;
}

.cdh-idea-modal-logo-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  color: var(--zs-report-text);
}

.cdh-idea-modal-asset-text {
  min-width: 0;
}

.cdh-idea-modal-asset-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
}

.cdh-idea-modal-symbol {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--zs-report-text);
  line-height: 1.15;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-modal-asset-name {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--zs-report-muted);
}

.cdh-idea-modal-status {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--zs-report-subtle);
}

.cdh-idea-modal-status--strong {
  color: rgba(163, 255, 18, 0.78);
}

.cdh-idea-modal-status--needs_confirmation {
  color: var(--zs-report-amber);
}

.cdh-idea-modal-quote {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
}

.cdh-idea-modal-price {
  font-size: 14px;
  font-weight: 600;
  color: var(--zs-report-text);
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-modal-change {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--zs-report-muted);
  font-variant-numeric: tabular-nums;
  direction: ltr;
  unicode-bidi: isolate;
}

.cdh-idea-modal-change.is-up {
  color: rgba(163, 255, 18, 0.85);
}

.cdh-idea-modal-change.is-down {
  color: var(--zs-report-red);
}

.cdh-idea-modal-head-rule {
  display: none;
}

.cdh-idea-quality-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin: 0 0 18px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--zs-report-line);
  max-width: 36rem;
}

.cdh-idea-quality-meta-label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--zs-report-subtle);
}

.cdh-idea-quality-meta-primary {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
}

.cdh-idea-quality-meta-secondary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 18px;
  margin: 2px 0 0;
}

.cdh-idea-quality-meta-metric {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--zs-report-subtle);
}

.cdh-idea-quality-meta-metric span {
  font-weight: 500;
}

.cdh-idea-quality-meta-metric strong {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--zs-report-text);
  font-variant-numeric: tabular-nums;
}

.cdh-idea-quality-meta-score {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  margin: 0;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--zs-report-text);
  font-variant-numeric: tabular-nums;
  unicode-bidi: isolate;
}

.cdh-idea-quality-meta-score span {
  font-size: 12px;
  font-weight: 500;
  color: var(--zs-report-subtle);
}

.cdh-idea-quality-meta-tier {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(163, 255, 18, 0.9);
}

.cdh-idea-quality-meta-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(163, 255, 18, 0.9);
  display: inline-block;
  flex-shrink: 0;
}

.cdh-idea-quality-meta-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--zs-report-subtle);
}

.cdh-idea-quality-meta-sep {
  color: var(--zs-report-muted);
}

.cdh-idea-modal-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--zs-report-muted);
  cursor: pointer;
  flex-shrink: 0;
  margin-inline-start: auto;
  transition:
    color var(--zs-report-dur) var(--zs-report-ease),
    background var(--zs-report-dur) var(--zs-report-ease),
    border-color var(--zs-report-dur) var(--zs-report-ease);
}

.cdh-idea-modal-close:hover {
  color: var(--zs-report-text);
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--zs-report-line);
}

.cdh-idea-modal-close:focus-visible {
  outline: 2px solid rgba(163, 255, 18, 0.45);
  outline-offset: 2px;
}

.cdh-idea-modal-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
  background: var(--zs-report-bg);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.12) transparent;
}

.cdh-idea-modal-body::-webkit-scrollbar {
  width: 4px;
}

.cdh-idea-modal-body::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 999px;
}

.cdh-idea-modal-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.cdh-idea-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
  align-items: start;
  min-height: 0;
}

.cdh-idea-layout.is-single {
  grid-template-columns: minmax(0, 1fr);
}

.cdh-idea-canvas {
  padding: 32px 32px 24px;
  border-inline-end: 1px solid var(--zs-report-line);
  min-width: 0;
}

.cdh-idea-layout.is-single .cdh-idea-canvas {
  border-inline-end: 0;
}

.cdh-idea-rail {
  padding: 32px 24px 24px;
  background: var(--zs-report-surface);
  min-width: 0;
  /* Content-driven: never stretch the rail (or its evidence panel) to
     match the canvas column height. */
  height: auto;
  align-self: start;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 32px;
}

.cdh-idea-kicker {
  display: block;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--zs-report-subtle);
  line-height: 1.35;
}

.cdh-idea-thesis {
  margin-bottom: 30px;
}

.cdh-idea-thesis-text {
  margin: 0;
  max-width: 34ch;
  font-size: clamp(26px, 2.2vw, 30px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--zs-report-text);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.cdh-idea-modal[dir='ltr'] .cdh-idea-thesis-text {
  max-width: 38rem;
  letter-spacing: 0;
}

.cdh-idea-modal[dir='rtl'] .cdh-idea-thesis-text {
  letter-spacing: normal;
  max-width: 28rem;
}

.cdh-idea-editorial {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
  gap: 0 24px;
  margin-bottom: 30px;
  padding-block: 8px;
}

.cdh-idea-editorial-rule {
  width: 1px;
  background: var(--zs-report-line);
  align-self: stretch;
}

.cdh-idea-editorial-col {
  min-width: 0;
}

.cdh-idea-prose {
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--zs-report-muted);
}

.cdh-idea-decision {
  position: relative;
  margin-bottom: 30px;
  padding: 16px 16px 16px 20px;
  background: rgba(255, 255, 255, 0.02);
  border-inline-start: 1px solid var(--zs-report-line-strong);
}

.cdh-idea-modal[dir='rtl'] .cdh-idea-decision {
  padding: 16px 20px 16px 16px;
}

.cdh-idea-decision--positive {
  border-inline-start-color: rgba(163, 255, 18, 0.22);
  background: rgba(255, 255, 255, 0.025);
}

.cdh-idea-decision--caution {
  border-inline-start-color: rgba(214, 168, 74, 0.45);
  background: rgba(214, 168, 74, 0.04);
}

.cdh-idea-decision--neutral {
  border-inline-start-color: rgba(255, 255, 255, 0.18);
}

.cdh-idea-decision .cdh-idea-kicker {
  margin-bottom: 8px;
}

.cdh-idea-decision-headline {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  color: var(--zs-report-text);
}

.cdh-idea-decision-text {
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--zs-report-muted);
}

.cdh-idea-why-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cdh-idea-why-list li {
  position: relative;
  padding-inline-start: 14px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--zs-report-muted);
}

.cdh-idea-why-list li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 0.55em;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.35);
}

.cdh-idea-quality-explain {
  margin: 0 0 16px;
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--zs-report-muted);
}

.cdh-idea-quality-fallback .cdh-idea-quality-explain {
  margin-top: 8px;
  margin-bottom: 0;
}

.cdh-idea-qrow-help {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--zs-report-subtle);
}

.cdh-idea-counter {
  margin-bottom: 30px;
}

.cdh-idea-counter-empty {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--zs-report-subtle);
}

.cdh-idea-counter-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cdh-idea-counter-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 0;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-counter-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.cdh-idea-counter-label {
  font-size: 0.875rem; /* 14px */
  font-weight: 500;
  line-height: 1.7;
  color: var(--zs-report-muted);
}

.cdh-idea-counter-item--high .cdh-idea-counter-label {
  color: var(--zs-report-text);
}

.cdh-idea-counter-detail {
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--zs-report-subtle);
}

.cdh-idea-trigger-list {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cdh-idea-trigger-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-trigger-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.cdh-idea-trigger-status {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
  color: var(--zs-report-subtle);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--zs-report-line);
}

.cdh-idea-trigger-item--met .cdh-idea-trigger-status {
  color: rgba(163, 255, 18, 0.85);
  border-color: rgba(163, 255, 18, 0.22);
  background: rgba(163, 255, 18, 0.06);
}

.cdh-idea-trigger-item--watching .cdh-idea-trigger-status {
  color: var(--zs-report-amber);
  border-color: rgba(214, 168, 74, 0.28);
  background: rgba(214, 168, 74, 0.06);
}

.cdh-idea-trigger-item--unmet .cdh-idea-trigger-status {
  color: var(--zs-report-subtle);
}

.cdh-idea-trigger-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cdh-idea-trigger-label {
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.45;
  color: var(--zs-report-muted);
}

.cdh-idea-trigger-detail {
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--zs-report-subtle);
}

.cdh-idea-watch {
  margin-bottom: 30px;
}

.cdh-idea-watch-rows {
  display: flex;
  flex-direction: column;
}

.cdh-idea-watch-row {
  display: grid;
  grid-template-columns: minmax(140px, 0.38fr) minmax(0, 1fr);
  gap: 16px;
  padding: 16px 0;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-watch-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--zs-report-subtle);
  line-height: 1.45;
}

.cdh-idea-watch-value {
  margin: 0;
  font-size: 0.875rem; /* 14px */
  font-weight: 400;
  line-height: 1.7;
  color: var(--zs-report-muted);
}

.cdh-idea-watch-value--confirm {
  color: var(--zs-report-text);
  font-weight: 600;
}

.cdh-idea-evolution {
  margin-top: 0;
  padding-top: 30px;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-evolution-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.cdh-idea-lifecycle {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--zs-report-muted);
  padding: 3px 0;
}

.cdh-idea-lifecycle--strengthened,
.cdh-idea-lifecycle--confirmed {
  color: var(--zs-report-text);
}

.cdh-idea-lifecycle--weakened,
.cdh-idea-lifecycle--invalidated {
  color: var(--zs-report-subtle);
}

.cdh-idea-lifecycle--needs_confirmation {
  color: var(--zs-report-amber);
}

.cdh-idea-evolution-deltas-title {
  margin: 0 0 8px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--zs-report-text);
}

.cdh-idea-delta-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cdh-idea-delta-list li {
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--zs-report-muted);
  padding-inline-start: 0.85em;
  position: relative;
}

.cdh-idea-delta-list li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 0.55em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--zs-report-subtle);
}

.cdh-idea-evolution-empty {
  margin: 0;
}

.cdh-idea-evolution-empty-title {
  margin: 0 0 4px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--zs-report-text);
}

.cdh-idea-evolution-empty-desc {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.5;
  color: var(--zs-report-subtle);
}

.cdh-idea-timeline {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
}

.cdh-idea-timeline-item {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  gap: 0 12px;
  align-items: stretch;
}

.cdh-idea-timeline-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 5px;
  min-height: 100%;
}

.cdh-idea-timeline-dot {
  flex-shrink: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.42);
}

.cdh-idea-timeline-line {
  flex: 1;
  width: 1px;
  min-height: 12px;
  margin-top: 6px;
  background: var(--zs-report-line);
}

.cdh-idea-timeline-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-bottom: 14px;
  min-width: 0;
}

.cdh-idea-timeline-item:last-child .cdh-idea-timeline-body {
  padding-bottom: 0;
}

.cdh-idea-timeline-title {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--zs-report-text);
  line-height: 1.4;
}

.cdh-idea-timeline-detail {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.5;
}

.cdh-idea-timeline-at {
  font-size: 11px;
  font-weight: 400;
  color: var(--zs-report-subtle);
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}

.cdh-idea-rail-block + .cdh-idea-rail-block {
  padding-top: 24px;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-qmatrix {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cdh-idea-qrow-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.cdh-idea-qrow-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--zs-report-text);
}

.cdh-idea-qrow-score {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  font-size: 13px;
  font-weight: 600;
  color: var(--zs-report-text);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  unicode-bidi: isolate;
}

.cdh-idea-qrow-score span {
  font-size: 11px;
  color: var(--zs-report-subtle);
  font-weight: 500;
}

.cdh-idea-qrow-track {
  position: relative;
  height: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: visible;
}

.cdh-idea-qrow-fill {
  position: relative;
  height: 100%;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.42);
}

.cdh-idea-qrow--high .cdh-idea-qrow-fill {
  background: rgba(255, 255, 255, 0.62);
}

.cdh-idea-qrow--mid .cdh-idea-qrow-fill {
  background: rgba(255, 255, 255, 0.38);
}

.cdh-idea-qrow--low .cdh-idea-qrow-fill {
  background: rgba(255, 255, 255, 0.22);
}

.cdh-idea-qrow-tip {
  display: none;
}

.cdh-idea-qmatrix-penalty,
.cdh-idea-qmatrix-final {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--zs-report-line);
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--zs-report-muted);
}

.cdh-idea-qmatrix-penalty strong {
  color: var(--zs-report-red);
  font-variant-numeric: tabular-nums;
}

.cdh-idea-qmatrix-final strong {
  color: var(--zs-report-text);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.cdh-idea-svn strong {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--zs-report-text);
  line-height: 1.3;
}

.cdh-idea-svn p {
  margin: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--zs-report-muted);
}

.cdh-idea-svn--high strong {
  color: var(--zs-report-text);
}

.cdh-idea-svn--mixed strong {
  color: var(--zs-report-amber);
}

.cdh-idea-svn--noise strong {
  color: var(--zs-report-red);
}

.cdh-idea-ev-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--zs-report-line);
}

.cdh-idea-ev-tab {
  appearance: none;
  border: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  background: transparent;
  color: var(--zs-report-subtle);
  padding: 8px 12px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition:
    color var(--zs-report-dur) var(--zs-report-ease),
    border-color var(--zs-report-dur) var(--zs-report-ease);
}

.cdh-idea-ev-tab em {
  font-style: normal;
  font-variant-numeric: tabular-nums;
  color: inherit;
  opacity: 0.7;
}

.cdh-idea-ev-tab:hover {
  color: var(--zs-report-muted);
}

.cdh-idea-ev-tab.is-active {
  color: var(--zs-report-text);
  border-bottom-color: rgba(255, 255, 255, 0.32);
}

.cdh-idea-ev-tab:focus-visible {
  outline: 2px solid rgba(163, 255, 18, 0.45);
  outline-offset: 2px;
}

.cdh-idea-ev-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.cdh-idea-evidence-wrap {
  min-width: 0;
  width: 100%;
}

.cdh-idea-evidence-list {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
}

.cdh-idea-evidence-item {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-top: 16px;
  min-width: 0;
  width: 100%;
}

.cdh-idea-evidence-item:first-child {
  padding-top: 0;
}

.cdh-idea-evidence-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

.cdh-idea-evidence-label {
  font-size: 0.875rem; /* 14px */
  font-weight: 700;
  color: var(--zs-report-text);
  line-height: 1.3;
  min-width: 0;
}

.cdh-idea-evidence-score {
  font-size: 0.8125rem; /* 13px */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--zs-report-text);
  flex-shrink: 0;
  white-space: nowrap;
  direction: ltr;
}

.cdh-idea-ev-tip-trigger .cdh-idea-evidence-interpretation {
  margin: 8px 0 0;
}

.cdh-idea-evidence-interpretation {
  margin: 8px 0 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-width: 0;
  max-width: none;
  width: 100%;
  font-size: 0.8125rem; /* 13px */
  font-weight: 400;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.66);
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: auto;
  text-wrap: pretty;
}

.cdh-idea-modal[dir='rtl'] .cdh-idea-evidence-interpretation,
.cdh-idea-modal[dir='rtl'] .cdh-idea-ev-tip {
  direction: rtl;
  text-align: right;
  unicode-bidi: plaintext;
}

.cdh-idea-modal[dir='ltr'] .cdh-idea-evidence-interpretation,
.cdh-idea-modal[dir='ltr'] .cdh-idea-ev-tip {
  direction: ltr;
  text-align: left;
  unicode-bidi: plaintext;
}

.cdh-idea-evidence-support {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  margin-top: 8px;
  min-width: 0;
}

.cdh-idea-evidence-support-label {
  font-size: 0.6875rem; /* 11px */
  font-weight: 600;
  color: var(--zs-report-subtle);
}

.cdh-idea-evidence-support-value {
  font-size: 0.6875rem; /* 11px */
  font-weight: 600;
  color: rgba(255, 255, 255, 0.55);
}

.cdh-idea-evidence-indicator {
  position: relative;
  width: min(150px, 100%);
  max-width: 150px;
  height: 2px;
  margin-top: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

.cdh-idea-evidence-indicator::before {
  content: '';
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: var(--ev-score, 0%);
  height: 100%;
  border-radius: inherit;
  background: var(--zs-report-accent);
  opacity: 0.4;
  box-shadow: none;
  filter: none;
  transition: none;
  animation: none;
}

.cdh-idea-evidence-fresh {
  display: block;
  margin-top: 7px;
  font-size: 0.6875rem; /* 11px */
  font-weight: 500;
  line-height: 1.3;
  color: var(--zs-report-subtle);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cdh-idea-evidence-divider {
  height: 1px;
  margin-top: 16px;
  background: var(--zs-report-line);
}

.cdh-idea-evidence-item:last-child .cdh-idea-evidence-divider {
  display: none;
}

/* Legacy interpreted evidence aliases (retained for any stale markup) */
.cdh-idea-ev-interpreted {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-block: 16px;
  border-bottom: 1px solid var(--zs-report-line);
  border-top: 0;
  min-width: 0;
  width: 100%;
}

.cdh-idea-ev-interpreted:first-child {
  padding-top: 0;
}

.cdh-idea-ev-interpreted:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.cdh-idea-ev-freshness-shared {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 12px;
  margin: 0 0 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--zs-report-line);
}

.cdh-idea-ev-freshness-shared-label {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--zs-report-subtle);
}

.cdh-idea-ev-freshness-shared-value {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--zs-report-muted);
}

.cdh-idea-ev-interpreted-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

.cdh-idea-ev-interpreted-label {
  font-size: 0.875rem; /* 14px */
  font-weight: 700;
  color: var(--zs-report-text);
  line-height: 1.3;
  min-width: 0;
}

.cdh-idea-ev-interpreted-score {
  font-size: 0.8125rem; /* 13px */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--zs-report-text);
  flex-shrink: 0;
  white-space: nowrap;
  direction: ltr;
}

.cdh-idea-ev-tip-root {
  display: block;
  min-width: 0;
  width: 100%;
}

.cdh-idea-ev-tip-trigger {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 8px 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: help;
}

.cdh-idea-ev-tip-trigger:focus-visible {
  outline: 2px solid rgba(163, 255, 18, 0.35);
  outline-offset: 2px;
  border-radius: 4px;
}

.cdh-idea-ev-interpreted-text {
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-width: 0;
  max-width: none;
  width: 100%;
  font-size: 0.8125rem; /* 13px */
  font-weight: 400;
  line-height: 1.65;
  color: var(--zs-report-muted);
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: auto;
  text-wrap: pretty;
}

/* When tip is disabled, keep the same spacing from head */
.cdh-idea-ev-interpreted > .cdh-idea-ev-interpreted-text {
  margin-top: 8px;
}

.cdh-idea-modal[dir='rtl'] .cdh-idea-ev-interpreted-text,
.cdh-idea-modal[dir='rtl'] .cdh-idea-ev-tip {
  direction: rtl;
  text-align: right;
  unicode-bidi: plaintext;
}

.cdh-idea-modal[dir='ltr'] .cdh-idea-ev-interpreted-text,
.cdh-idea-modal[dir='ltr'] .cdh-idea-ev-tip {
  direction: ltr;
  text-align: left;
  unicode-bidi: plaintext;
}

.cdh-idea-ev-interpreted-support {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  margin-top: 7px;
  min-width: 0;
}

.cdh-idea-ev-interpreted-support-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--zs-report-subtle);
}

.cdh-idea-ev-interpreted-support-value {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--zs-report-text);
}

.cdh-idea-ev-interpreted-track {
  height: 2px;
  margin-top: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  overflow: hidden;
  width: 100%;
  min-width: 0;
}

.cdh-idea-ev-interpreted-fill {
  height: 100%;
  border-radius: inherit;
  /* muted institutional accent â€” secondary to text */
  background: var(--zs-report-accent);
  opacity: 0.4;
  box-shadow: none;
  filter: none;
  transition: none;
  animation: none;
}

.cdh-idea-ev-interpreted--supporting .cdh-idea-ev-interpreted-fill,
.cdh-idea-ev-interpreted--opposing .cdh-idea-ev-interpreted-fill,
.cdh-idea-ev-interpreted--missing .cdh-idea-ev-interpreted-fill,
.cdh-idea-ev-interpreted--neutral .cdh-idea-ev-interpreted-fill {
  background: var(--zs-report-accent);
  opacity: 0.4;
}

.cdh-idea-ev-interpreted-fresh {
  display: block;
  margin-top: 7px;
  font-size: 0.6875rem; /* 11px */
  font-weight: 500;
  line-height: 1.3;
  color: var(--zs-report-subtle);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cdh-idea-ev-tip {
  max-width: 320px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--zs-report-line-strong);
  background: rgba(11, 14, 12, 0.98);
  color: var(--zs-report-muted);
  font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.65;
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: auto;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
  pointer-events: none;
}

/* Legacy string-bucket rows only â€” must NOT apply to interpreted evidence items */
.cdh-idea-ev-rows li:not(.cdh-idea-ev-interpreted) {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--zs-report-line);
}

.cdh-idea-ev-rows li:not(.cdh-idea-ev-interpreted):first-child {
  border-top: 0;
  padding-top: 4px;
}

.cdh-idea-ev-index {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--zs-report-subtle);
  font-variant-numeric: tabular-nums;
  line-height: 1.5;
  padding-top: 2px;
}

.cdh-idea-ev-title {
  display: block;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--zs-report-text);
  line-height: 1.45;
}

.cdh-idea-ev-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 4px;
}

.cdh-idea-ev-strength {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--zs-report-muted);
  font-variant-numeric: tabular-nums;
}

.cdh-idea-ev-state {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--zs-report-subtle);
}

.cdh-idea-ev-rows--for .cdh-idea-ev-state {
  color: var(--zs-report-muted);
}

.cdh-idea-ev-rows--against .cdh-idea-ev-state {
  color: var(--zs-report-amber);
}

.cdh-idea-ev-rows--missing .cdh-idea-ev-state {
  color: var(--zs-report-subtle);
}


/* Approved reference — shared structural primitives (theme-agnostic) */
.cdh-idea-why-panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 24px;
}
.cdh-idea-why-panel {
  min-width: 0;
}
.cdh-idea-why-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.cdh-idea-why-panel-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--zs-report-text);
}
.cdh-idea-section-title {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--zs-report-text);
}
.cdh-idea-lower {
  display: grid;
  grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
  gap: 0 24px;
  margin-bottom: 8px;
}
.cdh-idea-lower-decision {
  min-width: 0;
}
.cdh-idea-timeline-body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.cdh-idea-timeline-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cdh-idea-ev-summary,
.cdh-idea-signals {
  margin: 0;
  padding: 0;
  list-style: none;
}
.cdh-idea-ev-summary-row,
.cdh-idea-signal-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.cdh-idea-signal-track {
  height: 3px;
  border-radius: 999px;
  background: var(--zs-report-line);
  overflow: hidden;
}
.cdh-idea-signal-fill {
  height: 100%;
  background: var(--zs-report-accent);
}

.cdh-idea-foot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 16px;
  padding: 16px 32px 24px;
  border-top: 1px solid var(--zs-report-line);
  background: var(--zs-report-bg);
}

.cdh-idea-foot-meta {
  margin: 0;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--zs-report-subtle);
  text-align: center;
}

.cdh-idea-foot-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
}

.cdh-idea-disclaimer {
  margin: 0;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--zs-report-subtle);
  text-align: end;
  max-width: 18rem;
}

.cdh-idea-asset-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--zs-report-muted);
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition:
    color var(--zs-report-dur) var(--zs-report-ease),
    border-color var(--zs-report-dur) var(--zs-report-ease);
}

.cdh-idea-asset-link:hover {
  color: var(--zs-report-text);
  border-bottom-color: rgba(255, 255, 255, 0.28);
}

.cdh-idea-asset-link:focus-visible {
  outline: 2px solid rgba(163, 255, 18, 0.45);
  outline-offset: 2px;
}

.cdh-idea-asset-link-arrow {
  flex-shrink: 0;
  display: block;
}

@media (max-width: 980px) {
  .cdh-idea-modal-root {
    padding: 16px;
    align-items: stretch;
  }

  .cdh-idea-modal {
    width: calc(100vw - 32px);
    max-height: calc(100dvh - 32px);
    margin: auto 0;
  }

  .cdh-idea-modal-head {
    gap: 12px 16px;
    min-height: 0;
    padding: 16px;
  }

  .cdh-idea-modal-asset {
    min-width: 0;
  }

  .cdh-idea-modal-head-rule {
    display: none;
  }

  .cdh-idea-quality-meta {
    max-width: none;
    margin-bottom: 14px;
  }

  .cdh-idea-quality-meta-score {
    font-size: 1.5rem;
  }

  .cdh-idea-modal-close {
    margin-inline-start: auto;
  }

  .cdh-idea-layout {
    grid-template-columns: 1fr;
  }

  .cdh-idea-canvas {
    border-inline-end: 0;
    padding: 24px 16px 16px;
  }

  .cdh-idea-rail {
    padding: 24px 16px;
    border-top: 1px solid var(--zs-report-line);
  }

  .cdh-idea-thesis {
    margin-bottom: 32px;
  }

  .cdh-idea-thesis-text {
    font-size: 26px;
    max-width: none;
  }

  .cdh-idea-editorial {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .cdh-idea-editorial-rule {
    width: auto;
    height: 1px;
  }

  .cdh-idea-watch-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .cdh-idea-evolution-head {
    flex-wrap: wrap;
  }

  .cdh-idea-foot {
    padding: 16px;
  }

  .cdh-idea-foot-row {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cdh-idea-modal-overlay,
  .cdh-idea-modal,
  .cdh-idea-modal-close,
  .cdh-idea-ev-tab,
  .cdh-idea-asset-link {
    transition: none;
  }

  .cdh-idea-modal {
    transform: none;
  }
}


@media (max-width: 480px) {
  .cdh-ideas-head {
    padding-inline: 24px;
  }

  .cdh-ideas-controls {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    margin-inline: 24px;
  }

  .cdh-ideas-sort {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .cdh-ideas-sort-dropdown {
    width: 100%;
    max-width: none;
  }

  .cdh-ideas-filter-group {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .cdh-ideas-group-label {
    margin-inline-end: 0;
  }

  .cdh-ideas-filter-chips {
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    padding: 2px;
  }

  .cdh-ideas-filter-chips::-webkit-scrollbar {
    display: none;
  }

  .cdh-ideas-filter-clear {
    align-self: flex-start;
  }

  .cdh-idea-evidence-interpretation {
    -webkit-line-clamp: 3;
  }

  .cdh-idea-mi-foot {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 0.5rem;
  }

  .cdh-idea-mi-metric:nth-child(3)::before {
    display: none;
  }

  .cdh-idea-mi-metric:nth-child(3),
  .cdh-idea-mi-metric:nth-child(4) {
    padding-inline-start: 0;
  }

  .cdh-idea-mi-metric:nth-child(1),
  .cdh-idea-mi-metric:nth-child(2) {
    padding-bottom: 0.15rem;
  }

  .cdh-idea-card--mi {
    min-height: 0;
  }
}

/* ── News Center Premium (Bloomberg-density) ── */
/* Width: inherit All-Coins shell edges — no second nested max-width / extra gutters */
.cdh-section--news.cdh-news-premium,
.cdh-section--news {
  padding: 0.35rem 0 0.9rem;
  max-width: none;
  width: 100%;
  margin-inline: 0;
  --cdh-news-space-1: 0.55rem;
  --cdh-news-space-2: 0.75rem;
  --cdh-news-space-3: 0.9rem;
}

/* Beat continuous-workspace .cdh-section horizontal padding so News aligns with title shell */
.crypto-discovery-hub .cdh-section.cdh-section--news,
.crypto-discovery-hub .cdh-section.cdh-section--news.cdh-news-premium {
  max-width: none;
  width: 100%;
  margin-inline: 0;
  padding-inline: 0;
  box-sizing: border-box;
}

.cdh-news-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: var(--cdh-news-space-1);
}

.cdh-news-share-hint {
  font-size: 0.72rem;
  color: var(--zs-green-primary, #18c37e);
  white-space: nowrap;
}

/* Ticker — market tape */
.cdh-news-ticker {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin-bottom: 0.75rem;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: transparent;
  overflow: hidden;
  min-height: 2.15rem;
}

.cdh-news-ticker-label {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 0 0.7rem;
  background: transparent;
  color: #f87171;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-inline-end: 1px solid rgba(255, 255, 255, 0.1);
  z-index: 1;
}

.cdh-news-ticker-flame {
  display: none;
}

.cdh-news-ticker-track-wrap {
  flex: 1 1 auto;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
}

.cdh-news-ticker-track {
  display: flex;
  width: max-content;
  gap: 1.75rem;
  padding-inline: 0.75rem;
  align-items: center;
  animation: cdh-news-ticker-scroll 60s linear infinite;
}

.cdh-news-ticker:hover .cdh-news-ticker-track {
  animation-play-state: paused;
}

@keyframes cdh-news-ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.page-rtl .cdh-news-ticker-track {
  animation-name: cdh-news-ticker-scroll-rtl;
}

@keyframes cdh-news-ticker-scroll-rtl {
  from { transform: translateX(0); }
  to { transform: translateX(50%); }
}

.cdh-news-ticker-item {
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  font-size: 0.8125rem;
  white-space: nowrap;
  max-width: 36rem;
}

.cdh-news-ticker-item:hover .cdh-news-ticker-title {
  color: #fff;
}

.cdh-news-ticker-source {
  color: rgba(255, 255, 255, 0.38);
  font-size: 0.75rem;
  font-weight: 600;
}

.cdh-news-ticker-dot {
  color: rgba(255, 255, 255, 0.25);
}

.cdh-news-ticker-time {
  color: rgba(255, 255, 255, 0.34);
  font-size: 0.75rem;
}

.cdh-news-ticker-title {
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
  line-height: 1.4;
}

/* KPI removed from UI */
.cdh-news-kpi {
  display: none !important;
}

/* Filters — text tabs, low chrome */
.cdh-news-filters {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.1rem 0.3rem;
  height: 42px;
  min-height: 42px;
  max-height: 42px;
  margin: 0 0 1.15rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.cdh-news-filters::-webkit-scrollbar {
  display: none;
}

.cdh-news-filter {
  appearance: none;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.8125rem;
  font-weight: 600;
  height: 42px;
  padding: 0 0.5rem;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  line-height: 1;
  border-radius: 0;
  box-sizing: border-box;
  flex: 0 0 auto;
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease;
}

.cdh-news-filter:hover {
  border-color: transparent;
  color: rgba(255, 255, 255, 0.9);
  background: transparent;
}

.cdh-news-filter.is-active {
  border-color: #18c37e;
  color: #f8fafc;
  background: transparent;
  font-weight: 600;
}

.cdh-news-filter.is-active:hover {
  background: transparent;
  color: #fff;
}

/* Layout — full-width feed (sidebar removed) */
.cdh-news-layout {
  display: block;
  width: 100%;
  min-width: 0;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .cdh-news-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (min-width: 1024px) {
  .cdh-news-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (min-width: 1280px) {
  .cdh-news-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (min-width: 1600px) {
  .cdh-news-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

.cdh-news-main {
  min-width: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cdh-news-sidebar,
.cdh-news-discovery-rail {
  display: none;
}

/* Hero — full content width (12/12), secondary stories sit in the next row */
.cdh-news-hero {
  display: block;
  grid-template-columns: none;
  gap: 0;
  margin-bottom: 0.75rem;
  width: 100%;
  min-width: 0;
  max-width: none;
}

@media (min-width: 768px) {
  .cdh-news-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
  }
}

.cdh-news-featured-story {
  position: relative;
  display: block;
  border: 0;
  background: #080808;
  overflow: hidden;
  width: 100%;
  min-width: 0;
  height: clamp(320px, 22vw, 350px);
  min-height: 320px;
  max-height: 350px;
  border-radius: 0;
  transition: opacity 200ms ease;
}

.cdh-news-featured-story:hover {
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

.cdh-news-featured-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 0;
}

.cdh-news-featured-media .cdh-news-media-img {
  object-fit: cover;
  object-position: center;
}

.cdh-news-media[data-media="entity-plate"] .cdh-news-media-img,
.cdh-news-media-img.is-plate {
  object-fit: cover;
  object-position: center;
}

.cdh-news-featured-story:hover .cdh-news-media[data-media="entity-plate"] .cdh-news-media-img.is-loaded {
  transform: none;
}

.cdh-news-featured-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 1.05rem 1.25rem 1rem;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.02) 0%,
    rgba(0, 0, 0, 0.28) 42%,
    rgba(0, 0, 0, 0.82) 74%,
    rgba(0, 0, 0, 0.94) 100%
  );
}

.cdh-news-featured-headline {
  margin: 0;
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  font-weight: 700;
  line-height: 1.35;
  color: #f8f8f8;
  letter-spacing: -0.02em;
  max-width: 50%;
}

.cdh-news-featured-overlay > * {
  max-width: 50%;
}

.cdh-news-summary--hero {
  -webkit-line-clamp: 2;
  max-width: 50%;
  font-size: 0.84rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
}

.cdh-news-hero-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.48);
  line-height: 1.35;
}

.cdh-news-hero-strip-sep {
  opacity: 0.45;
}

.cdh-news-hero-coins {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 700;
}

.cdh-news-hero-side {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  width: 100%;
  min-width: 0;
  margin: 0 0 1rem;
}

@media (min-width: 768px) {
  .cdh-news-hero-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

.cdh-news-side-card {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  align-items: center;
  column-gap: 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.015);
  padding: 0.5rem 0.7rem;
  height: 128px;
  box-sizing: border-box;
  overflow: hidden;
  min-width: 0;
  transition: background 200ms ease;
}

[dir='rtl'] .cdh-news-side-card {
  flex-direction: row;
}

.cdh-news-side-card:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.cdh-news-side-card:hover {
  border-color: rgba(255, 255, 255, 0.1);
  transform: none;
  box-shadow: none;
  background: rgba(255, 255, 255, 0.03);
}

.cdh-news-side-media {
  width: 140px;
  height: 108px;
  flex: 0 0 140px;
  aspect-ratio: auto;
  overflow: hidden;
  align-self: center;
}

.cdh-news-side-media .cdh-news-media-img {
  object-fit: cover;
  object-position: center;
}

.cdh-news-side-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.22rem;
  min-width: 0;
  width: 100%;
}

.cdh-news-side-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  color: #ececec;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.cdh-news-side-title a {
  color: inherit;
  text-decoration: none;
}

.cdh-news-side-title a:hover {
  color: #fff;
}

.cdh-news-summary--side {
  display: none;
}

/* Media / image */
.cdh-news-media {
  position: relative;
  display: block;
  overflow: hidden;
  background: #111;
  border: 0;
  flex-shrink: 0;
}

.cdh-news-media-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transition: opacity 220ms ease, transform 280ms ease;
}

.cdh-news-media-img.is-loaded {
  opacity: 1;
}

.cdh-news-featured-story:hover .cdh-news-media-img.is-loaded {
  transform: scale(1.02);
}

.cdh-news-media-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(155deg, #161616 0%, #0c0c0c 55%, #121212 100%);
}

.cdh-news-media-fallback::after {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-image:
    linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, transparent 45%),
    repeating-linear-gradient(
      -28deg,
      transparent 0,
      transparent 7px,
      rgba(255, 255, 255, 0.02) 7px,
      rgba(255, 255, 255, 0.02) 8px
    );
}

.cdh-news-media--breaking .cdh-news-media-fallback {
  background: linear-gradient(155deg, #1a1010 0%, #0c0808 100%);
}
.cdh-news-media--bitcoin .cdh-news-media-fallback {
  background: linear-gradient(155deg, #16120e 0%, #0c0a08 100%);
}
.cdh-news-media--ethereum .cdh-news-media-fallback {
  background: linear-gradient(155deg, #101218 0%, #08090c 100%);
}
.cdh-news-media--regulation .cdh-news-media-fallback {
  background: linear-gradient(155deg, #121416 0%, #0a0b0c 100%);
}
.cdh-news-media--defi .cdh-news-media-fallback {
  background: linear-gradient(155deg, #0e1412 0%, #080c0a 100%);
}
.cdh-news-media--institutions .cdh-news-media-fallback {
  background: linear-gradient(155deg, #121214 0%, #0a0a0b 100%);
}
.cdh-news-media--tech .cdh-news-media-fallback {
  background: linear-gradient(155deg, #101416 0%, #080a0c 100%);
}
.cdh-news-media--analysis .cdh-news-media-fallback {
  background: linear-gradient(155deg, #121210 0%, #0b0b09 100%);
}

.cdh-news-media-fallback,
.cdh-news-media-fallback-label {
  display: none;
}

/* Meta / badges */
.cdh-news-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
}

.cdh-news-meta-row--compact {
  gap: 0.3rem;
}

.cdh-news-meta-quiet {
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.4);
  line-height: 1.35;
  font-weight: 500;
}

.cdh-news-badge {
  font-size: 0.6rem;
  font-weight: 700;
  padding: 0.12rem 0.4rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.72);
  letter-spacing: 0.02em;
}

.cdh-news-badge.is-break {
  border-color: rgba(239, 68, 68, 0.35);
  color: #f87171;
  background: rgba(239, 68, 68, 0.08);
}

.cdh-news-impact,
.cdh-news-sentiment,
.cdh-news-coin {
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0;
  border: 0;
  line-height: 1.35;
  background: transparent;
}

.cdh-news-impact.is-high {
  color: #fbbf24;
}
.cdh-news-impact.is-medium {
  color: rgba(255, 255, 255, 0.62);
}
.cdh-news-impact.is-low {
  color: rgba(255, 255, 255, 0.42);
}

.cdh-news-sentiment.is-positive {
  color: #18c37e;
}
.cdh-news-sentiment.is-negative {
  color: #f87171;
}
.cdh-news-sentiment.is-neutral {
  color: rgba(255, 255, 255, 0.42);
}

.cdh-news-coin {
  color: rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.03);
}

.cdh-news-summary {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.55);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cdh-news-summary--sm {
  font-size: 0.76rem;
  line-height: 1.45;
  -webkit-line-clamp: 1;
  color: rgba(255, 255, 255, 0.48);
}

@media (min-width: 640px) {
  .cdh-news-summary--sm {
    display: none;
  }
}

/* Actions — quiet secondary controls */
.cdh-news-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.1rem;
}

.cdh-news-action {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 0.26rem;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.78125rem;
  font-weight: 500;
  padding: 0.15rem 0.1rem;
  cursor: pointer;
  text-decoration: none;
  line-height: 1.3;
  transition: color 180ms ease;
}

.cdh-news-action:hover {
  border-color: transparent;
  color: #fff;
  transform: none;
}

.cdh-news-action.is-active {
  color: #18c37e;
  border-color: transparent;
}

.cdh-news-action--icon {
  width: 30px;
  height: 30px;
  justify-content: center;
  padding: 0;
  border-radius: 6px;
}

.cdh-news-action--icon:hover {
  background: rgba(255, 255, 255, 0.06);
}

.cdh-news-action--primary {
  border: 0;
  color: #18c37e;
  background: transparent;
  padding-inline: 0.35rem;
  margin-inline-start: 0.15rem;
}

.cdh-news-action--primary:hover {
  background: transparent;
  color: #22d48c;
}

.cdh-news-actions--compact .cdh-news-action {
  padding: 0.2rem 0.15rem;
}

/* Feed cards */
.cdh-news-block-title {
  margin: 0 0 0.65rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: -0.01em;
  line-height: 1.375rem;
  min-height: 1.375rem;
  display: flex;
  align-items: center;
}

.cdh-news-card-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cdh-news-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  column-gap: 0.75rem;
  padding: 0.55rem 0;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  background: transparent;
  box-shadow: none;
  align-items: center;
  min-height: 104px;
  max-height: 118px;
  box-sizing: border-box;
  overflow: hidden;
  transition: background 200ms ease;
}

.cdh-news-card:hover {
  border-color: rgba(255, 255, 255, 0.06);
  transform: none;
  box-shadow: none;
  background: rgba(255, 255, 255, 0.015);
}

@media (min-width: 640px) {
  .cdh-news-card {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 0.75rem;
    padding: 0.55rem 0;
  }
}

@media (max-width: 639px) {
  .cdh-news-card {
    padding: 0.65rem 0;
    gap: 0.65rem;
  }

  .cdh-news-card-title {
    font-size: 0.9375rem;
    line-height: 1.4;
  }

  .cdh-news-summary--sm {
    display: -webkit-box;
    font-size: 0.72rem;
    line-height: 1.45;
    -webkit-line-clamp: 2;
  }

  .cdh-news-card-body {
    gap: 0.22rem;
  }
}

.cdh-news-card-media {
  width: 120px;
  height: 92px;
  max-height: 92px;
  aspect-ratio: auto;
}

@media (min-width: 640px) {
  .cdh-news-card-media {
    width: 120px;
    height: 92px;
    max-height: 92px;
    aspect-ratio: auto;
  }
}

.cdh-news-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.22rem;
  min-width: 0;
  width: 100%;
  max-width: 46rem;
  justify-self: start;
}

.cdh-news-card .cdh-news-summary,
.cdh-news-card .cdh-news-summary--sm {
  display: none;
}

.cdh-news-card-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  color: #f2f2f2;
  letter-spacing: -0.01em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-align: start;
}

.cdh-news-card-title a {
  color: inherit;
  text-decoration: none;
}

.cdh-news-card-title a:hover {
  color: #fff;
}

.cdh-news-card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.35rem;
  margin-top: 0;
}

.cdh-news-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem;
}

.cdh-news-feed-body {
  min-height: 240px;
}

.cdh-news-feed-empty {
  margin: 0;
  padding: 1.1rem;
  border: 1px dashed rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.82rem;
  text-align: center;
  min-height: 240px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cdh-news-saved-empty {
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.08);
  padding: 1rem 1.1rem;
}

.cdh-news-saved-empty-title {
  margin: 0 0 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}

.cdh-news-saved-empty-body {
  margin: 0;
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.45);
  line-height: 1.45;
}

.cdh-news-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 0.65rem;
}

.cdh-news-more,
.cdh-news-retry {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #0c0c0c;
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.52rem 1.1rem;
  cursor: pointer;
  transition: border-color 200ms ease, color 200ms ease, transform 200ms ease;
}

.cdh-news-more:hover,
.cdh-news-retry:hover {
  border-color: rgba(24, 195, 126, 0.4);
  color: #18c37e;
  transform: translateY(-1px);
}

/* Sidebar panels — compact editorial rails */
.cdh-news-side-panel {
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: #080808;
  border-radius: 0;
  padding: 0.65rem 0.7rem 0.7rem;
}

.cdh-news-side-panel .cdh-news-block-title,
.cdh-news-rail-section .cdh-news-block-title {
  margin: 0 0 0.65rem;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.375rem;
  min-height: 1.375rem;
}

.cdh-news-rail-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cdh-news-rail-card {
  display: grid;
  grid-template-columns: 4.25rem minmax(0, 1fr);
  gap: 0.28rem 0.5rem;
  align-items: start;
  min-width: 0;
  padding: 0.5rem 0;
  border-block-end: 1px solid rgba(255, 255, 255, 0.05);
  border-inline-start: 0;
  transition: background 180ms ease;
}

.cdh-news-rail-card:last-child {
  border-block-end: 0;
}

.cdh-news-rail-card.is-impact-high,
.cdh-news-rail-card.is-impact-medium,
.cdh-news-rail-card.is-impact-low {
  border-inline-start-color: transparent;
}

.cdh-news-rail-card:hover {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.05);
  border-inline-start-color: transparent;
}

.cdh-news-rail-card--read {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: 0.35rem 0.55rem;
  align-items: start;
  border-inline-start-color: transparent;
}

.cdh-news-rail-card--read.is-top {
  border-block-start: 0;
}

.cdh-news-rail-card--read.is-top .cdh-news-rail-rank {
  color: rgba(255, 255, 255, 0.95);
  font-weight: 800;
  font-size: 0.9375rem;
}

.cdh-news-rail-rank {
  font-size: 0.8125rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.38);
  line-height: 1.55;
  padding-top: 0.1rem;
  text-align: end;
  width: 100%;
}

.cdh-news-rail-read-body,
.cdh-news-rail-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.cdh-news-rail-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.45;
  word-break: normal;
  overflow-wrap: break-word;
}

.cdh-news-rail-title:hover {
  color: #fff;
}

.cdh-news-rail-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.3rem;
  min-width: 0;
}

.cdh-news-rail-source,
.cdh-news-rail-time {
  font-size: 0.6875rem;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.38);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cdh-news-rail-dot {
  color: rgba(255, 255, 255, 0.22);
  font-size: 0.58rem;
}

.cdh-news-rail-score {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.18rem;
  font-size: 0.6875rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.3;
}

.cdh-news-rail-trend {
  display: inline-flex;
  align-items: baseline;
  gap: 0.2rem;
  font-size: 0.6875rem;
  line-height: 1.35;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
  white-space: nowrap;
  padding-top: 0.15rem;
}

.cdh-news-rail-trend-label {
  font-size: 0.6875rem;
  font-weight: 500;
}

.cdh-news-rail-trend.is-positive { color: #18c37e; }
.cdh-news-rail-trend.is-negative { color: #f87171; }
.cdh-news-rail-trend.is-neutral { color: rgba(255, 255, 255, 0.35); }

.cdh-news-rail-bar,
.cdh-news-rail-bar--pop,
.cdh-news-rail-bar-fill {
  display: none !important;
}

/* States */
.cdh-news-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  padding: 2.2rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: #080808;
  text-align: center;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.88rem;
}

.cdh-news-state--error {
  border-color: rgba(239, 68, 68, 0.25);
}

.cdh-news-state-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.88);
}

.cdh-news-state-detail {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.45);
  max-width: 36rem;
}

.cdh-news-state-time {
  margin: 0;
  font-size: 0.68rem;
  color: rgba(255, 255, 255, 0.35);
}

/* Skeleton */
.cdh-news-skeleton {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cdh-news-skel-ticker,
.cdh-news-skel-pulse,
.cdh-news-skel-chip,
.cdh-news-skel-featured,
.cdh-news-skel-card {
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, 0.03) 20%,
    rgba(255, 255, 255, 0.07) 40%,
    rgba(255, 255, 255, 0.03) 60%
  );
  background-size: 200% 100%;
  animation: cdh-pulse 1.2s ease-in-out infinite;
  border: 1px solid rgba(255, 255, 255, 0.04);
}

.cdh-news-skel-ticker { height: 1.65rem; }
.cdh-news-skel-pulse,
.cdh-news-skel-filters,
.cdh-news-skel-chip { display: none; }
.cdh-news-skel-hero {
  display: block;
  width: 100%;
}
@media (min-width: 768px) {
  .cdh-news-skel-hero {
    grid-template-columns: minmax(0, 1fr);
  }
}
.cdh-news-skel-featured { min-height: 320px; width: 100%; }
.cdh-news-skel-side {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
}
@media (min-width: 768px) {
  .cdh-news-skel-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}
.cdh-news-skel-card { min-height: 6.25rem; }

@media (max-width: 639px) {
  .cdh-news-side-card {
    height: auto;
    min-height: 104px;
    grid-template-columns: 96px minmax(0, 1fr);
  }
  [dir='rtl'] .cdh-news-side-card {
    flex-direction: row;
  }
  .cdh-news-side-media {
    width: 96px;
    height: 80px;
    flex-basis: 96px;
  }
  .cdh-news-card {
    max-height: none;
    grid-template-columns: 96px minmax(0, 1fr);
  }
  .cdh-news-card-media {
    width: 96px;
    height: 76px;
    max-height: 76px;
  }
  .cdh-news-featured-story {
    height: clamp(300px, 52vw, 330px);
    min-height: 300px;
    max-height: 330px;
  }
  .cdh-news-featured-headline,
  .cdh-news-featured-overlay > * {
    max-width: 86%;
  }
  .cdh-news-featured-headline {
    font-size: 1.15rem;
  }
  .cdh-news-featured-overlay {
    padding: 1rem 1rem 0.9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cdh-news-ticker-track,
  .cdh-news-media-img,
  .cdh-news-card,
  .cdh-news-side-card,
  .cdh-news-filter,
  .cdh-news-action,
  .cdh-news-kpi-card,
  .cdh-news-featured-story {
    animation: none !important;
    transition: none !important;
  }
  .cdh-news-card:hover,
  .cdh-news-side-card:hover,
  .cdh-news-featured-story:hover {
    transform: none;
  }
}

/* FAQ */
.cdh-section--faq {
  padding: 1.75rem 1.25rem;
}

.cdh-faq-heading {
  font-size: 1.65rem;
  font-weight: 800;
  text-align: center;
  color: var(--zs-text-primary);
  margin: 0 0 1.75rem;
  letter-spacing: -0.03em;
}

.cdh-faq-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 2rem;
}

@media (min-width: 1024px) {
  .cdh-faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.cdh-faq-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.cdh-faq-item--alt {
  background: var(--crypto-row-zebra, rgba(255, 255, 255, 0.02));
}

.cdh-faq-q {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 0.5rem;
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--zs-text-primary);
  line-height: 1.55;
}

.cdh-faq-q:hover span:first-child {
  color: var(--zs-green-primary, #18c37e);
}

.cdh-faq-icon {
  flex-shrink: 0;
  font-size: 1.25rem;
  color: var(--zs-text-secondary);
  transition: transform 0.2s;
}

.cdh-faq-icon.is-open {
  transform: rotate(45deg);
}

.cdh-faq-a {
  margin: 0;
  padding: 0 0.5rem 1.15rem;
  font-size: 0.85rem;
  line-height: 1.75;
  color: var(--zs-text-secondary);
}

html.light .crypto-discovery-hub .cdh-section,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

html.light .crypto-discovery-hub .csd-shell,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-shell {
  background: transparent;
}

html.light .crypto-discovery-hub .csd-chip-bar,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip-bar {
  background: transparent;
  box-shadow: none;
  border: none;
}

html.light .crypto-discovery-hub .csd-chip,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip {
  color: rgba(0, 0, 0, 0.52);
  border-color: rgba(0, 0, 0, 0.12);
  background: transparent;
}

html.light .crypto-discovery-hub .csd-chip:hover,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip:hover {
  color: rgba(0, 0, 0, 0.72);
  background: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.18);
}

html.light .crypto-discovery-hub .csd-chip.is-active,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip.is-active {
  color: var(--zs-accent);
  border-color: var(--zs-accent);
  background: rgba(90, 158, 0, 0.07);
}

html.light .crypto-discovery-hub .csd-chip-menu,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip-menu {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.08);
}

html.light .crypto-discovery-hub .csd-chip-menu-item,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip-menu-item {
  color: rgba(0, 0, 0, 0.62);
}

html.light .crypto-discovery-hub .csd-chip-menu-item:hover,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip-menu-item:hover {
  color: rgba(0, 0, 0, 0.82);
  background: rgba(0, 0, 0, 0.04);
}

html.light .crypto-discovery-hub .csd-chip-menu-item.is-active,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chip-menu-item.is-active {
  color: var(--zs-accent);
  background: rgba(90, 158, 0, 0.07);
}

html.light .crypto-discovery-hub .csd-dashboard,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-dashboard {
  --csd-bg: #f4f5f7;
  --csd-bg-veil: #eceef2;
  --csd-surface: #ffffff;
  --csd-surface-mid: #f8f9fb;
  --csd-surface-high: #ffffff;
  --csd-card: #ffffff;
  --csd-elevated: #ffffff;
  --csd-text: #111114;
  --csd-text-soft: #4a4a56;
  --csd-muted: #7a7a88;
  --csd-border: rgba(0, 0, 0, 0.07);
  --csd-highlight: rgba(255, 255, 255, 0.9);
  --csd-highlight-soft: rgba(255, 255, 255, 0.5);
  --csd-shadow-ambient: 0 2px 6px rgba(0, 0, 0, 0.06);
  --csd-shadow-elevated: 0 10px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  --csd-shadow-well: inset 0 2px 10px rgba(0, 0, 0, 0.04);
  --zs-accent: #5a9e00;
  --zs-accent-soft: rgba(90, 158, 0, 0.08);
  --zs-accent-line: rgba(90, 158, 0, 0.35);
  background:
    radial-gradient(ellipse 90% 55% at 12% -8%, rgba(90, 158, 0, 0.04), transparent 58%),
    radial-gradient(ellipse 70% 45% at 88% 0%, rgba(0, 0, 0, 0.02), transparent 52%),
    var(--csd-bg);
}

html.light .crypto-discovery-hub .csd-hero-tile,
html.light .crypto-discovery-hub .csd-hero-main,
html.light .crypto-discovery-hub .csd-hero--institutional,
html.light .crypto-discovery-hub .csd-chart-panel,
html.light .crypto-discovery-hub .csd-chart-canvas,
html.light .crypto-discovery-hub .csd-chart-wrap,
html.light .crypto-discovery-hub .csd-top-card,
html.light .crypto-discovery-hub .csd-analytics-card,
html.light .crypto-discovery-hub .csd-intel-card,
html.light .crypto-discovery-hub .csd-mover-card,
html.light .crypto-discovery-hub .csd-comp-pill,
html.light .crypto-discovery-hub .csd-kpi,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-hero-tile,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-hero-main,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-hero--institutional,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chart-panel,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chart-canvas,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-chart-wrap,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-top-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-analytics-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-intel-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-mover-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-comp-pill,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-kpi {
  background: var(--csd-gradient-surface);
  box-shadow: var(--csd-shadow-ambient), var(--csd-shadow-inner);
  border-color: var(--csd-border);
  color: var(--csd-text);
}

/* ── Continuous workspace surface architecture ── */
.crypto-discovery-hub .crypto-discovery-block {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.crypto-discovery-hub .cdh-section,
.crypto-discovery-hub .csd-dashboard,
.crypto-discovery-hub .ncd-page,
.crypto-discovery-hub .crypto-all-coins-shell {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.crypto-discovery-hub .cdh-section {
  padding: 40px clamp(16px, 2vw, 24px) 64px;
}

.crypto-discovery-hub .csd-dashboard,
.crypto-discovery-hub .ncd-page,
.crypto-discovery-hub .crypto-all-coins-shell {
  padding: 40px clamp(16px, 3vw, 32px) 64px !important;
}

.crypto-discovery-hub .ncd-featured,
.crypto-discovery-hub .ncd-table-section {
  padding: 16px 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0;
  box-shadow: none;
}

.crypto-discovery-hub .ncd-kpi-strip {
  gap: 0;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0;
}

.crypto-discovery-hub .ncd-kpi {
  background: transparent;
}

/* Elevation belongs to cards only. */
.crypto-discovery-hub .cdh-idea-card--mi,
.crypto-discovery-hub .cdh-list-card,
.crypto-discovery-hub .cdh-list-detail,
.crypto-discovery-hub .all-coins-terminal-card,
.crypto-discovery-hub .ncd-coin-card,
.crypto-discovery-hub .ncd-insight-panel,
.crypto-discovery-hub .ncd-list-panel,
.crypto-discovery-hub .csd-analytics-card,
.crypto-discovery-hub .csd-top-card,
.crypto-discovery-hub .csd-hero-tile,
.crypto-discovery-hub .csd-intel-card,
.crypto-discovery-hub .csd-mover-card {
  background: #0b0b0b;
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 18px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.16);
}

html.light .crypto-discovery-hub .cdh-section,
html.light .crypto-discovery-hub .csd-dashboard,
html.light .crypto-discovery-hub .ncd-page,
html.light .crypto-discovery-hub .crypto-all-coins-shell,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .cdh-section,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .csd-dashboard,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .ncd-page,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub .crypto-all-coins-shell {
  background: transparent !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
  box-shadow: none !important;
}

/* ── Sector reference layout (/crypto/all-coins?sector=*) ── */
.crypto-discovery-hub--sectors-view .crypto-all-coins-wrapper {
  width: 100%;
  max-width: none;
  padding-inline: clamp(24px, 2vw, 40px) !important;
}

.crypto-discovery-hub--sectors-view .cdh-hub-anchor {
  margin-top: 0.75rem;
}

.crypto-discovery-hub--sectors-view .cdh-section-tabs {
  justify-content: space-between;
  width: 100%;
  gap: 0;
  margin-bottom: 1.25rem;
}

.crypto-discovery-hub--sectors-view .cdh-section-tab {
  flex: 1 1 0;
  min-width: 0;
}

.crypto-discovery-hub--sectors-view .crypto-discovery-block--sectors {
  margin-bottom: 0;
}

.crypto-discovery-hub--sectors-view .csd-dashboard {
  max-width: none;
  padding-inline: 0;
  background: transparent;
}

.csd-sector-hero {
  padding-top: clamp(34px, 3vw, 44px);
  padding-bottom: 0.5rem;
  text-align: center;
}

.csd-sector-hero-title {
  margin: 0;
  font-size: clamp(2rem, 2.8vw, 3rem);
  font-weight: 800;
  line-height: 1.15;
  color: #f8fafc;
  letter-spacing: 0;
}

.csd-sector-hero-sub {
  margin: 0.75rem auto 0;
  max-width: 46rem;
  font-size: clamp(0.95rem, 1.1vw, 1.0625rem);
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.62);
}

.crypto-discovery-hub--sectors-view .csd-chip-bar {
  display: flex;
  justify-content: center;
  margin-bottom: 1.75rem;
}

.crypto-discovery-hub--sectors-view .csd-chip-row {
  justify-content: center;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.crypto-discovery-hub--sectors-view .csd-chip-row::-webkit-scrollbar {
  display: none;
}

.crypto-discovery-hub--sectors-view .csd-chip {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.78);
}

.crypto-discovery-hub--sectors-view .csd-chip.is-active {
  background: var(--zs-light-surface, #ffffff);
  border-color: var(--zs-light-border, #e5e7eb);
  color: var(--zs-light-ink, #0f172a);
  font-weight: 600;
  box-shadow: none;
}

.crypto-discovery-hub--sectors-view .csd-overview-header {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.85fr);
  gap: clamp(20px, 2vw, 32px);
  padding-top: 0.5rem;
  margin-bottom: 1rem;
}

.crypto-discovery-hub--sectors-view .csd-overview-kpis {
  gap: clamp(18px, 2.5vw, 40px);
}

.crypto-discovery-hub--sectors-view .csd-overview-body {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .crypto-discovery-hub--sectors-view .csd-overview-body {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 250px);
    gap: clamp(28px, 2vw, 36px);
    align-items: start;
  }
}

.crypto-discovery-hub--sectors-view .csd-chart-wrap {
  height: clamp(280px, 36vh, 380px);
  padding: 0.75rem 1rem 0.5rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.crypto-discovery-hub--sectors-view .csd-chart-grid {
  stroke: rgba(255, 255, 255, 0.035);
}

.csd-traded-rail {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
}

.csd-traded-title {
  margin: 0 0 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.55);
  text-align: start;
}

.csd-traded-card {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

.csd-traded-list {
  display: flex;
  flex-direction: column;
}

.csd-traded-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  min-height: 58px;
  padding: 0.65rem 0.85rem;
  text-decoration: none;
  color: inherit;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.csd-traded-row:first-child {
  border-top: none;
}

.csd-traded-chg {
  font-size: 12.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.csd-traded-chg.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.csd-traded-chg.is-down {
  color: var(--zs-red, #ef4444);
}

.csd-traded-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  min-width: 0;
  text-align: end;
  font-size: 11px;
  font-weight: 400;
}

.csd-traded-price {
  font-size: 13px;
  font-weight: 600;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
}

.csd-traded-sym {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.55);
  letter-spacing: 0.02em;
}

.csd-traded-logo {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  object-fit: cover;
  flex-shrink: 0;
}

.csd-traded-view-all {
  margin: 0;
  padding: 0.85rem 0.75rem;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  background: transparent;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: color 160ms ease;
}

.csd-traded-view-all:hover {
  color: var(--zs-light-ink, #0f172a);
}

.csd-kpi-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}

.csd-kpi-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-height: 88px;
  padding: 0.85rem 0.9rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.csd-kpi-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.62);
}

.csd-kpi-label {
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.48);
  line-height: 1.35;
}

.csd-kpi-value {
  font-size: 14px;
  font-weight: 600;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
}

.csd-kpi-value.is-up {
  color: var(--zs-success-text, var(--zs-success, #18c37e));
}

.csd-kpi-value.is-down {
  color: var(--zs-red, #ef4444);
}

@media (max-width: 1279px) {
  .csd-kpi-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1023px) {
  .crypto-discovery-hub--sectors-view .csd-overview-body > .csd-traded-rail {
    order: 2;
  }

  .crypto-discovery-hub--sectors-view .csd-overview-header {
    grid-template-columns: 1fr;
  }

  .csd-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .crypto-discovery-hub--sectors-view .cdh-section-tabs {
    justify-content: flex-start;
    gap: 1.5rem;
  }

  .crypto-discovery-hub--sectors-view .cdh-section-tab {
    flex: 0 0 auto;
  }

  .csd-kpi-strip {
    grid-template-columns: 1fr;
  }
}

html.light .crypto-discovery-hub--sectors-view .csd-sector-hero-title,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-sector-hero-title {
  color: var(--zs-text-primary, #0f172a);
}

html.light .crypto-discovery-hub--sectors-view .csd-sector-hero-sub,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-sector-hero-sub {
  color: rgba(15, 23, 42, 0.62);
}

html.light .crypto-discovery-hub--sectors-view .csd-chart-wrap,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-chart-wrap {
  background: rgba(0, 0, 0, 0.02);
  border-color: rgba(15, 23, 42, 0.08);
  box-shadow: none;
}

html.light .crypto-discovery-hub--sectors-view .csd-traded-card,
html.light .crypto-discovery-hub--sectors-view .csd-kpi-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-traded-card,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-kpi-card {
  background: rgba(0, 0, 0, 0.02);
  border-color: rgba(15, 23, 42, 0.08);
  box-shadow: none;
}

html.light .crypto-discovery-hub--sectors-view .csd-traded-title,
html.light .crypto-discovery-hub--sectors-view .csd-overview-kpi-label,
html.light .crypto-discovery-hub--sectors-view .csd-kpi-label,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-traded-title,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-overview-kpi-label,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-kpi-label {
  color: rgba(15, 23, 42, 0.55);
}

html.light .crypto-discovery-hub--sectors-view .csd-overview-kpi-value,
html.light .crypto-discovery-hub--sectors-view .csd-kpi-value,
html.light .crypto-discovery-hub--sectors-view .csd-overview-title,
html.light .crypto-discovery-hub--sectors-view .csd-traded-price,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-overview-kpi-value,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-kpi-value,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-overview-title,
[data-zs-crypto-root][data-zs-theme='light'] .crypto-discovery-hub--sectors-view .csd-traded-price {
  color: var(--zs-text-primary, #0f172a);
}

