/* Gene7 CMS feed —— 与 morphogenesis(造形权柄)统一: 紧凑 page-label + tabs + 左右两栏 */
* { box-sizing: border-box; }
body { margin:0; padding:0; background:#0b1020; color:#eef2ff; font-family:'IBM Plex Sans',-apple-system,sans-serif; min-height:100vh; }

/* 顶部导航(与全站统一) */
.topnav { position:sticky; top:0; left:0; right:0; z-index:100; background:rgba(11,16,32,0.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid rgba(126,224,195,0.08); padding:10px 36px; display:flex; justify-content:space-between; align-items:center; }
.topnav .brand { color:#ffd479; font-weight:700; font-size:15px; letter-spacing:4px; text-decoration:none; }
.topnav .brand:hover { color:#fff; }
.nav-items { display:flex; gap:2px; }
.nav-item { display:flex; flex-direction:column; align-items:center; padding:6px 16px; color:#9ab; text-decoration:none; border-bottom:2px solid transparent; transition:color .2s,border-color .2s; }
.nav-item:hover { color:#7ee0c3; border-bottom-color:rgba(126,224,195,0.4); }
.nav-item.active { color:#ffd479; border-bottom-color:#ffd479; }
.ni-cn { font-size:13px; font-weight:500; letter-spacing:2px; }
.ni-sub { font-size:10px; color:#5a6e8f; letter-spacing:1.5px; margin-top:2px; }
.nav-item.active .ni-sub { color:#9ab; }

/* 紧凑栏目标签 */
.page-label { background:#0d1525; border-bottom:1px solid #2c3b62; padding:13px 40px; text-align:center; position:sticky; top:64px; z-index:9; }
.page-label .pl-en { color:#ffd479; font-weight:600; font-size:14px; letter-spacing:4px; }
.page-label .pl-sep { color:#3d7a6a; margin:0 14px; }
.page-label .pl-zh { color:#9ab; font-size:12px; letter-spacing:3px; }

/* 类型 tab (全部/心得/成果) —— 留拓展空间:将来可加二级 tab */
.cmsf-tabs { display:flex; background:#0d1525; border-bottom:1px solid #2c3b62; position:sticky; top:110px; z-index:8; }
.cmsf-tabs .tab { flex:1; padding:16px 24px; text-align:center; cursor:pointer; color:#9ab; font-size:13px; letter-spacing:2px; border-bottom:2px solid transparent; transition:all .2s; }
.cmsf-tabs .tab:hover { color:#7ee0c3; }
.cmsf-tabs .tab.active { color:#ffd479; border-bottom-color:#ffd479; }
.cmsf-tabs .tab .cn { font-weight:600; margin-right:6px; }
.cmsf-tabs .tab .en { font-size:10px; color:#5a6e8f; letter-spacing:1.5px; }
.cmsf-tabs .tab.active .en { color:#9ab; }

/* 两栏 */
.cmsf-main { display:grid; grid-template-columns:340px 1fr; min-height:calc(100vh - 122px); }
/* 桌面：列表=独立滚动的钉住面板——翻列表不动页面，点标题不丢列表位置 */
.cmsf-list { border-right:1px solid #2c3b62; padding:16px 0; position:sticky; top:160px; max-height:calc(100vh - 160px); overflow-y:auto; }
.cmsf-list::-webkit-scrollbar { width:8px; }
.cmsf-list::-webkit-scrollbar-thumb { background:#2c3b62; border-radius:4px; }
.cmsf-list::-webkit-scrollbar-track { background:transparent; }
.cmsf-li { padding:16px 28px; cursor:pointer; border-bottom:1px solid #1a2540; transition:background .15s,border-left-color .15s; border-left:3px solid transparent; }
.cmsf-li:hover { background:#111928; border-left-color:#3d7a6a; }
.cmsf-li.active { background:#1a2540; border-left-color:#ffd479; }
.cmsf-li .ts { font-size:10px; letter-spacing:1.5px; color:#5a6e8f; }
.cmsf-li .ts .ty { color:#7ee0c3; }
.cmsf-li .ts .au { color:#ffd479; }
.cmsf-li .title { font-size:15px; font-weight:500; margin:5px 0 6px; color:#eef2ff; line-height:1.4; }
.cmsf-li .excerpt { font-size:12px; color:#9ab; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.cmsf-li .tags { margin-top:8px; font-size:10px; color:#7ee0c3; letter-spacing:1px; }

.cmsf-article { padding:50px 60px 120px; max-width:820px; width:100%; }
.cmsf-article .intro { color:#9ab; font-style:italic; font-family:'IBM Plex Serif',serif; font-size:15px; line-height:1.7; border-left:2px solid #2c3b62; padding-left:18px; margin-bottom:30px; }
.cmsf-article h1 { font-size:30px; font-weight:700; margin:0 0 10px; color:#eef2ff; letter-spacing:.5px; }
.cmsf-article .meta { font-size:11px; color:#5a6e8f; letter-spacing:2px; text-transform:uppercase; margin-bottom:32px; padding-bottom:18px; border-bottom:1px solid #1a2540; }
.cmsf-article .meta .sep { color:#2c3b62; margin:0 10px; }
.cmsf-article .meta .au { color:#ffd479; }
.cmsf-article h2 { font-size:22px; font-weight:600; margin:40px 0 14px; color:#7ee0c3; }
.cmsf-article h3 { font-size:18px; font-weight:600; margin:26px 0 10px; color:#eef2ff; }
.cmsf-article p { line-height:1.8; color:#cbd; font-size:15px; margin:14px 0; }
.cmsf-article blockquote { border-left:3px solid #ffd479; padding:6px 0 6px 20px; color:#eef2ff; font-family:'IBM Plex Serif','Noto Serif SC',serif; font-style:italic; font-size:16px; margin:20px 0; }
.cmsf-article ul, .cmsf-article ol { color:#cbd; line-height:1.85; font-size:15px; padding-left:24px; }
.cmsf-article li { margin:4px 0; }
.cmsf-article code { background:#1a2540; padding:2px 7px; border-radius:4px; font-size:13px; color:#7ee0c3; overflow-wrap:anywhere; }
/* 代码块统一面板：长代码折行+块内滚动，不撑破版面 */
.cmsf-article pre { background:#0a1120; border:1px solid #2c3b62; border-radius:8px; padding:14px 16px; margin:18px 0; overflow-x:auto; max-height:420px; overflow-y:auto; }
.cmsf-article pre code { background:none; padding:0; border-radius:0; display:block; color:#a9c6e8; font-size:12.5px; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; font-family:'IBM Plex Mono',Consolas,'Courier New',monospace; }
.cmsf-article p, .cmsf-article li { overflow-wrap:break-word; }
.cmsf-article table { display:block; width:100%; overflow-x:auto; }
.cmsf-article strong { color:#ffd479; font-weight:600; }
.cmsf-article em { color:#eef2ff; font-style:italic; }
.cmsf-article hr { border:none; border-top:1px solid #2c3b62; margin:36px 0; }

.cmsf-empty, .cmsf-loading { padding:80px 40px; text-align:center; color:#5a6e8f; font-style:italic; font-size:13px; letter-spacing:1px; line-height:1.9; }

/* 移动端"返回列表"按钮 —— 桌面永远隐藏，窄屏进入正文态才显示 */
.cmsf-back { display:none; }

/* 页脚 */
.sitenav { padding:28px 40px; text-align:center; border-top:1px solid #1a2540; color:#5a6e8f; }
.sitenav .footer-nav { display:flex; justify-content:center; gap:28px; margin-bottom:20px; flex-wrap:wrap; }
.sitenav .footer-nav a { color:#9ab; text-decoration:none; font-size:11px; letter-spacing:2.5px; transition:color .2s; }
.sitenav .footer-nav a:hover { color:#7ee0c3; }
.sitenav .brand-line { color:#9ab; font-size:11px; letter-spacing:3px; text-transform:uppercase; margin-bottom:6px; }
.sitenav .copy { color:#3d7a6a; font-size:10px; letter-spacing:2px; }

@media (max-width:900px){
  .topnav { padding:8px 12px; flex-direction:column; gap:6px; align-items:stretch; }
  .topnav .brand { text-align:center; font-size:13px; letter-spacing:3px; }
  .nav-items { gap:0; justify-content:space-between; }
  .nav-item { padding:3px 4px; flex:1; min-width:0; }
  .ni-cn { font-size:10px; letter-spacing:0.5px; }
  .ni-sub { font-size:8px; letter-spacing:1px; }
  .page-label { padding:10px 16px; top:86px; }
  .page-label .pl-en { font-size:12px; letter-spacing:3px; }
  .page-label .pl-sep { margin:0 10px; }
  .page-label .pl-zh { font-size:10px; letter-spacing:2px; }
  .cmsf-tabs { top:132px; }
  .cmsf-tabs .tab { padding:11px 6px; font-size:11px; letter-spacing:1px; }
  .cmsf-tabs .tab .en { display:none; }
  .cmsf-main { grid-template-columns:1fr; }
  .cmsf-list { border-right:none; border-bottom:1px solid #2c3b62; position:static; max-height:none; overflow-y:visible; }
  .cmsf-article { padding:30px 22px 80px; }
  .cmsf-article h1 { font-size:24px; }
  .cmsf-article pre { padding:12px; max-height:360px; }
  .cmsf-article pre code { font-size:12px; }
  /* 窄屏抽屉式：列表态只显列表，正文态只显正文+返回条（桌面不受影响） */
  .cmsf-main:not(.m-article) .cmsf-article { display:none; }
  .cmsf-main.m-article .cmsf-list { display:none; }
  .cmsf-main.m-article .cmsf-back { display:flex; align-items:center; gap:8px; padding:14px 22px; color:#7ee0c3; font-size:13px; letter-spacing:2px; cursor:pointer; border-bottom:1px solid #1a2540; user-select:none; }
  .cmsf-main.m-article .cmsf-back:active { background:#111928; }
  .sitenav .footer-nav { gap:14px 18px; }
  .sitenav .footer-nav a { font-size:10px; letter-spacing:1.5px; }
}

/* 2026-07-19 文章分享链接（指向 /p/<slug>/ 静态单页） */
.cmsf-article .meta a.permalink { color:#5a6e8f; text-decoration:underline; }
.cmsf-article .meta a.permalink:hover { color:#9ab; }