.benchmark-demo-notice { margin: 0 0 26px; color: #565c60; font-size: 12px; line-height: 1.7; }

/* Desktop module detail pages share the neutral homepage palette. */
@media (min-width: 981px) {
  .tensor-page {
    --theme-bg: #101214; --theme-surface: #191c20; --theme-hover: #24282d;
    --theme-ink: #eef0f2; --theme-muted: #b5bec6; --theme-line: #30353a;
    --theme-accent: #b7c0c8; --section-ink: #101214;
    --ink: #eef0f2; --muted: #b5bec6; --blue: #b7c0c8; --line: #30353a;
    background: #101214;
  }
  .tensor-page .site-header, .tensor-page .site-footer,
  .tensor-page .tensor-hero, .tensor-page .qml-workflow-section,
  .tensor-page .tensor-resources { background: #101214; border-color: #30353a; }
  .tensor-page .brand-mark { background: #d9dde1; color: #202327; }
  .tensor-page .tensor-hero-visual {
    --ink: #e8ebee; --muted: #aeb7bf; --blue: #a3b4c1; --lime: #a4b8ac;
    --line: #3e4952; --theme-secondary: #191c20; --surface-fill: #191c20;
    color: var(--ink); background: #191c20;
    border: 1px solid #ffffff0e; border-radius: 12px; color-scheme: dark;
  }
  .tensor-page .tensor-facts { border-color: #30353a; }
  .tensor-page .tensor-method {
    --theme-bg: #191c20; --theme-line: #343a40; --theme-muted: #b5bec6;
    --ink: #eef0f2; --muted: #b5bec6; --blue: #b7c0c8; --line: #343a40;
    color: var(--ink); background: #191c20; border-color: #343a40;
  }
  .tensor-page .qml-framework-section {
    --theme-bg: #e5e3dd; --theme-line: #bfc2bd; --theme-muted: #565c60;
    --ink: #303438; --muted: #565c60; --blue: #365d77; --line: #bfc2bd;
    color: var(--ink); background: #e5e3dd; border-color: #bfc2bd;
  }
  .tensor-page .performance-overview, .tensor-page .metric-results,
  .tensor-page .circuit-results, .tensor-page .qnn-results-section,
  .tensor-page .vqe-overview-section {
    --theme-bg: #e5e3dd; --theme-surface: #d9dad5; --theme-hover: #cdd1cc;
    --theme-ink: #303438; --theme-muted: #565c60; --theme-line: #bfc2bd; --theme-accent: #3b454e;
    --ink: #303438; --muted: #565c60; --blue: #365d77; --line: #bfc2bd;
    color: var(--ink); background: #e5e3dd; border-color: #bfc2bd; color-scheme: light;
  }
  .tensor-page .performance-overview, .tensor-page .qnn-results-section { border-top-width: 1px; }
  .tensor-page .metric-results .carousel-toolbar,
  .tensor-page .qnn-result-slide > header,
  .tensor-page .circuit-arrow-switcher > .chart-tab-list { background: #d9dad5; border-color: #bfc2bd; }
  .tensor-page .metric-results .carousel-toolbar > p,
  .tensor-page .metric-results .carousel-controls button { color: #565c60; border-color: #bfc2bd; }
  .tensor-page .qnn-chart figcaption { color: #46535e; background: #e5e3dd; border-color: #bfc2bd; }
  .tensor-page .qnn-result-slide { --ink: #303438; --muted: #565c60; border-color: #bfc2bd; border-radius: 10px; }
  .tensor-page .performance-overview-figure, .tensor-page .vqe-overview-figure,
  .tensor-page .circuit-display, .tensor-page .metric-carousel-shell { border-radius: 10px; }
  .tensor-page .vqe-overview-layout { border-color: #bfc2bd; }
  .tensor-page .tensor-resources { --ink: #eef0f2; --muted: #b5bec6; --line: #30353a; --blue: #bdcbd5; }
  .tensor-page .performance-overview-figure,
  .tensor-page .performance-chart-button,
  .tensor-page .metric-carousel-shell,
  .tensor-page .metric-slide > button,
  .tensor-page .circuit-display,
  .tensor-page .circuit-chart-button,
  .tensor-page .qnn-result-slide,
  .tensor-page .qnn-chart, .tensor-page .qnn-chart > button,
  .tensor-page .vqe-overview-figure,
  .tensor-page .vqe-overview-figure > button,
  .tensor-page .lightbox-stage { background: #e5e3dd; }
  .tensor-page .performance-overview-figure,
  .tensor-page .vqe-overview-figure { padding: 0; }
}

/* Hero illustrations share the module overview's vector style. */
.tensor-page .tensor-hero-visual.module-detail-diagram {
  display: grid;
  align-self: center;
  gap: 20px;
  min-height: 0;
  margin: 0;
  padding: 24px;
}
.module-diagram-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 16px;
  color: #b0b1b8;
  font-size: 12px;
  line-height: 1.6;
}
.module-diagram-heading > span:first-child { color: #b4ff50; font-weight: 500; }
.module-detail-diagram > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  max-height: 270px;
  object-fit: contain;
}
.module-detail-diagram figcaption {
  display: grid;
  gap: 8px;
  padding-top: 16px;
  border-top: 1px solid #303037;
  line-height: 1.7;
}
.module-detail-diagram figcaption strong { color: #f1f2f3; font-size: 14px; font-weight: 500; }
.module-detail-diagram figcaption > span { color: #b0b1b8; font-size: 12px; }
@media (max-width: 480px) {
  .tensor-page .tensor-hero-visual.module-detail-diagram { padding: 16px; gap: 16px; }
}