/* ============================================================
   Atelier · refine.css
   统一精炼层：搜索列表 / 详情 / 弹窗 / 移动端
   载入顺序在 app.css、m.css 之后，统一设计语言
   ============================================================ */

/* ---------- 字体与全局基底 ---------- */
body,
#app,
.common-header .headerBox,
.common-footer,
.footerBox,
.layerBox,
.drawer,
.el-dialog,
.el-input__wrapper,
.el-input__inner,
.el-textarea__inner,
.menu-dialog-wrapper {
    font-family: var(--sf-font-body) !important;
}

h1, h2, h3, h4, h5,
.red-bar-title,
.detail-title,
.search-result-title,
.main-title,
.cat-section-title,
.section-title {
    font-family: var(--sf-font-display) !important;
}

::selection {
    background: var(--sf-accent);
    color: #fff;
}

/* 滚动条 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: var(--sf-ink-4);
    border-radius: 10px;
    border: 3px solid var(--sf-paper);
}
::-webkit-scrollbar-thumb:hover { background: var(--sf-ink-3); }

/* ============================================================
   公共头部 headerBox（列表/详情页保留常规导航条）
   ============================================================ */
.common-header .headerBox {
    background: rgba(243, 239, 231, 0.82) !important;
    backdrop-filter: blur(14px) saturate(1.4);
    -webkit-backdrop-filter: blur(14px) saturate(1.4);
    border-bottom: 1px solid var(--sf-line) !important;
    box-shadow: 0 1px 0 rgba(228, 220, 204, 0.5);
}
.common-header .headerBox .bg { background: transparent !important; }
.common-header .headerBox .box {
    max-width: 1280px !important;
    padding: 0 28px !important;
    height: 64px !important;
}
.common-header .headerBox .box .logoBox .logo img { height: 36px !important; }
.common-header .headerBox .box .logoBox .logo .logo-text,
.common-header .headerBox .box .logoBox .logo .text {
    color: var(--sf-ink) !important;
    font-family: var(--sf-font-display) !important;
    font-weight: 600 !important;
}
.common-header .headerBox .box .navs a,
.common-header .headerBox .box .navs .item {
    color: var(--sf-ink-2) !important;
    font-size: 14px !important;
    border-radius: 8px !important;
    transition: color .2s var(--sf-ease), background .2s var(--sf-ease) !important;
}
.common-header .headerBox .box .navs a:hover,
.common-header .headerBox .box .navs .item:hover {
    color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}

/* 头部搜索框（列表/详情页） */
.common-header .headerBox .box .search {
    background-color: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: 999px !important;
    height: 42px !important;
    max-width: 380px !important;
    margin: 0 16px 0 auto !important;
    transition: border-color .2s var(--sf-ease), box-shadow .2s var(--sf-ease) !important;
}
.common-header .headerBox .box .search::after {
    display: none !important;
}
.common-header .headerBox .box .search:focus-within {
    border-color: var(--sf-accent) !important;
    box-shadow: 0 0 0 4px var(--sf-accent-soft) !important;
}
.common-header .headerBox .box .search input {
    color: var(--sf-ink) !important;
    font-size: 14px !important;
    padding-left: 20px !important;
}
.common-header .headerBox .box .search input::placeholder { color: var(--sf-ink-3) !important; }
.common-header .headerBox .box .search .btn .iconfont {
    color: var(--sf-ink-2) !important;
    font-size: 20px !important;
    transition: color .2s var(--sf-ease) !important;
}
.common-header .headerBox .box .search .btn:hover .iconfont { color: var(--sf-accent) !important; }

/* 背景图遮罩（列表/详情页） */
.headBg { opacity: .18 !important; mix-blend-mode: multiply; }

/* logo 标题 */
.common-header .headerBox .box .logoBox .title {
    font-family: var(--sf-font-display) !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
}

/* 导航栏"返回资源社"按钮 */
.nav-back-community {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 14px;
    font-size: 13px;
    font-weight: 500;
    font-family: var(--sf-font-body);
    color: var(--sf-card) !important;
    background: var(--sf-accent);
    border-radius: 999px;
    text-decoration: none !important;
    white-space: nowrap;
    margin-left: 6px;
    pointer-events: auto !important;
    box-shadow: 0 2px 6px -1px rgba(154, 52, 18, 0.25);
    transition: transform .2s var(--sf-ease), background .2s var(--sf-ease);
    flex-shrink: 0;
}
.nav-back-community:hover {
    background: var(--sf-accent-deep);
    transform: translateY(-1px);
}
.nav-back-community svg { opacity: .85; }
.nav-back-community svg:last-child { opacity: .7; transition: transform .2s var(--sf-ease); }
.nav-back-community:hover svg:last-child { transform: translateX(2px); }

/* 导航栏"分类"链接 */
.nav-category-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 500;
    font-family: var(--sf-font-body);
    color: var(--sf-ink-2) !important;
    background: var(--sf-accent-softer);
    border: 1px solid var(--sf-accent-soft);
    border-radius: 999px;
    text-decoration: none !important;
    white-space: nowrap;
    margin-left: 6px;
    pointer-events: auto !important;
    flex-shrink: 0;
    transition: all .2s var(--sf-ease);
}
.nav-category-link:hover {
    color: var(--sf-accent) !important;
    background: var(--sf-card);
    border-color: var(--sf-accent);
    transform: translateY(-1px);
}

/* 导航栏"提交需求"按钮 */
.nav-demand-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 500;
    font-family: var(--sf-font-body);
    color: var(--sf-ink-2) !important;
    background: var(--sf-accent-softer);
    border: 1px solid var(--sf-accent-soft);
    border-radius: 999px;
    white-space: nowrap;
    margin-left: 6px;
    cursor: pointer;
    pointer-events: auto !important;
    flex-shrink: 0;
    transition: all .2s var(--sf-ease);
}
.nav-demand-btn:hover {
    color: var(--sf-accent) !important;
    background: var(--sf-card);
    border-color: var(--sf-accent);
    transform: translateY(-1px);
}

