/* ============================================================
   烛心 · 跨浏览器兼容层 (compat.css)
   ------------------------------------------------------------
   必须最后加载（在所有样式之后）。
   目标：Edge(旧) / 小米浏览器 / UC / 夸克 / 各类 WebView
         —— 这些引擎对 backdrop-filter / color-mix /
            filter+animation / background-clip 动画 支持差，
            会导致「卡顿 + 闪烁 + 视觉与 Chrome 不一致」。

   策略：能力检测（@supports）+ 按引擎降级，
         不支持的自动退回「实底 + 静态金色」方案，
         视觉保留 90%，但绝不卡、不闪。
   ============================================================ */

/* ------------------------------------------------------------
   ① 不支持 backdrop-filter 的引擎：全部改实底
   ------------------------------------------------------------ */
@supports not ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))){
  .topbar{
    background:#0a0c12 !important;
    border-bottom:1px solid rgba(232,163,61,.18) !important;
  }
  .topbar.is-scrolled{
    background:#070910 !important;
  }
  .gn-term, .gn-terminal{
    background:#0d1017 !important;
  }
  .drawer{
    background:#090b11 !important;
  }
  .gn-card{
    background:rgba(255,255,255,.032) !important;
    border-color:rgba(255,255,255,.075) !important;
  }
  .loginbtn, .groupbtn{
    background:rgba(232,163,61,.10) !important;
  }
  .groupbtn{
    background:rgba(74,124,255,.10) !important;
  }
}

/* ------------------------------------------------------------
   ② 金色渐变文字：干掉「动画 + background-clip」的组合
      （这是各引擎闪烁的头号原因）
   ------------------------------------------------------------ */
.gn-title .accent,
.brand-text b,
.bl-title{
  animation:none !important;
  background-position:50% 0 !important;
}

