/* ==========================================================================
   LC 前台统一质感层（2026-09-16 二次修订）
   目标（用户定稿）：① 交互按钮统一「果冻」质感
                    ② 卡片统一「渐变 + 果冻」质感（**首页中间列除外**）
                    ③ 列表增加「灵动感」（入场错落 + 悬停位移 + 左侧强调条）
   用法：**只在前台模板** `</style>` 之后引本文件（靠源码顺序覆盖各页内联样式）；
        后台 / 营销后台不引。
   ⚠ 首页中间列（`.filter-card` / `.list` / `.list > .item`）**保持上一版本样式，本文件一律不碰**
     —— 用户明确要求「中间那一列不要改，恢复上一版本 UI」。
   ========================================================================== */
:root{
  --jelly-surface: radial-gradient(120% 78% at 16% -18%, rgba(255,255,255,.96) 0%, rgba(255,255,255,0) 62%),
                   linear-gradient(163deg, #ffffff 0%, #f7faff 46%, #eaf1ff 100%);
  --jelly-surface-soft: radial-gradient(120% 78% at 16% -18%, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 60%),
                   linear-gradient(163deg, rgba(255,255,255,.94) 0%, rgba(244,249,255,.9) 48%, rgba(233,242,255,.88) 100%);
  --jelly-chip: radial-gradient(120% 90% at 20% -20%, rgba(255,255,255,.98) 0%, rgba(255,255,255,0) 66%),
                   linear-gradient(155deg, #ffffff 0%, #f4f9ff 100%);
  --jelly-shadow: 0 12px 32px -20px rgba(35,71,214,.45), 0 2px 8px -5px rgba(35,71,214,.16);
  --jelly-shadow-hi: 0 18px 38px -20px rgba(35,71,214,.6), 0 3px 10px -6px rgba(35,71,214,.22);
  --jelly-inner: inset 0 1px 0 rgba(255,255,255,.98), inset 0 -10px 20px -16px rgba(35,71,214,.26);
  --jelly-edge: 1px solid rgba(255,255,255,.92);
  --jelly-ease: cubic-bezier(.34,1.36,.5,1);
  --jelly-brand: var(--grad-brand, linear-gradient(135deg, #2347d6 0%, #4d7dff 100%));
}

/* ============ ① 交互按钮：质感统一，配色按语义各就各位 ============
   ⚠ 绝不用裸 `.btn` 通吃配色。`.btn` 是各页的**混合基类**，金色 `.btn-gold`、
     橙 `.btn-orange`、绿 `.btn-apply`、描边 `.btn-outline`、状态 `.btn-applied`
     全挂在它上面；统一刷色会把语义色一律刷成品牌蓝，还会造出「白底白字」
     （2026-09-16 实测：个人中心「账号安全」页的按钮文字直接消失）。
   ✅ 下面按语义**逐项登记**。以后新增按钮类，先看它属于哪一组，再加进对应行。 */
.btn, .nav-btn, .chip, .page-btn, .standing-more, .gbtn a, .sms-btn,
.btn-primary, .btn-outline, .btn-green, .btn-red, .btn-pri, .btn-blue, .btn-gold,
.btn-orange, .btn-apply, .btn-applied, .btn-ghost, .dy-btn, .ic-btn, .tb-btn,
.actions .btn, .flow .btn, .ghost, .av-btn, .btn-unfav{
  position: relative; isolation: isolate;
  box-shadow: var(--jelly-shadow), var(--jelly-inner) !important;
  transition: transform .18s var(--jelly-ease), box-shadow .22s ease, color .2s ease;
}
/* 悬停上浮 */
.btn:hover, .nav-btn:hover, .chip:hover, .page-btn:hover, .standing-more:hover,
.gbtn a:hover, .sms-btn:hover, .btn-primary:hover, .btn-outline:hover, .btn-green:hover,
.btn-red:hover, .btn-pri:hover, .btn-blue:hover, .btn-gold:hover, .btn-orange:hover,
.btn-apply:hover, .btn-applied:hover, .btn-ghost:hover, .dy-btn:hover, .ic-btn:hover,
.ghost:hover, .av-btn:hover, .btn-unfav:hover{
  transform: translateY(-2px) scale(1.015);
  box-shadow: var(--jelly-shadow-hi), var(--jelly-inner) !important;
}
/* 按压回弹（果冻手感） */
.btn:active, .nav-btn:active, .chip:active, .page-btn:active, .gbtn a:active,
.btn-primary:active, .btn-pri:active, .dy-btn:active, .ghost:active,
.btn-gold:active, .btn-orange:active, .btn-apply:active, .btn-ghost:active{
  transform: translateY(0) scale(.982);
  box-shadow: 0 6px 16px -12px rgba(35,71,214,.55), var(--jelly-inner) !important;
}
/* ── 浅色果冻底：次要 / 描边 / 状态类（**保留各自字色**，只统一底与边）── */
.nav-btn, .chip, .page-btn, .standing-more, .gbtn a, .btn-outline, .btn-ghost,
.ghost, .av-btn.ghost, .sms-btn, .btn-unfav, .dy-btn, .ic-btn, .tb-btn{
  background: var(--jelly-chip) !important;
  border: var(--jelly-edge) !important;
}
/* 「已申报」是**状态**不是动作：白底红字，语义不能丢 */
.btn-applied{
  background: var(--jelly-chip) !important;
  border: 1px solid rgba(239,68,68,.3) !important;
}
/* ── 主色（品牌渐变）── */
.btn-primary, .nav-btn.primary, .btn-pri, .btn-blue, .gbtn a.reg, .av-btn,
.page-btn.active, .chip.active{
  background: var(--jelly-brand) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.36) !important;
  box-shadow: 0 12px 26px -14px rgba(35,71,214,.72), var(--jelly-inner) !important;
}
/* ── 语义彩色：保留色相，只换质感 ── */
.btn-green, .btn-apply{
  background: linear-gradient(135deg, #10b981 0%, #34d399 100%) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.34) !important;
}
.btn-red{
  background: linear-gradient(135deg, #dc2626 0%, #f87171 100%) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.34) !important;
}
.btn-gold, .btn-orange, .pct-banner .pct-btn{
  background: linear-gradient(135deg, #d97706 0%, #f59e0b 55%, #fbbf24 100%) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.42) !important;
  box-shadow: 0 12px 26px -14px rgba(217,119,6,.72), var(--jelly-inner) !important;
}

/* ============ ② 卡片：渐变 + 果冻 ============ */
/* :not(.lc-panel) / :not(.lc-crystal)：匹配页的自有卡片风格不被覆盖
   ⚠ 不含 .filter-card / .list —— 首页中间列保持原样 */
/* ⚠ 刻意**不含**裸 .card / .panel / .coming-card：
     · .card 在详情页(detail.html)有 7 张精调玻璃卡（用户已确认满意）——覆盖会破坏通透感；
     · .coming-card 是「即将上线」占位卡，要保留虚线语义。
   ✅ **逐项登记**（2026-09-16 逐个核对过 HTML 实际用法）：
     · 已移除 page-card / form-card / profile-card / hero-card / order-card —— HTML 里根本没用到，
       留着只会在将来新增页面时无声改掉别人的卡片；
     · 已移除 standing-top —— 它只出现在匹配页的 `.lc-crystal standing-top`（水晶卡，已定稿），
       原先只排除了 .lc-panel、漏了 .lc-crystal，导致果冻实心底叠在水晶边框上、通透感被盖掉。
   需要果冻的页面（个人中心 / 升级页 / 企业画像页）在该模板内自带样式。 */
.cat-panel, .guest-banner-inner, .stats-card-inner, .user-card{
  background: var(--jelly-surface) !important;
  border: var(--jelly-edge) !important;
  box-shadow: var(--jelly-shadow), var(--jelly-inner) !important;
  backdrop-filter: blur(10px) saturate(1.22);
  -webkit-backdrop-filter: blur(10px) saturate(1.22);
}
/* 左右两列：外层果冻渐变面板（中间列不动） */
.cat-col > .cat-panel, .side-col > .standing-strip{
  background: var(--jelly-surface-soft) !important;
  border: var(--jelly-edge) !important;
  border-radius: 18px;
  padding: 14px 14px 12px;
  box-shadow: var(--jelly-shadow), var(--jelly-inner) !important;
}
.cat-col > .cat-panel{ padding: 16px 14px; }
/* 右列内层卡片：轻一档，避免与外层抢层次 */
.side-col .standing-card{
  background: var(--jelly-chip) !important;
  border: var(--jelly-edge) !important;
  border-left: 3px solid rgba(35,71,214,.52) !important;
  box-shadow: 0 8px 20px -18px rgba(35,71,214,.6), var(--jelly-inner) !important;
}
.side-col .standing-card:hover{
  transform: translateY(-3px) scale(1.012);
  border-left-color: var(--color-primary, #2347d6) !important;
  box-shadow: var(--jelly-shadow-hi), var(--jelly-inner) !important;
}
/* 标签 / 徽标：柔化成小果冻块（颜色口径统一到品牌蓝 + 琥珀 + 绿 + 灰） */
.badge, .tag, .lv, .st, .amt, .need-tag, .gate-tag, .applied-tag, .pill{
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 3px 8px -6px rgba(35,71,214,.35);
}

/* ============ ③ 列表灵动感（首页中间列 .list 不在其列） ============ */
@keyframes lc-rise{ from{ opacity: 0; transform: translateY(9px) scale(.986); } to{ opacity: 1; transform: none; } }
.cat-list > a, .standing-list > a, .tag-row > a, .side-list > li,
.grid > .item:not(.lc-panel), .results-grid > .result:not(.lc-panel),
.cv-row, .cert-grp{
  animation: lc-rise .44s var(--jelly-ease) backwards;
}
.cat-list > a:nth-child(1), .standing-list > a:nth-child(1), .cv-row:nth-child(1){ animation-delay: .02s; }
.cat-list > a:nth-child(2), .standing-list > a:nth-child(2), .cv-row:nth-child(2){ animation-delay: .05s; }
.cat-list > a:nth-child(3), .standing-list > a:nth-child(3), .cv-row:nth-child(3){ animation-delay: .08s; }
.cat-list > a:nth-child(4), .standing-list > a:nth-child(4), .cv-row:nth-child(4){ animation-delay: .11s; }
.cat-list > a:nth-child(5), .standing-list > a:nth-child(5), .cv-row:nth-child(5){ animation-delay: .14s; }
.cat-list > a:nth-child(6), .standing-list > a:nth-child(6), .cv-row:nth-child(6){ animation-delay: .17s; }
.cat-list > a:nth-child(7), .standing-list > a:nth-child(7){ animation-delay: .20s; }
.cat-list > a:nth-child(n+8), .standing-list > a:nth-child(n+8){ animation-delay: .23s; }

/* 左列分类：每个分类一套果冻色（--jc 底色 RGB / --jt 文字色），并隐藏数量 */
.cat-list > a .cnt{ display: none !important; }
.cat-list > a.cat-1{ --jc: 59,130,246;  --jt: #1d4ed8; }   /* 蓝 */
.cat-list > a.cat-2{ --jc: 245,158,11;  --jt: #b45309; }   /* 琥珀 */
.cat-list > a.cat-3{ --jc: 16,185,129;  --jt: #047857; }   /* 绿 */
.cat-list > a.cat-4{ --jc: 139,92,246;  --jt: #6d28d9; }   /* 紫 */
.cat-list > a.cat-5{ --jc: 14,165,233;  --jt: #0369a1; }   /* 天蓝 */
.cat-list > a.cat-6{ --jc: 148,163,184; --jt: #475569; }   /* 灰 */
.cat-list > a.cat-all{ --jc: 35,71,214; --jt: #1e3a8a; }   /* 全部 = 品牌蓝 */

.cat-list > a{
  background:
    radial-gradient(120% 90% at 20% -20%, rgba(255,255,255,.98) 0%, rgba(255,255,255,0) 66%),
    linear-gradient(152deg, rgba(var(--jc,35,71,214),.17) 0%, rgba(var(--jc,35,71,214),.07) 100%) !important;
  border: 1px solid rgba(var(--jc,35,71,214),.30) !important;
  color: var(--jt, var(--color-text-dim)) !important;
  box-shadow: 0 6px 16px -16px rgba(var(--jc,35,71,214),.75), var(--jelly-inner);
  transition: transform .18s var(--jelly-ease), box-shadow .2s ease, background .2s ease;
}
.cat-list > a .dot{ background: rgb(var(--jc,35,71,214)) !important; box-shadow: 0 0 0 3px rgba(var(--jc,35,71,214),.14) !important; }
.cat-list > a:hover{
  transform: translateX(3px) scale(1.012);
  background:
    radial-gradient(120% 90% at 20% -20%, rgba(255,255,255,.98) 0%, rgba(255,255,255,0) 62%),
    linear-gradient(152deg, rgba(var(--jc,35,71,214),.26) 0%, rgba(var(--jc,35,71,214),.12) 100%) !important;
  box-shadow: 0 12px 26px -18px rgba(var(--jc,35,71,214),.95), var(--jelly-inner);
}
/* 选中：用该分类自己的颜色（不再统一成品牌蓝），白字白点 */
.cat-list > a.active{
  background: linear-gradient(135deg, rgb(var(--jc,35,71,214)) 0%, rgba(var(--jc,35,71,214),.84) 100%) !important;
  border-color: rgba(255,255,255,.42) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px -14px rgba(var(--jc,35,71,214),.85), var(--jelly-inner);
}
.cat-list > a.active .dot{ background: #fff !important; box-shadow: none !important; }
.cat-list > a.active .cnt{ display: none !important; }

/* ============ ④ 顶部统计条：与主体同宽 + 文字居中 ============ */
.stats-card{ max-width: 1800px !important; }
.stats-card-inner{ justify-content: center !important; }
.stats-card-inner .stats-crawl{ margin-left: 0 !important; }
.stats-card .stat-item b{ font-weight: 800; letter-spacing: -.2px; }
/* 游客提示条在 .wrap 内，去掉自带宽度限制与叠加内边距，避免比主体窄两列 */
.guest-banner{ max-width: none !important; padding: 0 !important; margin: 0 0 14px !important; }

/* ============ ⑤ 个人中心（/account 及其子页） ============ */
/* 资料行（.cv-row / .view-row）是**非交互**的键值展示，保持原有虚线分隔的排版，
   只加入场错落的灵动感，不做成卡片、不加悬停位移（否则整块像一堆碎卡片）。 */
.cv-row, .view-row{
  animation: lc-rise .44s var(--jelly-ease) backwards;
}
/* 快捷入口按钮 */
.hb-btn{
  background: var(--jelly-chip) !important;
  border: var(--jelly-edge) !important;
  border-radius: 12px;
  box-shadow: var(--jelly-shadow), var(--jelly-inner) !important;
  transition: transform .18s var(--jelly-ease), box-shadow .22s ease;
}
.hb-btn:hover{ transform: translateY(-2px) scale(1.015); box-shadow: var(--jelly-shadow-hi), var(--jelly-inner) !important; }
.hb-btn.gold{
  background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.4) !important;
}
/* ---------- 卡片统一对齐（2026-09-16 定稿）----------
   病灶：本页圆角混用 8/10/12/14/16/18/20/22，横向内边距混用 8/14/16/18/20/30/32，
        同一列里内容的左右边界在多个位置跳动 → 观感「一会左边长、一会右边短」。
   处方：① 卡片外边界一律贴齐容器内边缘（宽度 100% + box-sizing）
        ② 圆角统一 18px ③ 卡片横向内边距统一 20px
        ④ 卡片内的行不再自带左右留白，分隔线左右贯穿到卡片边框（这才是"对齐"的关键）*/
.account-page .user-card, .account-page .menu, .account-page .content,
.account-page .company-view, .account-page .msg-item, .account-page .coming-card,
.account-page .profile-pct-card, .account-page .hb-inner, .account-page .empty{
  box-sizing: border-box; width: 100%; border-radius: 18px;
}
.account-page .user-card, .account-page .menu, .account-page .company-view,
.account-page .msg-item, .account-page .coming-card, .account-page .profile-pct-card{
  padding-left: 20px; padding-right: 20px;
}
.account-page .company-view .cv-row{ margin: 0 -20px; padding: 9px 20px; }
.account-page .company-view .cv-row:last-child{ border-bottom: 0; }
.account-page .fav-progress{ padding-left: 20px; padding-right: 20px; }
.account-page .coming-grid{ gap: 16px; }
.account-page .content > .sub, .account-page .content > h2{ padding-left: 0; }
.account-page .layout{ align-items: stretch; }
/* 左栏两张卡：上卡按内容，菜单撑满剩余 → 左栏自然延到视口底 */
.account-page .sidebar{ display: flex; flex-direction: column; gap: 14px; min-height: 0; }
.account-page .sidebar > .user-card{ flex: 0 0 auto; }
.account-page .sidebar > .menu{ flex: 1 1 0%; min-height: 0; overflow-y: auto; margin-top: 0; }
/* ---------- 左右两栏等高（2026-09-16 定稿）----------
   动机：右栏内容多少不定 → 两栏高度不一致，又变成「一边长一边短」。
   做法：body 改纵向 flex，把**剩余视口高度**全给 .layout（自适应 header / 横幅高度，
        不用硬编码 calc(100vh - 190px)）→ 左栏卡片拉伸到底，右栏在框内滚动。
        桌面才启用；≤980px 仍走纵向堆叠（原来是 760px 断点）。 */
@media (min-width: 981px){
  /* ⚠ 第三个坑（2026-09-16 实测）：光写 `min-height:100vh` 没用 ——
     那样 body 的高度仍由**内容**决定，`.layout` 的 `flex:1` 分配的是"内容高度"而不是
     "剩余视口高度"，菜单 10 项就把 .layout 顶到 1360px（等于没等高）。
     必须 `height:100vh` + `overflow:hidden`，把滚动交给 .content / .menu 内部。 */
  body.account-page{
    display: flex; flex-direction: column;
    height: 100vh; min-height: 100vh; overflow: hidden;
  }
  .account-page .site-header{ flex: 0 0 auto; }
  /* ⚠ 两个坑（2026-09-16 实测，之前就是栽在这里）：
     ① body 变 flex 后，子项的 `margin:0 auto` 会把宽度**收缩到内容宽度**
        （所以三个 tab 的 .layout 宽 788 / 596 / 808 各不相同、右栏只剩 286px）
        → 必须显式 width:100%，auto margin 才会退化为"居中"而不是"收缩"。
     ② `flex:1 1 auto` 的 basis=auto 会被内容撑开（菜单 10 项就把 .layout 顶到 1360px 高）
        → 必须 `flex:1 1 0%` 才能真正按"剩余空间"分配。 */
  .account-page .hero-banner{ flex: 0 0 auto; width: 100%; }
  .account-page .layout{
    flex: 1 1 0%; min-height: 0; width: 100%; margin-bottom: 22px; align-items: stretch;
  }
  .account-page .content{
    min-height: 0; overflow-y: auto; overscroll-behavior: contain;
    scrollbar-gutter: stable;            /* 出现滚动条时右侧不跳宽 */
  }
  .account-page .content::-webkit-scrollbar{ width: 8px; }
  .account-page .content::-webkit-scrollbar-track{ background: transparent; }
  .account-page .content::-webkit-scrollbar-thumb{ background: rgba(35,71,214,.2); border-radius: 8px; }
  .account-page .content::-webkit-scrollbar-thumb:hover{ background: rgba(35,71,214,.34); }
}

/* ---------- 灵动交互：按钮高光扫过（Jelly Sheen）---------- */
/* 只作用于明确的按钮类，不碰首页中间列的 .chip / 分页 .pager */
.btn, .nav-btn, .hb-btn, .gbtn a, .page-btn, .dy-btn, .sms-btn{
  position: relative; overflow: hidden; isolation: isolate;
}
.btn::after, .nav-btn::after, .hb-btn::after, .gbtn a::after,
.page-btn::after, .dy-btn::after, .sms-btn::after{
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 2;
  background: linear-gradient(105deg,
    rgba(255,255,255,0) 36%, rgba(255,255,255,.62) 50%, rgba(255,255,255,0) 64%);
  background-size: 260% 100%; background-position: 130% 0; opacity: 0;
  transition: background-position .66s var(--jelly-ease), opacity .34s ease;
}
.btn:hover::after, .nav-btn:hover::after, .hb-btn:hover::after, .gbtn a:hover::after,
.page-btn:hover::after, .dy-btn:hover::after, .sms-btn:hover::after{
  background-position: -30% 0; opacity: 1;
}
/* 数字等宽，避免刷新时宽度跳动（科技感细节） */
.stats-card .stat-item b, .profile-pct-card .ppc-head b, .cat-list > a .cnt,
.amount, .amt, .price, [class*="num"]{
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}
/* 主内容卡片：悬停时极轻的上浮 + 彩色光晕（不做 3D 旋转，避免密集卡片同时晃） */
.account-page .msg-item, .account-page .coming-card, .account-page .profile-pct-card{
  transition: transform .2s var(--jelly-ease), box-shadow .24s ease, border-color .24s ease;
}
.account-page .msg-item:hover, .account-page .coming-card:hover, .account-page .profile-pct-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 38px -18px rgba(35,71,214,.42), var(--jelly-inner);
}
/* 升级 / 可点击卡片统一指针反馈 */
.account-page .menu a, .account-page .fav-item, .account-page .hb-btn{ cursor: pointer; }

/* 头像 / 升级 / 账单页的表单控件：柔化成玻璃输入 */
.field input, .field select, .field textarea, .input-wrap input, .form input, .form select{
  background: linear-gradient(160deg, rgba(255,255,255,.98) 0%, rgba(244,249,255,.94) 100%);
  border: 1px solid rgba(255,255,255,.95) !important;
  border-radius: 10px;
  box-shadow: inset 0 1px 2px rgba(35,71,214,.08), 0 1px 0 rgba(255,255,255,.9);
  transition: box-shadow .2s ease, border-color .2s ease;
}
.field input:focus, .field select:focus, .field textarea:focus,
.input-wrap input:focus, .form input:focus, .form select:focus{
  outline: none;
  border-color: rgba(77,125,255,.55) !important;
  box-shadow: 0 0 0 3px rgba(77,125,255,.16), inset 0 1px 2px rgba(35,71,214,.06);
}
/* 资质标签 / 复选组：小果冻块 */
.cert-grp, .chk-group label{
  background: var(--jelly-chip);
  border: 1px solid rgba(255,255,255,.92) !important;
  border-radius: 10px;
  box-shadow: 0 6px 16px -18px rgba(35,71,214,.65), var(--jelly-inner);
  transition: transform .16s var(--jelly-ease), box-shadow .2s ease;
}
.cert-grp:hover, .chk-group label:hover{ transform: translateY(-2px); box-shadow: var(--jelly-shadow); }
.actions .btn{ border-radius: 12px; }

/* ============ ⑥ 左右两列 & 常规项目：灵动细节（2026-09-16）============
   只碰左右列与常规项目卡片；中间列 / 导航栏 / 详情页 / 资质卡一律不动。 */
/* 分类项：悬停时圆点放大 + 品牌色光晕（最直观的"活"感），按压回弹 */
.cat-list > a .dot{
  transition: transform .22s var(--jelly-ease), box-shadow .22s ease;
}
.cat-list > a:hover .dot{
  transform: scale(1.45);
  box-shadow: 0 0 0 4px rgba(var(--jc, 35,71,214), .14);
}
.cat-list > a:hover{ transform: translateX(4px); }
.cat-list > a:active{ transform: translateX(2px) scale(.985); }
/* 右列常规项目卡：悬停层次再拉开一档 */
.side-col .standing-card:hover{
  transform: translateY(-3px) scale(1.012);
  box-shadow: 0 18px 36px -18px rgba(35,71,214,.62), var(--jelly-inner) !important;
}
/* 常规项目列表 / 详情卡片：悬停光晕（机甲框纹与水晶边框保持不变） */
.lc-panel.card, .lc-panel.result{
  transition: transform .2s var(--jelly-ease), box-shadow .24s ease;
}
.lc-panel.card:hover, .lc-panel.result:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 42px -22px rgba(35,71,214,.55);
}

/* ============ ⑧ 逐页适配（2026-09-16，按页面逐项登记）============
   下面每一条都写清「作用对象 + 所在页面」，因为它们是**页面结构特有**的适配，
   不是可以套到全站的通用规则。加新规则时请照这个格式登记。 */

/* ── [首页 index] 左右两列面板标题：品牌渐变竖条（中间列一律不碰）── */
.cat-col > .cat-panel .cp-hd, .side-col > .standing-strip .hd{ position: relative; padding-left: 11px; }
.cat-col > .cat-panel .cp-hd::before, .side-col > .standing-strip .hd::before{
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 16px; border-radius: 2px;
  background: linear-gradient(180deg, #2347d6, #f59e0b);
}
.cat-col > .cat-panel .cp-hd b, .side-col > .standing-strip .hd b{ letter-spacing: .3px; }

/* ── [个人中心 account] 消息未读态 / 收藏进度条 / 头像悬停 ── */
.account-page .msg-item.unread{
  border-left: 3px solid #ef4444;
  background: linear-gradient(90deg, rgba(239,68,68,.05), rgba(255,255,255,.92) 45%);
}
.account-page .fav-progress .bar i{
  background: linear-gradient(90deg, #2347d6, #4d7dff 58%, #0ea5e9);
  box-shadow: 0 0 10px rgba(77,125,255,.45);
  transition: width .6s var(--jelly-ease);
}
.account-page .av-pic, .account-page .avatar{ transition: transform .2s var(--jelly-ease), box-shadow .2s ease; }
.account-page .av-pic:hover, .account-page .avatar:hover{ transform: scale(1.06); }
.account-page .btn-unfav:hover{ border-color: #ef4444 !important; color: #ef4444 !important; }

/* ── [付费升级 account_upgrade] 流程时间线 / 订单与成员条目（类名本页独有）── */
.flow .step{
  border-radius: 12px; padding: 9px 13px;
  background: var(--jelly-chip); border: var(--jelly-edge);
  box-shadow: var(--jelly-shadow), var(--jelly-inner);
  transition: transform .18s var(--jelly-ease), box-shadow .22s ease;
}
.flow .step:hover{ transform: translateY(-2px); box-shadow: var(--jelly-shadow-hi), var(--jelly-inner); }
.order-item, .member-item{ border-radius: 14px; transition: transform .18s var(--jelly-ease), box-shadow .22s ease; }
.order-item:hover, .member-item:hover{ transform: translateY(-2px); }

/* ── [企业画像 account_company] 资质块选中态（:has 不支持时整条被忽略，无副作用）── */
.cert-grp{ cursor: pointer; }
.cert-grp:has(input:checked){
  border-color: rgba(77,125,255,.55) !important;
  box-shadow: 0 10px 22px -14px rgba(35,71,214,.75), var(--jelly-inner);
}

/* ── [匹配页 match] 常规项目「更多」小按钮 ──
   ⚠ 不纳入 .bonus-card .next .more —— 它在橙色渐变底上、文字是 #fff，
     套成果冻白底会立刻变成「白底白字」（与账号安全页同一个坑）。 */
.standing-top .st-head .st-more{
  background: var(--jelly-chip) !important;
  border: var(--jelly-edge) !important;
  box-shadow: var(--jelly-shadow), var(--jelly-inner) !important;
  transition: transform .18s var(--jelly-ease), box-shadow .22s ease;
}
.standing-top .st-head .st-more:hover{
  transform: translateY(-2px); box-shadow: var(--jelly-shadow-hi), var(--jelly-inner) !important;
}

/* ── [常规项目 standing_list / match_standing] 返回按钮：**深色 hero 上的玻璃按钮** ──
   这两页的 hero 是品牌渐变深底 + 白字，所以用半透明白玻璃 + 白边，
   不要给白底（会白字白底看不见）。 */
.hero-top .back-home{
  background: rgba(255,255,255,.16) !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transition: transform .18s var(--jelly-ease), background .2s ease;
}
.hero-top .back-home:hover{ transform: translateY(-2px); background: rgba(255,255,255,.28) !important; }

/* ============ 无障碍：尊重"减少动态" ============ */
@media (prefers-reduced-motion: reduce){
  .cat-list > a, .standing-list > a, .tag-row > a, .cv-row, .cert-grp,
  .grid > .item:not(.lc-panel), .results-grid > .result:not(.lc-panel){ animation: none !important; }
  .btn, .nav-btn, .chip, .page-btn, .gbtn a, .cat-list > a, .standing-card,
  .cv-row, .cert-grp{ transition: none !important; }
  .btn:hover, .nav-btn:hover, .chip:hover, .cat-list > a:hover, .standing-card:hover,
  .cv-row:hover{ transform: none !important; }
}

/* ============ ⑦ 灵动交互层（配合 static/js/lc-motion.js）============
   ⚠ 这一段的类名全部由 JS **运行时**添加（`.lc-reveal` / `.lc-magnetic`）。
     所以脚本被拦或报错时元素照常显示，不会出现「整页空白」——
     这是刻意的降级设计，千万别把初始隐藏态硬编码进模板。 */
.lc-reveal{ opacity: 0; transform: translateY(10px) scale(.988); }
.lc-reveal.is-in{
  opacity: 1; transform: none;
  transition: opacity .5s var(--jelly-ease), transform .55s var(--jelly-ease);
}
/* 磁性按钮：位移由 --mag-x/--mag-y 合成，与 hover 的上浮/缩放共存，
   因此需要覆盖同特异性的 .btn-primary:hover / .hb-btn:hover 的 transform（本段在文件最后） */
.lc-magnetic{ --mag-x: 0px; --mag-y: 0px; transform: translate3d(var(--mag-x), var(--mag-y), 0); }
.lc-magnetic:hover{
  transform: translate3d(var(--mag-x), calc(var(--mag-y) - 2px), 0) scale(1.015);
}
@media (prefers-reduced-motion: reduce){
  .lc-reveal{ opacity: 1 !important; transform: none !important; }
  .lc-magnetic, .lc-magnetic:hover{ transform: none !important; }
}