/* ============================================================
   分类页面
   ============================================================ */
.category-page {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
    padding: 90px 28px 60px;
    box-sizing: border-box;
    overflow-x: hidden;
}
.category-page-header { text-align: center; margin-bottom: 36px; }
.category-page-title {
    font-family: var(--sf-font-display);
    font-size: 32px;
    font-weight: 700;
    color: var(--sf-ink);
    margin: 0 0 8px;
    letter-spacing: -0.02em;
}
.category-page-desc {
    font-size: 14px;
    color: var(--sf-ink-3);
    margin: 0;
}

/* 快速导航 */
.category-quick-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-bottom: 40px;
}
.category-quick-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    background: var(--sf-card);
    border: 1px solid var(--sf-line);
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 500;
    color: var(--sf-ink-2);
    transition: all .2s var(--sf-ease);
}
.category-quick-item:hover {
    border-color: var(--sf-accent);
    color: var(--sf-accent);
    transform: translateY(-2px);
    box-shadow: var(--sf-shadow-sm);
}
.category-quick-icon { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; }
.category-quick-text {
    width: 22px; height: 22px;
    border-radius: 6px;
    background: var(--sf-accent);
    color: var(--sf-card);
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 分类区块 */
.category-sections {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}
.category-section {
    background: var(--sf-card);
    border: 1px solid var(--sf-line);
    border-radius: var(--sf-radius);
    padding: 24px 26px;
    box-shadow: var(--sf-shadow-sm);
    scroll-margin-top: 80px;
    min-width: 0;
    overflow: hidden;
}
.category-section-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 8px;
}
.category-section-title {
    font-family: var(--sf-font-display);
    font-size: 20px;
    font-weight: 600;
    color: var(--sf-ink);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.category-section-img { width: 30px; height: 30px; border-radius: 8px; object-fit: cover; }
.category-section-badge {
    width: 30px; height: 30px;
    border-radius: 8px;
    background: var(--sf-accent);
    color: var(--sf-card);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.category-section-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 500;
    color: var(--sf-accent);
    text-decoration: none;
    transition: gap .2s var(--sf-ease);
}
.category-section-more:hover { gap: 8px; }
.category-section-list { list-style: none; margin: 0; padding: 0; }
.category-item-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 4px;
    font-size: 14px;
    color: var(--sf-ink-2);
    border-bottom: 1px dashed var(--sf-line-2);
    text-decoration: none;
    transition: color .15s var(--sf-ease), padding-left .15s var(--sf-ease);
}
.category-item-link:hover { color: var(--sf-accent); padding-left: 8px; }
.category-item-pan { flex: none; font-size: 11px; color: var(--sf-ink-3); min-width: 60px; }
.category-item-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.category-item-date {
    flex: none; font-size: 11px;
    color: var(--sf-ink-3);
    background: var(--sf-accent-softer);
    padding: 2px 8px;
    border-radius: 5px;
}
.category-section-empty, .category-empty {
    text-align: center;
    color: var(--sf-ink-3);
    font-size: 13px;
    padding: 20px 0;
}

/* ============================================================
   红条标题 red-bar-title
   ============================================================ */
.red-bar-title {
    position: relative;
    padding-left: 14px !important;
    color: var(--sf-ink) !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    letter-spacing: -0.01em;
    margin-bottom: 18px !important;
}
.red-bar-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 18px;
    background: var(--sf-accent) !important;
    border-radius: 2px;
}

/* ============================================================
   搜索列表页 listBox / left 容器
   ============================================================ */
.listBox {
    max-width: 1100px !important;
    margin: 24px auto !important;
    padding: 0 28px !important;
}
.listBox .left {
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius) !important;
    box-shadow: var(--sf-shadow-sm) !important;
    padding: 22px 24px !important;
}
/* 全网搜结果区不需要额外 padding（已在 .left 上加过） */
.listBox .left .search-results-section,
.listBox .left .local-section {
    padding: 0 !important;
}

/* ---------- 搜索结果区 search-results-section ---------- */
.search-results-section {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}
.search-results-section.is-loading,
.search-results-section:has(.loading-minimal) { min-height: 280px !important; }

/* 段落标题 section-header-compact */
.section-header-compact { margin-bottom: 16px !important; }
.section-header-compact h3 {
    font-family: var(--sf-font-display) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
    margin: 0 0 12px 0 !important;
    padding: 6px 0 6px 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    letter-spacing: -0.01em;
}
.section-header-compact h3::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    bottom: auto !important;
    width: 4px !important;
    height: 22px !important;
    border-radius: 2px !important;
    background: var(--sf-accent) !important;
    transform: translateY(-50%) !important;
}
.section-header-compact h3::after { display: none !important; }
.section-header-compact h3 .keyword-highlight {
    color: var(--sf-accent) !important;
    font-weight: 700 !important;
    background: var(--sf-accent-softer) !important;
    padding: 1px 7px !important;
    border-radius: 6px !important;
}
.section-header-compact h3 .search-status {
    font-family: var(--sf-font-body) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--sf-ink-3) !important;
}

/* 关键词高亮（标题内） */
.keyword-highlight {
    color: var(--sf-accent) !important;
    font-weight: 700 !important;
    background: var(--sf-accent-softer) !important;
    padding: 0 3px !important;
    border-radius: 3px !important;
}

