.hermes-tech-article,
.editor-styles-wrapper .hermes-tech-article {
  --htm-blue: #1769e0;
  --htm-blue-dark: #0b3f91;
  --htm-blue-soft: #f3f7fd;
  --htm-ink: #1a2433;
  --htm-muted: #687386;
  --htm-line: #dbe3ed;
  --htm-surface: #f7f9fc;
  box-sizing: border-box;
  overflow-wrap: break-word;
}

.hermes-tech-article *,
.editor-styles-wrapper .hermes-tech-article * {
  box-sizing: border-box;
}

.hermes-tech-intro {
  margin: 0 0 0.65em;
  color: #3f4e63;
  font-size: 1.08em;
  line-height: 1.7;
}

.hermes-tech-reading-info {
  margin: 0 0 1.75em;
  color: var(--htm-muted);
  font-size: 0.78em;
}

.hermes-tech-summary,
.hermes-tech-key-point,
.hermes-tech-toc {
  margin: 1.65em 0;
}

.hermes-tech-summary {
  padding: 1em 1.1em;
  border: 1px solid #cddcf0;
  border-left: 3px solid var(--htm-blue);
  border-radius: 4px;
  background: var(--htm-blue-soft);
}

.hermes-tech-summary h2,
.hermes-tech-toc h2,
.hermes-tech-references h2 {
  margin: 0 0 0.7em;
  color: var(--htm-ink);
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0;
}

.hermes-tech-summary ul {
  margin: 0;
  padding-left: 1.2em;
}

.hermes-tech-summary li + li {
  margin-top: 0.4em;
}

.hermes-tech-toc {
  padding: 1em 0;
  border-top: 1px solid var(--htm-line);
  border-bottom: 1px solid var(--htm-line);
}

.hermes-tech-toc ol {
  margin: 0;
  padding-left: 1.35em;
}

.hermes-tech-toc li {
  margin: 0.35em 0;
}

.hermes-tech-toc a,
.hermes-article-body a {
  color: var(--htm-blue-dark);
  text-underline-offset: 3px;
}

.hermes-article-body {
  counter-reset: hermes-section;
}

.hermes-article-body h2 {
  counter-increment: hermes-section;
  margin-top: 2.2em;
}

.hermes-article-body h2::before {
  display: block;
  margin-bottom: 0.25em;
  color: var(--htm-blue);
  content: counter(hermes-section, decimal-leading-zero);
  font-size: 0.55em;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
}

.hermes-article-body h3 {
  margin-top: 1.7em;
}

.hermes-tech-key-point {
  padding: 0.9em 1em;
  border-left: 3px solid var(--htm-blue);
  border-radius: 3px;
  background: var(--htm-surface);
}

.hermes-tech-key-point strong:first-child {
  display: block;
  margin-bottom: 0.35em;
  color: var(--htm-blue-dark);
  font-size: 0.78em;
  letter-spacing: 0.08em;
}

.hermes-tech-key-point > :last-child {
  margin-bottom: 0;
}

.hermes-tech-article figure {
  margin: 1.75em 0;
}

.hermes-tech-article figcaption {
  margin-top: 0.45em;
  color: var(--htm-muted);
  font-size: 0.78em;
  text-align: center;
}

.hermes-tech-article img {
  max-width: 100%;
  height: auto;
}

.hermes-tech-table-wrap {
  margin: 1.75em 0;
  overflow-x: auto;
  border: 1px solid var(--htm-line);
}

.hermes-tech-article table {
  width: 100%;
  min-width: 520px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  font-size: 0.9em;
}

.hermes-tech-article th,
.hermes-tech-article td {
  padding: 0.7em 0.8em;
  border: 0;
  border-bottom: 1px solid var(--htm-line);
  text-align: left;
  vertical-align: top;
}

.hermes-tech-article th {
  color: var(--htm-ink);
  background: #edf3fa;
  font-weight: 700;
}

.hermes-tech-article tr:last-child td {
  border-bottom: 0;
}

.hermes-tech-conclusion {
  margin-top: 2.5em;
  padding-top: 1em;
  border-top: 2px solid var(--htm-blue);
}

.hermes-tech-conclusion h2 {
  margin-top: 0;
}

.hermes-tech-conclusion > :last-child {
  margin-bottom: 0;
}

.hermes-tech-references {
  margin-top: 2.5em;
  padding-top: 1em;
  border-top: 1px solid var(--htm-line);
  color: var(--htm-muted);
  font-size: 0.86em;
}

.hermes-tech-references ol {
  margin-bottom: 0;
  padding-left: 1.25em;
}

@media (max-width: 680px) {
  .hermes-tech-intro {
    font-size: 1.03em;
  }

  .hermes-tech-summary,
  .hermes-tech-key-point {
    padding: 0.85em 0.9em;
  }

  .hermes-tech-article table {
    min-width: 500px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hermes-tech-article *,
  .hermes-tech-article *::before,
  .hermes-tech-article *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}