:root {
    --space-black: #070b16;
    --space-ink: #172033;
    --space-muted: #6f7786;
    --space-line: #e8eaf0;
    --space-red: #d9574f;
}

body { background: #fff; color: var(--space-ink); }
a:hover, a:focus, .post-container a:hover, .post-container a:focus { color: var(--space-red); }
.intro-header { position: relative; background-color: var(--space-black); background-position: center 48%; }
.intro-header .header-mask { width: 100%; height: 100%; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 6, 14, .36), rgba(3, 6, 14, .62)); }
.intro-header .site-heading h1 { letter-spacing: .08em; text-shadow: 0 3px 24px rgba(0, 0, 0, .7); }
.intro-header .site-heading .subheading { letter-spacing: .22em; line-height: 1.8; text-shadow: 0 2px 16px rgba(0, 0, 0, .85); }
.header-img-credit { position: absolute; right: 14px; bottom: 10px; z-index: 2; color: rgba(255,255,255,.7); font-size: 11px; }
.header-img-credit a { color: rgba(255,255,255,.9); }
.navbar-custom .navbar-brand { letter-spacing: .08em; }
.post-preview > a > .post-title { color: var(--space-ink); }
.post-preview > a:hover > .post-title, .post-preview > a:focus > .post-title { color: var(--space-red); }
.post-preview > .post-meta, .post-content-preview { color: var(--space-muted); }
.sidebar-container .short-about img { width: 168px; height: 168px; object-fit: cover; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 8px 28px rgba(7, 11, 22, .18); }
.giscus-wrap { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--space-line); }
.photo-credit-note { color: var(--space-muted); font-size: 14px; }
footer .copyright { line-height: 1.8; }
@media (max-width: 767px) {
    .intro-header .site-heading h1 { font-size: 42px; }
    .intro-header .site-heading .subheading { letter-spacing: .1em; }
}