/* ---------- 网盘筛选条 pan-filter-minimal（下划线风格 → 胶囊风格） ---------- */
.pan-filter-minimal {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 10px !important;
    margin-bottom: 16px !important;
    border: 1px solid var(--sf-line) !important;
    border-bottom: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    background: var(--sf-card-2) !important;
}
.pan-filter-minimal a {
    padding: 7px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--sf-ink-2) !important;
    border: 1px solid var(--sf-line) !important;
    border-bottom: 1px solid var(--sf-line) !important;
    border-radius: 999px !important;
    background: var(--sf-card) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    margin-bottom: 0 !important;
    transition: all .2s var(--sf-ease) !important;
}
.pan-filter-minimal a:hover {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
.pan-filter-minimal a.active {
    color: var(--sf-card) !important;
    background: var(--sf-ink) !important;
    border-color: var(--sf-ink) !important;
    font-weight: 600 !important;
}

/* 网盘下拉选择 pan-select */
.pan-select-menu {
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    background: var(--sf-card) !important;
    box-shadow: var(--sf-shadow-lg) !important;
    padding: 6px !important;
}
.pan-select-item {
    color: var(--sf-ink-2) !important;
    border-radius: 7px !important;
    transition: all .15s var(--sf-ease) !important;
}
.pan-select-item:hover { background: var(--sf-accent-softer) !important; color: var(--sf-accent) !important; }
.pan-select-item.active {
    color: var(--sf-accent) !important;
    background: var(--sf-accent-soft) !important;
    font-weight: 600 !important;
}

/* ---------- 网搜结果卡片 resource-result-card ---------- */
.resource-result-list { padding: 0 !important; }
.resource-result-card {
    display: block !important;
    margin-bottom: 10px !important;
    padding: 0 !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    background: var(--sf-card) !important;
    overflow: hidden !important;
    box-shadow: var(--sf-shadow-sm) !important;
    transition: transform .25s var(--sf-ease), box-shadow .25s var(--sf-ease), border-color .25s var(--sf-ease) !important;
}
.resource-result-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: var(--sf-shadow) !important;
    border-color: var(--sf-ink-4) !important;
}
.resource-card-main {
    padding: 14px 16px 10px !important;
    gap: 14px !important;
}
.resource-card-content { flex: 1; min-width: 0; }
.resource-card-header { padding: 0 !important; border: none !important; }

/* 卡片标题（红条样式） */
.resource-title,
.list .item .resource-title,
.listBox .left .list .item .resource-title {
    font-family: var(--sf-font-body) !important;
    color: var(--sf-ink) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    padding: 0 0 0 13px !important;
    transition: color .2s var(--sf-ease) !important;
}
.resource-result-card:hover .resource-title { color: var(--sf-accent) !important; }
.resource-title::before {
    background: var(--sf-accent) !important;
    width: 3px !important;
    border-radius: 2px !important;
}
.resource-title .keyword-highlight,
.resource-title span[style],
.resource-title p span {
    color: var(--sf-accent) !important;
    font-weight: 700 !important;
}
.resource-state {
    color: var(--sf-accent) !important;
    background: var(--sf-accent-soft) !important;
}

/* 卡片底部 */
.resource-card-footer {
    padding: 9px 16px !important;
    border-top: 1px solid var(--sf-line-2) !important;
    gap: 12px !important;
}
.resource-pan-meta { gap: 7px !important; }
.resource-pan-icon { width: 22px !important; height: 22px !important; border-radius: 5px; }
.result-actions { gap: 8px !important; }
.resource-card-footer .result-actions button,
.resource-result-card .result-actions button {
    height: 32px !important;
    padding: 0 16px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 30px !important;
    transition: all .2s var(--sf-ease) !important;
}
.resource-tree-btn {
    color: var(--sf-ink-2) !important;
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
}
.resource-tree-btn:hover {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
.resource-get-btn {
    color: var(--sf-card) !important;
    background: var(--sf-ink) !important;
    border: 1px solid var(--sf-ink) !important;
}
.resource-get-btn:hover {
    background: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--sf-shadow) !important;
}

/* 目录树面板 */
.resource-tree-panel {
    margin: 0 !important;
    padding: 12px 16px 14px !important;
    border-top: 1px dashed var(--sf-line) !important;
    background: var(--sf-card-2) !important;
}
.resource-tree-header {
    font-family: var(--sf-font-display) !important;
    color: var(--sf-ink) !important;
}
.resource-tree-loading,
.resource-tree-error,
.resource-tree-empty,
.resource-tree-tip {
    color: var(--sf-ink-3) !important;
    font-size: 13px !important;
}
.resource-tree-error button {
    color: var(--sf-accent) !important;
    border: 1px solid var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
    border-radius: 6px !important;
    padding: 2px 10px !important;
}

/* ============================================================
   资源卡片 resource-result-card（列表页，带图）
   ============================================================ */
.resource-result-card,
.result-card,
.resource-card {
    display: flex !important;
    gap: 18px !important;
    padding: 18px !important;
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius) !important;
    box-shadow: var(--sf-shadow-sm) !important;
    margin-bottom: 14px !important;
    transition: transform .25s var(--sf-ease), box-shadow .25s var(--sf-ease), border-color .25s var(--sf-ease) !important;
}
.resource-result-card:hover,
.result-card:hover,
.resource-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--sf-shadow-lg) !important;
    border-color: var(--sf-ink-4) !important;
}

/* 卡片缩略图 */
.resource-result-card .card-img,
.resource-result-card .result-img,
.resource-result-card img.cover,
.result-card .card-img,
.result-card img {
    width: 160px !important;
    height: 120px !important;
    object-fit: cover !important;
    border-radius: var(--sf-radius-sm) !important;
    flex: none !important;
    transition: transform .4s var(--sf-ease) !important;
}
.resource-result-card:hover .card-img,
.resource-result-card:hover .result-img,
.resource-result-card:hover img.cover {
    transform: scale(1.04) !important;
}

