:root { --color-text: #000; --sidebar-cols: 3; --main-cols: 9; }
body { font-family: 'Public Sans', sans-serif; font-weight: 300; color: var(--color-text); margin: 0; line-height: 1.6; }
h1, .article-title { font-family: 'Geist Mono', 'JetBrains Mono', monospace; font-weight: 300; font-size: 32px; color: var(--color-text); margin-bottom: 0.5rem; line-height: 1.25; }
h2 { line-height: 1; }
.meta { font-family: 'Geist Mono', 'JetBrains Mono', monospace; font-weight: 300; font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-text); opacity: 0.8; margin-top: 0.25rem; margin-bottom: 0.75rem; }
.tags { font-family: 'Geist Mono', 'JetBrains Mono', monospace; font-weight: 300; font-size: 16px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-text); opacity: 0.8; margin-bottom: 1.5rem; }
.related, .references { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #eee; }
.related h3, .references h3 { font-family: 'Geist Mono', 'JetBrains Mono', monospace; font-weight: 300; font-size: 20px; margin-bottom: 1rem; }
.ref-list { padding-left: 1.25rem; margin: 0; }
.ref-list a { color: var(--color-text); text-decoration: none; }
.ref-list a:hover { text-decoration: underline; }
.related a { color: var(--color-text); text-decoration: none; display: block; margin-bottom: 0.5rem; }
.related a:hover { text-decoration: underline; }
.article-list { list-style: none; padding: 0; padding-top: 0; margin-top: 0; }
.article-list li { margin-bottom: 2.2rem; }
.article-list li:first-child { margin-top: 0; padding-top: 0; }
.article-list .article-title { margin: 0; padding: 0; }
.article-page .main { padding-top: 4rem; }
.article-page .main > h1.article-title { margin: 0 !important; margin-block: 0 !important; margin-inline: 0 !important; padding: 0 !important; padding-block: 0 !important; padding-inline: 0 !important; }
.article-list a { color: var(--color-text); text-decoration: none; }
.article-list a:hover { text-decoration: underline; }
.article-list .summary { font-size: 0.9rem; opacity: 0.85; margin-top: 0.5rem; line-height: 1.5; }
.read-more-wrap { margin-top: 0.5rem; }
.read-more { font-family: 'Geist Mono', 'JetBrains Mono', monospace; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-text); opacity: 0.8; text-decoration: none; }
.read-more:hover { text-decoration: underline; opacity: 1; }
.page-layout { display: flex; flex-direction: row; min-height: 100vh; width: 100%; max-width: 1400px; margin: 0 auto; }
.sidebar { flex: 0 0 240px; min-width: 0; padding: 2rem 1.5rem; display: flex; flex-direction: column; gap: 1.5rem; position: sticky; top: 0; align-self: flex-start; max-height: 100vh; }
.sidebar a { text-decoration: none; color: inherit; }
.sidebar .logo { width: 4rem; height: auto; aspect-ratio: 4/1; object-fit: contain; }
.sidebar .tagline { font-size: 0.95rem; opacity: 0.9; }
.main { flex: 1; min-width: 0; padding: 2rem 2.5rem; overflow-y: auto; }
.main:has(.article-list) { padding-top: 4rem; }
.article-page .main { max-width: 800px; }
@media (max-width: 768px) {
.page-layout { flex-direction: column; width: 100%; max-width: 100%; overflow-x: hidden; }
.sidebar { position: sticky; top: 0; max-height: none; flex: 0 0 auto; width: 100%; padding: 1.5rem 1rem; z-index: 100; background: #fff; }
.main { width: 100%; max-width: 100%; min-width: 0; padding: 1.5rem 1rem; box-sizing: border-box; }
.main:has(.article-list) { padding-top: 1.5rem; }
.article-page .main { padding-top: 1.5rem; max-width: 100%; }
.article-title, .article-list li, .article-page .main { max-width: 100%; overflow-wrap: break-word; word-wrap: break-word; }
}
