.ht-single__main{
  color:var(--fg);
}

.ht-single__main > *:first-child{
  margin-top:0;
}

.ht-single__main p,
.ht-single__main p.has-text-align-center,
.ht-single__main p.has-text-align-right,
.ht-single__main p.has-text-align-left{
  margin-top:0;
  margin-bottom:16px;
  text-align:justify !important;
  text-align-last:right;
}

.ht-single__main strong{
  font-weight:600;
}

.ht-single__main em{
  font-style:italic;
}

.ht-single__main a{
  color:var(--brand-700);
  font-weight:600;
  text-decoration:none;
}

.ht-single__main a:hover{
  color:var(--brand-700);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
}

.ht-single__main a:focus-visible{
  outline:2px solid var(--brand-700);
  outline-offset:2px;
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
}

html[data-theme="dark"] .ht-single__main a{
  color:var(--brand-300);
}

html[data-theme="dark"] .ht-single__main a:hover{
  color:var(--brand-200);
}

html[data-theme="dark"] .ht-single__main a:focus-visible{
  outline-color:var(--brand-300);
}

.ht-single__main img{
  max-width:100%;
  height:auto;
  display:block;
  margin:20px auto;
  border-radius:12px;
}

.ht-single__main figure{
  margin:20px 0;
}

.ht-single__main figure img{
  margin:0 auto;
}

.ht-single__main figcaption{
  text-align:center;
  margin-top:8px;
  color:var(--fg-muted,#6b7280);
}

.ht-single__main ul,
.ht-single__main ol{
  margin-top:0;
  margin-bottom:16px;
  padding-right:24px;
}

.ht-single__main li{
  margin-bottom:6px;
}

.ht-single__main ul li::marker{
  font-size:1.2em;
  color:var(--brand-500);
}

.ht-single__main ol li::marker{
  font-size:1.1em;
  color:var(--brand-600);
}

.ht-single__main h2,
.ht-single__main h3,
.ht-single__main h4,
.ht-single__main h5,
.ht-single__main h6{
  margin-top:28px;
  margin-bottom:12px;
}

.ht-single__main h2{
  position:relative;
  text-align:right;
  padding-right:18px;
}

.ht-single__main h2::after{
  content:"";
  position:absolute;
  top:50%;
  right:0;
  width:4px;
  height:18px;
  border-radius:999px;
  background:linear-gradient(to bottom,var(--brand-400),var(--brand-600));
  transform:translateY(-50%);
}

.ht-single__main blockquote{
  margin:20px 0;
  padding:12px 16px;
  border-right:3px solid var(--brand-500);
  border-radius:10px;
  background-color:var(--surface-soft,#f3f4f6);
}

.ht-single__main blockquote p{
  margin-bottom:8px;
}

.ht-single__main blockquote p:last-child{
  margin-bottom:0;
}

.ht-single__main table{
  width:100%;
  border-collapse:collapse;
  margin:20px 0;
}

.ht-single__main th,
.ht-single__main td{
  border:1px solid var(--border-subtle,#e5e7eb);
  padding:8px 10px;
  text-align:right;
}

.ht-single__main th{
  background-color:var(--surface-soft,#f3f4f6);
}

.ht-single__main h2[id],
.ht-single__main h3[id]{
  scroll-margin-top:var(--single-scroll-offset);
}

.ht-article-card {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    padding: 0.7rem 0.4rem;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    background-color: #ffffff;
    color: var(--fg);
    gap: 1rem;
}

.ht-article-card__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: right;
    line-height: 1.6;
    margin-inline-end: auto;
}

.ht-article-card__title {
    margin: 0 0 0.15rem;
    font-size: 0.86rem;
    color: var(--muted);
    font-weight: 400;
}

.ht-article-card__subtitle {
    margin: 0;
    font-size: 0.96rem;
    font-weight: 600;
    color: var(--brand-700);
    text-decoration: none;
}

.ht-article-card__subtitle:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ht-article-card__img-link {
    flex-shrink: 0;
    display: inline-flex;
}

.ht-article-card__img {
    width: 128px;
    border-radius: 12px;
    object-fit: cover;
}

@media (max-width: 480px) {
    .ht-article-card {
        padding: 0.6rem 1rem;
    }

    .ht-article-card__img {
        width: 52px;
        height: 52px;
    }

    .ht-article-card__subtitle {
        font-size: 0.9rem;
    }
}

.ht-important-box {
    margin: 16px 0;
    padding: 12px 14px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--brand-300);
    background-color: color-mix(in oklab, var(--bg), var(--brand-100) 85%);
    color: var(--fg);
}

.ht-important-box__title {
    margin: 0 0 4px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--brand-700);
}

.ht-important-box__content {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.7;
}

.success-box {
    margin: 16px 0;
    padding: 12px 14px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--brand-300);
    background-color: color-mix(in oklab, var(--bg), var(--brand-100) 92%);
    color: var(--fg);
}

.success-box-heading {
    margin: 0 0 4px !important;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--brand-700);
}

.success-box-content {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.7;
}