.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 .benchmark-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 .benchmark-overview-figure,
  .tensor-page .circuit-display, .tensor-page .metric-carousel-shell { border-radius: 10px; }
  .tensor-page .benchmark-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 .benchmark-overview-figure,
  .tensor-page .benchmark-overview-figure > button,
  .tensor-page .lightbox-stage { background: #e5e3dd; }
  .tensor-page .performance-overview-figure,
  .tensor-page .benchmark-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; }
}

/* Shared conditions for all ArcTN benchmark figures. */
.tensor-page .benchmark-environment { margin: 0 0 32px; padding: 18px 20px; border: 1px solid #303037; border-radius: 8px; color: #e3e4e8; background: #141419; }
.tensor-page .benchmark-environment-summary { margin: 0 0 12px; font-size: 13px; line-height: 1.8; color: #c5c7ce; }
.tensor-page .benchmark-environment summary { padding-block: 6px; cursor: pointer; font-size: 14px; line-height: 1.7; }
.tensor-page .benchmark-environment summary::marker { color: #b4ff50; }
.tensor-page .benchmark-environment summary span { display: inline-block; margin-left: 12px; color: #a5a7b0; font-size: 12px; }
.tensor-page .benchmark-environment summary:focus-visible { outline: 2px solid #b4ff50; outline-offset: 4px; }
.tensor-page .benchmark-environment-note { margin: 16px 0 24px; color: #b0b1b8; font-size: 13px; line-height: 1.8; }
.tensor-page .benchmark-environment-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; gap: 28px; }
.tensor-page .benchmark-environment-tables { display: grid; min-width: 0; gap: 24px; }
.qml-page .qml-environment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.qml-page .qml-environment-grid > table:nth-child(-n+2) { align-self: stretch; }
.tensor-page .benchmark-environment table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.tensor-page .benchmark-environment caption { padding-bottom: 12px; text-align: left; color: #f1f2f3; font-size: 15px; font-weight: 500; }
.tensor-page .benchmark-environment :is(th, td) { padding: 9px 12px; border-bottom: 1px solid #303037; text-align: left; vertical-align: top; }
.tensor-page .benchmark-environment th { font-weight: 400; }
.tensor-page .benchmark-environment th:first-child { width: 36%; }
.tensor-page .benchmark-environment thead { background: #202026; color: #c9cbd2; }
.tensor-page .benchmark-environment tbody th { color: #b0b1b8; }
.tensor-page .benchmark-table-scroll { max-width: 100%; overflow-x: auto; }
.tensor-page .benchmark-table-scroll:focus-visible { outline: 2px solid #b4ff50; outline-offset: 4px; }
.tensor-page .benchmark-environment .vqe-circuit-table { min-width: 700px; }
.tensor-page .benchmark-environment .vqe-circuit-table th:first-child { width: 16.6667%; }
.tensor-page .vqe-circuit-table td { white-space: nowrap; }
@media (max-width: 980px) {
  .tensor-page .benchmark-environment-grid { grid-template-columns: minmax(0, 1fr); }
  .qml-page .qml-environment-grid > table:nth-child(-n+2) { align-self: start; }
}
@media (max-width: 480px) {
  .tensor-page .benchmark-environment { padding: 14px 12px; }
  .tensor-page .benchmark-environment summary span { display: block; margin-left: 0; }
  .tensor-page .benchmark-environment :is(th, td) { padding: 8px 6px; }
}