/* nav.css — Flix 全局顶栏样式 * 在各页面 中 引入 * 依赖页面已定义以下 CSS 变量（或直接使用下方默认值）： * --nav-bg 默认 rgba(242, 242, 242, 0.8) * --nav-border 默认 rgba(0, 0, 0, 0.06) * --text-primary 默认 #000 */ .site-nav { position: fixed; top: 0; left: 0; right: 0; height: 64px; z-index: 100; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); background-color: var(--nav-bg, rgba(242, 242, 242, 0.8)); display: flex; align-items: center; justify-content: space-between; padding: 0 50px; } .site-nav::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background: var(--nav-border, rgba(0, 0, 0, 0.06)); } .nav-logo img { height: 19px; width: auto; display: block; } .nav-links { display: flex; align-items: center; gap: 36px; } .nav-links a { font-size: 14px; font-weight: 500; color: var(--text-primary, #000); text-decoration: none; letter-spacing: -0.01em; opacity: 0.55; transition: opacity 0.18s; } .nav-links a:hover { opacity: 1; } .nav-links a.active { opacity: 1; } @media (max-width: 680px) { .site-nav { padding: 0 20px; } .nav-links { display: none; } }