.ht-single{
  max-width:1400px;
  margin-inline:auto;
  padding-top:16px;
  padding-bottom:40px;
  padding-inline:10px;
}

.ht-single__layout{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.ht-single__main{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:20px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single__main{
  background:var(--surface-2);
}

.ht-single__aside{
  border-radius:var(--radius);
}

.ht-single-rating{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:18px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single-rating{
  background:var(--surface-2);
}

.ht-single-quicknav{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:18px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single-quicknav{
  background:var(--surface-2);
}

.ht-single-share{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:18px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single-share{
  background:var(--surface-2);
}

.ht-single-author{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:18px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single-author{
  background:var(--surface-2);
}

.ht-single-comments{
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  padding:18px 16px 20px 16px;
}

html[data-theme="dark"] .ht-single-comments{
  background:var(--surface-2);
}

@media(min-width:768px){
  .ht-single__layout{
    gap:18px;
  }
}

@media(min-width:992px){
  .ht-single__layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 320px;
    align-items:flex-start;
    column-gap:18px;
  }

  .ht-single__main{
    padding:22px 22px 24px 22px;
    grid-column:1;
  }
.ht-single{
  --single-scroll-offset:96px;
}

@media(max-width:1024px){
  .ht-single{
    --single-scroll-offset:80px;
  }
}

@media(max-width:640px){
  .ht-single{
    --single-scroll-offset:72px;
  }
}

  .ht-single-rating{
    grid-column:1;
  }

  .ht-single-quicknav{
    grid-column:1;
  }

  .ht-single-share{
    grid-column:1;
  }

  .ht-single-author{
    grid-column:1;
  }

  .ht-single-comments{
    grid-column:1;
  }

  .ht-single__aside{
    grid-column:2;
    grid-row:1;
  }
}