/* ==========================================================================
   CRX 极简插件主题 · kuakeba.cn
   目标视觉：chrome.zzzmh.cn/index
   - 顶部白色 header（logo + 搜索 + 操作）
   - 左侧白色菜单面板（导航 / 分类 / 热门推荐 / 最新收录）
   - 右侧主面板（轮播 + 站长推荐 + 分类区块，每行 4 张插件卡片）
   - 深色页脚
   ========================================================================== */

body {
  --accent: #2f4f4f;
  --accent-ink: #ffffff;
  --accent-soft: rgba(47, 79, 79, .08);
  --accent-deep: #203a3a;
  --bg: #f7f7f7;
  --card: #ffffff;
  --surface: #ffffff;
  --line: rgba(0, 0, 0, .06);
  --radius: 8px;
  --radius-sm: 6px;
  background: #f7f7f7;
  color: #4c4c4c;
  font-size: 14px;
  line-height: 1.5;
}

/* 站点主色：头部按钮、链接、选中态统一到目标站的墨绿 */
.crx-primary,
.index-center-title,
.crx-section-more:hover,
.crx-card-title:hover {
  color: var(--crx-primary, #2f4f4f);
}

/* --------------------------------------------------------------------------
   1. 桌面端重构外壳：header 全宽置顶，左菜单卡片，右主面板
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
  .app {
    /* 左侧菜单宽度（992–1199px 下收窄为 320px） */
    --crx-nav: 400px;
    display: grid;
    /* 内容宽度 = 配置百分比（--crx-width，由主题全局模板注入），作用于全部页面；
       104px = 3 个列间距 72px + 两侧最小留白 32px，同时不超过“窗口宽度 - 左侧菜单与间距”，
       避免窄屏出现横向滚动 */
    grid-template-columns: minmax(16px, 1fr) var(--crx-nav) minmax(0, min(var(--crx-width, 68%), calc(100% - var(--crx-nav) - 104px))) minmax(16px, 1fr);
    grid-template-rows: auto 1fr auto;
    align-items: start;
    min-height: 100vh;
    column-gap: 24px;
    background: #f7f7f7;
  }

  /* 让 .main 的子元素成为 .app 的网格项 */
  .main {
    display: contents;
  }

  .main-bar {
    grid-column: 1 / -1;
    grid-row: 1;
    position: sticky;
    top: 0;
    z-index: 40;
    height: 64px;
    background: #ffffff;
    border-bottom: 0;
    box-shadow: 0 2px 4px rgb(0 0 0 / 8%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  /* 页头内容与内容区左边缘对齐：左偏移 = (100% - 主栏宽度 - 菜单宽 - 3 个列间距) / 2 */
  html:not(.layout-dual):not(.layout-triple) .main-bar-inner,
  .main-bar-inner {
    width: 100%;
    max-width: none;
    height: 64px;
    margin: 0 auto;
    padding-left: max(40px, calc((100% - min(var(--crx-width, 68%), calc(100% - var(--crx-nav) - 104px)) - var(--crx-nav) - 72px) / 2));
    padding-right: max(40px, calc((100% - min(var(--crx-width, 68%), calc(100% - var(--crx-nav) - 104px)) - var(--crx-nav) - 72px) / 2));
    box-sizing: border-box;
    gap: 16px;
  }

  /* 单栏布局下宿主默认隐藏品牌区，这里统一显示在顶部 header */
  .bar-left {
    display: flex;
    flex: 0 0 auto;
  }

  .bar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }

  .bar-brand .logo-copy {
    display: flex;
    flex-direction: row;
    flex: 0 1 auto;
    align-items: center;
    min-width: 0;
  }

  .bar-brand .logo-text {
    font-size: 20px;
    font-weight: 800;
    color: #3a3a3a;
    letter-spacing: 0;
  }

  /* 目标站页头品牌为单行图文，隐藏副标题 */
  .bar-brand .logo-sub {
    display: none;
  }

  .bar-ver,
  .bar-rank-btn,
  .bar-center {
    display: none !important;
  }

  /* 左菜单项由后台配置、theme.js 重绘；重绘完成前先隐藏宿主自带菜单，避免闪一下 */
  html.crx-nav-pending .sidebar-nav .sidebar-link {
    visibility: hidden;
  }

  /* 页头右操作区：对齐目标站 .header-btn-panel（图标+文字、1.75rem 间距、#6d6d6d） */
  .bar-right {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    margin-left: auto;
    gap: 28px;
  }

  .bar-actions {
    display: flex;
    align-items: center;
    gap: 28px;
  }

  html .bar-right .bar-search,
  .main-bar .bar-set-btn,
  .main-bar .bar-signin-btn,
  .main-bar .bar-msg-btn,
  .main-bar .bar-post-btn {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    min-width: 0;
    max-width: none;
    margin-left: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #6d6d6d;
    box-shadow: none;
    font-size: 16px;
    line-height: 24px;
    gap: 6px;
  }

  html .bar-right .bar-search:hover,
  .main-bar .bar-set-btn:hover,
  .main-bar .bar-signin-btn:hover,
  .main-bar .bar-msg-btn:hover,
  .main-bar .bar-post-btn:hover {
    background: transparent;
    border-color: transparent;
    color: #3a3a3a;
  }

  html .bar-right .bar-search > i,
  .main-bar .bar-set-btn > i,
  .main-bar .bar-signin-btn > i,
  .main-bar .bar-msg-btn > i,
  .main-bar .bar-post-btn > i {
    font-size: 18px;
  }

  /* 签到按钮沿用社区插件的“已签”绿色标记，但去掉圆底圆框 */
  html .main-bar .bar-signin-btn.is-signed,
  html .main-bar .bar-signin-btn.is-signed:hover {
    border-color: transparent;
    background: transparent;
    color: #16a34a;
  }

  html .bar-right .bar-search > span:not(.bar-search-keys) {
    display: block !important;
    margin-bottom: 2px;
    font-size: 16px;
    line-height: 24px;
  }

  html .bar-right .bar-search-keys {
    display: none !important;
  }

  /* 页头「设置」按钮已移除，主题设置入口保留在左侧边栏齿轮按钮 */
  html .main-bar .bar-set-btn {
    display: none !important;
  }

  /* 页头「发布」按钮已移除，发帖入口保留在左侧菜单与广场 */
  html .main-bar .bar-post-btn {
    display: none !important;
  }

  /* 登录按钮：目标站右操作区为纯文字样式，去掉宿主圆角主按钮外观 */
  .main-bar .btn.btn-primary.js-auth-open {
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin-left: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #6d6d6d;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    box-shadow: none;
  }

  .main-bar .btn.btn-primary.js-auth-open:hover {
    background: transparent;
    color: #3a3a3a;
  }

  /* 左侧菜单吸附在页头下方固定不动，内容过长时在菜单内部滚动（参考 liteBBS） */
  .sidebar {
    grid-column: 2;
    grid-row: 2;
    position: sticky;
    top: 88px; /* 页头 64px + 24px 间距 */
    align-self: start;
    box-sizing: border-box;
    width: auto;
    height: auto;
    /* 上限 = 视口 - 页头 64 - 上下留白 48 - 页脚 56，保证底部不压住页脚 */
    max-height: calc(100vh - 168px);
    margin: 24px 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
    z-index: 1;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  /* 彻底隐藏左菜单的滚动条（含内部子元素，兼容 Chrome 覆盖式滚动条） */
  html .sidebar::-webkit-scrollbar,
  html .sidebar *::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  html .sidebar * {
    scrollbar-width: none;
  }

  .sidebar-brand {
    display: none;
  }

  /* 对齐目标站 .menu：1rem/3rem 整行链接，图标 1.25rem、右间距 1.5rem */
  .sidebar-nav {
    padding: 16px 0;
    gap: 0;
  }

  .sidebar-link {
    min-height: 0;
    height: auto;
    padding: 16px 48px;
    border-radius: 0;
    color: #999;
    font-size: 16px;
    font-weight: 700;
    gap: 0;
  }

  .sidebar-link i {
    margin-right: 24px;
    color: #999;
    font-size: 20px;
  }

  .sidebar-link span {
    margin-bottom: 4px;
  }

  /* 目标站菜单无右侧计数 */
  .sidebar-link em {
    display: none;
  }

  .sidebar-link:hover {
    background: #f7f7f7;
    color: #4c4c4c;
  }

  .sidebar-link.on {
    background: #2f4f4f;
    color: #ffffff;
  }

  .sidebar-link.on i {
    color: rgba(255, 255, 255, .82);
  }

  .sidebar-notices {
    margin-top: 8px;
    padding: 16px 24px 8px;
    border-top: 1px solid #efefef;
  }

  .sidebar-notices-head {
    color: #9aa0a6;
    font-size: 12px;
    font-weight: 500;
  }

  .sidebar-notice-link {
    color: #5f656b;
    font-size: 13px;
  }

  .sidebar-foot {
    display: none;
  }

  /* 右侧主面板 */
  .main-scroll {
    grid-column: 3;
    grid-row: 2;
    min-width: 0;
    padding: 24px 0 36px;
    background: transparent;
  }

  /* 宿主用 html:not(.layout-dual):not(.layout-triple) .content 把内容区收成
     min(92%, 100% - 56px) 并居中，在主栏内会额外留下左右各约 36px 空白，
     导致详情中栏比目标站窄；用更高特异性压过，让内容区占满主栏 */
  html:not(.layout-dual):not(.layout-triple) .main-scroll > .content,
  html.layout-dual .main-scroll > .content,
  html.layout-triple .main-scroll > .content,
  .main-scroll > .content,
  .main-scroll > .crx-home {
    width: 100%;
    max-width: none;
    margin: 0 auto;
  }

  /* 右主面板：目标站 main-panel 为白色面板，无阴影，四周 3.5rem 留白 */
  .main-scroll > .crx-home {
    min-height: 90vh;
    padding: 56px;
    background: #fff;
    border-radius: 8px;
    box-shadow: none;
  }

  .site-foot {
    grid-column: 1 / -1;
    grid-row: 3;
    background: #343a40;
    border-top: 0;
    padding: 0;
  }
}

/* --------------------------------------------------------------------------
   2. 页脚：对齐目标站 footer（深色版权条，单行居中，无品牌区与链接分栏）
   -------------------------------------------------------------------------- */
.site-foot {
  background: #343a40;
  padding: 0;
  border-top: 0;
}

/* 目标站页脚无品牌区与链接分栏，整块隐藏（含其内边距，避免留下深色空条） */
.site-foot .site-foot-inner {
  display: none;
}

html:not(.layout-dual):not(.layout-triple) .site-foot-bottom,
.site-foot .site-foot-bottom {
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border-top: 0;
}

.site-foot .site-foot-bottom-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: none;
  min-height: 0;
  padding: 16px;
  gap: 8px 20px;
  color: #efefef;
  font-size: .85rem;
}

