/* VibeVideo layout overrides for posts */
html, body { background-color: #131313; color: #ffffff; }
main, #main, #content, .content, .container, article { max-width: 1200px; margin: 0 auto; padding: 24px 16px; padding-bottom: 96px !important; box-sizing: border-box; }
h1, h2, h3, h4, h5, h6 { color: #ffffff; margin: 0.9em 0 0.5em; line-height: 1.25; }
p { line-height: 1.8; margin: 0.5em 0; }
table { width: 100%; border-collapse: collapse; margin: 1em 0; }
th, td { border: 1px solid #ffffff33; padding: 8px; }
.vv-video-embed { width: 100%; height: clamp(360px, 70vh, 720px); border: 0; }
/* Hide common Hexo header/footer/nav and credits */
header.site-header, .site-header, .navbar, nav.site-nav, #header, .header, footer.site-footer, .site-footer, #footer, .footer { display: none !important; }
.powered, .powered-by, .theme-info, a[href*="hexo" i] { display: none !important; }
/* Remove bottom gap from common wrappers/pagination when footers are hidden */
.outer, .wrap, .container, .content, main, article, section, .posts, .post, .pagination, .post-nav, .post-footer { margin-bottom: 0 !important; padding-bottom: 0 !important; }
body > *:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.clearfix { height: auto !important; }
/* Top bar (mimic landing) */
.vv-topbar { position: sticky; top: 0; z-index: 100; width: 100%; border-bottom: 1px solid #ffffff1a; background: rgba(19,19,19,0.8); backdrop-filter: blur(6px); }
.vv-topbar-inner { max-width: 100%; margin: 0 auto; padding: 20px 16px; display: flex; align-items: center; justify-content: space-between; }
.vv-brand { display: flex; align-items: center; gap: 12px; }
.vv-brand a { color: #f0ff8c; font-weight: 600; font-size: 16px; text-decoration: none; }
.vv-topbar-nav { display: flex; gap: 16px; align-items: center; }
.vv-topbar-nav a { color: rgba(255,255,255,0.72); text-decoration: none; font-size: 14px; font-weight: 400; line-height: 1.2; padding: 4px 0; display: inline-flex; align-items: center; transition: color .2s ease, opacity .2s ease; }
.vv-topbar-nav a:hover { color: #f0ff8c; opacity: 0.95; }
.vv-topbar-nav .vv-create-button { display: inline-flex; align-items: center; justify-content: center; background: #f0ff8c !important; color: #000000 !important; padding: 8px 18px !important; border-radius: 999px !important; font-weight: 400; border: 1px solid #f0ff8c !important; line-height: 1; }
.vv-topbar-nav .vv-create-button:hover { background: #f0ff8c !important; color: #000000 !important; opacity: 0.9; }
@media (min-width: 768px) {
  .vv-topbar-inner { padding: 20px 44px; }
  .vv-topbar-nav { gap: 48px; }
}
/* Footer */
.vv-footer { margin-top: 32px; width: 100%; border-top: 1px solid #ffffff33; background: #131313; clear: both; position: relative; z-index: 10; }
.vv-footer-inner { max-width: 100%; margin: 0 auto; padding: 16px; display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; justify-content: space-between; }
.vv-footer .vv-left { display: flex; flex-direction: column; gap: 12px; }
.vv-footer .vv-logo { display: flex; align-items: center; gap: 8px; height: 40px; }
.vv-footer .vv-nav { display: flex; gap: 16px; flex-wrap: wrap; }
.vv-footer .vv-nav a { color: #ffffff80; font-size: 14px; }
.vv-footer .vv-nav a:hover { color: #ffffff; }
.vv-footer .vv-right { display: flex; gap: 32px; flex-wrap: wrap; }
.vv-footer .vv-contact h3, .vv-footer .vv-social h3 { color: #f0ff8c; font-weight: 500; font-size: 12px; text-transform: uppercase; margin: 0 0 8px; }
.vv-footer .vv-contact a { color: #ffffff80; font-size: 14px; }
.vv-footer .vv-social .vv-icons { display: flex; gap: 12px; }
.vv-footer .vv-social .vv-icon { width: 36px; height: 36px; border-radius: 18px; background: #ffffff1a; display: flex; align-items: center; justify-content: center; }
.vv-footer .vv-links { display: flex; gap: 6px; flex-wrap: wrap; }
.vv-footer .vv-links a { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; padding: 0 4px; border-radius: 4px; border: none; background: transparent; color: #ffffffb3; font-size: 11px; line-height: 1.2; white-space: nowrap; }
.vv-footer .vv-links a:hover { color: #f0ff8c; text-decoration: underline; }
.vv-footer .vv-copy { color: #ffffff80; font-size: 12px; text-align: right; margin-top: 8px; width: 100%; }