body,
html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
#app {
  height: 100%;
}


/* Vant 风格移动端样式 */
.mobile-header-vant[data-v-5fe93dfe] {
  display: flex;
  flex-direction: column;
}
.mobile-nav-bar[data-v-5fe93dfe] {
  display: flex;
  align-items: center;
  padding: 12px 18px;
  height: 44px;
  margin-top: 8px;
}

/* 返回图标圆形背景 */
.nav-back-icon-wrapper[data-v-5fe93dfe] {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--control-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  cursor: pointer;
  transition: background-color 0.2s;
}
.nav-back-icon-wrapper[data-v-5fe93dfe]:hover {
  background-color: var(--bg-hover);
}
.nav-back-icon[data-v-5fe93dfe] {
  font-size: 22px;
  color: var(--text-primary);
}
.nav-title[data-v-5fe93dfe] {
  font-size: 20px;
  font-weight: bold;
  color: var(--text-primary);
  cursor: pointer;
  margin-left: 4px;
  flex: 1; /* 让标题占据剩余空间，将搜索按钮推到右侧 */
}

/* 搜索图标圆形背景 */
.nav-search-icon-wrapper[data-v-5fe93dfe] {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--control-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-left: auto; /* 将按钮推到右侧 */
}
.nav-search-icon-wrapper[data-v-5fe93dfe]:hover {
  background-color: var(--bg-hover);
}
.nav-search-icon[data-v-5fe93dfe] {
  width: 20px;
  height: 20px;
  opacity: 0.7;
  transition: opacity 0.2s;
}
.nav-search-icon-wrapper:hover .nav-search-icon[data-v-5fe93dfe] {
  opacity: 1;
}
.vant-search-wrapper[data-v-5fe93dfe] {
  padding: 2px 8px;
  margin: 10px 0 0 0;
}

/* 自定义搜索框样式 */
.custom-search-height[data-v-5fe93dfe] {
  padding-top: 3px;
  padding-bottom: 6px;
}
[data-v-5fe93dfe] .custom-search-height .van-search__content {
  height: 40px; /* 增加高度 */
  background-color: rgba(235, 235, 235, 0.6); /* 背景颜色深一点，透明度调整 */
  display: flex;
  align-items: center; /* 垂直居中 */
}
[data-v-5fe93dfe] .custom-search-height .van-cell {
  display: flex;
  align-items: center;
  padding: 0 4px 0 0; /* 调整内部内边距，左侧对齐 */
  height: 100%;
  width: 100%;
}
[data-v-5fe93dfe] .custom-search-height .van-field__value {
  flex: 1; /* 让输入框容器占据剩余空间 */
}
[data-v-5fe93dfe] .custom-search-height .van-field__left-icon {
  margin-right: 4px;
  display: flex;
  align-items: center;
}
[data-v-5fe93dfe] .custom-search-height .van-field__control {
  height: 100%; /* 确保输入框高度填满 */
}
[data-v-5fe93dfe] .custom-search-height .van-field__control::-moz-placeholder {
  color: #646566; /* 提示文字加深 */
  font-weight: normal;
  font-size: 16px;
  padding-left: 4px;
}
[data-v-5fe93dfe] .custom-search-height .van-field__control::placeholder {
  color: #646566; /* 提示文字加深 */
  font-weight: normal;
  font-size: 16px;
  padding-left: 4px;
}

/* 分类滑动栏样式 */
.category-slider[data-v-5fe93dfe] {
  display: flex;
  overflow-x: auto;
  padding: 4px 18px;
  gap: 12px;
  -webkit-overflow-scrolling: touch; /* 平滑滚动 */
  scrollbar-width: none; /* Firefox 隐藏滚动条 */
}
.category-slider[data-v-5fe93dfe]::-webkit-scrollbar {
  display: none; /* Chrome/Safari 隐藏滚动条 */
}
.category-card[data-v-5fe93dfe] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 8px 16px;
  background: var(--control-bg);
  border-radius: 20px;
  font-size: 14px; /* 统一文字大小 */
  color: #323233;
  transition: all 0.2s;
  cursor: pointer;
  border: 1px solid transparent;
}
.category-card[data-v-5fe93dfe]:active {
  transform: scale(0.95);
}

/* 选中状态样式 */
.category-card.active[data-v-5fe93dfe] {
  background: #000000 !important;
  color: #ffffff !important;
  box-shadow: none;
}
.category-icon[data-v-5fe93dfe] {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  flex-shrink: 0;
  opacity: 0.8;
  transition: opacity 0.2s;
}
.category-card.active .category-icon[data-v-5fe93dfe] {
  opacity: 1;
  filter: brightness(0) invert(1);
}

/* 暗黑模式适配 */
@media (prefers-color-scheme: dark) {
.nav-search-icon[data-v-5fe93dfe] {
    filter: brightness(0) invert(1);
}
.category-card[data-v-5fe93dfe] {
    color: #e5e5e7;
}
.category-card.active[data-v-5fe93dfe] {
    background: #ffffff !important;
    color: #000000 !important;
}
.category-card.active .category-icon[data-v-5fe93dfe] {
    filter: brightness(0);
}
}
.category-name[data-v-5fe93dfe] {
  white-space: nowrap;
  font-weight: 500;
  font-size: 14px; /* 统一文字大小 */
}

/* 移动端搜索弹窗样式 */
.mobile-search-overlay[data-v-5fe93dfe] {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--modal-overlay);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  z-index: 2000;
  padding-top: 80px;
}
.mobile-search-container[data-v-5fe93dfe] {
  background: var(--modal-bg);
  border-radius: 12px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}