.site-foot .site-foot-copy,
.site-foot .site-foot-legal a {
  height: 24px;
  line-height: 24px;
  color: #efefef;
  font-size: .85rem;
  font-weight: 400;
}

.site-foot .site-foot-legal a:hover {
  color: #b0c4de;
}

.site-foot .site-foot-legal > span {
  color: #efefef;
}

/* 备案号后面的「友情链接 / 网站地图」等配置链接 */
.site-foot .crx-foot-links {
  display: flex;
  align-items: center;
  height: 24px;
  line-height: 24px;
  gap: 8px;
  color: #efefef;
  font-size: .85rem;
}

.site-foot .crx-foot-links a {
  color: #efefef;
}

.site-foot .crx-foot-links a:hover {
  color: #b0c4de;
}

.site-foot .crx-foot-links .crx-foot-sep {
  color: #8b939b;
}

/* --------------------------------------------------------------------------
   3. 首页：轮播
   -------------------------------------------------------------------------- */
.crx-home {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 8px;
}

.crx-banner {
  position: relative;
  aspect-ratio: 16 / 9;
  margin-bottom: 56px;
  border-radius: var(--crx-radius, 8px);
  overflow: hidden;
  background: #2f4f4f;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.crx-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .45s ease;
}

.crx-slide.is-active {
  opacity: 1;
  visibility: visible;
}

