.main-article-container {
  --article-accent: #1a73e8;
  --article-accent-dark: #174ea6;
  --article-muted: rgba(var(--color-text), 0.66);
  --article-line: rgba(var(--color-text), 0.16);
  --article-line-soft: rgba(var(--color-text), 0.09);
  --article-soft: rgba(var(--color-text), 0.055);
  --article-success: #3f6b47;
  --article-warning: #9a4b18;
  --article-toc-active: #202124;
  --article-toc-line: #dadce0;
  --article-toc-scrollbar: #c4c7c5;
  background-color: rgb(var(--color-background));
}

/* Article editorial enhancements */
.main-article__excerpt { max-width: 760px; margin-block-end: 20px; color: var(--article-muted); font-size: clamp(17px, 1.25vw, 20px); line-height: 1.6; }
.main-article__byline { display: inline-flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.main-article__byline-name { color: rgb(var(--color-text)); font-weight: 600; }
.main-article__byline-role, .main-article__byline-short-bio { color: var(--article-muted); }
.main-article__byline-short-bio::before { margin-inline-end: 8px; content: "·"; }
.main-article__listen-trigger { display: inline-flex; gap: 6px; align-items: center; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: .16em; cursor: pointer; }
.main-article__listen-icon { display: block; flex: 0 0 auto; }
.main-article__audio[hidden], .main-article__subscribe[hidden] { display: none !important; }
.main-article__audio { position: fixed; inset-inline-end: 24px; inset-block-end: 24px; z-index: 20; display: grid; grid-template-columns: 132px minmax(0,1fr); width: min(520px, calc(100vw - 32px)); overflow: hidden; border: 1px solid var(--article-line); border-radius: 8px; background: rgb(var(--color-background)); box-shadow: 0 12px 36px rgba(0,0,0,.16); }
.main-article__audio-close { position: absolute; inset-block-start: 10px; inset-inline-end: 12px; z-index: 2; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: rgba(var(--color-text),.07); color: rgb(var(--color-text)); font-size: 22px; line-height: 1; cursor: pointer; }
.main-article__audio-cover { position: relative; min-height: 148px; overflow: hidden; background: var(--article-soft); }
.main-article__audio-cover-media, .main-article__audio-cover-media img { width: 100%; height: 100%; }
.main-article__audio-cover-media img { display: block; object-fit: cover; }
.main-article__audio-cover-media svg { position: absolute; inset: 0; margin: auto; }
.main-article__audio-control { position: absolute; inset: auto auto 12px 12px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: #111; box-shadow: 0 3px 12px rgba(0,0,0,.18); cursor: pointer; }
.main-article__audio-pause { display: none; }
.main-article__audio-control[aria-pressed="true"] .main-article__audio-play { display: none; }
.main-article__audio-control[aria-pressed="true"] .main-article__audio-pause { display: inline; }
.main-article__audio-body { min-width: 0; padding: 24px 48px 20px 20px; }
.main-article__audio-title { display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-weight: 600; }
.main-article__audio-source, .main-article__audio-count { margin: 5px 0 0; color: var(--article-muted); }
.main-article__audio-progress { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; margin-block-start: 18px; }
.main-article__audio-progress input { width: 100%; }
.main-article__author-profile { display: flex; gap: 18px; width: 100%; max-width: 726px; margin: 0 0 52px; padding-block-start: 28px; border-block-start: 1px solid var(--article-line-soft); }
.main-article__author-image { flex: 0 0 64px; width: 64px; height: 64px; overflow: hidden; border-radius: 50%; }
.main-article__author-image img { width: 100%; height: 100%; object-fit: cover; }
.main-article__author-copy { min-width: 0; }
.main-article__author-label, .main-article__author-name, .main-article__author-role { margin: 0; }
.main-article__author-label { margin-block-end: 6px; color: var(--article-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.main-article__author-role { margin-block-start: 4px; color: var(--article-muted); }
.main-article__author-bio { margin-block: 12px; line-height: 1.68; }
.main-article__author-link { color: inherit; text-underline-offset: .18em; }
.main-article__navigation { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; margin-block-start: 24px; padding-block: 28px; border-block: 1px solid var(--article-line-soft); }
.main-article__navigation-slot { display: flex; min-width: 0; justify-content: flex-start; }
.main-article__navigation-slot--next { justify-content: flex-end; }
.main-article__navigation-link { display: inline-flex; flex-direction: column; gap: 8px; max-width: 90%; color: rgb(var(--color-text)); text-decoration: none; }
.main-article__navigation-link--previous { text-align: start; }
.main-article__navigation-link--next { text-align: end; }
.main-article__navigation-label { color: var(--article-muted); font-size: 12px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.main-article__navigation-main { display: flex; gap: 12px; align-items: center; font-size: clamp(16px,1.25vw,20px); font-weight: 600; line-height: 1.35; }
.main-article__navigation-arrow { flex: 0 0 auto; transition: transform .2s ease; }
.main-article__navigation-link--previous:hover .main-article__navigation-arrow { transform: translateX(-4px); }
.main-article__navigation-link--next:hover .main-article__navigation-arrow { transform: translateX(4px); }
.main-article__related { padding-block: 54px 70px; }
.main-article__related-title { margin: 0 0 28px; }
.main-article__related-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.main-article__related-card { overflow: hidden; border: 1px solid var(--article-line-soft); background: rgb(var(--color-background)); }
.main-article__related-media { display: block; aspect-ratio: 16/10; overflow: hidden; }
.main-article__related-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.main-article__related-card:hover .main-article__related-media img { transform: scale(1.025); }
.main-article__related-body { padding: 18px; }
.main-article__related-date { margin: 0 0 8px; color: var(--article-muted); }
.main-article__related-card-title { margin: 0; }
.main-article__related-card-title a { color: inherit; text-decoration: none; }
.main-article__related-excerpt { display: -webkit-box; margin: 12px 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: var(--article-muted); }
.main-article__related-more { display: inline-block; margin-block-start: 14px; color: inherit; text-underline-offset: .18em; }
.main-article__subscribe { position: fixed; inset: auto 0 0; z-index: 19; padding-block: 16px; background: #111; color: #fff; opacity: 0; transform: translateY(100%); transition: opacity .22s ease, transform .22s ease; }
.main-article__subscribe--visible { opacity: 1; transform: translateY(0); }
.main-article__subscribe-inner { display: flex; gap: 24px; align-items: center; justify-content: space-between; }
.main-article__subscribe-text { margin: 0; }
.main-article__subscribe-actions { display: flex; gap: 18px; align-items: center; }
.main-article__subscribe-dismiss { padding: 0; border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; }
.main-article__tail { padding-block-end: 24px; }
@media (max-width: 1023px) {
  .main-article__related { overflow: hidden; }
  .main-article__related-grid {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 16px) / 1.5);
    gap: 16px;
    margin-inline-end: calc(var(--page-padding, 20px) * -1);
    padding-inline-end: var(--page-padding, 20px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
  }
  .main-article__related-grid::-webkit-scrollbar { display: none; }
  .main-article__related-card { scroll-snap-align: start; }
  .main-article__navigation { gap: 16px; padding-block: 22px; }
  .main-article__navigation-link { max-width: 100%; }
  .main-article__navigation-main { font-size: 15px; }
  .main-article__subscribe-inner { align-items: flex-start; flex-direction: column; gap: 14px; }
  .main-article__byline-short-bio { display: none; }
  .main-article__audio { inset-inline: 8px; inset-block-end: 8px; grid-template-columns: 64px minmax(0,1fr); width: auto; min-height: 80px; }
  .main-article__audio-cover { min-height: 80px; }
  .main-article__audio-control { inset-block-end: 8px; inset-inline-start: 8px; width: 30px; height: 30px; }
  .main-article__audio-body { padding: 12px 44px 10px 12px; }
  .main-article__audio-title { -webkit-line-clamp: 1; font-size: 14px; }
  .main-article__audio-source, .main-article__audio-count { display: none; }
  .main-article__audio-progress { margin-block-start: 8px; }
  .main-article__audio-close { inset-block-start: 6px; inset-inline-end: 8px; width: 28px; height: 28px; }
}
.main-article__title {
  margin: 0;
  padding-block-end: 20px;
}
.main-article__cover-image {
  aspect-ratio: var(--aspect-ratio);
  margin-block: 40px;
  overflow: hidden;
  border-radius: var(--border-radius);
}
.main-article__cover-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.main-article__info {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-block-end: 20px;
  color: rgb(var(--color-light-text));
  border-block-end: 1px solid rgb(221 221 221 / 100%);
}
.main-article__button-back {
  margin-block-end: 40px;
}
.main-article__button-back svg {
  width: 0.8em;
  height: 0.8em;
  transform: rotate(90deg);
}
.main-article .main-article__content {
  width: 100%;
  max-width: none;
  margin-block: 40px;
}
.main-article__reading {
  position: relative;
}
.main-article__sidebar {
  min-width: 0;
}
.main-article__sidebar-inner {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.main-article__reading--toc-hidden .main-article__sidebar:not(:has(.preferred-source)) {
  display: none;
}
.main-article__reading--toc-hidden {
  display: block;
}
.main-article__toc[hidden],
.main-article__mobile-toc[hidden] {
  display: none !important;
}
.main-article__mobile-toc {
  margin-block-start: 24px;
}
.main-article__toc {
  display: none;
}
.main-article__toc-inner,
.main-article__toc-details {
  background: rgb(var(--color-background));
}
.main-article__toc-title {
  margin: 0 0 18px;
  font-weight: var(--body-bold-font-weight);
}
.main-article__toc-nav {
  scrollbar-color: var(--article-toc-scrollbar) transparent;
  scrollbar-width: thin;
}
.main-article__toc-nav::-webkit-scrollbar { width: 6px; }
.main-article__toc-nav::-webkit-scrollbar-track { background: transparent; }
.main-article__toc-nav::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--article-toc-scrollbar); }
.main-article__toc-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-article__toc .main-article__toc-list {
  position: relative;
  border-inline-start: 2px solid var(--article-toc-line);
}
.main-article__toc-item { margin: 0; padding: 0; }
.main-article__toc-link {
  position: relative;
  display: block;
  padding: 8px 10px;
  color: var(--article-muted);
  line-height: 1.45;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color var(--duration-short) ease, background-color var(--duration-short) ease;
}
.main-article__toc .main-article__toc-link {
  margin-inline-start: -2px;
  padding-inline-start: 12px;
}
.main-article__toc .main-article__toc-item--h3 .main-article__toc-link {
  padding-inline-start: 28px;
}
.main-article__toc .main-article__toc-link::before {
  position: absolute;
  inset-block: 8px;
  inset-inline-start: 0;
  width: 2px;
  background: transparent;
  content: "";
}
.main-article__toc-link:hover,
.main-article__toc-link:focus-visible,
.main-article__toc-link--active { color: var(--article-toc-active); }
.main-article__toc .main-article__toc-link--active::before,
.main-article__toc .main-article__toc-link[aria-current="true"]::before { background: var(--article-toc-active); }
.main-article__toc-link:focus-visible,
.main-article__toc-summary:focus-visible {
  outline: 2px solid rgba(var(--color-text), 0.38);
  outline-offset: 2px;
}
.main-article__reading--toc-outside .main-article__toc { opacity: 0; visibility: hidden; transform: translateY(8px); }
.main-article__heading-anchor { scroll-margin-top: 112px; }
.main-article__content.rte {
  overflow-wrap: anywhere;
  font-size: clamp(16px, 1.05vw, 18px);
  line-height: 1.72;
}
.main-article__content.rte > h2 {
  margin-block: 56px 18px;
  font-size: var(--title5-font-size);
}
.main-article__content.rte > h3 {
  margin-block: 38px 14px;
  font-size: var(--title6-font-size);
}
.main-article__content.rte a:not(.button) {
  color: var(--article-accent-dark);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.main-article__content.rte a:not(.button):hover {
  color: var(--article-accent);
}
.main-article__content.rte img {
  border-radius: 0;
}
.main-article__content.rte :is(p img:not([style*="float"]):only-child, div img:not([style*="float"]):only-child, figure, video, object, blockquote, table) {
  margin-block: 1.8rem;
}
.main-article__content > p:has(iframe) {
  position: relative;
  padding-bottom: 56.25%;
}
.main-article__content > p > iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.main-article__content.rte figcaption {
  margin-block-start: 0.55rem;
  color: var(--article-muted);
  font-size: 0.875rem;
  font-style: normal;
  line-height: 1.5;
  text-align: center;
}
.main-article__content.rte figure {
  text-align: center;
}
.main-article__content.rte figure > a {
  display: block;
  width: 100%;
  margin: 0;
  line-height: 0;
}
.main-article__content.rte figure img,
.main-article__content.rte figure > a > img {
  display: block;
  width: 80%;
  height: auto;
  margin: 0 auto;
}
.main-article__content.rte blockquote {
  margin-inline: 0;
  padding: 1rem 0 1rem 1.25rem;
  border-inline-start: 3px solid var(--article-line);
  background: transparent;
  color: var(--article-muted);
  line-height: 1.75;
}
.main-article__content.rte :is(aside.article-note, .article-note) {
  padding: 1rem 1rem 1rem 1.25rem;
  border-inline-start: 3px solid var(--article-line);
  background: var(--article-soft);
}
.main-article__content.rte :is(.quality-list, .callout, .tip-box, .warning-box, .steps-list, .compare-table-wrap, .compare-table, .spec-list, .faq-section, .product-highlight) {
  margin-block: 2rem;
}
.main-article__content.rte :is(.quality-list, .callout, .tip-box, .warning-box, .steps-list, .compare-table, .spec-list, .faq-section, .product-highlight) :where(:not(meta, span) + *) {
  margin-block-start: 0;
}
.main-article__content.rte .quality-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
  list-style: none;
  border-block: 1px solid var(--article-line);
}
.main-article__content.rte .quality-list li {
  display: grid;
  grid-template-columns: minmax(150px, 0.34fr) 1fr;
  gap: 1rem;
  margin: 0;
  padding: 1rem 0;
  border-bottom: 1px solid var(--article-line-soft);
  line-height: 1.58;
}
.main-article__content.rte .quality-list li:last-child {
  border-bottom: 0;
}
.main-article__content.rte .quality-list strong {
  display: block;
  font-weight: 600;
}
.main-article__content.rte :is(.callout, .tip-box, .warning-box) {
  padding: 0.95rem 0 0.95rem 1.15rem;
  border-radius: 0;
  background: #f9f9f9;
  line-height: 1.65;
}
.main-article__content.rte .callout {
  border-inline-start: 3px solid var(--article-success);
}
.main-article__content.rte .tip-box {
  border-inline-start: 3px solid var(--article-accent);
}
.main-article__content.rte .warning-box {
  border-inline-start: 3px solid var(--article-warning);
}
.main-article__content.rte :is(.callout, .tip-box, .warning-box) strong:first-child {
  font-weight: 600;
}
.main-article__content.rte .steps-list {
  display: grid;
  gap: 0.85rem;
  padding-inline-start: 1.35rem;
}
.main-article__content.rte .steps-list li {
  margin: 0;
  padding-inline-start: 0.2rem;
  line-height: 1.65;
}
.main-article__content.rte .steps-list li::marker {
  color: var(--article-accent-dark);
  font-weight: 600;
}
.main-article__content.rte .compare-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-block: 1px solid var(--article-line);
}
.main-article__content.rte .compare-table {
  width: 100%;
  min-width: 660px;
  margin-block: 0;
  border-collapse: collapse;
  font-size: 0.95em;
  line-height: 1.5;
}
.main-article__content.rte .compare-table :is(th, td) {
  padding: 0.95rem 1rem;
  border: 0;
  border-bottom: 1px solid var(--article-line-soft);
  vertical-align: top;
  white-space: normal;
}
.main-article__content.rte .compare-table th {
  color: var(--article-muted);
  font-size: 0.88em;
  font-weight: 600;
  text-align: start;
  background: transparent;
}
.main-article__content.rte .compare-table tr:last-child td {
  border-bottom: 0;
}
.main-article__content.rte > .compare-table {
  border-block: 1px solid var(--article-line);
}
.main-article__content.rte .spec-list {
  display: grid;
  grid-template-columns: minmax(130px, 0.32fr) 1fr;
  gap: 0;
  border-block: 1px solid var(--article-line);
}
.main-article__content.rte .spec-list :is(dt, dd) {
  margin: 0;
  padding: 0.9rem 0;
  border-bottom: 1px solid var(--article-line-soft);
}
.main-article__content.rte .spec-list dt {
  padding-inline-end: 1rem;
  font-weight: 600;
}
.main-article__content.rte .spec-list dd {
  color: var(--article-muted);
}
.main-article__content.rte .spec-list :is(dt:last-of-type, dd:last-of-type) {
  border-bottom: 0;
}
.main-article__content.rte .faq-section {
  padding-block-start: 1.25rem;
  border-block-start: 1px solid var(--article-line);
}
.main-article__content.rte .faq-section h2 {
  margin-block: 0 1.25rem;
  font-size: var(--title5-font-size);
}
.main-article__content.rte .faq-section h3 {
  margin-block: 1.25rem 0.35rem;
  font-size: var(--title6-font-size);
  line-height: 1.35;
}
.main-article__content.rte .faq-section p {
  margin-block-start: 0;
  color: var(--article-muted);
}
.main-article__content.rte .product-highlight {
  margin-inline: 0;
}
.main-article__content.rte .product-highlight img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
}
.main-article__content.rte .product-highlight figcaption {
  margin-block-start: 0.55rem;
  color: var(--article-muted);
  font-size: 0.92em;
  line-height: 1.45;
}
.main-article__comment-title {
  padding-block: 40px;
}
.main-article__comment-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-block-end: 40px;
}
.main-article__comment-item {
  display: flex;
  flex-direction: column;
  gap: 30px;
  padding: 30px;
  border: 1px solid #ddd;
  border-radius: 4px;
}
.main-article__comment-info {
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: end;
}
.main-article__comment-fields {
  display: flex;
  gap: 20px;
}
.main-article .text-area + .field__label {
  inset-block-start: 20px;
}
.main-article__share {
  margin-block: 40px 80px;
}
.main-article__comment-submit {
  display: flex;
  justify-content: center;
  margin-block-start: 40px;
}
.main-article__comment-form {
  padding-block-start: 40px;
}
.main-article__comment-form-title {
  margin-block-end: 40px;
}
.main-article__comment-tip {
  padding-block: 40px;
}
.main-article .field__info {
  padding-block-end: 40px;
}
.main-article__comment-dot {
  width: 4px;
  height: 4px;
  background-color: #000;
  border-radius: 50%;
}
@media (min-width: 1024px) {
  .main-article__reading--toc-ready {
    display: grid;
    grid-template-columns: minmax(0, 800px) 264px;
    column-gap: 56px;
    align-items: start;
    width: min(calc(100vw - 80px), 1120px);
    margin-inline-start: 50%;
    transform: translateX(-50%);
  }

  .main-article__reading--toc-ready .main-article__mobile-toc {
    display: none;
  }

  .main-article__reading--toc-ready .main-article__content {
    grid-column: 1;
    width: 100%;
    max-width: none;
    margin-block: 40px;
  }

  .main-article__reading--toc-ready .main-article__author-profile {
    grid-column: 1;
  }

  .main-article__reading--toc-ready .main-article__sidebar {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: stretch;
    min-width: 0;
    padding-block-start: 40px;
  }

  .main-article__reading--toc-ready .main-article__sidebar-inner {
    position: sticky;
    inset-block-start: 112px;
    max-height: calc(100vh - 144px);
  }

  .main-article__reading--toc-ready .main-article__toc {
    z-index: 2;
    display: flex;
    flex: 0 1 auto;
    flex-direction: column;
    min-height: 0;
    max-height: none;
    overflow: hidden;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity var(--duration-default) ease, transform var(--duration-default) ease, visibility var(--duration-default) ease;
  }

  .main-article__reading--toc-ready .main-article__toc-nav {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    padding-inline-end: 10px;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .main-article__reading--toc-hidden .main-article__sidebar:has(.preferred-source) {
    display: block;
    width: min(100%, 726px);
    margin: 0 auto 40px;
  }
}
@media (max-width: 1023px) {
  .main-article__cover-image {
    margin-block: 20px;
  }

  .main-article__content {
    margin-block-end: 20px;
  }

  .main-article__toc {
    display: none;
  }

  .main-article__sidebar {
    width: 100%;
    margin-block-end: 40px;
  }

  .main-article__sidebar-inner {
    gap: 20px;
  }

  .main-article__mobile-toc {
    display: block;
    margin-block-start: 24px;
  }

  .main-article__toc-details {
    overflow: hidden;
    border: 1px solid var(--article-line);
  }

  .main-article__toc-summary {
    position: relative;
    padding: 14px 44px 14px 16px;
    font-weight: var(--body-bold-font-weight);
    cursor: pointer;
    list-style: none;
  }

  .main-article__toc-summary::-webkit-details-marker {
    display: none;
  }

  .main-article__toc-summary::after {
    content: "";
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: 18px;
    width: 8px;
    height: 8px;
    border-inline-end: 1px solid currentColor;
    border-block-end: 1px solid currentColor;
    transform: translateY(-65%) rotate(45deg);
    transition: transform var(--duration-default) ease;
  }

  .main-article__toc-details[open] .main-article__toc-summary::after {
    transform: translateY(-35%) rotate(225deg);
  }

  .main-article__mobile-toc .main-article__toc-nav {
    max-height: none;
    padding: 8px 10px 12px;
    border-block-start: 1px solid var(--article-line-soft);
  }

  .main-article__mobile-toc .main-article__toc-item--h3 {
    padding-inline-start: 16px;
  }

  .main-article__mobile-toc .main-article__toc-link:hover,
  .main-article__mobile-toc .main-article__toc-link:focus-visible,
  .main-article__mobile-toc .main-article__toc-link--active {
    background: rgba(var(--color-text), 0.04);
  }

  .main-article__share {
    margin-block: 20px 40px;
  }

  .main-article__comment-title {
    padding-block: 0 20px;
  }

  .main-article__comment-list {
    margin-block-end: 20px;
  }

  .main-article__comment-item {
    gap: 20px;
    padding: 20px;
  }

  .main-article__comment-info {
    gap: 16px;
  }

  .main-article__comment-content {
    padding: 0;
  }

  .main-article__comment-form-title {
    margin-block-end: 20px;
  }

  .main-article__comment-fields {
    display: block;
  }

  .main-article__comment-tip {
    padding-block-start: 20px;
  }
}
@media (max-width: 640px) {
  .main-article__content.rte {
    font-size: 16px;
    line-height: 1.68;
  }

  .main-article__content.rte :is(.quality-list, .callout, .tip-box, .warning-box, .steps-list, .compare-table-wrap, .compare-table, .spec-list, .faq-section, .product-highlight) {
    margin-block: 1.65rem;
  }

  .main-article__content.rte .quality-list li {
    grid-template-columns: 1fr;
    gap: 0.3rem;
  }

  .main-article__content.rte .compare-table {
    min-width: 620px;
  }

  .main-article__content.rte .compare-table :is(th, td) {
    padding: 0.85rem;
  }

  .main-article__content.rte .spec-list {
    grid-template-columns: 1fr;
  }

  .main-article__content.rte .spec-list dt {
    padding-block-end: 0.25rem;
    border-bottom: 0;
  }

  .main-article__content.rte .spec-list dd {
    padding-block-start: 0;
  }

  .main-article__content.rte .spec-list dd:not(:last-child) {
    border-bottom: 1px solid var(--article-line-soft);
  }
}