/* 卡片正文 */
.resource-result-card .card-content,
.resource-result-card .result-content,
.result-card .card-content {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}
.resource-result-card .card-title,
.resource-result-card .result-title,
.result-card .card-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    transition: color .2s var(--sf-ease) !important;
}
.resource-result-card:hover .card-title,
.resource-result-card:hover .result-title {
    color: var(--sf-accent) !important;
}
.resource-result-card .card-desc,
.resource-result-card .result-desc,
.result-card .card-desc {
    font-size: 13px !important;
    color: var(--sf-ink-2) !important;
    line-height: 1.6 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin: 0 !important;
}
.resource-result-card .card-meta,
.resource-result-card .result-meta,
.result-card .card-meta {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: auto !important;
    flex-wrap: wrap !important;
}
.resource-result-card .pan-badge,
.resource-result-card .pan-tag,
.result-card .pan-badge {
    font-size: 12px !important;
    padding: 3px 10px !important;
    border-radius: 6px !important;
    background: var(--sf-accent-soft) !important;
    color: var(--sf-accent) !important;
    font-weight: 500 !important;
}
.resource-result-card .card-date,
.resource-result-card .result-date,
.result-card .card-date {
    font-size: 12px !important;
    color: var(--sf-ink-3) !important;
    font-variant-numeric: tabular-nums !important;
}

/* ---------- 纯文本结果项 ---------- */
.search-results-list .result-item,
.results-list .result-item,
.text-result-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 18px !important;
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    margin-bottom: 10px !important;
    transition: transform .2s var(--sf-ease), box-shadow .2s var(--sf-ease) !important;
}
.search-results-list .result-item:hover,
.results-list .result-item:hover,
.text-result-item:hover {
    transform: translateX(3px) !important;
    box-shadow: var(--sf-shadow) !important;
    border-color: var(--sf-ink-4) !important;
}

/* ============================================================
   加载状态 loading-minimal / loader-minimal
   ============================================================ */
.loading-minimal,
.loader-minimal,
.loading,
.loader {
    text-align: center !important;
    padding: 40px 20px !important;
    color: var(--sf-ink-3) !important;
    font-size: 14px !important;
}
.loader-minimal::before {
    content: "";
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    margin-right: 10px !important;
    border: 2.5px solid var(--sf-line) !important;
    border-top-color: var(--sf-accent) !important;
    border-radius: 50% !important;
    animation: sf-spin .8s linear infinite !important;
    vertical-align: middle !important;
}
@keyframes sf-spin { to { transform: rotate(360deg); } }

/* ============================================================
   缓存徽标 cache-badge
   ============================================================ */
.cache-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11px !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    background: var(--sf-accent-softer) !important;
    color: var(--sf-accent) !important;
    border: 1px solid rgba(154, 52, 18, 0.15) !important;
    font-weight: 500 !important;
}

/* ============================================================
   分页 pagination
   ============================================================ */
.pagination,
.pager,
.el-pagination {
    margin: 28px 0 !important;
    display: flex !important;
    justify-content: center !important;
    gap: 6px !important;
}
.pagination a,
.pagination span,
.pager a,
.pager span,
.el-pagination .btn-prev,
.el-pagination .btn-next,
.el-pagination .el-pager li {
    min-width: 36px !important;
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 10px !important;
    border-radius: 9px !important;
    border: 1px solid var(--sf-line) !important;
    background: var(--sf-card) !important;
    color: var(--sf-ink-2) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: all .2s var(--sf-ease) !important;
}
.pagination a:hover,
.pager a:hover,
.el-pagination .el-pager li:hover {
    border-color: var(--sf-accent) !important;
    color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
.pagination .active,
.pagination .current,
.pager .active,
.el-pagination .el-pager li.active,
.el-pagination .el-pager li.is-active {
    background: var(--sf-ink) !important;
    color: var(--sf-card) !important;
    border-color: var(--sf-ink) !important;
}

/* ============================================================
   详情页 listBox.detailBox / .details
   ============================================================ */
.listBox.detailBox {
    max-width: 900px !important;
    margin: 28px auto !important;
    padding: 0 28px !important;
}
/* 详情页 .left 不做卡片，避免卡片套卡片的嵌套 */
.listBox.detailBox .left {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
/* h3 标题增加左内边距，避免贴边 */
.listBox.detailBox .left > h3 {
    font-family: var(--sf-font-display) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
    padding: 24px 4px 6px !important;
    margin: 0 0 14px !important;
    border-bottom: 1px solid var(--sf-line) !important;
    letter-spacing: -0.01em;
}
.listBox.detailBox .left > h3.samelistNav {
    margin-top: 36px !important;
}

/* 详情容器 */
.list .box.details, .listBox .details {
    padding: 28px 32px !important;
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius) !important;
    box-shadow: var(--sf-shadow-sm) !important;
}
.listBox .details.samelistBox { box-shadow: var(--sf-shadow-sm) !important; }

/* 封面图 */
.details .pic {
    width: 150px !important;
    height: 200px !important;
    border-radius: var(--sf-radius-sm) !important;
    background-color: var(--sf-card-2) !important;
    margin: 0 auto 26px !important;
    box-shadow: var(--sf-shadow) !important;
    overflow: hidden;
}
.details .pic img { border-radius: var(--sf-radius-sm) !important; }

/* 详情标题 */
.details .title {
    font-family: var(--sf-font-display) !important;
    text-align: center !important;
    font-size: clamp(20px, 3vw, 26px) !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
    margin-bottom: 24px !important;
    line-height: 1.35 !important;
    letter-spacing: -0.015em !important;
}

/* 详情字段行 */
.details .cat {
    display: flex !important;
    font-size: 14px !important;
    padding: 9px 0 !important;
    border-bottom: 1px dashed var(--sf-line-2) !important;
}
.details .cat:last-of-type { border-bottom: none !important; }
.details .cat .l {
    flex: none !important;
    width: 84px !important;
    color: var(--sf-ink-3) !important;
    opacity: 1 !important;
    font-size: 13px !important;
}
.details .cat .r {
    flex: 1 !important;
    width: auto !important;
    color: var(--sf-ink) !important;
    opacity: 1 !important;
    word-break: break-all !important;
}
.details .cat .r a {
    color: var(--sf-accent) !important;
    transition: opacity .2s var(--sf-ease) !important;
}
.details .cat .r a:hover { opacity: .75 !important; }
.details .cat .r .icon { width: 20px !important; height: 20px !important; }
.details .cat .r[style*="FF3F3D"],
.details .cat .r[style*="#FF3F3D"],
.details .cat .r[style*="ff3f3d"] { color: var(--sf-accent) !important; }

/* 详情操作按钮 */
.details .btns {
    display: flex !important;
    gap: 14px !important;
    margin-top: 28px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}
.details .btns .btn {
    position: relative !important;
    width: auto !important;
    min-width: 140px !important;
    height: 42px !important;
    line-height: 42px !important;
    border-radius: 11px !important;
    background-color: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--sf-ink-2) !important;
    text-align: center !important;
    opacity: 1 !important;
    cursor: pointer !important;
    transition: all .2s var(--sf-ease) !important;
}
.details .btns .btn::after { display: none !important; }
.details .btns .btn .iconfont { font-size: 17px !important; margin-right: 5px; }
.details .btns .btn:hover {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
    transform: translateY(-2px) !important;
    box-shadow: var(--sf-shadow) !important;
}
.details .btns .btn.btnCol {
    background-color: var(--sf-ink) !important;
    color: var(--sf-card) !important;
    border-color: var(--sf-ink) !important;
}
.details .btns .btn.btnCol:hover {
    background-color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    color: var(--sf-card) !important;
}