.crx-slide-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.crx-slide-fallback {
  background-image: linear-gradient(135deg, rgba(255, 255, 255, .16) 0, rgba(255, 255, 255, 0) 55%);
}

.tone-hot { background-color: #ff5252; }
.tone-developer { background-color: #1976d2; }
.tone-tool { background-color: #00bcd4; }
.tone-clean { background-color: #21aba5; }
.tone-office { background-color: #6e5773; }
.tone-fun { background-color: #fd7e14; }

.crx-slide-link {
  position: absolute;
  inset: 0;
  display: block;
  z-index: 1;
}

.crx-banner-dots {
  position: absolute;
  right: 24px;
  bottom: 22px;
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 2;
}

.crx-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .55);
  cursor: pointer;
  transition: width .2s, background .2s;
}

.crx-dot.is-active {
  width: 22px;
  border-radius: 4px;
  background: #ffffff;
}

/* --------------------------------------------------------------------------
   4. 首页区块与插件卡片
   -------------------------------------------------------------------------- */
.crx-section {
  margin: 0 0 48px;
}

.crx-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 8px;
}

.index-center-title {
  margin: 0;
  padding: 16px 8px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #4c4c4c;
  letter-spacing: 0;
}

.crx-section-more {
  display: inline-flex;
  align-items: center;
  margin-right: 8px;
  font-size: .875rem;
  color: #9aa0a6;
}

.crx-section-more:hover {
  color: #2f4f4f;
}

.crx-grid {
  display: grid;
  gap: 32px 24px;
}

.crx-grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.crx-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
  transition: box-shadow .18s ease;
  position: relative;
}

.crx-card:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, .12), 0 6px 18px rgba(0, 0, 0, .1);
}

