*{margin:0;padding:0;box-sizing:border-box;font-family:'Linux Libertine','Georgia','Times','Source Serif 4',serif}
    body{
      background-color:#f8fafc;color:#334155;line-height:1.6;padding:20px;min-height:100vh;
      background-image:radial-gradient(#e2e8f0 1px,transparent 1px);background-size:20px 20px;
    }
    .container{
      max-width:1280px;margin:0 auto;padding:30px;background-color:#f7f7f7;border-radius:20px;
      position:relative;overflow:hidden;
    }
    .container::before{
      content:'';position:absolute;top:0;left:0;width:100%;height:6px;
      background:linear-gradient(to right,#3b82f6,#8b5cf6,#10b981);
    }
    header{margin-bottom:20px;}

    /* 顶部导航（无 border/box-shadow） */
    .top-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:25px 0;margin-bottom:18px;}
    .nav-left{display:flex;align-items:center;gap:60px;min-width:0;flex-wrap:wrap;}
    .brand{display:inline-flex;align-items:center;gap:10px;border-radius:12px;color:#0f172a;font-weight:700;white-space:nowrap;font-size: 24px;}
    .brand a {display: inline-flex; align-items: center; gap: 10px; border-radius: 12px; color: #0f172a; font-weight: 700; font-size: 24px; text-decoration: none;}
    .brand img{width:40px;}
    .nav-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
    .nav-links a{
      display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;text-decoration:none;
      color:#0f172a;background:#fff;font-size:14px;font-weight:600;transition:background .2s ease,transform .2s ease;
    }
    .nav-links a:hover{transform:translateY(-1px);background:#f1f5f9;}
    .nav-links a.active{background:#1f2937;color:#fff;}
    .nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}
    .nav-btn{
      display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;border:none;background:#fff;
      cursor:pointer;font-weight:700;color:#0f172a;transition:background .2s ease,transform .2s ease;
    }
    .nav-btn:hover{transform:translateY(-1px);background:#f1f5f9;}

    h1{
      font-size:22px;color:#1e293b;margin-bottom:10px;
      -webkit-background-clip:text;
      background-clip:text;
    }
    .subtitle{color:#64748b;font-size:16px;}
    .subtitle strong{color:#181818;font-size:16px;font-weight:600;}

    .section-divider{height:1px;background:linear-gradient(to right,transparent,#e2e8f0,transparent);margin:20px 0;}

    h2{font-size:18px;color:#1e293b;margin-bottom:25px;position:relative;display:inline-block;}
    h2::after{
      content:'';position:absolute;left:0;bottom:-5px;width:60px;height:2px;
      background:linear-gradient(#575757);border-radius:2px;
    }

    .section-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:25px;}
    .section-title-row h2{margin-bottom:0;}

    .radio-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
    .radio-pill{
      display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:5px;text-decoration:none;
      background:#fff;color:#111827;font-size:14px;font-weight:500;transition:background .2s ease,transform .2s ease;
    }
    .radio-pill:hover{background:#f1f5f9;transform:translateY(-1px);}
    .radio-pill.active{background:#2563eb;color:#fff;}
    .radio-pill:focus-visible{outline:3px solid rgba(59,130,246,0.35);outline-offset:2px;}

    .noteworthy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(580px,1fr));gap:25px;margin-top:20px;}

    .noteworthy-card{
      background:#fff;border-radius:16px;padding:10px 20px;position:relative;overflow:hidden;
      transition:transform .2s ease,background .2s ease;
    }

    .noteworthy-card.with-bar::before{
      content:'';position:absolute;top:0;left:0;width:5px;height:100%;
      background:linear-gradient(to bottom,#2563eb);
    }

    .card-header{
      display:flex;
      justify-content:space-between;
      margin-bottom:8px;
      gap:12px;
      font-weight: 700;
    white-space: nowrap;
        align-items: center;
    }
    
    .card_logo img {
        height: 60px;
        max-width: 160px;
    }

    .card-head-left{min-width:0;}
    .card-title{
      font-size:1.3rem;font-weight:700;color:#1e293b;
      display:block;
      line-height:1.2;
      word-break:break-word;
    }
    .card-logo{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:34px;height:34px;
      border-radius:10px;
      background:#f1f5f9;
      text-decoration:none;
      flex:0 0 auto;
    }
    .card-logo img{width:22px;height:22px;object-fit:contain;display:block;}
    .card-logo.fallback{color:#0f172a;font-weight:800;font-size:12px;}

    /* card-content 两行 + 右侧按钮（绝对靠右） */
    .card-content-wrap{position:relative;margin-top:4px;}
    .card-content{
      color:#64748b;font-size:16px;line-height:1.7;
      display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
      overflow:hidden;
      padding-right:78px;
      min-height:calc(1.7em * 2);
    }
    .full-btn{
      position:absolute;right:0;bottom:0;
      display:inline-flex;align-items:center;justify-content:center;
      padding:2px 6px;border-radius:6px;background:#f1f5f9;color:#2563eb;
      font-size:12px;font-weight:800;cursor:pointer;user-select:none;white-space:nowrap;
      transition:background .2s ease,transform .2s ease;
    }
    .full-btn:hover{background:#e2e8f0;transform:translateY(-1px);}
    .full-btn:focus-visible{outline:3px solid rgba(59,130,246,0.35);outline-offset:2px;}

    /* 支付方式：图标块 + border-bottom */
    .card-meta{margin-top:12px;}
    .card-pay-row{
      display:flex;align-items:center;gap:2px;flex-wrap:wrap;
      padding-bottom:5px;border-bottom:1px solid #e2e8f0;margin-bottom:5px;
    }
    .meta-label{color:#0f172a;font-weight:800;font-size:14px;white-space:nowrap;}
    .pay-badges{display:flex;align-items:center;gap:2px;flex-wrap:wrap;}
    .pay-badge{
      display:inline-flex;align-items:center;justify-content:center;
      height:28px;min-width:44px;background-color: #f1f5f9;padding:5px 5px;border-radius:8px;
      color:#1c1c1c;text-decoration:none;font-weight:500;font-size:12px;line-height:1;
      transition:transform .15s ease,filter .15s ease;
    }
    .pay-badge i{font-size:14px;line-height:1;}

    .card-ad-row{display:flex;align-items:center;gap:2px;flex-wrap:inherit;color:#475569;font-size:13px;}
    .meta-value{color:#0f172a;font-weight:500;line-height: 2;}

    .card-footer{
      display:flex;align-items:center;justify-content:space-between;gap:5px;margin-top:16px;flex-wrap:wrap;
    }
    .tag-list{display:flex;align-items:center;gap:3px;flex-wrap:wrap;max-width: 450px;}
    .tag{
      display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;background:#f1f5f9;color:#0f172a;
      font-size:12px;font-weight:500;line-height:1;text-decoration:none;transition:background .2s ease,transform .2s ease;
    }
    .tag:hover{background:#e2e8f0;transform:translateY(-1px);}
    .tag:focus-visible{outline:3px solid rgba(59,130,246,0.35);outline-offset:2px;}

    .visit-btn{
      display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:6px;border:none;background:#2563eb;
      color:#fff;font-weight:800;font-size:12px;cursor:pointer;text-decoration:none;white-space:nowrap;
      transition:background .2s ease,transform .2s ease;
    }
    .visit-btn:hover{background:#1d4ed8;transform:translateY(-1px);}

    .view-all{
      display:inline-flex;align-items:center;gap:8px;margin-top:40px;padding:8px 12px;background:#2563eb;color:#fff;border:none;
      border-radius:0.5rem;font-weight:700;cursor:pointer;transition:transform .2s ease,background .2s ease;
    }
    .view-all:hover{transform:translateY(-2px);background:#1d4ed8;}

    .stats{display:flex;gap:30px;margin-top:40px;padding:20px;background-color:#f8fafc;border-radius:15px;}
    .stat-item{display:flex;flex-direction:column;align-items:center;flex:1;}
    .stat-value{font-size:2rem;font-weight:700;color:#3b82f6;margin-bottom:5px;}
    .stat-label{font-size:0.9rem;color:#64748b;}
    footer{margin-top:50px;text-align:center;color:#94a3b8;font-size:0.9rem;padding-top:20px;border-top:1px solid #e2e8f0;}

    /* ======================================================
       ✅ 顶层 Popover：从下往上缓慢出现（非居中，跟随按钮）
       ====================================================== */
    .intro-popover{
      position:fixed;
      display:none;
      width:min(341px, 22vw);
      background:#fff;
      border-radius:10px;
      overflow:hidden;
      z-index:99999;
      box-shadow:0 22px 70px rgba(2,6,23,.25);

      opacity:0;
      transform:translateY(18px);
      pointer-events:none;

      transition:opacity .55s ease, transform .55s cubic-bezier(.2,.9,.25,1);
      will-change:transform,opacity;
    }
    .intro-popover.mounted{display:block;}
    .intro-popover.open{
      opacity:1;
      transform:translateY(0);
      pointer-events:auto;
    }

    .intro-media{height:200px;background:#e2e8f0;}
    .intro-media img{width:100%;height:100%;object-fit:cover;display:block;}
    .intro-body{
      padding:5px 5px 25px;
      font-size:14px;
      line-height:1.7;
      color:#0f172a;
      position:relative;
    }
    .intro-title{font-size:16px;font-weight:900;margin-bottom:8px;color:#0f172a;}
 
    /* ======================================================
       ✅ 倒角箭头：单独 fixed，固定在“全部简介”按钮处（不在弹窗内部）
       ====================================================== */
    .intro-arrow{
      position:fixed;
      width:0;height:0;
      z-index:100000;
      display:none;
      opacity:0;
      transform:translateY(6px);
      transition:opacity .35s ease, transform .35s ease;
      filter:drop-shadow(0 6px 10px rgba(2,6,23,.15));
      will-change:transform,opacity;
    }
    .intro-arrow.mounted{display:block;}
    .intro-arrow.open{
      opacity:1;
      transform:translateY(0);
    }

    .intro-arrow.arrow-up{
      border-left:12px solid transparent;
      border-right:12px solid transparent;
      border-bottom:18px solid #fff;
    }
    .intro-arrow.arrow-down{
      border-left:12px solid transparent;
      border-right:12px solid transparent;
      border-top:12px solid #fff;
    }

    @media (max-width:768px){
      .container{padding:20px;border-radius:15px;}
      h1{font-size:2rem;}
      .noteworthy-grid{grid-template-columns:1fr;}
      .stats{flex-direction:column;gap:20px;}
      .top-nav{align-items:flex-start;flex-direction:column;}
      .nav-right{width:100%;justify-content:flex-end;}
    }
    @media (max-width:480px){
      h1{font-size:1.8rem;}
      .nav-links a,.nav-btn,.brand{width:100%;justify-content:center;}
      .nav-links{width:100%;}
      .nav-right{width:100%;}
      .visit-btn{width:100%;}
    }
    
    
    
    /* 基础样式：你可按自己站点风格微调 */
.view-all{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 15px;
  border: 0;
  cursor: pointer;
  user-select: none;
  font-weight: 700;
  letter-spacing: .5px;
  transition: transform .15s ease, filter .15s ease, opacity .15s ease;
}

/* hover 轻微抬起 */
.view-all:hover{ transform: translateY(-1px); }
.view-all:active{ transform: translateY(0px) scale(.99); }

/* Loading 状态：按钮不可点 + 视觉反馈 */
.view-all.is-loading{
  cursor: not-allowed;
  opacity: .92;
  filter: saturate(1.05);
}

/* 左侧旋转小圆环 */
.view-all::before{
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.35);
  border-top-color: rgba(255,255,255,.95);
  display: none;               /* 默认隐藏 */
  animation: btnSpin .8s linear infinite;
}

/* 只有 loading 才显示圆环 */
.view-all.is-loading::before{
  display: inline-block;
}

/* 文字在 loading 时稍微变淡一点 */
.view-all.is-loading span{
  opacity: .92;
}

/* Shimmer 闪光扫过（高级感） */
.view-all::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    110deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.22) 35%,
    rgba(255,255,255,0) 70%
  );
  transform: translateX(-120%);
  opacity: 0;
  pointer-events: none;
}

/* Loading 时开启 shimmer 扫光 */
.view-all.is-loading::after{
  opacity: 1;
  animation: btnShimmer 1.1s ease-in-out infinite;
}

/* 禁用（没有更多了）你已有 disabled，这里给个更明确的视觉 */
.view-all:disabled{
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

/* 动画 */
@keyframes btnSpin{
  to { transform: rotate(360deg); }
}
@keyframes btnShimmer{
  0%   { transform: translateX(-120%); }
  100% { transform: translateX(120%); }
}




/* ===== PJAX 顶部进度条 ===== */
.pjax-progress{
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0%;
  z-index: 99999;
  background: linear-gradient(90deg, #3b82f6, #22c55e);
  transition: width .18s ease;
  pointer-events: none;
}

/* ===== PJAX 主内容淡出/淡入 ===== */
#pjaxMain{
  transition: opacity .18s ease;
}
body.pjax-loading #pjaxMain{
  opacity: .25;
}

/* ===== PJAX 骨架 overlay ===== */
.pjax-overlay{
  position: fixed;
  inset: 0;
  z-index: 99998;
  display: none;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(1px);
}
body.pjax-loading .pjax-overlay{
  display: block;
}

/* ===== Skeleton UI ===== */
.pjax-skeleton-wrap{
  max-width: 1100px;
  margin: 90px auto 0;
  padding: 0 16px 28px;
}
.pjax-skeleton-title{
  height: 22px;
  width: 240px;
  border-radius: 10px;
  margin-bottom: 14px;
  background: #e9eef5;
  overflow: hidden;
}
.pjax-skeleton-subtitle{
  height: 12px;
  width: 78%;
  border-radius: 10px;
  margin-bottom: 22px;
  background: #e9eef5;
  overflow: hidden;
}

.pjax-skeleton-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 720px){
  .pjax-skeleton-grid{ grid-template-columns: 1fr; }
}

.pjax-skeleton-card{
  border-radius: 14px;
  background: #f6f8fb;
  padding: 14px;
  border: 1px solid rgba(0,0,0,.04);
  overflow: hidden;
  position: relative;
  min-height: 130px;
}
.pjax-skeleton-row{
  height: 12px;
  border-radius: 10px;
  background: #e9eef5;
  margin-bottom: 10px;
}
.pjax-skeleton-row.w60{ width: 60%; }
.pjax-skeleton-row.w80{ width: 80%; }
.pjax-skeleton-row.w40{ width: 40%; }

.pjax-shimmer::after{
  content:'';
  position:absolute;
  inset:-40% -60%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent);
  animation: pjax-shimmer 1.2s linear infinite;
}
@keyframes pjax-shimmer{
  0%{ transform: translateX(-30%); }
  100%{ transform: translateX(30%); }
}