/* 支持 background-clip 的：用静态渐变，视觉几乎一致 */
@supports ((-webkit-background-clip: text) or (background-clip: text)){
  .gn-title .accent{
    background:linear-gradient(100deg, #d9a441 0%, #ffd68a 42%, #fff4d6 58%, #e8a33d 100%) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    -webkit-text-fill-color:transparent !important;
    color:transparent !important;
    text-shadow:none !important;
    filter:none !important;
    -webkit-filter:none !important;
  }
  .brand-text b{
    background:linear-gradient(100deg, #d9a441, #ffd68a 50%, #e8a33d) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    -webkit-text-fill-color:transparent !important;
    color:transparent !important;
    filter:none !important;
    -webkit-filter:none !important;
  }
  .bl-title{
    background:linear-gradient(100deg, #c9982f, #ffd68a 45%, #fff4d6 55%, #e8a33d) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    -webkit-text-fill-color:transparent !important;
    filter:none !important;
    -webkit-filter:none !important;
  }
}

/* 不支持的：直接给纯金色，能看且稳 */
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .gn-title .accent,
  .brand-text b,
  .bl-title{
    background:none !important;
    -webkit-text-fill-color:#ffd68a !important;
    color:#ffd68a !important;
  }
}

/* ------------------------------------------------------------
   ③ 所有 filter 发光 → 换成 text-shadow / box-shadow
      （后者在非 Chromium 引擎上走 CPU 但只算一次，不随动画重算）
   ------------------------------------------------------------ */
.gn-title .accent,
.gn-title,
.gn-stat .num,
.gn-card .ci,
.ti,
.gn-btn,
.loginbtn,
.groupbtn,
.brand-avatar{
  filter:none !important;
  -webkit-filter:none !important;
}

/* 用阴影补回发光感（静态，代价低） */
.gn-title{
  text-shadow:0 0 28px rgba(232,163,61,.16), 0 2px 28px rgba(0,0,0,.55) !important;
}
.gn-stat .num{
  text-shadow:0 0 14px rgba(232,163,61,.30) !important;
}

/* ------------------------------------------------------------
   ④ 只保留「transform / opacity」动画，其余一律停
      （颜色、阴影、背景位置类动画在弱引擎上必卡）
   ------------------------------------------------------------ */
.topbar::after{
  animation:none !important;
  background:linear-gradient(90deg,
    transparent, rgba(255,214,138,.20) 30%,
    rgba(255,244,214,.52) 50%,
    rgba(255,214,138,.20) 70%, transparent) !important;
  opacity:.6 !important;
}

.gn-btn.primary::before{
  display:none !important;      /* 流光扫过：伪元素位移动画，弱引擎很贵 */
}

.bar-fill{
  background:linear-gradient(90deg, #c9982f, #ffd68a 60%, #fff4d6) !important;
  box-shadow:none !important;
  animation:none !important;
}

/* 头像发光：保留（只动 box-shadow，代价可控），但降低幅度 */
.brand-avatar{
  box-shadow:0 0 0 1px rgba(255,214,138,.24), 0 0 16px -6px rgba(232,163,61,.42);
}

/* ------------------------------------------------------------
   ⑤ 入场动画统一为 transform+opacity（去掉 blur 滤镜）
   ------------------------------------------------------------ */
.gn-hero .gn-anim{
  animation-name:compatRiseIn !important;
}
@keyframes compatRiseIn{
  from{ opacity:0; transform:translate3d(0,20px,0) }
  to  { opacity:1; transform:translate3d(0,0,0) }
}

/* ------------------------------------------------------------
   ⑥ 背景漂移降频（弱机更稳）
   ------------------------------------------------------------ */
body::after{
  animation-duration:64s !important;
}

/* ------------------------------------------------------------
   ⑦ 关闭 mix-blend-mode（各引擎实现差异大，容易发灰/发白）
   ------------------------------------------------------------ */
.lux-aurora,
[class*="nebula"],
[class*="aurora"]{
  mix-blend-mode:normal !important;
  display:none !important;
}

/* ------------------------------------------------------------
   ⑧ 卡片悬浮简化（非 Chromium 上 transition 多项属性很卡）
   ------------------------------------------------------------ */
.gn-card{
  transition:transform .32s ease, border-color .32s ease !important;
}
.gn-card::before{
  display:none !important;      /* 鼠标跟随光斑：需要 JS 写 CSS 变量，弱机卡 */
}

/* ------------------------------------------------------------
   ⑨ 减少同时播放的动画数量（弱机友好）
   ------------------------------------------------------------ */
@media(max-width:768px){
  .gn-hero .gn-anim{ animation-duration:.62s !important }
  body::after{ animation-duration:80s !important }
  .bl-candle{ animation-duration:3.4s !important }
}

/* ============================================================
   ⑩ class 触发式降级（与 @supports 双保险）
   ------------------------------------------------------------
   引擎检测脚本会给 <html> 加：
     .eng-weak / .eng-third / .no-backdrop / .eng-edge ...
   这里针对这些 class 直接降级，不依赖 @supports（后者在某些
   老引擎里行为不一致）。
   ============================================================ */
html.no-backdrop .topbar{
  background:#0a0c12 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
html.no-backdrop .topbar.is-scrolled{ background:#070910 !important }
html.no-backdrop .gn-term,
html.no-backdrop .gn-terminal{
  background:#0d1017 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
html.no-backdrop .drawer{
  background:#090b11 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
html.no-backdrop .gn-card{
  background:rgba(255,255,255,.032) !important;
}
html.no-backdrop .loginbtn{
  background:rgba(232,163,61,.10) !important;
}
html.no-backdrop .groupbtn{
  background:rgba(74,124,255,.10) !important;
}

/* 弱引擎：关掉所有非必要动画 */
html.eng-weak .gn-card::before{ display:none !important }
html.eng-weak .gn-btn.primary::before{ display:none !important }
html.eng-weak .topbar::after{ animation:none !important }
html.eng-weak .brand-text b,
html.eng-weak .gn-title .accent,
html.eng-weak .bl-title{ animation:none !important }
html.eng-weak body::after{ animation:none !important }
html.eng-weak body::before{ animation:none !important }
html.eng-weak .gn-stat .num{ text-shadow:none !important }
html.eng-weak .gn-title{ text-shadow:none !important }
html.eng-weak .gn-title .accent{ text-shadow:none !important }
html.eng-weak *{ filter:none !important; -webkit-filter:none !important }

/* 弱引擎：顶栏按钮去掉所有过渡与阴影动画 */
html.eng-weak .loginbtn,
html.eng-weak .groupbtn{
  transition:background .2s ease !important;
  box-shadow:none !important;
  transform:none !important;
}
html.eng-weak .loginbtn:hover,
html.eng-weak .groupbtn:hover{
  transform:none !important;
}

/* 弱引擎：卡片只做最简单的透明度过渡 */
html.eng-weak .gn-card{
  transition:border-color .2s ease !important;
  transform:none !important;
  box-shadow:0 8px 24px -18px rgba(0,0,0,.8) !important;
}
html.eng-weak .gn-card:hover{
  transform:none !important;
}

/* 弱引擎：只保留 Hero 入场（transform+opacity） */
html.eng-weak .gn-hero .gn-anim{
  animation-name:compatRiseIn !important;
  animation-duration:.55s !important;
}
html.eng-weak .gn-marquee-track,
html.eng-weak .gn-scroll .mouse::after,
html.eng-weak .gn-typed .caret{ animation:none !important }

/* 弱引擎：抽屉/弹窗改实底 */
html.eng-weak .drawer{ background:#090b11 !important }
html.eng-weak .gmodal{ background:#0d1017 !important }

/* ============================================================
   ⑪ 弱引擎：关掉全部剩余的无限循环动画
   ============================================================ */
html.eng-weak .brand-avatar,
html.eng-weak .gn-btn.primary,
html.eng-weak .gn-status-item .d,
html.eng-weak .dnav-hot,
html.eng-weak .stars-d,
html.eng-weak [class*="Pulse"],
html.eng-weak [class*="pulse"],
html.eng-weak [class*="twinkle"],
html.eng-weak [class*="drift"],
html.eng-weak [class*="Flow"],
html.eng-weak [class*="flow"]{
  animation:none !important;
}

/* 头像改用静态描边（保留一点质感） */
html.eng-weak .brand-avatar{
  box-shadow:0 0 0 1px rgba(255,214,138,.30), 0 0 14px -6px rgba(232,163,61,.4) !important;
}
/* 主按钮：静态金色（去掉流光） */
html.eng-weak .gn-btn.primary{
  background:linear-gradient(120deg, #d9a441, #ffd68a 55%, #e8a33d) !important;
  background-size:100% 100% !important;
}
/* 状态点：静态发光 */
html.eng-weak .gn-status-item .d{
  background:#ffd68a !important;
  box-shadow:0 0 6px rgba(232,163,61,.6) !important;
  opacity:1 !important;
}
/* 星点：静态 */
html.eng-weak .stars-d{
  opacity:.7 !important;
}
/* 弱机：Hero 打字机光标也不闪（省一帧） */
html.eng-weak .gn-typed .caret{
  opacity:.9 !important;
}

/* ============================================================
   ⑫ 更低一档：低内存设备的极限精简
   ============================================================ */
html.low-mem body::before,
html.low-mem body::after{
  animation:none !important;
}
html.low-mem .gn-card,
html.low-mem .gn-stat{
  transition:none !important;
}
html.low-mem .gn-hero .gn-anim{
  animation:compatRiseIn .4s ease both !important;
}

/* ============================================================
   ⑬ 弱引擎 · 提亮方案
   ------------------------------------------------------------
   降级时关掉了所有发光 → 画面偏暗发灰。
   这里用「更亮的底色 + 更浓的金色 + 静态光晕」补回来，
   全部是静态属性，不影响性能。
   ============================================================ */

/* ---- ① 深空底色整体提亮一档 ---- */
html.eng-weak body,
html.no-backdrop body{
  background-color:#0d1118 !important;
  background-image:
    linear-gradient(180deg, rgba(232,163,61,.075), transparent 26%),
    radial-gradient(72% 46% at 78% 0%,  rgba(232,163,61,.16), transparent 72%),
    radial-gradient(58% 42% at 6% 26%,  rgba(74,124,255,.13), transparent 74%),
    radial-gradient(60% 46% at 92% 74%, rgba(155,92,255,.11), transparent 76%),
    radial-gradient(48% 34% at 32% 102%, rgba(46,230,200,.075), transparent 78%) !important;
  background-repeat:no-repeat !important;
}
/* 星点提亮 */
html.eng-weak body::before{
  opacity:1 !important;
  filter:none !important;
}

/* ---- ② 顶栏提亮（原来是 #0a0c12，太黑） ---- */
html.no-backdrop .topbar,
html.eng-weak .topbar{
  background:linear-gradient(180deg, #12161f, #0e1219) !important;
  border-bottom-color:rgba(232,163,61,.24) !important;
}
html.no-backdrop .topbar.is-scrolled,
html.eng-weak .topbar.is-scrolled{
  background:linear-gradient(180deg, #10141c, #0c1016) !important;
}

/* ---- ③ 终端窗口提亮 ---- */
html.no-backdrop .gn-term,
html.no-backdrop .gn-terminal,
html.eng-weak .gn-term,
html.eng-weak .gn-terminal{
  background:linear-gradient(165deg, #161b24, #101520) !important;
  border-color:rgba(232,163,61,.30) !important;
  box-shadow:0 14px 34px -20px rgba(0,0,0,.85),
             0 0 0 1px rgba(255,214,138,.06) inset !important;
}

/* ---- ④ 金色加浓：标题 / 数字 / 品牌字 ---- */
html.eng-weak .gn-title{
  color:#e8ecf5 !important;
}
html.eng-weak .gn-title .accent{
  background:linear-gradient(100deg, #ffcc55 0%, #ffe0a0 42%, #fff8e0 58%, #ffc23d 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}
html.eng-weak .brand-text b{
  background:linear-gradient(100deg, #ffcc55, #ffe0a0 50%, #ffc23d) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
html.eng-weak .gn-stat .num{
  color:#ffd68a !important;
  background:none !important;
  -webkit-text-fill-color:#ffd68a !important;
}
html.eng-weak .gn-stat .num{
  text-shadow:0 0 12px rgba(232,163,61,.42) !important;
}

/* ---- ⑤ 按钮：金色更饱满 ---- */
html.eng-weak .gn-btn.primary{
  background:linear-gradient(120deg, #e8a33d, #ffd68a 52%, #e8a33d) !important;
  color:#1a1408 !important;
  box-shadow:0 10px 24px -12px rgba(232,163,61,.85) !important;
}
html.eng-weak .gn-btn:not(.primary){
  background:rgba(255,255,255,.06) !important;
  border-color:rgba(255,255,255,.16) !important;
  color:#dfe5ef !important;
}

/* ---- ⑥ 卡片：底色提亮，避免糊成一团 ---- */
html.no-backdrop .gn-card,
html.eng-weak .gn-card{
  background:linear-gradient(160deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  border-color:rgba(255,255,255,.10) !important;
}

/* ---- ⑦ 正文文字提亮（原来 #9aa1ae 偏灰） ---- */
html.eng-weak{
  --muted:#a8b0bd;
}
html.eng-weak .gn-typed,
html.eng-weak .gn-eyebrow,
html.eng-weak p{
  color:#aeb6c4;
}

/* ---- ⑧ 顶栏图标提亮 ---- */
html.eng-weak .loginbtn{
  background:rgba(232,163,61,.16) !important;
  border-color:rgba(255,214,138,.42) !important;
  color:#ffd68a !important;
}
html.eng-weak .groupbtn{
  background:rgba(74,124,255,.16) !important;
  border-color:rgba(140,185,255,.42) !important;
  color:#b8d4ff !important;
}

/* ---- ⑨ 抽屉提亮 ---- */
html.eng-weak .drawer{
  background:linear-gradient(160deg, #12161f, #0d1118) !important;
  border-right-color:rgba(232,163,61,.22) !important;
}

/* ---- ⑩ 数据卡标签提亮 ---- */
html.eng-weak .gn-stat .label,
html.eng-weak .gn-stat span{
  color:#98a2b2 !important;
}

/* ============================================================
   ⑭ 弱引擎 · 高对比亮色方案（最终版）
   ------------------------------------------------------------
   之前的问题是：降级成「实底」后底太深 + 金色透明度太低，
   在小米/Edge 上看起来又暗又灰。
   这次直接给一套明确的高对比配色，不再靠透明叠加。
   ============================================================ */

/* ---- ① 底色：明显提亮到深蓝灰（不是黑） ---- */
html.eng-weak,
html.no-backdrop,
html.eng-third{
  background-color:#131924 !important;
}
html.eng-weak body,
html.no-backdrop body,
html.eng-third body{
  background-color:transparent !important;
  background-image:
    linear-gradient(180deg, rgba(232,163,61,.10), transparent 28%),
    radial-gradient(80% 52% at 76% 0%,  rgba(232,163,61,.20), transparent 70%),
    radial-gradient(64% 48% at 4% 24%,  rgba(74,124,255,.16), transparent 72%),
    radial-gradient(66% 52% at 94% 72%, rgba(155,92,255,.14), transparent 74%),
    radial-gradient(54% 40% at 30% 104%, rgba(46,230,200,.10), transparent 76%) !important;
  background-repeat:no-repeat !important;
}

/* ---- ② 顶栏：明确的分层色，不再是黑 ---- */
html.eng-weak .topbar,
html.no-backdrop .topbar{
  background:linear-gradient(180deg, #1a2130, #151b26) !important;
  border-bottom:1px solid rgba(232,163,61,.30) !important;
  box-shadow:0 6px 20px -12px rgba(0,0,0,.9) !important;
}
html.eng-weak .topbar.is-scrolled,
html.no-backdrop .topbar.is-scrolled{
  background:linear-gradient(180deg, #171d2a, #131a25) !important;
}

/* ---- ③ 顶栏按钮：明确的金色/蓝色，高对比 ---- */
html.eng-weak .loginbtn,
html.no-backdrop .loginbtn{
  background:linear-gradient(140deg, #e8a33d, #ffd68a) !important;
  border:1px solid rgba(255,214,138,.6) !important;
  color:#221a08 !important;
  font-weight:600 !important;
  box-shadow:0 6px 16px -8px rgba(232,163,61,.9) !important;
}
html.eng-weak .groupbtn,
html.no-backdrop .groupbtn{
  background:linear-gradient(140deg, #3d6fd8, #6a9dff) !important;
  border:1px solid rgba(150,190,255,.6) !important;
  color:#0c1424 !important;
  font-weight:600 !important;
  box-shadow:0 6px 16px -8px rgba(74,124,255,.9) !important;
}
/* 图标反色，保证看得见 */
html.eng-weak .loginbtn .lb-ic,
html.eng-weak .groupbtn .gb-ic{ color:inherit !important }

/* ---- ④ 主按钮：饱满金色 ---- */
html.eng-weak .gn-btn.primary{
  background:linear-gradient(120deg, #e8a33d, #ffd68a 52%, #e8a33d) !important;
  color:#1a1408 !important;
  font-weight:600 !important;
  box-shadow:0 10px 26px -12px rgba(232,163,61,.95) !important;
}
html.eng-weak .gn-btn:not(.primary){
  background:rgba(255,255,255,.09) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  color:#e6ecf6 !important;
}

/* ---- ⑤ 终端窗口：明显提亮 ---- */
html.eng-weak .gn-term,
html.eng-weak .gn-terminal,
html.no-backdrop .gn-term,
html.no-backdrop .gn-terminal{
  background:linear-gradient(165deg, #1e2532, #171d29) !important;
  border:1px solid rgba(232,163,61,.34) !important;
  box-shadow:0 18px 40px -22px rgba(0,0,0,.9) !important;
}

/* ---- ⑥ 卡片：底色提亮到看得见边框 ---- */
html.eng-weak .gn-card,
html.no-backdrop .gn-card{
  background:linear-gradient(160deg, rgba(255,255,255,.085), rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.14) !important;
}

/* ---- ⑦ 文字全面提亮 ---- */
html.eng-weak body,
html.eng-weak p,
html.eng-weak .gn-typed,
html.eng-weak .gn-eyebrow{
  color:#c4ccd9 !important;
}
html.eng-weak .gn-title{ color:#f0f4fb !important }
html.eng-weak .gn-stat .label,
html.eng-weak .gn-stat span{ color:#aab4c4 !important }
html.eng-weak .gn-stat .num{
  color:#ffd68a !important;
  -webkit-text-fill-color:#ffd68a !important;
  text-shadow:0 0 10px rgba(232,163,61,.5) !important;
}

/* ---- ⑧ 抽屉：提亮 ---- */
html.eng-weak .drawer,
html.no-backdrop .drawer{
  background:linear-gradient(160deg, #1a2130, #141a25) !important;
  border-right:1px solid rgba(232,163,61,.26) !important;
}

/* ---- ⑨ 弹窗：提亮 ---- */
html.eng-weak .gmodal,
html.no-backdrop .gmodal{
  background:linear-gradient(160deg, #1c2331, #161c27) !important;
}

/* ---- ⑩ 分割线可见 ---- */
html.eng-weak .footer,
html.no-backdrop .footer{
  border-top:1px solid rgba(255,255,255,.09) !important;
}

/* ============================================================
   ⑮ 深色方案声明（防系统夜间模式二次压暗）
   ------------------------------------------------------------
   问题：系统/浏览器夜间模式会给网页强制降亮/反色，
        导致整站看起来「很暗」，与 Chrome 上不一致。
   做法：显式声明本站就是深色站点，让系统不要再做暗化处理。
   ============================================================ */
:root,
html{
  color-scheme:dark only;
}
/* 让原生控件（滚动条、输入框、下拉）也走深色，
   避免系统把它们反色造成刺眼的白色块 */
html{
  accent-color:#e8a33d;
}
input, textarea, select, button{
  color-scheme:dark;
  background-color:transparent;
}
/* 强制所有元素不被系统滤镜影响（部分国产浏览器的「护眼/夜间」会加滤镜） */
html, body{
  -webkit-text-size-adjust:100%;
  forced-color-adjust:none;
}
/* 顶部状态栏配色（Android Chrome / 小米浏览器） */
@supports (background:color-mix(in srgb, red, blue)){
  html{
    background-color:#111725;
  }
}

/* ============================================================
   ⑯ 抽屉菜单文字提亮（弱引擎下发灰/发虚）
   ============================================================ */
html.eng-weak .drawer-nav .dnav-item,
html.no-backdrop .drawer-nav .dnav-item{
  color:#c8d0dd !important;
}
html.eng-weak .drawer-nav .dnav-item .dnav-tx,
html.no-backdrop .drawer-nav .dnav-item .dnav-tx{
  color:#c8d0dd !important;
}
/* 分段标题（主页 / 收纳） */
html.eng-weak .drawer-sec,
html.no-backdrop .drawer-sec,
html.eng-weak .drawer-group-title{
  color:#8b94a3 !important;
}
/* 当前选中项 */
html.eng-weak .drawer-nav .dnav-item.active,
html.no-backdrop .drawer-nav .dnav-item.active{
  color:#ffd68a !important;
}
/* 抽屉头部文字 */
html.eng-weak #drawerName,
html.no-backdrop #drawerName{
  color:#eef2f9 !important;
}
html.eng-weak #drawerTagline,
html.no-backdrop #drawerTagline{
  color:#a4adbc !important;
}
/* 关闭菜单按钮：弱机上更清晰 */
html.eng-weak .drawer-close,
html.no-backdrop .drawer-close{
  color:#bcc5d3 !important;
  border-color:rgba(255,255,255,.18) !important;
  background:rgba(255,255,255,.06) !important;
}