.crx-card-hit {
  display: block;
}

.crx-card-media {
  position: relative;
  display: block;
  aspect-ratio: 11 / 7;
  overflow: hidden;
  background: #f1f3f5;
}

.crx-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.crx-card-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 100%;
  color: #fff;
  background-image: linear-gradient(135deg, rgba(255, 255, 255, .18) 0, rgba(255, 255, 255, 0) 60%);
}

.crx-card-fallback i {
  font-size: 30px;
  opacity: .9;
}

.crx-card-fallback em {
  font-style: normal;
  font-size: 1.1rem;
  font-weight: 700;
  opacity: .95;
}

.crx-card-flag {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 2px 8px;
  border-radius: 4px;
  background: #ff5252;
  color: #fff;
  font-size: 12px;
  font-style: normal;
}

.crx-card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  padding: 16px;
  border-top: 1px solid #efefef;
}

.crx-card-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 2.25rem;
  color: #4c4c4c;
}

.crx-card-title:hover {
  color: #2f4f4f;
}

.crx-card-text {
  display: -webkit-box;
  -webkit-line-clamp: var(--crx-desc-lines, 1);
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.5em * var(--crx-desc-lines, 1));
  font-size: .85rem;
  line-height: 1.5;
  color: #9a9a9a;
}

.crx-card-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding-top: 2px;
}

.crx-card-tag {
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 12px;
  font-style: normal;
  color: #fff;
}

.crx-card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  font-size: 12px;
  color: #9aa0a6;
}

