/* T8 全站统一顶栏（官网 / 论坛共用这唯一实现，由 topbar.js 挂载）
   改这里的值，两边同时生效——不要再单独改 site.css 或 bridge.less 的顶栏 */
.t8bar{position:fixed;top:0;left:0;right:0;z-index:1100;background:#0b121e;
  backdrop-filter:none;border-bottom:1px solid rgba(255,255,255,.10);
  font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;letter-spacing:.1px}
/* 固定顶栏不占文档流，由各页面首屏 section 自行补偿顶部 62px 偏移；
   移除 body padding-top 占位，避免任何多余的「占位区」视觉残留。 */
.t8bar .row{display:flex;align-items:center;gap:26px;height:62px;max-width:1200px;margin:0 auto;padding:0 40px}
.t8bar .logo{display:flex;align-items:center;gap:10px;font-weight:700;color:#fff;font-size:17px;letter-spacing:.2px;text-decoration:none;white-space:nowrap;flex:none}
.t8bar .logo b{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:7px;
  background:linear-gradient(135deg,#00d4ff,#2e5bff);color:#fff;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;
  font-size:11.5px;font-weight:800;box-shadow:0 0 16px rgba(0,212,255,.5),inset 0 1px 0 rgba(255,255,255,.35)}
.t8bar .logo i{font-style:normal;font-size:17.5px;letter-spacing:.5px;font-weight:800;
  background:linear-gradient(135deg,#ffffff,#8fd0ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.t8bar .logo .mark{height:42px;width:auto;display:block;border-radius:9px}
.t8bar nav{display:flex;gap:9px;margin-left:auto}
.t8bar nav a{color:#aab3c0;padding:7px 11px;border-radius:6px;font-size:14px;line-height:1.75;white-space:nowrap;text-decoration:none;transition:.15s}
.t8bar nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.t8bar nav a.on{color:#fff;font-weight:600;background:rgba(255,255,255,.10);transition:color .2s ease,background-color .2s ease}
.t8bar .cd{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12.5px;color:#9aa6b6;letter-spacing:-.2px;white-space:nowrap;flex:none}
.t8bar .cta{flex:none;background:linear-gradient(135deg,#00d4ff,#0891b2);color:#06121f !important;font-weight:600;line-height:1.75;font-size:15.5px;padding:7px 15px;border-radius:6px;text-decoration:none;white-space:nowrap;box-shadow:0 0 36px -6px rgba(0,212,255,.55)}
.t8bar .cta:hover{background:linear-gradient(135deg,#33e0ff,#0071bd);color:#fff !important}
.t8bar .auth{display:flex;gap:6px;align-items:center;min-width:140px;justify-content:flex-end}
.t8bar .auth a{color:#aab3c0;padding:7px 10px;border-radius:6px;font-size:14px;line-height:1.75;white-space:nowrap;text-decoration:none;transition:.15s}
.t8bar .auth a:hover{background:rgba(255,255,255,.08);color:#fff}
.t8bar .auth a.me{color:#e7ecf3;font-weight:600}
/* 当前登录账号（左上角 logo 右侧常驻，未登录时 [hidden] 不占位）
   桌面：头像首字 + 账号.姓名（账号=登录名，姓名=名片「姓名」字段）；窄屏逐步收敛为「姓名」→ 只剩头像圆点 */
.t8bar .acct{display:inline-flex;align-items:center;gap:7px;flex:none;max-width:290px;padding:3px 12px 3px 4px;
  border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  color:#cbd5e1;font-size:13px;line-height:1.5;white-space:nowrap;overflow:hidden;text-decoration:none;
  transition:background .15s ease,border-color .15s ease,color .15s ease}
.t8bar .acct[hidden]{display:none}
.t8bar .acct:hover{background:rgba(255,255,255,.13);border-color:rgba(0,212,255,.45);color:#fff}
.t8bar .acct .av{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  font-size:11.5px;font-weight:800;color:#06121f;background:linear-gradient(135deg,#00d4ff,#3b82f6)}
.t8bar .acct b{min-width:0;font-weight:700;color:#e7ecf3;overflow:hidden;text-overflow:ellipsis}
/* em = 「账号.」前缀（如 X8FDE.），不参与压缩，由后面的姓名承担省略 */
.t8bar .acct em{flex:none;font-style:normal;font-size:12px;color:#8a93a1}
/* 搜索按钮 */
.t8bar .search-btn{color:#b4bcc8;padding:6px 10px;border-radius:6px;font-size:15px;line-height:1;text-decoration:none;transition:.15s;display:flex;align-items:center;flex:none}
.t8bar .search-btn:hover{background:rgba(255,255,255,.08);color:#00d4ff}
.t8bar .search-btn:active{background:rgba(255,255,255,.16);color:#00d4ff}
/* 汉堡按钮：桌面隐藏，移动端（≤720px）显示（base 块须写在 media 之前，避免覆盖移动端 44px 热区） */
.t8bar .burger{display:none;flex:none;width:40px;height:40px;align-items:center;justify-content:center;border:0;border-radius:8px;background:transparent;color:#cbd5e1;font-size:19px;line-height:1;cursor:pointer;transition:.15s}
.t8bar .burger:hover{background:rgba(255,255,255,.08);color:#fff}
.t8bar .burger:active{transform:scale(.92);background:rgba(255,255,255,.16);color:#fff}
@media(max-width:820px){.t8bar .row{gap:14px;padding:0 20px}
  .t8bar .logo i{display:none}.t8bar .cd{display:none}.t8bar .logo .mark{height:38px}
  .t8bar nav a{padding:7px 7px;font-size:13.5px}.t8bar .auth a{padding:7px 8px}
  .t8bar .acct{max-width:180px}
  .t8bar .acct em{display:none}}
@media(max-width:720px){.t8bar nav{display:none}.t8bar .logo i{display:none}.t8bar .cd{display:none}.t8bar .logo .mark{height:34px}
  /* 移动端：搜索 + 登录 + 汉堡菜单按钮；导航折叠进下拉菜单 */
  .t8bar .cta{display:none}
  /* 触控热区统一 44×44，内容居中；base 块已上移，此处后定义自然覆盖 40px */
  .t8bar .search-btn{margin-left:auto;width:44px;height:44px;padding:0;justify-content:center}
  .t8bar .burger{display:inline-flex;margin-left:4px;width:44px;height:44px}
  .t8bar .auth a{display:inline-flex;align-items:center;min-height:44px}
  /* 移动端行距收紧，给左上角账号圆点腾位（信息层级不变，仅 -2px 间距） */
  .t8bar .row{gap:12px}
  /* 账号胶囊收敛为头像圆点；完整「账号.姓名」在下拉菜单「账号」区可见 */
  .t8bar .acct{padding:0;border:0;background:transparent;max-width:none;gap:0}
  .t8bar .acct:hover{background:transparent}
  .t8bar .acct b,.t8bar .acct em{display:none}
  .t8bar .acct .av{width:32px;height:32px;font-size:14px}
  .t8bar .mnav{display:none}
  .t8bar .mnav.open{display:block}}
/* 移动端下拉菜单（topbar.js 动态填充导航项 + 登录态操作） */
.t8bar .mnav{position:fixed;top:62px;left:0;right:0;z-index:1090;background:#0b121e;border-bottom:1px solid rgba(255,255,255,.10);box-shadow:0 18px 36px -12px rgba(0,0,0,.55);border-radius:0 0 12px 12px;padding:10px 18px calc(18px + env(safe-area-inset-bottom));display:none}
.t8bar .mnav a{display:block;color:#cbd5e1;font-size:15px;padding:13px 12px;border-radius:8px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.05)}
.t8bar .mnav a:last-of-type{border-bottom:0}
.t8bar .mnav a:hover{background:rgba(255,255,255,.07);color:#fff}
.t8bar .mnav a.on{color:#fff;font-weight:600;background:rgba(255,255,255,.10)}
.t8bar .mnav .msep{margin:8px 0 6px;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12px;letter-spacing:1.2px;color:#8a93a1;padding:0 12px}
.t8bar .mnav .m-acct{margin:2px 0 8px;padding:9px 12px;border-radius:8px;background:rgba(0,212,255,.08);
  border:1px solid rgba(0,212,255,.22);color:#cbd5e1;font-size:13px;line-height:1.5;word-break:break-all}
.t8bar .mnav .m-acct b{color:#e7ecf3}
.t8bar .mnav a.m-me{color:#7fe3ff;font-weight:600}
.t8bar .mnav a.m-out{color:#f16a6a}
/* 顶栏兜底：.t8bar 由 topbar.js 异步挂载，加载前先把 body 顶部 62px 铺成顶栏同色，
   避免固定顶栏尚未渲染时页面顶部露出白色断带（与 .t8bar .row 高度 62px 对齐）。 */
html{background:#fff}
body{background-color:#fff;background-image:linear-gradient(to bottom,#0b121e 62px,#fff 62px);background-repeat:no-repeat}
/* 页面离开时淡出，配合 View Transitions 进一步弱化硬切闪屏感
   （不支持 VT 的浏览器也能享受离开时的淡出） */
body.t8-leaving{opacity:0;transition:opacity .12s ease-out}

/* —— 页面切换平滑过渡（View Transitions API）——
   消除导航点击后的硬切闪屏感，整页淡入淡出。
   降级：不支持的浏览器自动回退为硬切，不影响功能。 */
@supports (view-transition-name: root){
  ::view-transition-old(root),
  ::view-transition-new(root){animation-duration:.22s;animation-timing-function:ease}
  ::view-transition-old(root){animation-name:vt-fade-out}
  ::view-transition-new(root){animation-name:vt-fade-in}
  @keyframes vt-fade-out{from{opacity:1;filter:blur(0)}to{opacity:0;filter:blur(2px)}}
  @keyframes vt-fade-in{from{opacity:0;filter:blur(2px)}to{opacity:1;filter:blur(0)}}
  /* 顶栏单独一组，切换时保持不动，减少视觉跳动。
     ⚠️ 只能 contain:layout —— 不能加 paint：paint 会把「固定定位」的下拉菜单 .mnav
     裁剪进 63px 高的顶栏内，导致移动端汉堡菜单整块不可见（2026-09-17 实测根因）。 */
  .t8bar{view-transition-name:t8topbar;contain:layout}
  ::view-transition-old(t8topbar),
  ::view-transition-new(t8topbar){animation-duration:.12s;animation-timing-function:ease}
}
@media(prefers-reduced-motion:reduce){
  ::view-transition-old(*),::view-transition-new(*){animation-duration:.01ms !important}
}

/* 超小屏（≤360px）：避免汉堡菜单折叠项文字挤压 / 行高不足 */
@media(max-width:360px){
  .t8bar .mnav a{font-size:14px;padding:12px 10px}
  .t8bar .mnav{padding-left:14px;padding-right:14px}
}
