.longtext-page {
    padding-block: var(--tk-space-7) var(--tk-space-8);
}

.longtext-header {
    max-width: var(--tk-size-prose);
    margin-bottom: var(--tk-space-7);
}

.longtext-header h1 {
    margin-bottom: var(--tk-space-5);
}

.longtext-header .short-answer {
    margin-bottom: var(--tk-space-3);
    font-size: var(--tk-font-size-lead);
    color: var(--tk-color-text-muted);
}

.longtext-lead {
    margin-bottom: 0;
}

.legal-updated,
.blog-meta {
    margin: var(--tk-space-4) 0 0;
    font-size: var(--tk-font-size-sm);
    color: var(--tk-color-text-muted);
}

.blog-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--tk-space-2) var(--tk-space-5);
}

.longtext {
    max-width: var(--tk-size-prose);
    font-size: var(--tk-font-size-lg);
    line-height: var(--tk-line-height-body);
}

.longtext > :first-child {
    margin-top: 0;
}

.longtext p,
.longtext ul,
.longtext ol,
.longtext address,
.longtext .longtext-quote,
.longtext .longtext-code,
.longtext .longtext-figure {
    margin-block: 0 var(--tk-space-5);
}

.longtext h2 {
    font-weight: var(--tk-font-weight-bold);
    margin-block: var(--tk-space-8) var(--tk-space-4);
    font-size: var(--tk-font-size-h3);
}

.longtext h3,
.longtext h4 {
    font-weight: var(--tk-font-weight-bold);
    margin-block: var(--tk-space-6) var(--tk-space-3);
    font-size: var(--tk-font-size-xl);
    line-height: var(--tk-line-height-snug);
}

.longtext h4 {
    font-size: var(--tk-font-size-lg);
}

.longtext ul,
.longtext ol {
    padding-inline-start: var(--tk-space-6);
}

.longtext li > p {
    margin: 0;
}

.longtext li + li {
    margin-top: var(--tk-space-2);
}

.longtext address {
    font-style: normal;
}

.longtext :not(pre) > code {
    padding-inline: var(--tk-space-2);
    font-size: var(--tk-font-size-sm);
    overflow-wrap: anywhere;
    background-color: var(--tk-color-primary-soft);
    border-radius: var(--tk-radius-sm);
}

.longtext-code {
    padding: var(--tk-space-4) var(--tk-space-5);
    overflow-x: auto;
    font-size: var(--tk-font-size-sm);
    line-height: var(--tk-line-height-snug);
    color: var(--tk-color-text);
    background-color: var(--tk-color-surface);
    border: var(--tk-border-width) solid var(--tk-color-line-strong);
    border-radius: var(--tk-radius-md);
}

.longtext-code code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    background: none;
}

.longtext-quote {
    padding-inline-start: var(--tk-space-5);
    margin-inline: 0;
    color: var(--tk-color-text-muted);
    border-inline-start: var(--tk-space-1) solid var(--tk-color-primary);
}

.longtext-quote footer {
    font-size: var(--tk-font-size-sm);
}

.longtext hr {
    margin-block: var(--tk-space-7);
    border: 0;
    border-top: var(--tk-border-width) solid var(--tk-color-line-strong);
    opacity: 1;
}

.longtext-figure img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: var(--tk-radius-md);
}

.longtext-figure figcaption {
    margin-top: var(--tk-space-2);
    font-size: var(--tk-font-size-sm);
    color: var(--tk-color-text-muted);
}

.longtext-cover {
    max-width: var(--tk-size-prose);
    margin-bottom: var(--tk-space-6);
}

.longtext-repository {
    margin-top: var(--tk-space-6);
}

.longtext-back {
    max-width: var(--tk-size-prose);
    margin-top: var(--tk-space-7);
}

.blog-empty {
    max-width: var(--tk-size-prose);
    font-size: var(--tk-font-size-lg);
    color: var(--tk-color-text-muted);
}

.blog-list {
    display: grid;
    gap: var(--tk-space-6);
    max-width: var(--tk-size-prose);
    padding: 0;
    margin: 0;
    list-style: none;
}

.blog-item {
    padding-bottom: var(--tk-space-6);
    border-bottom: var(--tk-border-width) solid var(--tk-color-line);
}

.blog-item-title {
    margin: 0;
    font-size: var(--tk-font-size-h3);
}

.blog-item-title a {
    color: var(--tk-color-text);
    text-decoration: none;
}

.blog-item-title a:hover {
    color: var(--tk-color-link-hover);
    text-decoration: underline;
}

.blog-item-text {
    margin: var(--tk-space-3) 0 0;
}

@media (min-width: 48rem) {
    .longtext-page {
        padding-block: var(--tk-space-8) var(--tk-space-9);
    }
}