.crx-card-meta em {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-style: normal;
}

.crx-card-dl {
  padding: 3px 10px;
  border-radius: 4px;
  background: #2f4f4f;
  color: #fff;
  font-size: 12px;
}

.crx-card-dl:hover {
  background: #203a3a;
  color: #fff;
}

.crx-empty {
  padding: 48px 20px;
  border-radius: 8px;
  background: #fff;
  text-align: center;
  color: #9aa0a6;
}

.crx-empty i {
  font-size: 34px;
}

.crx-empty p {
  margin: 10px 0 0;
  font-size: 14px;
}

.crx-empty a {
  color: #2f4f4f;
  font-weight: 600;
}

.crx-home-note {
  margin-top: 26px;
  padding: 14px 16px;
  border-radius: 8px;
  background: #fff;
  color: #8a8a8a;
  font-size: 13px;
  line-height: 1.7;
}

/* --------------------------------------------------------------------------
   5. 左菜单附加区块（热门推荐 / 最新收录），由 theme.js 注入
   -------------------------------------------------------------------------- */
/* 目标站 .top-plugins / .news-plugins：内边距 1.5rem 3rem，区块间 1px 分隔线 */
.crx-side-block {
  padding: 24px 48px 16px;
  border-top: 1px solid #efefef;
}

.crx-side-title {
  display: flex;
  align-items: center;
  margin: 0 0 12px 8px;
  font-size: 16px;
  font-weight: 700;
  color: #999;
}

.crx-side-title i {
  margin-right: 12px;
  font-size: 18px;
}

/* 与目标站左栏 .plugin 行一致：44px 图标 + 标题 + 彩色标签 */
.crx-side-item {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 0;
  margin: 0 0 12px;
  padding: 8px 0;
  border-radius: 8px;
  color: #4c4c4c;
  font-size: .95rem;
  font-weight: 700;
}

.crx-side-item:hover {
  background: hsla(0, 0%, 87.1%, .15);
  color: #4c4c4c;
}

.crx-side-logo {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-right: 16px;
  overflow: hidden;
  border-radius: 4px;
  background: #f1f3f5;
}

.crx-side-logo img,
.crx-side-logo em {
  filter: drop-shadow(1px 2px 4px rgba(128, 128, 128, .2));
}

.crx-side-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.crx-side-logo em {
  font-style: normal;
  font-size: 18px;
  font-weight: 700;
  color: #2f4f4f;
}

.crx-side-text {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  flex: 1 1 auto;
}

.crx-side-name {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 8px;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.4;
  color: #4c4c4c;
  filter: drop-shadow(1px 2px 4px rgba(128, 128, 128, .2));
}