.mobile-search-header[data-v-5fe93dfe] {
  display: flex;
  align-items: center;
  padding: 16px;
}
.mobile-search-input[data-v-5fe93dfe] {
  flex: 1;
  height: 40px;

  border: none;
  background: var(--input-bg);
  border-radius: 20px;
  outline: none;
  color: var(--text-primary);
  font-size: 16px;
}
.mobile-search-input[data-v-5fe93dfe]::-moz-placeholder {
  color: var(--text-secondary);
}
.mobile-search-input[data-v-5fe93dfe]::placeholder {
  color: var(--text-secondary);
}
.mobile-search-close[data-v-5fe93dfe] {
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s;
  margin-left: 12px;
}
.mobile-search-close[data-v-5fe93dfe]:hover {
  opacity: 1;
}
.mobile-suggestions-list[data-v-5fe93dfe] {
  max-height: 300px;
  overflow-y: auto;
}
.mobile-suggestion-item[data-v-5fe93dfe] {
  padding: 16px;
  cursor: pointer;
  transition: background-color 0.2s;
  color: var(--text-primary);
}
.mobile-suggestion-item[data-v-5fe93dfe]:last-child {
  border-bottom: none;
}
.mobile-suggestion-item[data-v-5fe93dfe]:hover {
  background-color: var(--suggestion-hover-bg);
}

/* 搜索按钮显示隐藏动画 */
.search-button-enter-active[data-v-5fe93dfe],
.search-button-leave-active[data-v-5fe93dfe] {
  transition: all 0.3s ease;
}
.search-button-enter-from[data-v-5fe93dfe] {
  opacity: 0;
  transform: scale(0.8);
}
.search-button-leave-to[data-v-5fe93dfe] {
  opacity: 0;
  transform: scale(0.8);
}


/* 自定义指示器样式 - 全局样式 */
.custom-indicator {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 10px;
  display: flex;
  gap: 4px;
  align-items: center;
}
.custom-indicator i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #CCC;
  transition: all 0.3s;
  opacity: 1;
}
.custom-indicator i.active {
  width: 12px;
  height: 4px;
  border-radius: 2px;
  background: #333;
}

/* Removed external Google Fonts import to avoid mobile timeouts */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.container {
    display: flex;
    min-height: 100vh;
}

/* 侧边栏样式 */
.sidebar {
    width: 240px;
    background-color: var(--sidebar-bg);
    box-shadow: 2px 0 5px var(--shadow-medium);
    padding: 20px 0;
}

.sidebar-nav ul {
    list-style: none;
}

.sidebar-nav li {
    padding: 12px 24px;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: var(--text-secondary);
    transition: all 0.3s ease;
}

.sidebar-nav li:hover {
    background-color: var(--sidebar-item-hover-bg);
}

.sidebar-nav li.active {
    background-color: var(--sidebar-item-active-bg);
    color: var(--brand-primary);
}

.sidebar-nav .icon {
    width: 24px;
    height: 24px;
    margin-right: 12px;
}

.sidebar-nav .icon.inactive {
    display: none;
}

.sidebar-nav li.active .icon.active {
    display: none;
}

.sidebar-nav li.active .icon.inactive {
    display: block;
}

/* 主内容区域样式 */
.main-content {
    flex: 1;
    padding: 20px;
}

.main-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

.logo {
    font-size: 24px;
    font-weight: 500;
    color: #1a73e8;
}

.search-bar {
    display: flex;
    gap: 10px;
}

.search-bar input {
    width: 300px;
    padding: 8px 16px;
    border: 1px solid var(--input-border);
    border-radius: 4px;
    font-size: 14px;
    background-color: var(--input-bg);
    color: var(--text-primary);
}