/* 相关资源 samelist */
.samelist { gap: 0 !important; }
.samelist .item { width: 100% !important; }
.samelist .item p {
    padding: 9px 12px !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    margin-bottom: 8px !important;
    color: var(--sf-ink-2) !important;
    font-size: 13.5px !important;
    background: var(--sf-card) !important;
    transition: all .2s var(--sf-ease) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}
.samelist .item:hover p {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
    transform: translateX(3px) !important;
}
.samelist .item p span {
    color: var(--sf-ink-3) !important;
    margin-right: 8px !important;
    font-variant-numeric: tabular-nums !important;
}
.samelist .item:nth-child(1) p span { color: #b91c1c !important; }
.samelist .item:nth-child(2) p span { color: var(--sf-accent-2) !important; }
.samelist .item:nth-child(3) p span { color: var(--sf-accent) !important; }

/* 列表页常规卡片 .Ebox（非全网搜结果） */
.listBox .left .Ebox {
    border-radius: var(--sf-radius) !important;
    background-color: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
    box-shadow: var(--sf-shadow-sm) !important;
    padding: 18px !important;
    margin-bottom: 14px !important;
}
.listBox .left .Ebox .list .item.has-image .item-content .title {
    color: var(--sf-ink) !important;
    font-family: var(--sf-font-body) !important;
}
.listBox .left .Ebox .list .item.has-image:hover .item-content .title {
    color: var(--sf-accent) !important;
}
.listBox .left .Ebox .list .item .item-image {
    background-color: var(--sf-card-2) !important;
    border-radius: var(--sf-radius-sm) !important;
}
.listBox .left .Ebox .list .item .result-actions button,
.listBox .left .Ebox .list .item .resource-tree-btn,
.listBox .left .Ebox .list .item .resource-get-btn {
    border-radius: 8px !important;
    transition: all .2s var(--sf-ease) !important;
}
.listBox .left .Ebox .list .item .resource-tree-btn {
    color: var(--sf-ink-2) !important;
    background: var(--sf-card) !important;
    border: 1px solid var(--sf-line) !important;
}
.listBox .left .Ebox .list .item .resource-get-btn {
    color: var(--sf-card) !important;
    background: var(--sf-ink) !important;
    border: 1px solid var(--sf-ink) !important;
}
.listBox .left .Ebox .list .item .resource-get-btn:hover {
    background: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
}

/* ============================================================
   弹窗 dialog / drawer（Element Plus）
   ============================================================ */
.el-dialog,
.el-drawer {
    border-radius: var(--sf-radius) !important;
    overflow: hidden !important;
    box-shadow: var(--sf-shadow-lg) !important;
}
.el-dialog__header {
    background: var(--sf-card-2) !important;
    border-bottom: 1px solid var(--sf-line) !important;
    padding: 16px 20px !important;
    margin: 0 !important;
}
.el-dialog__title {
    font-family: var(--sf-font-display) !important;
    font-weight: 600 !important;
    color: var(--sf-ink) !important;
}
.el-dialog__body { padding: 20px !important; color: var(--sf-ink-2) !important; }
.el-dialog__footer {
    border-top: 1px solid var(--sf-line) !important;
    padding: 14px 20px !important;
}

/* 输入框 */
.el-input__wrapper,
.el-textarea__inner {
    border-radius: var(--sf-radius-sm) !important;
    box-shadow: 0 0 0 1px var(--sf-line) inset !important;
    background: var(--sf-card) !important;
    transition: box-shadow .2s var(--sf-ease) !important;
}
.el-input__wrapper:hover,
.el-textarea__inner:hover { box-shadow: 0 0 0 1px var(--sf-ink-4) inset !important; }
.el-input__wrapper.is-focus,
.el-textarea__inner:focus {
    box-shadow: 0 0 0 1px var(--sf-accent) inset, 0 0 0 4px var(--sf-accent-soft) !important;
}
.el-input__inner { color: var(--sf-ink) !important; }
.el-input__inner::placeholder { color: var(--sf-ink-3) !important; }

/* 按钮 */
.el-button {
    border-radius: 10px !important;
    font-weight: 500 !important;
    transition: all .2s var(--sf-ease) !important;
}
.el-button--primary {
    background: var(--sf-ink) !important;
    border-color: var(--sf-ink) !important;
}
.el-button--primary:hover {
    background: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    transform: translateY(-1px) !important;
}
.el-button--default {
    background: var(--sf-card) !important;
    border-color: var(--sf-line) !important;
    color: var(--sf-ink-2) !important;
}
.el-button--default:hover {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}

/* ============================================================
   资源展示弹窗 dialogUrlBox（点击「获取资源」后）
   ============================================================ */
.dialogUrlBox .el-dialog {
    border-radius: var(--sf-radius) !important;
    overflow: hidden !important;
    box-shadow: var(--sf-shadow-lg) !important;
    background: var(--sf-card) !important;
}
.dialogUrlBox .el-dialog__header { display: none !important; }
.dialogUrlBox .el-dialog__body { padding: 0 !important; }
.dialogUrlBox .resource-dialog-card { background: var(--sf-card) !important; }
.dialogUrlBox .resource-dialog-info { padding: 22px 24px !important; }
.dialogUrlBox .resource-dialog-title.red-bar-title {
    font-size: 20px !important;
    padding-left: 14px !important;
    margin-bottom: 16px !important;
}

/* 链接卡片 */
.dialogUrlBox .resource-dialog-link-card {
    padding: 16px !important;
    background: var(--sf-card-2) !important;
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
}
.dialogUrlBox .resource-dialog-pan-name {
    color: var(--sf-ink) !important;
    font-weight: 600 !important;
}
.dialogUrlBox .resource-dialog-url {
    color: var(--sf-accent) !important;
    transition: opacity .2s var(--sf-ease) !important;
}
.dialogUrlBox .resource-dialog-url:hover { opacity: .75 !important; }
.dialogUrlBox .resource-dialog-actions { gap: 10px !important; }
.dialogUrlBox .resource-dialog-btn {
    height: 38px !important;
    padding: 0 18px !important;
    border-radius: 10px !important;
    font-size: 13.5px !important;
    transition: all .2s var(--sf-ease) !important;
}
.dialogUrlBox .resource-dialog-btn.btn-copy {
    border: 1px solid var(--sf-line) !important;
    background: var(--sf-card) !important;
    color: var(--sf-ink-2) !important;
}
.dialogUrlBox .resource-dialog-btn.btn-copy:hover {
    border-color: var(--sf-accent) !important;
    color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
.dialogUrlBox .resource-dialog-btn.btn-open {
    border: 1px solid var(--sf-ink) !important;
    background: var(--sf-ink) !important;
    color: var(--sf-card) !important;
}
.dialogUrlBox .resource-dialog-btn.btn-open:hover {
    background: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    transform: translateY(-1px) !important;
}

.dialogUrlBox .resource-dialog-loading {
    padding: 28px 0 8px;
    text-align: center;
}
.dialogUrlBox .resource-dialog-loading-text {
    color: var(--sf-ink-2);
    font-size: 15px;
}

/* 错误 / 二维码 / 目录 */
.dialogUrlBox .resource-dialog-error {
    border: 1px solid rgba(185, 28, 28, .18) !important;
    background: rgba(185, 28, 28, .04) !important;
    border-radius: var(--sf-radius-sm) !important;
}
.dialogUrlBox .resource-dialog-error-title { color: #b91c1c !important; }
.dialogUrlBox .resource-dialog-error-text { color: var(--sf-ink-2) !important; }
.dialogUrlBox .resource-dialog-qr,
.dialogUrlBox .pan-tree-box {
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    background: var(--sf-card-2) !important;
}
.dialogUrlBox .resource-dialog-qr-text { color: var(--sf-ink-2) !important; }
.dialogUrlBox .resource-dialog-tree-toggle {
    border: 1px solid var(--sf-line) !important;
    border-radius: var(--sf-radius-sm) !important;
    background: var(--sf-card) !important;
    color: var(--sf-ink) !important;
    transition: all .2s var(--sf-ease) !important;
}
.dialogUrlBox .resource-dialog-tree-toggle:hover {
    border-color: var(--sf-accent) !important;
    color: var(--sf-accent) !important;
}
.dialogUrlBox .resource-dialog-tree-toggle em { color: var(--sf-ink-3) !important; }
.dialogUrlBox .qrcode { border-color: var(--sf-line) !important; }

/* 声明 */
.dialogUrlBox .statement .content { color: var(--sf-ink-3) !important; }
.dialogUrlBox .statement .content p { line-height: 1.7 !important; }

/* 密码弹窗 */
.password-dialog-wrapper .el-dialog__header { background: var(--sf-card-2) !important; }
.password-dialog-wrapper .el-dialog__title {
    font-family: var(--sf-font-display) !important;
    color: var(--sf-ink) !important;
}
.password-dialog-wrapper .password-tips { color: var(--sf-ink-2) !important; }
.password-dialog-wrapper .password-error { color: #b91c1c !important; }

/* 提交需求弹窗 layerBox */
.layerBox .vname {
    font-family: var(--sf-font-display) !important;
    color: var(--sf-ink) !important;
    font-weight: 600 !important;
}
.layerBox .vbtn {
    background: var(--sf-ink) !important;
    color: var(--sf-card) !important;
    border-radius: 10px !important;
    transition: all .2s var(--sf-ease) !important;
}
.layerBox .vbtn:hover {
    background: var(--sf-accent) !important;
    transform: translateY(-1px) !important;
}

/* ============================================================
   菜单抽屉 / 移动端导航
   ============================================================ */
.menu-dialog-wrapper,
.drawer-menu,
.layerBox {
    background: var(--sf-paper) !important;
}
.menu-dialog-wrapper .menu-item,
.drawer-menu .menu-item {
    padding: 14px 20px !important;
    border-bottom: 1px solid var(--sf-line) !important;
    color: var(--sf-ink-2) !important;
    font-size: 15px !important;
    transition: all .2s var(--sf-ease) !important;
}
.menu-dialog-wrapper .menu-item:hover,
.drawer-menu .menu-item:hover {
    background: var(--sf-accent-softer) !important;
    color: var(--sf-accent) !important;
    padding-left: 26px !important;
}

/* ============================================================
   iOS 公告条 ios-announcement
   ============================================================ */
.ios-announcement,
.announcement-bar,
.notice-bar {
    background: var(--sf-card-2) !important;
    border: 1px solid var(--sf-line) !important;
    border-left: 3px solid var(--sf-accent) !important;
    border-radius: var(--sf-radius-sm) !important;
    color: var(--sf-ink-2) !important;
    font-size: 13px !important;
}
.ios-announcement .close,
.announcement-bar .close { color: var(--sf-ink-3) !important; }

/* ============================================================
   公共页脚 common-footer
   ============================================================ */
.common-footer {
    background: var(--sf-paper) !important;
    border-top: 1px solid var(--sf-line) !important;
    margin-top: 50px !important;
    padding: 32px 28px !important;
}
.common-footer .footerBox .box {
    color: var(--sf-ink-3) !important;
    font-size: 13px !important;
    line-height: 1.8 !important;
}
.common-footer .footerBox .box a {
    color: var(--sf-ink-2) !important;
    transition: color .2s var(--sf-ease) !important;
}
.common-footer .footerBox .box a:hover { color: var(--sf-accent) !important; }

/* 返回顶部 global-backtop */
.global-backtop {
    background: var(--sf-ink) !important;
    color: var(--sf-card) !important;
    border-radius: 50% !important;
    box-shadow: var(--sf-shadow) !important;
    transition: all .2s var(--sf-ease) !important;
}
.global-backtop:hover {
    background: var(--sf-accent) !important;
    transform: translateY(-3px) !important;
}

/* ============================================================
   移动端统一优化
   ============================================================ */
@media screen and (max-width: 768px) {
    /* 导航栏背景与搜索栏统一为暖纸色，形成一体化顶部 */
    .headerBox,
    .common-header .headerBox {
        background: rgba(243, 239, 231, 0.95) !important;
        backdrop-filter: blur(12px) saturate(1.4) !important;
        -webkit-backdrop-filter: blur(12px) saturate(1.4) !important;
    }
    .headerBox .bg,
    .common-header .headerBox .bg {
        background: transparent !important;
        box-shadow: none !important;
    }
    .headerBox .box,
    .common-header .headerBox .box { padding: 0 16px !important; height: 56px !important; }

    /* 移动端导航栏"返回资源社"按钮：更小 */
    .nav-back-community {
        padding: 4px 10px;
        font-size: 11px;
        gap: 3px;
        margin-left: 4px;
    }
    .nav-back-community svg:first-child { display: none; }
    .nav-back-community span { font-size: 11px; }

    /* 移动端导航栏"分类"链接 */
    .nav-category-link {
        padding: 4px 10px;
        font-size: 11px;
        gap: 3px;
        margin-left: 4px;
    }
    .nav-category-link svg { width: 12px; height: 12px; }

    /* 移动端导航栏"提交需求"按钮 */
    .nav-demand-btn {
        padding: 4px 10px;
        font-size: 11px;
        gap: 3px;
        margin-left: 4px;
    }
    .nav-demand-btn svg { width: 12px; height: 12px; }

    /* 移动端隐藏汉堡菜单图标 */
    .headerBox .box .navs .iconfont.header-menu-btn {
        display: none !important;
    }

    /* 移动端分类页面 */
    .category-page { padding: 74px 16px 40px; }
    .category-page-title { font-size: 24px; }
    .category-page-desc { font-size: 13px; }
    .category-quick-nav { gap: 8px; margin-bottom: 28px; }
    .category-quick-item { padding: 6px 12px; font-size: 12px; }
    .category-sections { grid-template-columns: 1fr; gap: 14px; }
    .category-section { padding: 18px 16px; }
    .category-section-title { font-size: 17px; }
    .category-section-more { font-size: 12px; }
    .category-item-link { font-size: 13px; padding: 8px 2px; }
    .category-item-pan { font-size: 10px; min-width: 50px; }
    .category-item-date { font-size: 10px; padding: 2px 6px; }

    /* 列表/详情页固定搜索条：紧贴导航栏下方，背景统一 */
    .searchList,
    .searchDetail {
        background-color: rgba(243, 239, 231, 0.95) !important;
        backdrop-filter: blur(12px) saturate(1.4) !important;
        -webkit-backdrop-filter: blur(12px) saturate(1.4) !important;
        padding: 0 16px 12px !important;
        border-bottom: 1px solid var(--sf-line) !important;
    }
    .searchList .search,
    .searchDetail .search {
        background-color: var(--sf-card) !important;
        border: 1px solid var(--sf-line) !important;
        border-radius: 999px !important;
        box-shadow: var(--sf-shadow-sm) !important;
        height: 44px !important;
        margin-top: 10px !important;
    }
    .searchList .search input,
    .searchDetail .search input {
        font-size: 15px !important;
        padding-left: 20px !important;
        color: var(--sf-ink) !important;
    }
    .searchList .search .btn .iconfont,
    .searchDetail .search .btn .iconfont {
        color: var(--sf-ink-2) !important;
    }

    .search-results-section,
    .detail-page,
    .detail-container,
    .detail-box {
        padding: 0 16px !important;
        margin: 18px auto !important;
    }

    .listBox,
    .listBox.detailBox {
        padding: 0 16px !important;
        margin: 16px auto !important;
    }
    .listBox .left {
        border-radius: var(--sf-radius) !important;
        padding: 16px 16px !important;
    }
    /* 详情页 .left 移动端也保持透明，不做卡片 */
    .listBox.detailBox .left {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
    /* 移动端恢复显示"详情"标题（m.css 原来用 display:none 隐藏了，现已在 m.css 中直接修复） */
    .listBox.detailBox h3:not(.samelistNav) {
        display: block !important;
        position: relative;
        padding: 130px 4px 6px !important;
        margin: 0 0 14px !important;
        font-size: 4.2vw !important;
        font-weight: 600 !important;
        text-align: left !important;
        color: var(--sf-ink) !important;
        border-bottom: 1px solid var(--sf-line) !important;
    }
    /* "相关资源"标题不需要顶部大间距 */
    .listBox.detailBox h3.samelistNav {
        padding: 24px 4px 6px !important;
        margin-top: 36px !important;
    }
    /* 详情容器：因为 h3 标题现在显示了（有 20.4vw padding-top 给搜索框留空间），
       所以 .details 不需要 margin-top: 20vw 了 */
    .listBox.detailBox .details {
        margin-top: 0 !important;
    }
    .listBox .details { padding: 20px 18px !important; }
    .details .pic { width: 120px !important; height: 160px !important; margin-bottom: 18px !important; }
    .details .btns .btn { min-width: 120px !important; height: 40px !important; line-height: 40px !important; }

    .resource-result-card,
    .result-card,
    .resource-card {
        flex-direction: column !important;
        gap: 12px !important;
        padding: 14px !important;
    }
    .resource-result-card .card-img,
    .resource-result-card .result-img,
    .resource-result-card img.cover,
    .result-card .card-img,
    .result-card img {
        width: 100% !important;
        height: 180px !important;
    }

    .detail-content,
    .detail-desc,
    .detail-page .content,
    .detail-box .desc {
        padding: 18px 16px !important;
    }
    .detail-title,
    .detail-page h1,
    .detail-box h1 {
        font-size: 22px !important;
    }

    .pan-filter-minimal,
    .pan-filter,
    .filter-bar {
        padding: 10px !important;
        gap: 6px !important;
    }
    .pan-filter-minimal .filter-item,
    .pan-filter-minimal .pan-tab,
    .pan-filter-minimal button,
    .pan-filter-minimal a {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }

    .related-list,
    .recommend-list,
    .detail-related ul {
        grid-template-columns: 1fr !important;
    }

    .common-footer { padding: 24px 16px !important; margin-top: 40px !important; }

    /* 大按钮全宽 */
    .get-code-btn,
    .copy-link-btn {
        width: 100% !important;
        padding: 13px 20px !important;
    }

    /* 详情按钮移动端 */
    .details .btns { gap: 10px !important; }
    .details .btns .btn { flex: 1 !important; min-width: 0 !important; }

    /* 弹窗内边距 */
    .dialogUrlBox .resource-dialog-info { padding: 18px 16px !important; }
}

/* ============================================================
   动画与微交互
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ============================================================
   链接有效性徽标 validity-badge
   有效=绿 无效=红 检测中=琥珀 无法判断=灰
   ============================================================ */
.validity-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    border: 1px solid transparent !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    font-family: var(--sf-font-body) !important;
}
.validity-badge.validity-none {
    display: none !important;
}
.validity-badge.validity-checking {
    color: #b45309 !important;
    background: rgba(180, 83, 9, 0.08) !important;
    border-color: rgba(180, 83, 9, 0.25) !important;
}
.validity-badge.validity-checking::before {
    content: "";
    width: 10px;
    height: 10px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    display: inline-block;
    animation: sf-validity-spin 0.7s linear infinite;
}
.validity-badge.validity-valid {
    color: #15803d !important;
    background: rgba(21, 128, 61, 0.08) !important;
    border-color: rgba(21, 128, 61, 0.25) !important;
}
.validity-badge.validity-valid::before {
    content: "✓";
    font-weight: 700;
}
.validity-badge.validity-invalid {
    color: #dc2626 !important;
    background: rgba(220, 38, 38, 0.08) !important;
    border-color: rgba(220, 38, 38, 0.25) !important;
}
.validity-badge.validity-invalid::before {
    content: "✕";
    font-weight: 700;
}
.validity-badge.validity-unknown {
    color: var(--sf-ink-3) !important;
    background: var(--sf-paper-2) !important;
    border-color: var(--sf-line) !important;
}
@keyframes sf-validity-spin {
    to { transform: rotate(360deg); }
}

/* 网盘图标旁的徽标对齐 */
.resource-pan-meta .validity-badge {
    margin-left: 4px !important;
}
/* 本地列表项 meta 中的徽标 */
.item-meta .local-validity.validity-none {
    display: none !important;
}
.item-meta .local-validity {
    margin-left: 2px !important;
}

/* ============================================================
   检测按钮 resource-check-btn / btn-check-local
   ============================================================ */
.resource-check-btn {
    color: var(--sf-accent-2) !important;
    background: var(--sf-card) !important;
    border: 1px dashed rgba(180, 83, 9, 0.4) !important;
}
.resource-check-btn:hover:not(:disabled) {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
.resource-check-btn:disabled {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
}
.btn-check-local {
    color: var(--sf-accent-2) !important;
    border: 1px dashed rgba(180, 83, 9, 0.4) !important;
    background: var(--sf-card) !important;
}
.btn-check-local:hover {
    color: var(--sf-accent) !important;
    border-color: var(--sf-accent) !important;
    background: var(--sf-accent-softer) !important;
}
/* 详情页链接状态行 */
.details .cat .r .validity-badge {
    font-size: 13px !important;
    padding: 5px 12px !important;
}