.crx-side-tags {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.crx-side-tag {
  display: inline-block;
  margin-right: 8px;
  padding: 2.4px 9.6px;
  border-radius: 4px;
  color: #fff;
  font-size: .85rem;
  font-weight: 700;
  line-height: 1;
  filter: drop-shadow(1px 2px 4px rgba(128, 128, 128, .2));
}

/* 目标站标签配色 */
.crx-side-tag.bg-hot { background-color: #ff5252; }
.crx-side-tag.bg-office { background-color: #6e5773; }
.crx-side-tag.bg-developer { background-color: #1976d2; }
.crx-side-tag.bg-clean { background-color: #21aba5; }
.crx-side-tag.bg-tool { background-color: #00bcd4; }
.crx-side-tag.bg-prettify { background-color: #ffc93c; }

/* --------------------------------------------------------------------------
   6. 其它：浮层、杂项收敛
   -------------------------------------------------------------------------- */
.site-float .site-float-actions {
  display: none;
}

.site-float .back-top {
  background: #fff;
  color: #4c4c4c;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .16);
}

/* 首页数据由主题区块接管，不渲染社区广场侧栏 */
.crx-home ~ .plaza-aside {
  display: none;
}

/* --------------------------------------------------------------------------
   7. 详情页：对齐目标站插件详情（白卡 / 图标信息区 / 截图 / 正文排版）
   -------------------------------------------------------------------------- */
.content .article-card {
  padding: 32px 36px;
  border-radius: 8px;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.detail-head h1 {
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5;
  color: #4c4c4c;
  white-space: normal;
}

/* 软件详情：标题已由信息区承载，隐藏重复的 h1 与顶部统计行（统计移到右栏） */
.crx-software-detail .detail-head h1,
.crx-software-detail .detail-meta {
  display: none;
}

.crx-software-detail .software-detail-panel {
  margin-top: 0;
}

/* 详情页：页面级双栏（左菜单由站点外壳承担 + 白色主面板）
   主面板内部再分「正文 + 信息栏」两列，对齐目标站 col-lg-9 结构 */
.is-topic-detail .plaza-main {
  display: block !important;
  grid-template-columns: none !important;
}

.is-topic-detail .plaza-left,
.is-topic-detail .plaza-aside {
  display: none !important;
}

.is-topic-detail .plaza-feed {
  min-height: 90vh;
  padding: 56px;
  background: #fff;
  border-radius: 8px;
  box-shadow: none;
}

.is-topic-detail .content > .plaza-feed > .article-card {
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

/* 正文 + 信息栏两列（目标站 center-box：左正文 9 栏 / 右信息 3 栏） */
.crx-detail-cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(160px, 24%, 210px);
  gap: 2rem;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid #efefef;
}

.crx-detail-main,
.crx-detail-side {
  min-width: 0;
}

/* 右侧信息行：对齐目标站 .chrome-info-message */
.crx-info-row {
  margin: 0 0 1.5rem;
  padding: 0;
  border: 0;
}

.crx-info-row:last-child {
  margin-bottom: 0;
}

.crx-info-label {
  margin: 0;
  color: #999;
  font-size: .85rem;
  line-height: 1.5;
}

.crx-info-value {
  margin: 0;
  color: #4c4c4c;
  font-size: .85rem;
  line-height: 1.5;
  word-break: break-all;
}

.crx-info-value a {
  color: #2f4f4f;
}

.crx-info-value a:hover {
  color: #203a3a;
}

@media (max-width: 991px) {
  /* lg 以下信息栏下沉为单列 */
  .crx-detail-cols {
    grid-template-columns: minmax(0, 1fr);
  }

  .is-topic-detail .plaza-feed {
    padding: 24px 20px;
  }
}

.detail-meta {
  margin-top: 12px;
  gap: 10px 14px;
  color: #777;
  font-size: 13px;
  font-weight: 400;
}

.detail-meta a {
  color: #2f4f4f;
  font-weight: 600;
}

/* 软件信息区：图标 + 标题/参数 + 下载按钮（目标站 .chrome-info-top + .chrome-download-btns） */
.article-card .software-detail-panel {
  margin: 0 0 3.5rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.software-detail-main {
  grid-template-columns: 80px minmax(0, 1fr) auto;
  gap: 20px 33px;
}

.software-detail-icon {
  width: 80px;
  height: 80px;
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
}

.software-detail-name {
  margin-bottom: .75rem;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.35;
  color: #4c4c4c;
}

.software-detail-subtitle {
  margin: 0 0 .75rem;
  color: #777;
  font-size: .85rem;
  line-height: 1.6;
}

.software-detail-params {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}

.software-detail-param {
  font-size: .85rem;
  color: #777;
}

/* 992–1199：三栏下中栏变窄，信息区改为「图标 + 标题参数」两列，下载按钮独占一行 */
@media (min-width: 992px) and (max-width: 1199px) {
  .software-detail-main {
    grid-template-columns: 80px minmax(0, 1fr);
    grid-template-areas:
      "icon info"
      "action action";
    gap: 10px 12px;
    align-items: start;
  }

  .software-detail-icon {
    grid-area: icon;
    width: 80px;
    height: 80px;
    border-radius: 14px;
  }

  .software-detail-info {
    grid-area: info;
    width: auto;
    min-width: 0;
  }

  .software-detail-action {
    grid-area: action;
    width: 100%;
    justify-self: start;
    margin-top: 4px;
  }

  .software-detail-name {
    font-size: 1.25rem;
  }
}

.software-detail-param dt {
  color: #999;
}

.software-detail-param dd {
  color: #4c4c4c;
}

/* 下载按钮：对齐目标站 .chrome-download-btns（推荐下载蓝 / 备用下载黄） */
.software-detail-download,
.crx-detail-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  height: auto;
  margin-right: 1.25rem;
  padding: .7rem 1.4rem;
  border: 0;
  border-radius: 4px;
  background: #0d6efd;
  color: #fff !important;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.software-detail-download:hover,
.crx-detail-download:hover {
  background: #0b5ed7;
  color: #fff !important;
}

.crx-detail-alt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: .7rem 1.4rem;
  border-radius: 4px;
  background: #ffc107;
  color: #212529 !important;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.crx-detail-alt:hover {
  background: #ffca2c;
  color: #212529 !important;
}

/* VIP 提示：备用下载后的开通引导 */
.crx-vip-tip {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  color: #999;
  font-size: .8rem;
  line-height: 1.5;
}

.crx-vip-tip a {
  color: #c8102e;
  font-weight: 600;
}

.crx-vip-tip a:hover {
  text-decoration: underline;
}

/* 下载扣费确认弹窗 */
.crx-dlg-mask {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .45);
}

.crx-dlg-mask.on {
  display: flex;
}

.crx-dlg {
  width: min(92vw, 380px);
  padding: 24px 24px 16px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}

.crx-dlg-title {
  margin: 0 0 10px;
  color: #4c4c4c;
  font-size: 1.05rem;
  font-weight: 700;
}

.crx-dlg-msg {
  margin: 0 0 20px;
  color: #777;
  font-size: .9rem;
  line-height: 1.7;
}

/* 支付方式单选 */
.crx-dlg-pay {
  margin: -8px 0 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.crx-dlg-pay-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #e6e6e6;
  border-radius: 6px;
  font-size: .9rem;
  color: #4c4c4c;
  cursor: pointer;
}

.crx-dlg-pay-item:hover {
  border-color: #0d6efd;
}

.crx-dlg-pay-item.is-disabled {
  color: #bbb;
  background: #fafafa;
  cursor: not-allowed;
}

.crx-dlg-pay-item.is-disabled:hover {
  border-color: #e6e6e6;
}

.crx-dlg-pay-item input {
  accent-color: #0d6efd;
}

.crx-dlg-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.crx-dlg-cancel,
.crx-dlg-ok {
  padding: 8px 18px;
  border-radius: 4px;
  font-size: .875rem;
  cursor: pointer;
}

.crx-dlg-cancel {
  border: 1px solid #e0e0e0;
  background: #fff;
  color: #666;
}

.crx-dlg-ok {
  border: 0;
  background: #0d6efd;
  color: #fff;
  font-weight: 600;
}

.crx-dlg-ok:hover {
  background: #0b5ed7;
}

/* 正文排版 */
.detail-body {
  margin-top: 24px;
  font-size: 16px;
  line-height: 2;
  color: #4c4c4c;
}

/* 软件详情：下载入口统一到信息区，正文里的原站按钮不再重复展示 */
.crx-software-detail .crx-source {
  display: none;
}

.detail-body p {
  margin: 0 0 12px;
}

.detail-body a {
  color: #2f4f4f;
  font-weight: 600;
}

.detail-body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 0 4px 2px #efefef;
}

.crx-lead {
  font-size: 15px;
  color: #4c4c4c;
}

.crx-shots {
  display: flex;
  gap: 12px;
  margin: 0 0 3.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  border-radius: 8px;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .16));
  scrollbar-width: none;
}

.crx-shots::-webkit-scrollbar {
  display: none;
}

.crx-shot {
  flex: 0 0 100%;
  display: block;
  overflow: hidden;
  border-radius: 8px;
  background: #f1f3f5;
  scroll-snap-align: start;
}

.crx-shot img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  box-shadow: none;
}

/* 正文内嵌的 JSON 元数据不展示 */
.detail-body .crx-file-meta {
  display: none;
}

/* 短评 / 详情：对齐目标站 .chrome-download-desc */
.detail-body .crx-desc-block {
  margin-bottom: 2.5rem;
}

.detail-body .crx-desc-title {
  margin: 0 0 1rem;
  color: #999;
  font-size: .85rem;
  line-height: 1.5;
}

.detail-body .crx-desc-notes {
  margin: 0;
  color: #4d4d4d;
  font-size: .9rem;
  line-height: 2;
  white-space: pre-wrap;
}

.crx-detail-main .detail-body {
  margin-top: 0;
}

.crx-source-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 18px;
  border-radius: 999px;
  background: #2f4f4f;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
}

.crx-source-link:hover {
  background: #203a3a;
}

/* --------------------------------------------------------------------------
   8. 响应式：按目标站断点 992 / 1200 / 1400 收敛
   -------------------------------------------------------------------------- */
@media (max-width: 1399px) {
  .crx-grid-4 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1199px) {
  .crx-grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  /* 目标站 992-1199 主面板内边距 2rem，左菜单同步收窄 */
  .app {
    --crx-nav: 320px;
  }

  .main-scroll > .crx-home {
    padding: 32px;
  }
}

@media (max-width: 991px) {
  /* 目标站 992 以下隐藏左侧菜单面板，主区域通栏 */
  .sidebar {
    display: none !important;
  }

  /* 移除移动端顶部横向导航栏（首页/话题/问答…），移动端只用顶部抽屉菜单 */
  .bar-nav {
    display: none !important;
  }

  .main-scroll {
    padding: 16px 16px 36px;
  }

  .crx-grid-4 {
    grid-template-columns: minmax(0, 1fr);
  }

  /* 单列时改用 16:9，避免卡片被拉得过高 */
  .crx-card-media {
    aspect-ratio: 16 / 9;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  /* 目标站平板：容器 720，主面板四周 3.5rem */
  .crx-home {
    box-sizing: border-box;
    max-width: 720px;
    margin: 0 auto;
    padding: 56px;
    background: #fff;
    border-radius: 8px;
  }
}

@media (max-width: 767px) {
  /* 目标站移动端：主面板无内边距、轮播通栏，区块左右各留 3.5rem */
  .main-scroll {
    padding: 0 0 36px;
  }

  .crx-home {
    box-sizing: border-box;
    padding: 0;
    background: #fff;
    border-radius: 0;
  }

  .crx-section {
    padding: 0 56px;
  }

  .crx-banner {
    margin-bottom: 32px;
    border-radius: 0;
  }

  .crx-home-note {
    padding: 0 56px;
  }
}

@media (max-width: 900px) {
  .content .article-card {
    padding: 24px 20px;
  }

  .detail-body {
    line-height: 1.85;
  }

  /* 宿主在 ≤900 隐藏软件标题，这里恢复，避免详情页只剩图标 */
  .crx-software-detail .software-detail-name {
    display: block;
  }
}

@media (max-width: 560px) {
  .crx-card-title {
    font-size: 1rem;
    line-height: 1.75rem;
  }

  .content .article-card {
    padding: 20px 16px;
  }

  .crx-shots {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .software-detail-main {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .software-detail-icon {
    width: 64px;
    height: 64px;
  }

  .software-detail-name {
    font-size: 1.375rem;
  }

  .software-detail-param {
    font-size: .75rem;
  }

  .crx-detail-download {
    width: 100%;
  }
}