.search-bar button {
    padding: 8px 16px;
    background-color: var(--brand-primary);
    color: var(--text-inverse);
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.login-btn {
    padding: 8px 24px;
    background-color: var(--brand-primary);
    color: var(--text-inverse);
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

/* 内容区域样式 */
.content {
    max-width: 1200px;
    margin: 0 auto;
}

.main-title {
    font-size: 32px;
    color: var(--text-primary);
    margin-bottom: 40px;
    text-align: center;
}

.section-title {
    font-size: 24px;
    color: var(--text-primary);
    margin: 30px 0 20px;
}

.tool-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.tool-card {
    background-color: var(--card-bg);
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px var(--shadow-medium);
    transition: transform 0.3s ease;
    cursor: pointer;
}

.tool-card:hover {
    transform: translateY(-5px);
    background-color: var(--card-hover-bg);
}

.tool-title {
    font-size: 18px;
    font-weight: 500;
    color: var(--text-primary);
    margin: 12px 0 8px;
}

.tool-desc {
    font-size: 14px;
    color: var(--text-secondary);
}

.icon-placeholder {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: var(--brand-secondary);
    border-radius: 8px;
} 
/* 大文件提示弹窗样式优化：左右留白与按钮分置 */
.mobile-large-file-dialog .van-dialog {
  /* 在移动端确保与屏幕左右边缘有空隙 */
  width: auto;
  max-width: 600px;
  margin: 0 16px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .mobile-large-file-dialog .van-dialog {
    width: calc(100% - 32px);
    margin: 0 16px;
  }
}

/* 按钮分置：复制网页在左，继续处理在右 */
.mobile-large-file-dialog .van-dialog__footer {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

/* 保障按钮顺序与位置（cancel左、confirm右） */
.mobile-large-file-dialog .van-dialog__cancel {
  order: 1;
}
.mobile-large-file-dialog .van-dialog__confirm {
  order: 2;
}

/* Custom notify styles (app look) */
#app-notify-container {
  pointer-events: none;
}
.custom-notify {
  pointer-events: auto;
  display: inline-block;
  min-width: 180px;
  max-width: 720px;
  background: linear-gradient(90deg, #4facfe 0%, #00f2fe 100%);
  color: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(32, 120, 255, 0.18);
  padding: 10px 16px;
  font-weight: 600;
  font-size: 14px;
  text-align: left;
  transform-origin: center top;
  opacity: 0;
  transform: translateY(-8px) scale(0.98);
  transition: all 240ms cubic-bezier(.2,.8,.2,1);
}
.custom-notify.enter {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.custom-notify.leave {
  opacity: 0;
  transform: translateY(-8px) scale(0.98);
}
.custom-notify .notify-inner {
  display: flex;
  align-items: center;
  gap: 10px;
}
.custom-notify .notify-icon {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  flex: 0 0 18px;
  background: rgba(255,255,255,0.2);
}
.custom-notify.success .notify-icon { background: rgba(255,255,255,0.22); }
.custom-notify.warning { background: linear-gradient(90deg,#FFB65A,#FF8C6A); }
.custom-notify.error { background: linear-gradient(90deg,#FF6B6B,#FF4E6A); }
.custom-notify .notify-message { flex: 1; color: #fff; }


.container[data-v-80fb0c74] {
  background-color: var(--bg-primary);
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.main-container[data-v-80fb0c74] {
  flex: 1;
  display: flex;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.main-content[data-v-80fb0c74] {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  padding: 8px;
}
.content-scroll[data-v-80fb0c74] {
  flex: 1;
  position: relative; /* 确保 offsetTop 计算准确 */
  overflow-y: auto;
  overflow-x: hidden;
  /* 隐藏滚动条但保持滚动功能 */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}
.content-scroll[data-v-80fb0c74]::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}
.content[data-v-80fb0c74] {
  padding: 0 20px 0 0;
  max-width: 1200px;
  margin: 0 auto;
}

/* 移动端内容样式 */
.container.mobile .content[data-v-80fb0c74] {
  padding: 0;
  max-width: none;
  width: 100%;
}
.container.mobile .main-content[data-v-80fb0c74] {
  padding: 0;
}
.main-title[data-v-80fb0c74] {
  font-size: 22px;
  color: var(--text-primary);
  margin-bottom: 32px;
  text-align: left;
  font-weight: 400;
}
.section-title[data-v-80fb0c74] {
  font-size: 16px;
  color: var(--text-primary);
  margin: 16px 0 8px 0;
  font-weight: 500;
  scroll-margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 移动端分组标题 */
.container.mobile .section-title[data-v-80fb0c74] {
  padding: 0 18px;
  margin: 16px 0 8px 0;
}
.edit-icon[data-v-80fb0c74] {
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s;
}
.edit-icon[data-v-80fb0c74]:hover {
  opacity: 1;
}


/* 移动端工具网格 - 用于滑动视图内部 */
.mobile-swipe-grid[data-v-80fb0c74] {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 两列 */
  grid-template-rows: repeat(3, auto);   /* 三行 */
  gap: 12px;
  padding: 0 16px 30px 16px; /* 底部留出指示器空间 */
}

/* 移动端卡片样式调整 */
.mobile-card[data-v-80fb0c74] {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 12px;
  background: transparent; /* 移除背景色 */
  border-radius: 0;
  height: auto;
  min-height: 70px;
  box-shadow: none; /* 移除阴影 */
  border: none !important; /* 移除可能的边框 */
}
.mobile-card .tool-info[data-v-80fb0c74] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  flex: 1;
}
.mobile-card .tool-icon[data-v-80fb0c74] {
  width: 36px;
  height: 36px;
  margin-right: 12px;
  margin-bottom: 0;
  flex-shrink: 0;
}
.mobile-card .tool-title[data-v-80fb0c74] {
  font-size: 17px;
  font-weight: 500;
  color: var(--text-primary);
  margin: 0 0 4px 0;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mobile-card .tool-desc[data-v-80fb0c74] {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
  line-height: 1.2;
  display: block !important; /* 强制显示描述 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 暗黑模式适配 */
@media (prefers-color-scheme: dark) {
.mobile-card[data-v-80fb0c74] {
    background: transparent;
}
}

/* 移动端工具网格 */
.container.mobile .tool-grid[data-v-80fb0c74] {
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0 18px;
}

/* 移动端滑动网格容器 */
.mobile-swipe-grid[data-v-80fb0c74],
.mobile-full-grid[data-v-80fb0c74] {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 两列 */
  gap: 8px; /* 减小间距 */
  padding: 0 10px 24px 10px; /* 减小容器内边距 */
}
.mobile-swipe-grid[data-v-80fb0c74] {
  grid-template-rows: repeat(3, auto);   /* 三行 */
}

/* 覆盖原有移动端卡片样式 */
.container.mobile .mobile-swipe-grid .tool-card[data-v-80fb0c74],
.container.mobile .mobile-full-grid .tool-card[data-v-80fb0c74] {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 8px 10px; /* 减小卡片内边距 */
  background: transparent; /* 移除背景色 */
  border-radius: 0;
  height: auto;
  min-height: 60px; /* 减小最小高度 */
  box-shadow: none; /* 移除阴影 */
  border: none; /* 移除底部分割线 */
  margin-bottom: 0; /* 移除可能的 margin */
}
.container.mobile .mobile-swipe-grid .tool-info[data-v-80fb0c74],
.container.mobile .mobile-full-grid .tool-info[data-v-80fb0c74] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  flex: 1;
}
.container.mobile .mobile-swipe-grid .tool-icon[data-v-80fb0c74],
.container.mobile .mobile-full-grid .tool-icon[data-v-80fb0c74] {
  width: 28px; /* 放大图标 */
  height: 28px;
  margin-right: 8px; /* 减小间距 */
  margin-bottom: 0;
  flex-shrink: 0;
  opacity: 1;
}
.container.mobile .mobile-swipe-grid .tool-title[data-v-80fb0c74],
.container.mobile .mobile-full-grid .tool-title[data-v-80fb0c74] {
  font-size: 15px; /* 放大标题字号 */
  font-weight: 500;
  color: var(--text-primary);
  margin: 0 0 2px 0;
  line-height: 1.2;
  height: auto;
}
.container.mobile .mobile-swipe-grid .tool-desc[data-v-80fb0c74],
.container.mobile .mobile-full-grid .tool-desc[data-v-80fb0c74] {
  font-size: 11px; /* 缩小描述字号 */
  color: var(--text-secondary);
  margin: 0;
  line-height: 1.2;
  white-space: nowrap; /* 不换行，只显示一行 */
  overflow: hidden;
  text-overflow: ellipsis; /* 显示省略号 */
}

/* 暗黑模式适配 */
@media (prefers-color-scheme: dark) {
.container.mobile .mobile-swipe-grid .tool-card[data-v-80fb0c74],
  .container.mobile .mobile-full-grid .tool-card[data-v-80fb0c74] {
    background: transparent;
}
.container.mobile .mobile-swipe-grid .tool-card[data-v-80fb0c74]:hover,
  .container.mobile .mobile-full-grid .tool-card[data-v-80fb0c74]:hover {
    background-color: transparent;
}
}
.tool-card[data-v-80fb0c74] {
  min-height: 120px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  background-color: transparent;
  padding: 16px;
  border-radius: 0;
  box-shadow: none;
}

/* 移动端工具卡片 */
.container.mobile .tool-card[data-v-80fb0c74] {
  min-height: 56px;
  flex-direction: row;
  align-items: center;
  background-color: transparent;
  padding: 16px;
  border-radius: 0;
  border-bottom: 1px solid var(--border-secondary);
  display: flex;
  justify-content: flex-start;
}
.container.mobile .tool-card[data-v-80fb0c74]:last-child {
  border-bottom: none;
}
.tool-icon-wrapper[data-v-80fb0c74] {
  display: inline-block;
  margin-bottom: 10px;
}
.tool-icon[data-v-80fb0c74] {
  width: 28px;
  height: 28px;
  transition: filter 0.2s ease;
}
.tool-title[data-v-80fb0c74] {
  font-size: 18px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 4px;
}
.tool-desc[data-v-80fb0c74] {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.4;
}

/* 移动端工具图标和文本 */
.container.mobile .tool-icon[data-v-80fb0c74] {
  width: 28px;
  height: 28px;
  margin-bottom: 0;
  margin-right: 16px;
  opacity: 0.8;
  flex-shrink: 0;
  display: block;
}
.container.mobile .tool-title[data-v-80fb0c74] {
  flex: 1;
  font-size: 18px;
  font-weight: 400;
  color: var(--text-primary);
  margin: 0;
  line-height: 24px;
  display: flex;
  align-items: center;
  height: 24px;
}
.container.mobile .tool-desc[data-v-80fb0c74] {
  display: none;
}
.icon-placeholder[data-v-80fb0c74] {
  margin-bottom: 10px;
}
.tool-selector-modal[data-v-80fb0c74] {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--modal-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
.tool-selector-content[data-v-80fb0c74] {
  background: var(--modal-bg);
  border-radius: 12px;
  width: 90%;
  max-width: 1000px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
}
.tool-selector-header[data-v-80fb0c74] {
  padding: 16px 20px 0;
  border-bottom: 1px solid var(--modal-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.tool-selector-header h3[data-v-80fb0c74] {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}
.close-icon[data-v-80fb0c74] {
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s;
}
.close-icon[data-v-80fb0c74]:hover {
  opacity: 1;
}
.tool-selector-grid[data-v-80fb0c74] {
  padding: 20px 20px 0;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}
.tool-selector-item[data-v-80fb0c74] {
  background: var(--card-bg);
  padding: 16px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}
.tool-selector-item[data-v-80fb0c74]:hover {
  background: var(--bg-hover);
}
.tool-selector-item.selected[data-v-80fb0c74] {
  background: var(--brand-secondary);
  border: 2px solid var(--brand-primary);
}
.tool-selector-footer[data-v-80fb0c74] {
  padding: 16px 20px;
  border-top: 1px solid var(--modal-border);
  display: flex;
  justify-content: flex-end;
}
.confirm-btn[data-v-80fb0c74] {
  padding: 8px 24px;
  background: var(--text-primary);
  color: var(--text-inverse);
  border: none;
  border-radius: 20px;
  cursor: pointer;
  font-size: 14px;
  transition: opacity 0.2s;
}
.confirm-btn[data-v-80fb0c74]:hover {
  opacity: 0.8;
}

/* 标签页样式 */
.tabs-container[data-v-80fb0c74] {
  background: var(--toolbar-bg);
  border-bottom: 1px solid var(--toolbar-border);
  height: 40px;
  overflow: hidden;
  padding-top: 8px;
  margin-bottom: -8px; /* 抵消padding-top的影响，保持整体高度不变 */
}
.tabs-scroll[data-v-80fb0c74] {
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-left: 100px;
}
.tabs[data-v-80fb0c74] {
  display: flex;
  height: 100%;
  padding: 0 20px 0;
  gap: 4px;
  margin-left: 140px;
}
.tab[data-v-80fb0c74] {
  display: flex;
  align-items: center;
  padding: 0 16px;
  height: 100%;
  background: var(--tab-bg);
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  transition: all 0.2s;
  gap: 8px;
  min-width: 120px;
  max-width: 200px;
}
.tab.active[data-v-80fb0c74] {
  background: var(--tab-active-bg);
  color: var(--tab-active-text);
}
.tab-icon[data-v-80fb0c74] {
  width: 16px;
  height: 16px;
  opacity: 0.8;
}
.tab.active .tab-icon[data-v-80fb0c74] {
  opacity: 1;
  filter: brightness(0) invert(1);
}
.tab-title[data-v-80fb0c74] {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
}
.tab .close-icon[data-v-80fb0c74] {
  width: 16px;
  height: 16px;
  opacity: 0.6;
  transition: opacity 0.2s;
}
.tab.active .close-icon[data-v-80fb0c74] {
  opacity: 0.8;
  filter: brightness(0) invert(1);
}
.tab .close-icon[data-v-80fb0c74]:hover {
  opacity: 1;
}
.tab.active .close-icon[data-v-80fb0c74]:hover {
  opacity: 1;
}

/* 应用内容样式 */
.tool-content[data-v-80fb0c74] {
  width: 100%;
  height: calc(100vh - 120px); /* 进一步调整高度，确保与 Footer 连接 */
  background: var(--bg-primary);
  position: relative;
  margin: 0;
  padding: 0;
}

/* 移动端工具内容全屏 */
.container.mobile .tool-content[data-v-80fb0c74] {
  height: 100vh;
  width: 100vw;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}
.iframe-container[data-v-80fb0c74] {
  width: 100%;
  height: 100%;
  position: relative;
  margin: 0;
  padding: 0;
}
.iframe-container iframe[data-v-80fb0c74] {
  width: 100%;
  height: 100%;
  border: none;
  background: var(--bg-primary);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  margin: 0;
  padding: 0;
}
.iframe-container iframe.loaded[data-v-80fb0c74] {
  opacity: 1;
}

/* 加载指示器样式 */
.loading-indicator[data-v-80fb0c74] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  z-index: 10;
}
.loading-spinner[data-v-80fb0c74] {
  width: 32px;
  height: 32px;
  border: 3px solid var(--border-secondary);
  border-top: 3px solid var(--text-primary);
  border-radius: 50%;
  animation: spin-80fb0c74 1s linear infinite;
}
.loading-text[data-v-80fb0c74] {
  font-size: 14px;
  color: var(--text-secondary);
}
@keyframes spin-80fb0c74 {
0% { transform: rotate(0deg);
}
100% { transform: rotate(360deg);
}
}


/* 暗黑模式下被选中标签页的图标适配 */
@media (prefers-color-scheme: dark) {
.tab.active .tab-icon[data-v-80fb0c74] {
    filter: none !important;
}
.tab.active .close-icon[data-v-80fb0c74] {
    filter: none !important;
}
}

/* 强制暗黑模式类的图标适配 */
.dark-theme .tab.active .tab-icon[data-v-80fb0c74] {
  filter: none !important;
}
.dark-theme .tab.active .close-icon[data-v-80fb0c74] {
  filter: none !important;
}


/* 分组样式 */
.category-section[data-v-80fb0c74] {
  margin-top: 0;
}

/* 可滚动头部样式 */
.scrollable-header[data-v-80fb0c74] {
  position: relative;
  background: var(--bg-primary);
  z-index: 10;
}

/* 可滚动搜索框样式 */
.scrollable-search-wrapper[data-v-80fb0c74] {
  padding: 2px 6px;
  margin: 10px 0 0 0;
  cursor: pointer;
}
.scrollable-custom-search-height[data-v-80fb0c74] {
  padding-top: 3px;
  padding-bottom: 3px;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-search__content {
  height: 40px;
  background-color: var(--control-bg);
  display: flex;
  align-items: center;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-cell {
  display: flex;
  align-items: center;
  padding: 0 4px 0 0;
  height: 100%;
  width: 100%;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-field__value {
  flex: 1;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-field__left-icon {
  margin-right: 4px;
  display: flex;
  align-items: center;
}
.search-input-icon[data-v-80fb0c74] {
  width: 16px;
  height: 16px;
  filter: brightness(0) saturate(100%) invert(39%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-field__control {
  height: 100%;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-field__control::-moz-placeholder {
  color: #646566;
  font-weight: normal;
  font-size: 16px;
  padding-left: 4px;
}
.scrollable-custom-search-height[data-v-80fb0c74] .van-field__control::placeholder {
  color: #646566;
  font-weight: normal;
  font-size: 16px;
  padding-left: 4px;
}

/* 可滚动分类滑动栏样式 - 添加 Sticky 支持 */
.scrollable-category-slider[data-v-80fb0c74] {
  display: flex;
  overflow-x: auto;
  padding: 8px 18px;
  gap: 12px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  background: var(--bg-primary); /* 确保背景不透明 */
}
.sticky-slider[data-v-80fb0c74] {
  position: sticky;
  top: 0;
  z-index: 99;
  border-bottom: none;
  transition: box-shadow 0.3s;
}
.sticky-slider.sticky[data-v-80fb0c74] {
  border-bottom: 1px solid var(--border-secondary);
}
.scrollable-category-slider[data-v-80fb0c74]::-webkit-scrollbar {
  display: none;
}
.scrollable-category-card[data-v-80fb0c74] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  background: var(--control-bg);
  border-radius: 20px;
  font-size: 14px;
  color: #323233;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  border: 1px solid transparent;
}
.scrollable-category-card[data-v-80fb0c74]:active {
  transform: scale(0.95);
}
.scrollable-category-card.active[data-v-80fb0c74] {
  background: #000000 !important;
  color: #ffffff !important;
  box-shadow: none;
}
.scrollable-category-icon[data-v-80fb0c74] {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  flex-shrink: 0;
  opacity: 0.8;
  transition: opacity 0.2s;
}
.scrollable-category-card.active .scrollable-category-icon[data-v-80fb0c74] {
  opacity: 1;
  filter: brightness(0) invert(1);
}
.scrollable-category-name[data-v-80fb0c74] {
  white-space: nowrap;
  font-weight: 500;
  font-size: 14px;
}

/* 吸顶分类栏样式 */
.sticky-category-wrapper[data-v-80fb0c74] {
  position: fixed;
  top: calc(var(--home-titlebar-height, 52px) - 1px); /* 减去1px以消除间隙 */
  left: 0;
  right: 0;
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border-secondary);
  z-index: 100;
  padding: 6px 0;
}
.sticky-category-slider[data-v-80fb0c74] {
  display: flex;
  overflow-x: auto;
  padding: 0 20px;
  gap: 12px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sticky-category-slider[data-v-80fb0c74]::-webkit-scrollbar {
  display: none;
}
.sticky-category-card[data-v-80fb0c74] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  background: var(--control-bg);
  border-radius: 20px;
  font-size: 14px;
  color: #323233;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  border: 1px solid transparent;
}
.sticky-category-card[data-v-80fb0c74]:active {
  transform: scale(0.95);
}
.sticky-category-card.active[data-v-80fb0c74] {
  background: #000000 !important;
  color: #ffffff !important;
  box-shadow: none;
}
.sticky-category-icon[data-v-80fb0c74] {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  flex-shrink: 0;
  opacity: 0.8;
  transition: opacity 0.2s;
}
.sticky-category-card.active .sticky-category-icon[data-v-80fb0c74] {
  opacity: 1;
  filter: brightness(0) invert(1);
}
.sticky-category-name[data-v-80fb0c74] {
  white-space: nowrap;
  font-weight: 500;
  font-size: 14px;
}

/* 移动端适配 */
@media (prefers-color-scheme: dark) {
.scrollable-category-card[data-v-80fb0c74] {
    color: #e5e5e7;
}
.scrollable-category-card .scrollable-category-icon[data-v-80fb0c74] {
    filter: invert(1);
}
.scrollable-category-card.active[data-v-80fb0c74] {
    background: #ffffff !important;
    color: #000000 !important;
}
.scrollable-category-card.active .scrollable-category-icon[data-v-80fb0c74] {
    filter: brightness(0);
}
.sticky-category-card[data-v-80fb0c74] {
    color: #e5e5e7;
}
.sticky-category-card .sticky-category-icon[data-v-80fb0c74] {
    filter: invert(1);
}
.sticky-category-card.active[data-v-80fb0c74] {
    background: #ffffff !important;
    color: #000000 !important;
}
.sticky-category-card.active .sticky-category-icon[data-v-80fb0c74] {
    filter: brightness(0);
}

  /* 指示器暗黑模式适配 */
.custom-indicator i[data-v-80fb0c74] {
    background: #666;
}
.custom-indicator i.active[data-v-80fb0c74] {
    background: #CCC;
}
}

/* 分组分割线样式 */
.category-divider[data-v-80fb0c74] {
  height: 0.8px;
  background-color: var(--border-secondary);
  margin: 16px 0;
  border: none;
}

/* 移动端分组分割线 */
.container.mobile .category-divider[data-v-80fb0c74] {
  margin: 12px 18px;
  height: 0.8px;
  background-color: var(--border-secondary);
}

/* 版本信息样式 */
.version-footer[data-v-80fb0c74] {
  background-color: var(--bg-primary);
  padding: 12px 0;
  text-align: center;
  border-top: 1px solid var(--border-primary);
}
.version-text[data-v-80fb0c74] {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 400;
}

/* 移动端版本信息样式 */
.container.mobile .version-footer[data-v-80fb0c74] {
  padding: 16px 0;
}
.container.mobile .version-text[data-v-80fb0c74] {
  font-size: 14px;
  padding: 0 20px;
}

/* 移除图标点击/悬停时的跳动效果 */
.tool-card[data-v-80fb0c74]:hover,
.tool-card[data-v-80fb0c74]:active {
  transform: none !important;
}

/* 全局颜色变量系统 - 支持明亮和暗黑模式 */

/* 明亮模式 (默认) */
:root {
  /* 主要背景色 */
  --bg-primary: #f5f7f9;
  --bg-secondary: #f5f5f5;
  --bg-tertiary: #f4f5f7;
  --bg-hover: #ffffff;
  --bg-active: #f0f2f5;

  /* 按钮和控件背景色 */
  --control-bg: #E8ECEF;
  
  /* 文本颜色 */
  --text-primary: #1f1f1f;
  --text-secondary: #777777;
  --text-tertiary: #888888;
  --text-inverse: #ffffff;
  --text-danger: #ff4d4f;
  
  /* 边框颜色 */
  --border-primary: #e5e6eb;
  --border-secondary: #e0e0e0;
  --border-light: #f5f5f5;
  
  /* 品牌色 */
  --brand-primary: #1677ff;
  --brand-hover: #145bcc;
  --brand-secondary: #e8f0fe;

  /* 应用主题色 */
  --theme-primary: #2758EE;
  
  /* 功能色 */
  --success: #52c41a;
  --warning: #faad14;
  --error: #ff4d4f;
  --info: #1890ff;
  
  /* 特殊颜色 */
  --orange: #FF9800;
  --rank-first: #f5222d;
  --rank-second: #fa8c16;
  --rank-third: #52c41a;
  
  /* 阴影 */
  --shadow-light: rgba(0, 0, 0, 0.04);
  --shadow-medium: rgba(0, 0, 0, 0.1);
  --shadow-strong: rgba(0, 0, 0, 0.15);
  
  /* 卡片背景 */
  --card-bg: #ffffff;
  --card-hover-bg: #f0f1f3;
  
  /* 输入框 */
  --input-bg: #f4f5f7;
  --input-border: #e5e6eb;
  --input-focus-border: #1677ff;
  
  /* 工具栏 */
  --toolbar-bg: #ffffff;
  --toolbar-border: #e5e6eb;
  
  /* 侧边栏 */
  --sidebar-bg: #ffffff;
  --sidebar-border: #e5e6eb;
  --sidebar-item-bg: transparent;
  --sidebar-item-hover-bg: #f0f2f5;
  --sidebar-item-active-bg: #f0f2f5;
  
  /* 标签页 */
  --tab-bg: #f5f5f5;
  --tab-active-bg: #1f1f1f;
  --tab-active-text: #ffffff;
  --tab-border: #e5e6eb;
  
  /* 模态框 */
  --modal-bg: #ffffff;
  --modal-overlay: rgba(0, 0, 0, 0.5);
  --modal-border: #e5e6eb;
  
  /* 按钮 */
  --btn-bg: #f5f5f5;
  --btn-hover-bg: #e5e5e5;
  --btn-text: #1f1f1f;
  
  /* 搜索建议 */
  --suggestion-bg: #ffffff;
  --suggestion-hover-bg: #f5f5f5;
}

/* 暗黑模式 */
@media (prefers-color-scheme: dark) {
  :root {
    /* 主要背景色 */
    --bg-primary: #1e1f21;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #333333;
    --bg-hover: #404040;
    --bg-active: #3a3a3a;

    /* 按钮和控件背景色 */
    --control-bg: #2b2c2d;
    
    /* 文本颜色 */
    --text-primary: #ffffff;
    --text-secondary: #cccccc;
    --text-tertiary: #999999;
    --text-inverse: #1a1a1a;
    --text-danger: #ff7875;
    
    /* 边框颜色 */
    --border-primary: #404040;
    --border-secondary: #333333;
    --border-light: #2d2d2d;
    
    /* 品牌色 */
    --brand-primary: #4096ff;
    --brand-hover: #69b1ff;
    --brand-secondary: #1d39c4;

    /* 应用主题色 */
    --theme-primary: #2758EE;
    
      /* 功能色 */
  --success: #73d13d;
  --warning: #ffc53d;
  --error: #ff7875;
  --info: #40a9ff;
  
  /* 功能色背景（暗黑模式） */
  --success-bg: #162312;
  --warning-bg: #2b2111;
  --error-bg: #2a1215;
  --info-bg: #111b26;
    
    /* 特殊颜色 */
    --orange: #ffab40;
    --rank-first: #ff5252;
    --rank-second: #ffb74d;
    --rank-third: #69f0ae;
    
    /* 阴影 */
    --shadow-light: rgba(0, 0, 0, 0.2);
    --shadow-medium: rgba(0, 0, 0, 0.3);
    --shadow-strong: rgba(0, 0, 0, 0.4);
    
    /* 卡片背景 */
    --card-bg: #2d2d2d;
    --card-hover-bg: #333333;
    
    /* 输入框 */
    --input-bg: #333333;
    --input-border: #404040;
    --input-focus-border: #4096ff;
    
    /* 工具栏 */
    --toolbar-bg: #1a1a1a;
    --toolbar-border: #404040;
    
    /* 侧边栏 */
    --sidebar-bg: #1a1a1a;
    --sidebar-border: #404040;
    --sidebar-item-bg: transparent;
    --sidebar-item-hover-bg: #2d2d2d;
    --sidebar-item-active-bg: #3a3a3a;
    
    /* 标签页 */
    --tab-bg: #333333;
    --tab-active-bg: #ffffff;
    --tab-active-text: #1a1a1a;
    --tab-border: #404040;
    
    /* 模态框 */
    --modal-bg: #2d2d2d;
    --modal-overlay: rgba(0, 0, 0, 0.7);
    --modal-border: #404040;
    
    /* 按钮 */
    --btn-bg: #333333;
    --btn-hover-bg: #404040;
    --btn-text: #ffffff;
    
    /* 搜索建议 */
    --suggestion-bg: #2d2d2d;
    --suggestion-hover-bg: #333333;
  }
}

/* 强制暗黑模式类（可选，用于手动切换） */
.dark-theme {
  /* 主要背景色 */
  --bg-primary: #1e1f21;
  --bg-secondary: #2d2d2d;
  --bg-tertiary: #333333;
  --bg-hover: #404040;
  --bg-active: #3a3a3a;
  
  /* 文本颜色 */
  --text-primary: #ffffff;
  --text-secondary: #cccccc;
  --text-tertiary: #999999;
  --text-inverse: #1a1a1a;
  --text-danger: #ff7875;
  
  /* 边框颜色 */
  --border-primary: #404040;
  --border-secondary: #333333;
  --border-light: #2d2d2d;
  
  /* 品牌色 */
  --brand-primary: #4096ff;
  --brand-hover: #69b1ff;
  --brand-secondary: #1d39c4;
  
  /* 功能色 */
  --success: #52c41a;
  --warning: #faad14;
  --error: #ff4d4f;
  --info: #1890ff;
  
  /* 功能色背景 */
  --success-bg: #f6ffed;
  --warning-bg: #fffbe6;
  --error-bg: #fff2f0;
  --info-bg: #e6f7ff;
  
  /* 阴影 */
  --shadow-light: rgba(0, 0, 0, 0.2);
  --shadow-medium: rgba(0, 0, 0, 0.3);
  --shadow-strong: rgba(0, 0, 0, 0.4);
  
  /* 卡片背景 */
  --card-bg: #2d2d2d;
  --card-hover-bg: #333333;
  
  /* 输入框 */
  --input-bg: #333333;
  --input-border: #404040;
  --input-focus-border: #4096ff;
  
  /* 工具栏 */
  --toolbar-bg: #1a1a1a;
  --toolbar-border: #404040;
  
  /* 侧边栏 */
  --sidebar-bg: #1a1a1a;
  --sidebar-border: #404040;
  --sidebar-item-bg: transparent;
  --sidebar-item-hover-bg: #2d2d2d;
  --sidebar-item-active-bg: #3a3a3a;
  
  /* 标签页 */
  --tab-bg: #333333;
  --tab-active-bg: #ffffff;
  --tab-active-text: #1a1a1a;
  --tab-border: #404040;
  
  /* 模态框 */
  --modal-bg: #2d2d2d;
  --modal-overlay: rgba(0, 0, 0, 0.7);
  --modal-border: #404040;
  
  /* 按钮 */
  --btn-bg: #333333;
  --btn-hover-bg: #404040;
  --btn-text: #ffffff;
  
  /* 搜索建议 */
  --suggestion-bg: #2d2d2d;
  --suggestion-hover-bg: #333333;
}

/* 确保颜色过渡平滑 */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* 避免过渡在某些元素上显得突兀 */
img,
video,
iframe {
  transition: none;
}

/* 图标暗黑模式适配 */
@media (prefers-color-scheme: dark) {
  /* 侧边栏图标反色 */
  .sidebar-nav .icon {
    filter: invert(1);
  }
  
  /* 标签页图标反色 */
  .tab-icon {
    filter: invert(1);
  }
  
  /* 激活状态的标签页图标不反色（因为背景是白色） */
  .tab.active .tab-icon {
    filter: none;
  }
  
  /* 激活状态的标签页关闭图标也不反色 */
  .tab.active .close-icon {
    filter: none;
  }
  
  /* 功能列表图标反色 */
  .tool-icon {
    filter: invert(1);
  }
  
  /* 顶部工具栏图标反色 */
  .search-bar::before {
    filter: invert(1);
  }
  
  .clear-btn {
    filter: invert(1);
  }
  
  .edit-icon {
    filter: invert(1);
  }
  
  .close-icon {
    filter: invert(1);
  }
  
  .download-btn img {
    filter: invert(1);
  }
  
  /* 页面内容区域的所有图标反色 */
  .upload-icon {
    filter: invert(1);
  }
  
  .button-icon {
    filter: invert(1);
  }
  
  .back-icon {
    filter: invert(1);
  }
  
  .favorite-icon {
    filter: invert(1);
  }
  
  .copy-icon {
    filter: invert(1);
  }
  
  .refresh-icon {
    filter: invert(1);
  }
  
  .search-icon {
    filter: invert(1);
  }
  
  /* SVG图标使用currentColor的不需要反色，因为会自动跟随文字颜色 */
  .search-icon[fill="currentColor"],
  .member-icon[fill="currentColor"] {
    filter: none;
  }
  
  /* 各种操作按钮内的图标 */
  .clear-btn img,
  .copy-btn img,
  .action-btn img,
  .compress-btn img,
  .convert-btn img,
  .cut-btn img,
  .extract-btn img,
  .process-btn img,
  .submit-btn img,
  .reset-btn img,
  .remove-btn img,
  .upload-btn img,
  .remove-logo-btn img,
  .new-convert-btn img,
  .new-compress-btn img,
  .new-cut-btn img,
  .new-extract-btn img,
  .new-process-btn img,
  .control-btn img,
  .option-btn img,
  .search-btn img {
    filter: invert(1);
  }
  
  /* 白色背景按钮（下载按钮）内的图标不反色，因为它们本身就是白色 */
  .download-btn img,
  .download-all-btn img {
    filter: none;
  }
  
  /* 通用图标适配 - 对所有含有1F1F1F（黑色）的SVG图标进行反色 */
  img[src*="1F1F1F"] {
    filter: invert(1);
  }
  
  /* 白色图标（FFFFFF）保持原样 */
  img[src*="FFFFFF"] {
    filter: none;
  }
  
  /* 首页工具选择器相关的图标 */
  .tool-selector-modal .close-icon {
    filter: invert(1);
  }
  
  /* 排除用户头像和特定图片 */
  .user-avatar img,
  .user-avatar-large img,
  .logo-img,
  .social-icon {
    filter: none;
  }
}

/* 强制暗黑模式类的图标适配 */
.dark-theme .sidebar-nav .icon {
  filter: invert(1);
}

.dark-theme .tab-icon {
  filter: invert(1);
}

.dark-theme .tab.active .tab-icon {
  filter: none;
}

.dark-theme .tab.active .close-icon {
  filter: none;
}

.dark-theme .tool-icon {
  filter: invert(1);
}

.dark-theme .search-bar::before {
  filter: invert(1);
}

.dark-theme .clear-btn {
  filter: invert(1);
}

.dark-theme .edit-icon {
  filter: invert(1);
}

.dark-theme .close-icon {
  filter: invert(1);
}

.dark-theme .download-btn img {
  filter: invert(1);
}

/* 页面内容区域的所有图标反色 */
.dark-theme .upload-icon {
  filter: invert(1);
}

.dark-theme .button-icon {
  filter: invert(1);
}

.dark-theme .back-icon {
  filter: invert(1);
}

.dark-theme .favorite-icon {
  filter: invert(1);
}

.dark-theme .copy-icon {
  filter: invert(1);
}

.dark-theme .refresh-icon {
  filter: invert(1);
}

.dark-theme .search-icon {
  filter: invert(1);
}

/* SVG图标使用currentColor的不需要反色，因为会自动跟随文字颜色 */
.dark-theme .search-icon[fill="currentColor"],
.dark-theme .member-icon[fill="currentColor"] {
  filter: none;
}

/* 各种操作按钮内的图标 */
.dark-theme .clear-btn img,
.dark-theme .copy-btn img,
.dark-theme .action-btn img,
.dark-theme .compress-btn img,
.dark-theme .convert-btn img,
.dark-theme .cut-btn img,
.dark-theme .extract-btn img,
.dark-theme .process-btn img,
.dark-theme .submit-btn img,
.dark-theme .reset-btn img,
.dark-theme .remove-btn img,
.dark-theme .upload-btn img,
.dark-theme .remove-logo-btn img,
.dark-theme .new-convert-btn img,
.dark-theme .new-compress-btn img,
.dark-theme .new-cut-btn img,
.dark-theme .new-extract-btn img,
.dark-theme .new-process-btn img,
.dark-theme .control-btn img,
.dark-theme .option-btn img,
.dark-theme .search-btn img {
  filter: invert(1);
}

/* 白色背景按钮（下载按钮）内的图标不反色，因为它们本身就是白色 */
.dark-theme .download-btn img,
.dark-theme .download-all-btn img {
  filter: none;
}

/* 通用图标适配 - 对所有含有1F1F1F（黑色）的SVG图标进行反色 */
.dark-theme img[src*="1F1F1F"] {
  filter: invert(1);
}

/* 白色图标（FFFFFF）保持原样 */
.dark-theme img[src*="FFFFFF"] {
  filter: none;
}

/* 首页工具选择器相关的图标 */
.dark-theme .tool-selector-modal .close-icon {
  filter: invert(1);
}

.dark-theme .user-avatar img,
.dark-theme .user-avatar-large img,
.dark-theme .logo-img,
.dark-theme .social-icon {
  filter: none;
}