/* Minimal style bridge to match site look */
html, body { margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; }

/* Colors aligned with globals.css */
.bg-primary { background-color: #131313; }
.bg-primary-5 { background-color: #ffffff1a; }
.bg-primary-10 { background-color: #ffffff0d; }
.bg-primary-80 { background-color: #ffffffcc; }
.bg-secondary { background-color: #f0ff8c; }
.bg-black { background-color: #000000; }
.color-primary { color: #ffffff; }
.color-primary-60 { color: #ffffff99; }
.color-primary-80 { color: #ffffffcc; }
.color-primary-20 { color: #ffffff33; }
.color-secondary { color: #f0ff8c; }
.border-primary { border-color: #f0ff8c; }
.border-secondary { border-color: #ffffff33; }

/* Layout */
.vv-layout { display: flex; min-height: 100vh; }
.vv-sidebar { width: 64px; box-sizing: border-box; border-right: 1px solid; display: flex; flex-direction: column; align-items: center; gap: 24px; padding: 16px 0; position: sticky; top: 0; height: 100vh; }
.vv-logo { writing-mode: vertical-rl; transform: rotate(180deg); font-weight: 600; letter-spacing: 1px; }
.vv-nav { display: flex; flex-direction: column; gap: 16px; align-items: center; }
.vv-nav-item { text-decoration: none; font-size: 12px; }
.vv-content { flex: 1; box-sizing: border-box; padding: 32px; }
.vv-container { max-width: 920px; margin: 0 auto; }

/* Post list */
.vv-post-item { margin-bottom: 28px; padding-bottom: 16px; border-bottom: 1px solid #ffffff1a; }
.vv-post-title { margin: 0 0 8px; font-size: 22px; }
.vv-meta { font-size: 13px; margin-bottom: 8px; }
.vv-excerpt { font-size: 14px; }
.vv-tag-list { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 24px; }
.vv-tag-link { text-decoration: none; }
.vv-tag-link:hover { color: #f0ff8c; }

/* Post content */
.vv-post-h1 { margin: 0 0 12px; font-size: 28px; }
.article-body img { max-width: 100%; width: auto; height: auto; }
.article-body pre { background: #1e1e1e; color: #ddd; padding: 12px; border-radius: 8px; overflow: auto; }
.article-body code { background: #1e1e1e; color: #ddd; padding: 2px 4px; border-radius: 4px; }
.article-body a { color: #f0ff8c; text-decoration: none; }
.article-body a:hover { text-decoration: underline; }

/* Table of Contents */
.vv-toc {
  background: #ffffff0d;
  border: 1px solid #ffffff1a;
  border-radius: 8px;
  padding: 20px 24px;
  margin-bottom: 32px;
}
.vv-toc-list,
.vv-toc-list ol,
.vv-toc-list ul {
  list-style: none;
  list-style-type: none;
  padding: 0;
  margin: 0;
  counter-reset: none;
}
.vv-toc-list ol {
  padding-left: 20px;
  margin: 8px 0;
}
.vv-toc-list li,
.vv-toc-list ol li,
.vv-toc-list ul li {
  list-style: none;
  list-style-type: none;
  counter-increment: none;
}
.vv-toc-list-item {
  list-style: none;
  list-style-type: none;
}
.vv-toc-list li::before,
.vv-toc-list li::marker {
  content: none;
  display: none;
}
.vv-toc-list-item::marker {
  content: none;
  display: none;
}
.vv-toc-list .toc-number {
  display: none;
}
.vv-toc ol,
.vv-toc ul {
  list-style: none;
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
}
.vv-toc li::marker {
  content: none;
  display: none;
}
.vv-toc .toc-number {
  display: none;
}
.vv-toc-list a {
  color: #ffffff99;
  text-decoration: none;
  display: block;
  padding: 6px 0;
  transition: color 0.2s;
}
.vv-toc-list a:hover {
  color: #f0ff8c;
}
.vv-toc-list .toc-level-1 > a {
  font-weight: 500;
  color: #ffffffcc;
}
