@import url("../styles/reset.css");
@import url("../styles/variables.css");
@import url("../styles/global.css");
@import url("../components/code-viewer/code-viewer.css");
@import url("../components/tab-panel/tab-panel.css");

.byline {
    color: var(--text-color-mute);
    font-size: 0.8em;
    margin-bottom: 1.5em;
}

blog-header {
    display: block;
    margin-bottom: 1.5em;
}

blog-header nav {
    margin-bottom: 2em;
}

blog-header img {
    aspect-ratio: 3 / 2;
}

main img {
    margin: 0.5em 0;
}

@media (scripting: none) {
    blog-header::before {
        content: 'Please enable scripting to view the navigation'
    }
}

.comments {
    margin-top: 2em;
    text-align: center;
}