/* ============================================
   小红书运营工具 - 主样式表
   设计规范参考：产品需求文档 5.1-5.5
   ============================================ */

/* ---------- 自定义属性 (Design Tokens) ---------- */
:root {
    /* 主色调 */
    --color-primary: #FF2442;
    --color-primary-hover: #E61A35;
    --color-primary-light: #FFF1F3;
    --color-primary-bg: rgba(255, 36, 66, 0.06);

    /* 功能色 */
    --color-success: #00B42A;
    --color-success-bg: #E8FFEA;
    --color-warning: #FF7D00;
    --color-warning-bg: #FFF7E8;
    --color-info: #165DFF;
    --color-info-bg: #E8F0FF;
    --color-danger: #F53F3F;
    --color-purple: #722ED1;

    /* 中性色 */
    --color-text-primary: #1D2129;
    --color-text-secondary: #4E5969;
    --color-text-tertiary: #86909C;
    --color-text-disabled: #C9CDD4;
    --color-border: #E5E6EB;
    --color-border-light: #F2F3F5;
    --color-fill: #F7F8FA;
    --color-fill-light: #FAFBFC;
    --color-bg: #F2F3F5;
    --color-white: #FFFFFF;

    /* 数据可视化配色 */
    --chart-1: #FF2442;
    --chart-2: #FF7D00;
    --chart-3: #FF9A2E;
    --chart-4: #165DFF;
    --chart-5: #722ED1;
    --chart-6: #00B42A;

    /* 侧边栏 */
    --sidebar-width: 240px;
    --sidebar-collapsed-width: 68px;

    /* 间距 */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-xxl: 48px;

    /* 圆角 */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;

    /* 阴影 */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.08);
    --shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.12);

    /* 字体 */
    --font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-size-xs: 11px;
    --font-size-sm: 12px;
    --font-size-md: 14px;
    --font-size-lg: 16px;
    --font-size-xl: 20px;
    --font-size-xxl: 24px;
    --font-size-huge: 32px;

    /* 过渡 */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.25s ease;
    --transition-slow: 0.35s ease;

    /* 导航栏高度 */
    --topbar-height: 60px;
}

/* ---------- Reset & Base ---------- */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-family);
    font-size: var(--font-size-md);
    line-height: 1.6;
    color: var(--color-text-primary);
    background: var(--color-bg);
    overflow-x: hidden;
    min-height: 100vh;
}

a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
img { max-width: 100%; display: block; }
button { cursor: pointer; border: none; background: none; font-family: inherit; font-size: inherit; }
input, select, textarea { font-family: inherit; font-size: inherit; }
table { border-collapse: collapse; width: 100%; }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--color-text-disabled); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-text-tertiary); }

/* ============================================
   侧边导航栏
   ============================================ */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--sidebar-width);
    background: var(--color-white);
    border-right: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    z-index: 1000;
    transition: width var(--transition-normal), transform var(--transition-normal);
    overflow: hidden;
}

.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--topbar-height);
    padding: 0 var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
    flex-shrink: 0;
}

.logo {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    overflow: hidden;
    white-space: nowrap;
}

.logo svg { flex-shrink: 0; }

.logo-text {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-text-primary);
    white-space: nowrap;
}

.sidebar-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    color: var(--color-text-tertiary);
    transition: all var(--transition-fast);
    flex-shrink: 0;
}

.sidebar-toggle:hover {
    background: var(--color-fill);
    color: var(--color-text-secondary);
}

/* 导航列表 */
.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding: var(--spacing-sm);
}

.nav-item { margin-bottom: 2px; }

.nav-link {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    height: 44px;
    padding: 0 var(--spacing-md);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    font-size: var(--font-size-md);
    transition: all var(--transition-fast);
    position: relative;
    white-space: nowrap;
    overflow: hidden;
}

.nav-link .nav-icon {
    flex-shrink: 0;
    opacity: 0.7;
    transition: opacity var(--transition-fast);
}

.nav-link:hover {
    background: var(--color-fill);
    color: var(--color-text-primary);
}

.nav-link:hover .nav-icon { opacity: 1; }

.nav-link.active {
    background: var(--color-primary-bg);
    color: var(--color-primary);
}

.nav-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 20px;
    background: var(--color-primary);
    border-radius: 0 2px 2px 0;
}

.nav-link.active .nav-icon { opacity: 1; }

/* 会员徽章 */
.nav-badge-vip {
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #f59e0b, #e8790f);
    padding: 1px 6px;
    border-radius: 8px;
    margin-left: auto;
    white-space: nowrap;
    flex-shrink: 0;
}

/* 侧边栏底部 */
.sidebar-footer {
    padding: var(--spacing-md);
    border-top: 1px solid var(--color-border-light);
    flex-shrink: 0;
}

.user-info {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-lg);
    transition: background var(--transition-fast);
    overflow: hidden;
}

.user-info:hover { background: var(--color-fill); }

.user-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-primary), #FF6B81);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: var(--font-size-md);
    flex-shrink: 0;
}

.user-details {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.user-name {
    font-size: var(--font-size-md);
    font-weight: 500;
    color: var(--color-text-primary);
    white-space: nowrap;
}

.user-role {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
    white-space: nowrap;
}

/* 侧边栏折叠状态 */
.sidebar.collapsed {
    width: var(--sidebar-collapsed-width);
}

.sidebar.collapsed .logo-text,
.sidebar.collapsed .nav-link span,
.sidebar.collapsed .nav-link .nav-badge-vip,
.sidebar.collapsed .user-details,
.sidebar.collapsed .sidebar-toggle svg {
    opacity: 0;
    pointer-events: none;
}

.sidebar.collapsed .nav-link {
    justify-content: center;
    padding: 0;
}

.sidebar.collapsed .user-info {
    justify-content: center;
    padding: var(--spacing-sm);
}

/* ============================================
   主内容区
   ============================================ */
.main-wrapper {
    margin-left: var(--sidebar-width);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    transition: margin-left var(--transition-normal);
}

.sidebar.collapsed ~ .main-wrapper {
    margin-left: var(--sidebar-collapsed-width);
}

/* ---------- 顶部导航栏 ---------- */
.topbar {
    position: sticky;
    top: 0;
    height: var(--topbar-height);
    background: var(--color-white);
    border-bottom: 1px solid var(--color-border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--spacing-lg);
    z-index: 900;
    backdrop-filter: blur(8px);
}

.topbar-left {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.mobile-menu-btn {
    display: none;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    transition: background var(--transition-fast);
}

.mobile-menu-btn:hover { background: var(--color-fill); }

.page-title {
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--color-text-primary);
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.btn-label { display: inline; }

/* ---------- 主内容 ---------- */
.main-content {
    flex: 1;
    padding: var(--spacing-lg);
    max-width: 1600px;
    width: 100%;
    margin: 0 auto;
}

.page-section {
    display: none;
    animation: fadeInUp 0.35s ease;
}

.page-section.active { display: block; }

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================
   按钮组件
   ============================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    height: 36px;
    padding: 0 var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-md);
    font-weight: 500;
    white-space: nowrap;
    transition: all var(--transition-fast);
    cursor: pointer;
}

.btn-primary {
    background: var(--color-primary);
    color: white;
    border: 1px solid var(--color-primary);
}

.btn-primary:hover {
    background: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
    box-shadow: 0 2px 8px rgba(255, 36, 66, 0.3);
}

.btn-ai {
    background: linear-gradient(135deg, #6a5af9, #d66efd);
    color: white;
    border: 1px solid #6a5af9;
    font-weight: 600;
}

.btn-ai:hover {
    background: linear-gradient(135deg, #5849d6, #c55ee6);
    border-color: #5849d6;
    box-shadow: 0 2px 8px rgba(106, 90, 249, 0.3);
}

.btn-secondary {
    background: var(--color-white);
    color: var(--color-text-primary);
    border: 1px solid var(--color-border);
}

.btn-secondary:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.btn-text {
    background: transparent;
    color: var(--color-text-secondary);
    border: none;
}

.btn-text:hover {
    color: var(--color-primary);
    background: var(--color-primary-bg);
}

.btn-sm { height: 30px; padding: 0 var(--spacing-sm); font-size: var(--font-size-sm); }
.btn-lg { height: 44px; padding: 0 var(--spacing-lg); font-size: var(--font-size-lg); }
.btn-block { width: 100%; }

/* ============================================
   工作台总览 - 数据卡片
   ============================================ */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.stat-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    cursor: pointer;
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.stat-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-sm);
}

.stat-label {
    font-size: var(--font-size-md);
    color: var(--color-text-tertiary);
}

.stat-badge {
    font-size: var(--font-size-xs);
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

.stat-badge.up { background: var(--color-success-bg); color: var(--color-success); }
.stat-badge.warning { background: var(--color-warning-bg); color: var(--color-warning); }
.stat-badge.danger { background: #FEE8E8; color: var(--color-danger); }

.stat-value {
    font-size: var(--font-size-huge);
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.2;
    margin-bottom: var(--spacing-sm);
}

.stat-unit { font-size: var(--font-size-lg); font-weight: 500; color: var(--color-text-tertiary); }

.stat-footer {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
}

.stat-change { font-weight: 500; }
.stat-change.up { color: var(--color-success); }
.stat-change.down { color: var(--color-danger); }
.stat-period { color: var(--color-text-tertiary); }

/* ============================================
   图表卡片
   ============================================ */
.charts-row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

/* ============================================
   对比卡片（昨日/本周）
   ============================================ */
.compare-section {
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-lg);
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
}
.compare-section-header {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}
.compare-section-header h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--color-text);
}
.compare-hint {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
}
.compare-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}
.compare-card {
    padding: var(--spacing-md);
    background: var(--color-bg);
    border-radius: var(--radius-md);
    text-align: center;
    transition: transform .15s, box-shadow .15s;
}
.compare-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.compare-metric {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
    margin-bottom: var(--spacing-xs);
}
.compare-today {
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--color-text);
    line-height: 1.3;
}
.compare-yesterday {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: 2px;
}
.compare-change {
    display: inline-block;
    margin-top: var(--spacing-xs);
    padding: 2px 8px;
    border-radius: 10px;
    font-size: var(--font-size-xs);
    font-weight: 600;
}
.compare-change.up {
    background: #E8F8EF;
    color: #00B42A;
}
.compare-change.down {
    background: #FFECE8;
    color: #FF4D4F;
}
.compare-change.flat {
    background: var(--color-bg);
    color: var(--color-text-tertiary);
}

.chart-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.chart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-md) var(--spacing-lg);
    border-bottom: 1px solid var(--color-border-light);
}

.chart-header h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
}

.chart-tabs {
    display: flex;
    gap: 2px;
    background: var(--color-fill);
    padding: 2px;
    border-radius: var(--radius-md);
}

.chart-tab {
    padding: 4px 12px;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    border-radius: var(--radius-sm);
    transition: all var(--transition-fast);
}

.chart-tab.active {
    background: var(--color-white);
    color: var(--color-primary);
    box-shadow: var(--shadow-sm);
}

.chart-body { height: 320px; padding: var(--spacing-md); }

.chart-card-small .chart-body { height: 320px; }

/* ============================================
   信息行（表格 + 待办）
   ============================================ */
.info-row {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.info-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.info-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-md) var(--spacing-lg);
    border-bottom: 1px solid var(--color-border-light);
}

.info-card-header h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
}

.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: var(--color-primary);
    color: white;
    font-size: var(--font-size-xs);
    font-weight: 600;
}

.info-tabs {
    display: flex;
    gap: var(--spacing-md);
}

.info-tab {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    padding-bottom: 2px;
    border-bottom: 2px solid transparent;
    transition: all var(--transition-fast);
}

.info-tab.active {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

.info-card-body { padding: var(--spacing-md) var(--spacing-lg); }

/* ---------- 排行表格 ---------- */
.rank-table {
    width: 100%;
}

.rank-table th {
    padding: var(--spacing-sm) var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    font-weight: 500;
    text-align: left;
    background: var(--color-fill);
}

.rank-table th:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.rank-table th:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }

.rank-table td {
    padding: 10px var(--spacing-sm);
    font-size: var(--font-size-md);
    border-bottom: 1px solid var(--color-border-light);
}

.rank-table tbody tr:last-child td { border-bottom: none; }
.rank-table tbody tr:hover { background: var(--color-fill-light); }

.rank-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: var(--font-size-sm);
}

.rank-num.top { background: #FFF1F3; color: var(--color-primary); }
.rank-num.normal { background: var(--color-fill); color: var(--color-text-tertiary); }

.rank-account-name { font-weight: 500; }
.rank-group { color: var(--color-text-tertiary); font-size: var(--font-size-sm); }

.trend-up { color: var(--color-success); }
.trend-down { color: var(--color-danger); }

/* ---------- 待办事项 ---------- */
.todo-list { display: flex; flex-direction: column; }

.todo-input-row {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.todo-input-row input {
    flex: 1;
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-md);
    outline: none;
    transition: border-color var(--transition-fast);
}

.todo-input-row input:focus { border-color: var(--color-primary); }

.todo-input-row button {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: var(--radius-sm);
    font-size: 18px;
    line-height: 1;
}

.todo-delete-btn {
    background: none;
    border: none;
    color: var(--color-text-tertiary);
    font-size: 18px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
    border-radius: 4px;
    transition: all var(--transition-fast);
    flex-shrink: 0;
}

.todo-delete-btn:hover { color: var(--color-primary); background: rgba(0,0,0,0.04); }

.todo-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border-light);
}

.todo-item:last-child { border-bottom: none; }

.todo-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 6px;
    flex-shrink: 0;
}

.todo-dot.urgent { background: var(--color-primary); }
.todo-dot.normal { background: var(--color-warning); }
.todo-dot.low { background: var(--color-info); }

.todo-content { flex: 1; font-size: var(--font-size-md); }
.todo-time { font-size: var(--font-size-sm); color: var(--color-text-tertiary); }

/* ---------- 热点推荐 ---------- */
.section-block {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.section-block-header {
    margin-bottom: var(--spacing-md);
}

.section-block-header h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
}

.hot-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.hot-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: var(--color-fill);
    border-radius: 20px;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    transition: all var(--transition-fast);
    cursor: pointer;
}

.hot-tag:hover {
    background: var(--color-primary-bg);
    color: var(--color-primary);
}

.hot-tag .rank-badge {
    font-size: 10px;
    color: var(--color-primary);
    font-weight: 600;
}

/* ============================================
   页面通用
   ============================================ */
.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-lg);
}

.page-header h2 {
    font-size: var(--font-size-xxl);
    font-weight: 700;
}

.page-header-actions {
    display: flex;
    gap: var(--spacing-sm);
}

.filter-bar {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
    flex-wrap: wrap;
}

.filter-group {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.filter-select, .filter-input {
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-white);
    color: var(--color-text-primary);
    font-size: var(--font-size-md);
    outline: none;
    transition: border-color var(--transition-fast);
}

.filter-select:focus, .filter-input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(255, 36, 66, 0.1);
}

.filter-input { min-width: 200px; }

/* ============================================
   表格容器
   ============================================ */
.table-container {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.data-table { width: 100%; }

.data-table th {
    padding: 12px var(--spacing-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-text-tertiary);
    text-align: left;
    background: var(--color-fill);
    white-space: nowrap;
}

.data-table td {
    padding: 12px var(--spacing-md);
    font-size: var(--font-size-md);
    border-bottom: 1px solid var(--color-border-light);
    white-space: nowrap;
}

.data-table tbody tr:nth-child(even) { background: var(--color-fill-light); }
.data-table tbody tr:hover { background: var(--color-info-bg); }
.data-table tbody tr:last-child td { border-bottom: none; }

/* 状态标签 */
.status-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.status-tag.online { background: var(--color-success-bg); color: var(--color-success); }
.status-tag.offline { background: var(--color-fill); color: var(--color-text-disabled); }
.status-tag.warning { background: var(--color-warning-bg); color: var(--color-warning); }


/* ============================================
   AI 标题优化助手
   ============================================ */
.to-input-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}
.to-input-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}
.to-input-header h3 { font-size: var(--font-size-lg); font-weight: 600; color: var(--color-text); margin-right: var(--spacing-sm); }
.to-input-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.to-cat-chip-header {
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text-secondary);
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.to-cat-chip-header:hover { border-color: var(--color-primary); color: var(--color-primary); }
.to-cat-chip-header.active {
    background: linear-gradient(135deg, #ff2442 0%, #ff5170 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 2px 6px rgba(255, 36, 66, 0.3);
}
.to-cat-tips {
    font-size: 12px;
    color: var(--color-text-tertiary);
    margin-top: 4px;
    padding-left: 4px;
}
.to-cat-tips strong { color: var(--color-primary); }
.to-industry-hint {
    margin-top: var(--spacing-md);
    padding: var(--spacing-md);
    background: linear-gradient(135deg, rgba(255, 36, 66, 0.06) 0%, rgba(255, 200, 200, 0.06) 100%);
    border: 1px dashed rgba(255, 36, 66, 0.3);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    font-size: 13px;
    line-height: 1.7;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}
.to-industry-hint strong { color: var(--color-primary); display: block; margin-bottom: 4px; }
.to-industry-hint span { display: block; color: var(--color-text); }
.to-input-area { position: relative; }
.to-input-area textarea {
    width: 100%;
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
    font-size: var(--font-size-md);
    font-family: inherit;
    resize: vertical;
    min-height: 100px;
    transition: border-color .2s;
    background: var(--color-bg);
    line-height: 1.6;
}
.to-input-area textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    background: var(--color-white);
}
.to-input-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--spacing-sm);
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}
.to-char-count { font-size: var(--font-size-xs); color: var(--color-text-tertiary); }
.to-char-count.over { color: var(--color-danger); font-weight: 600; }

/* 评分面板 */
.to-score-panel {
    display: flex;
    gap: var(--spacing-lg);
    align-items: center;
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-md);
    flex-wrap: wrap;
}
.to-total-score-wrapper { text-align: center; min-width: 100px; }
.to-total-score {
    font-size: 48px;
    font-weight: 800;
    line-height: 1;
}
.to-total-score.good { color: #00B42A; }
.to-total-score.medium { color: #FF7D00; }
.to-total-score.bad { color: #FF4D4F; }
.to-total-label { font-size: var(--font-size-xs); color: var(--color-text-tertiary); margin-top: 4px; }
.to-score-bars { flex: 1; min-width: 250px; }
.to-score-bar-row {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: 8px;
}
.to-score-bar-label { font-size: var(--font-size-xs); color: var(--color-text-secondary); width: 80px; flex-shrink: 0; }
.to-score-bar-track {
    flex: 1;
    height: 8px;
    background: var(--color-fill);
    border-radius: 4px;
    overflow: hidden;
}
.to-score-bar-fill {
    height: 100%;
    border-radius: 4px;
    background: linear-gradient(90deg, #FF2442, #FF7D00);
    transition: width .6s cubic-bezier(.4,0,.2,1);
}
.to-score-bar-value { font-size: var(--font-size-xs); color: var(--color-text-secondary); width: 40px; text-align: right; flex-shrink: 0; }

/* 诊断 */
.to-diagnosis {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-md);
}
.to-diagnosis h4 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-sm); color: var(--color-text); }
.to-tip-item {
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    margin-bottom: 4px;
    font-size: var(--font-size-sm);
}
.to-tip-item.warn { background: #FFF7E6; color: #D46B08; border-left: 3px solid #FF7D00; }
.to-tip-item.info { background: #E8F3FF; color: #165DFF; border-left: 3px solid #165DFF; }
.to-tip-item.good { background: #E8F8EF; color: #00B42A; border-left: 3px solid #00B42A; }

/* 优化版本 */
.to-variants-section { margin-bottom: var(--spacing-md); }
.to-variants-section h3 { font-size: var(--font-size-lg); font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.to-variants-subtitle { font-size: var(--font-size-xs); color: var(--color-text-tertiary); margin-bottom: var(--spacing-md); }
.to-variants-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
}
.to-variant-card {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    cursor: pointer;
    transition: all .2s;
    position: relative;
    overflow: hidden;
}
.to-variant-card:hover {
    border-color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.to-variant-card.copied {
    border-color: #00B42A;
    background: #E8F8EF;
}
.to-variant-rank {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
    margin-bottom: 8px;
}
.to-variant-text {
    font-size: var(--font-size-md);
    font-weight: 600;
    color: var(--color-text);
    line-height: 1.5;
    word-break: break-word;
}
.to-variant-copy-hint {
    font-size: var(--font-size-xs);
    color: var(--color-text-disabled);
    margin-top: 8px;
    text-align: right;
    transition: color .2s;
}
.to-variant-card:hover .to-variant-copy-hint { color: var(--color-primary); }

/* 技巧提示 */
.to-tips-section {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: var(--spacing-lg);
}
.to-tips-section h4 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-md); color: var(--color-text); }
.to-tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-sm);
}
.to-tip-card {
    padding: var(--spacing-md);
    background: var(--color-bg);
    border-radius: var(--radius-md);
}
.to-tip-card strong { display: block; font-size: var(--font-size-sm); color: var(--color-text); margin-bottom: 4px; }
.to-tip-card p { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin: 0; line-height: 1.5; }

/* 空状态 */
.to-empty-state {
    text-align: center;
    padding: 60px 20px;
    background: var(--color-white);
    border-radius: var(--radius-lg);
    border: 2px dashed var(--color-border);
}
.to-empty-icon { font-size: 48px; margin-bottom: var(--spacing-md); }
.to-empty-state h3 { font-size: var(--font-size-lg); color: var(--color-text); margin-bottom: var(--spacing-xs); }
.to-empty-state p { font-size: var(--font-size-sm); color: var(--color-text-secondary); margin-bottom: 4px; }
.to-empty-sub { color: var(--color-text-tertiary); max-width: 420px; margin: var(--spacing-sm) auto 0; }

/* 响应式 */
@media (max-width: 768px) {
    .to-variants-grid { grid-template-columns: 1fr; }
    .to-tips-grid { grid-template-columns: 1fr; }
    .to-score-panel { flex-direction: column; text-align: center; }
    .to-score-bars { width: 100%; }
    .to-input-actions { width: 100%; }
    .to-input-actions .btn { font-size: 11px; padding: 4px 8px; }
}

/* ============================================
   A. 爆款笔记灵感库
   ============================================ */
.hn-controls { margin-bottom: var(--spacing-lg); }
.hn-filter-row {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
    background: var(--color-white);
    padding: var(--spacing-md);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
}
.hn-filter-row select, .hn-filter-row input {
    padding: 6px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    background: var(--color-bg);
}
.hn-filter-row input { flex: 1; min-width: 160px; }
.hn-count { font-size: var(--font-size-xs); color: var(--color-text-tertiary); margin-left: auto; }
#hnFavBtn.active { background: #FFF7E6; border-color: #FF7D00; color: #FF7D00; }
.hn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: var(--spacing-md);
}
.hn-empty { text-align: center; padding: 60px 20px; color: var(--color-text-tertiary); font-size: var(--font-size-md); }
.hn-card {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    transition: all .2s;
    cursor: default;
}
.hn-card:hover { border-color: var(--color-primary); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.hn-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.hn-cat-tag { font-size: 11px; background: var(--color-bg); padding: 2px 8px; border-radius: 10px; color: var(--color-text-secondary); }
.hn-likes { font-size: var(--font-size-xs); color: #FF7D00; font-weight: 600; }
.hn-card-title { font-size: var(--font-size-md); font-weight: 600; color: var(--color-text); margin-bottom: 8px; cursor: pointer; line-height: 1.4; }
.hn-card-title:hover { color: var(--color-primary); }
.hn-cover-desc { font-size: var(--font-size-xs); color: var(--color-text-secondary); margin-bottom: 6px; line-height: 1.5; }
.hn-first-line { font-size: var(--font-size-sm); color: var(--color-text); margin-bottom: 6px; cursor: pointer; line-height: 1.5; font-style: italic; }
.hn-first-line:hover { color: var(--color-primary); }
.hn-tags-line { font-size: 11px; color: #165DFF; margin-bottom: 10px; cursor: pointer; line-height: 1.5; word-break: break-all; }
.hn-card-meta { font-size: 11px; color: var(--color-text-secondary); margin: -4px 0 8px 0; opacity: 0.85; }
.hn-badge { display: inline-block; font-size: 10px; padding: 1px 6px; border-radius: 8px; margin-left: 4px; vertical-align: middle; line-height: 1.4; font-weight: 600; }
.hn-badge-new { background: linear-gradient(135deg,#FF4D4F,#FF7875); color: #fff; animation: hn-new-pulse 1.6s ease-in-out infinite; }
.hn-badge-hot { background: linear-gradient(135deg,#FF7D00,#FFC53D); color: #fff; }
.hn-badge-up { background: #E6F4FF; color: #165DFF; }
.hn-badge-evergreen { background: #F0FDF4; color: #15803D; }
@keyframes hn-new-pulse { 0%,100%{ transform: scale(1); box-shadow: 0 0 0 0 rgba(255,77,79,.5);} 50%{ transform: scale(1.06); box-shadow: 0 0 0 4px rgba(255,77,79,0);} }
.hn-tags-line:hover { opacity: .7; }
.hn-card-actions { display: flex; gap: 6px; }

/* ============================================
   灵感雷达（爆款灵感库升级版）
   ============================================ */
.hn-badge-new { font-size: 11px; background: linear-gradient(135deg, #FF2442, #FF7D00); color: #fff; padding: 2px 10px; border-radius: 10px; vertical-align: middle; margin-left: 6px; font-weight: 600; }
.radar-daily { background: linear-gradient(135deg, #FFF5F6 0%, #FFF0E6 100%); border: 1px solid #FFE0D6; border-radius: 16px; padding: 18px 20px; margin-bottom: 18px; }
.radar-daily-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.radar-daily-date { font-size: 18px; font-weight: 700; color: #FF2442; }
.radar-daily-sub { font-size: 12px; color: #8c8c8c; }
.radar-signals { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px; }
.radar-signal { font-size: 12px; background: #fff; border: 1px solid #FFD6C2; color: #B25000; padding: 4px 12px; border-radius: 20px; }
.radar-daily-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.radar-daily-item { background: #fff; border: 1px solid #FFE8E0; border-radius: 12px; padding: 12px 14px; transition: .2s; }
.radar-daily-item:hover { border-color: #FF2442; box-shadow: 0 2px 10px rgba(255,36,66,.08); transform: translateY(-1px); }
.radar-daily-item .rd-cat { font-size: 11px; color: #fff; background: #FF2442; padding: 2px 8px; border-radius: 8px; margin-right: 6px; }
.radar-daily-item .rd-formula { font-size: 11px; color: #FF7D00; }
.radar-daily-item .rd-title { font-size: 14px; font-weight: 600; color: #333; margin: 8px 0 6px; line-height: 1.4; cursor: pointer; }
.radar-daily-item .rd-title:hover { color: #FF2442; }
.radar-daily-item .rd-tags { font-size: 11px; color: #165DFF; line-height: 1.5; }
.radar-daily-item .rd-actions { margin-top: 8px; display: flex; gap: 6px; }
.radar-gen-card { background: #fff; border: 1px solid var(--color-border); border-radius: 16px; padding: 18px 20px; margin-bottom: 18px; }
.radar-gen-head h3 { margin: 0 0 4px; font-size: 16px; }
.radar-gen-head p { margin: 0 0 12px; font-size: 12px; color: var(--color-text-tertiary); }
.radar-gen-row { display: flex; gap: 10px; flex-wrap: wrap; }
.radar-gen-row select, .radar-gen-row input { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 13px; background: var(--color-bg); }
.radar-gen-row select { flex: 0 0 110px; }
.radar-gen-row input { flex: 1; min-width: 220px; }
.radar-result { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.radar-idea { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; background: #FAFAFA; transition: .2s; }
.radar-idea:hover { border-color: #FF2442; background: #fff; box-shadow: 0 2px 10px rgba(255,36,66,.06); }
.radar-idea-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.radar-idea-formula { font-size: 11px; background: #FFF0E6; color: #FF7D00; padding: 2px 8px; border-radius: 8px; font-weight: 600; }
.radar-idea-copy { font-size: 11px; color: #165DFF; cursor: pointer; }
.radar-idea-copy:hover { text-decoration: underline; }
.radar-idea-title { font-size: 14px; font-weight: 600; color: #333; line-height: 1.45; margin-bottom: 6px; cursor: pointer; }
.radar-idea-title:hover { color: #FF2442; }
.radar-idea-hook { font-size: 12px; color: #666; line-height: 1.55; margin-bottom: 6px; cursor: pointer; }
.radar-idea-tags { font-size: 11px; color: #165DFF; line-height: 1.6; cursor: pointer; }
.radar-idea-explain { font-size: 11px; color: #999; margin-top: 6px; border-top: 1px dashed #eee; padding-top: 6px; }
.hn-sub-title { font-size: 13px; font-weight: 600; color: #666; margin: 6px 0 10px; display: flex; align-items: center; gap: 6px; }

/* ============================================
   B. AI 笔记发布前自检
   ============================================ */
.nc-input-card { background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); padding: var(--spacing-lg); margin-bottom: var(--spacing-lg); }
.nc-input-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--spacing-md); }
.nc-input-header h3 { font-size: var(--font-size-lg); font-weight: 600; }
.nc-input-card textarea {
    width: 100%; border: 2px solid var(--color-border); border-radius: var(--radius-md);
    padding: var(--spacing-md); font-size: var(--font-size-sm); font-family: inherit;
    resize: vertical; min-height: 200px; line-height: 1.7; background: var(--color-bg);
    transition: border-color .2s;
}
.nc-input-card textarea:focus { outline: none; border-color: var(--color-primary); background: var(--color-white); }
.nc-input-footer { display: flex; justify-content: space-between; align-items: center; margin-top: var(--spacing-sm); flex-wrap: wrap; gap: var(--spacing-sm); }
.nc-stats { font-size: var(--font-size-xs); color: var(--color-text-tertiary); }
.nc-empty { text-align: center; padding: 60px 20px; background: var(--color-white); border-radius: var(--radius-lg); border: 2px dashed var(--color-border); }
.nc-empty-icon { font-size: 48px; margin-bottom: var(--spacing-md); }
.nc-empty h3 { font-size: var(--font-size-lg); color: var(--color-text); }
.nc-empty p { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.nc-results { margin-top: var(--spacing-lg); }
.nc-score-row { display: flex; gap: var(--spacing-lg); align-items: center; flex-wrap: wrap; background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); padding: var(--spacing-lg); margin-bottom: var(--spacing-md); }
.nc-big-score { font-size: 56px; font-weight: 800; min-width: 120px; text-align: center; line-height: 1; }
.nc-big-score span { font-size: 18px; font-weight: 400; }
.nc-big-score.good { color: #00B42A; }
.nc-big-score.medium { color: #FF7D00; }
.nc-big-score.bad { color: #FF4D4F; }
.nc-score-label { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.nc-score-dims { flex: 1; min-width: 260px; }
.nc-dim-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.nc-dim-bar-label { font-size: 11px; color: var(--color-text-secondary); width: 70px; flex-shrink: 0; }
.nc-dim-bar-track { flex: 1; height: 6px; background: var(--color-fill); border-radius: 3px; overflow: hidden; }
.nc-dim-bar-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, #FF2442, #FF7D00); }
.nc-dim-bar-val { font-size: 11px; color: var(--color-text-secondary); width: 36px; text-align: right; }
.nc-fixlist { background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); padding: var(--spacing-lg); margin-bottom: var(--spacing-md); }
.nc-fixlist h4 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-sm); }
.nc-fix-group { margin-bottom: var(--spacing-sm); }
.nc-fix-group-title { font-size: var(--font-size-sm); font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.nc-fix-item { padding: 4px 10px; font-size: var(--font-size-sm); color: #D46B08; background: #FFF7E6; border-left: 3px solid #FF7D00; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: 3px; }
.nc-fix-item.good { color: #00B42A; background: #E8F8EF; border-left-color: #00B42A; }
.nc-fixed-output { background: var(--color-white); border-radius: var(--radius-lg); border: 2px solid #00B42A; padding: var(--spacing-lg); }
.nc-fixed-output h4 { font-size: var(--font-size-md); font-weight: 600; margin-bottom: var(--spacing-sm); }
.nc-fixed-text { background: var(--color-bg); border-radius: var(--radius-md); padding: var(--spacing-md); font-size: var(--font-size-sm); line-height: 1.8; cursor: pointer; word-break: break-word; }
.nc-fixed-text:hover { background: #E8F8EF; }
.nc-fixed-hint { font-size: 11px; color: var(--color-text-tertiary); margin-top: var(--spacing-xs); text-align: center; }

/* ===== 发布前自检 · 聚光合规升级版 ===== */
.nc-badge-jg { display: inline-block; padding: 2px 8px; margin-left: 8px; font-size: 11px; font-weight: 500; color: #fff; background: linear-gradient(135deg,#FF2442 0%,#FF7A00 100%); border-radius: 10px; vertical-align: middle; }
.nc-jg-banner { display: flex; align-items: center; gap: 12px; padding: 14px 16px; margin-bottom: 14px; background: linear-gradient(135deg,#FFF5F7 0%,#FFF0E6 100%); border-left: 4px solid #FF2442; border-radius: var(--radius-md); }
.nc-jg-banner-icon { font-size: 26px; flex-shrink: 0; }
.nc-jg-banner-body { flex: 1; }
.nc-jg-banner-body strong { font-size: 14px; color: var(--color-text); }
.nc-jg-banner-sub { font-size: 12px; color: var(--color-text-secondary); margin-top: 2px; }

/* 行业 chip 切换器 */
.nc-industry-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px; margin-bottom: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.nc-industry-label { font-size: 12px; font-weight: 600; color: var(--color-text-secondary); margin-right: 4px; }
.nc-industry-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.nc-chip { display: inline-block; padding: 4px 10px; font-size: 12px; color: var(--color-text); background: var(--color-bg); border: 1px solid var(--color-border); border-radius: 14px; cursor: pointer; transition: all 0.2s; }
.nc-chip:hover { background: #FFE8EE; color: #FF2442; border-color: #FFB8C7; }
.nc-chip.active { background: linear-gradient(135deg,#FF2442 0%,#FF7A00 100%); color: #fff; border-color: transparent; box-shadow: 0 2px 6px rgba(255,36,66,.25); }

/* 输入区操作按钮组 */
.nc-input-actions { display: flex; gap: 6px; }

/* 聚光头 */
.nc-jg-card { display: flex; align-items: center; gap: 16px; padding: 18px 20px; margin-bottom: 14px; background: var(--color-white); border: 2px solid; border-radius: var(--radius-lg); position: relative; overflow: hidden; }
.nc-jg-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--jg-bg, transparent) 0%, transparent 50%); pointer-events: none; opacity: 0.4; }
.nc-jg-icon { width: 56px; height: 56px; flex-shrink: 0; border-radius: 50%; background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; flex-shrink: 0; }
.nc-jg-info { flex: 1; }
.nc-jg-title { font-size: 18px; font-weight: 700; color: var(--color-text); }
.nc-jg-total { margin-left: 10px; font-size: 14px; font-weight: 500; color: var(--color-text-secondary); }
.nc-jg-desc { font-size: 12px; color: var(--color-text-secondary); margin-top: 4px; }
.nc-jg-meta { display: flex; gap: 18px; flex-shrink: 0; }
.nc-jg-meta-item { text-align: center; }
.nc-jg-meta-item span { display: block; font-size: 11px; color: var(--color-text-secondary); margin-bottom: 2px; }
.nc-jg-meta-item strong { font-size: 18px; font-weight: 700; color: var(--color-text); }
.nc-jg-safe     { --jg-bg: #E8F8EF; }
.nc-jg-low      { --jg-bg: #FFFBE6; }
.nc-jg-medium   { --jg-bg: #FFF4E6; }
.nc-jg-high     { --jg-bg: #FFF1F0; }
.nc-jg-critical { --jg-bg: #FFE0E0; }

/* 命中词分布 */
.nc-hits-panel { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 16px 20px; margin-bottom: 14px; }
.nc-hits-panel h4 { font-size: 14px; font-weight: 600; margin-bottom: 12px; color: var(--color-text); }
.nc-hits-sub { font-size: 12px; font-weight: 400; color: var(--color-text-secondary); }
.nc-hits-groups { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px dashed var(--color-border); }
.nc-hit-grp { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: var(--color-bg); border-radius: 14px; font-size: 12px; }
.nc-hit-grp-icon { font-size: 14px; }
.nc-hit-grp-num { background: #FF2442; color: #fff; border-radius: 10px; padding: 0 6px; font-size: 11px; font-weight: 600; }
.nc-hits-empty { padding: 18px; text-align: center; color: #00B42A; background: #E8F8EF; border-radius: var(--radius-md); }
.nc-hits-list { display: flex; flex-direction: column; gap: 6px; }
.nc-hit-pill { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 10px; font-size: 12px; background: var(--color-bg); border-radius: var(--radius-sm); border-left: 3px solid #999; }
.nc-hit-pill b { color: var(--color-text); font-weight: 600; }
.nc-hit-pill u { color: #FF2442; text-decoration-style: wavy; text-underline-offset: 2px; }
.nc-hit-ctx { font-size: 11px; color: var(--color-text-secondary); margin-left: 4px; font-family: monospace; }
.nc-hit-more { padding: 4px 10px; font-size: 11px; color: var(--color-text-secondary); }

/* 命中词分类色板 */
.nc-hit-adlaw     { border-left-color: #722ED1; background: #F4F1FB; }
.nc-hit-outlink   { border-left-color: #F5222D; background: #FFF1F0; }
.nc-hit-sensitive { border-left-color: #FA8C16; background: #FFF7E6; }
.nc-hit-fake      { border-left-color: #FA541C; background: #FFF2E8; }
.nc-hit-clickbait { border-left-color: #EB2F96; background: #FFF0F6; }
.nc-hit-promo     { border-left-color: #13C2C2; background: #E6FFFB; }
.nc-hit-adult     { border-left-color: #A8071A; background: #FFE0E0; }
.nc-hit-violence  { border-left-color: #5C0011; background: #FFD9D9; }
.nc-hit-abuse     { border-left-color: #CB1B1B; background: #FFE0E0; }
.nc-hit-spam      { border-left-color: #7CB305; background: #F4FFB8; }
.nc-hit-platform  { border-left-color: #444; background: #F0F0F0; }

/* 12 维度评分条 */
.nc-score-head { display: flex; align-items: center; gap: 18px; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px dashed var(--color-border); }
.nc-big-score { font-size: 48px; font-weight: 800; line-height: 1; }
.nc-big-score.good { color: #00B42A; } .nc-big-score.medium { color: #FA8C16; } .nc-big-score.bad { color: #F5222D; }
.nc-big-score span { font-size: 16px; font-weight: 400; color: var(--color-text-secondary); margin-left: 4px; }
.nc-score-label { flex: 1; }
.nc-score-label-tag { display: inline-block; padding: 3px 10px; font-size: 12px; font-weight: 600; color: #fff; border-radius: 4px; margin-bottom: 4px; }
.nc-score-label-desc { font-size: 12px; color: var(--color-text-secondary); }
.nc-score-dims { display: flex; flex-direction: column; gap: 6px; }
.nc-dim-bar-label { font-size: 12px; color: var(--color-text); width: 110px; flex-shrink: 0; }
.nc-dim-jg { background: #FAFAFA; padding: 4px 8px; border-radius: 6px; margin-left: -6px; }
.nc-dim-tag { display: inline-block; padding: 0 5px; font-size: 10px; color: #fff; background: linear-gradient(90deg,#FF2442,#FF7A00); border-radius: 3px; margin-left: 4px; vertical-align: middle; }
.nc-dim-bar-fill.good { background: linear-gradient(90deg,#00B42A,#52C41A); }
.nc-dim-bar-fill.ok { background: linear-gradient(90deg,#FA8C16,#FFC53D); }
.nc-dim-bar-fill.bad { background: linear-gradient(90deg,#F5222D,#FF4D4F); }

/* 修改清单 / 替换记录 */
.nc-fix-count { font-size: 12px; font-weight: 400; color: var(--color-text-secondary); margin-left: 4px; }
.nc-fix-applied { padding: 10px 12px; margin-bottom: 10px; background: #E8F8EF; border-radius: var(--radius-md); border-left: 3px solid #00B42A; }
.nc-fix-applied strong { font-size: 12px; color: #00B42A; margin-right: 6px; }
.nc-fix-replace-item { display: inline-flex; align-items: center; gap: 3px; margin: 2px 4px 2px 0; font-size: 11px; }
.nc-fix-from { padding: 1px 5px; background: #FFE0E0; color: #C41D2A; border-radius: 3px; text-decoration: line-through; }
.nc-fix-to { padding: 1px 5px; background: #E8F8EF; color: #00B42A; border-radius: 3px; }
.nc-fix-replace-more { display: inline-block; margin-left: 4px; font-size: 11px; color: var(--color-text-secondary); }
.nc-fix-actions { display: flex; gap: 8px; margin-top: 10px; }

/* 修复版本 textarea */
.nc-fixed-output textarea.nc-fixed-text { width: 100%; min-height: 160px; cursor: default; font-family: inherit; line-height: 1.8; resize: vertical; border: 1px dashed var(--color-border); }

/* 空状态下的聚光 tag */
.nc-empty-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 20px; max-width: 720px; margin-left: auto; margin-right: auto; }
.nc-empty-tag { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; font-size: 12px; background: var(--color-bg); border: 1px solid var(--color-border); border-radius: 14px; }
.nc-empty-tag b { color: #FF2442; }
.nc-empty-tag span { color: var(--color-text-secondary); }
.nc-empty-tags .nc-empty-tag b + span::before { content: '·'; margin: 0 4px; color: var(--color-border); }

/* 响应式调整 */
@media (max-width: 768px) {
    .nc-jg-card { flex-direction: column; align-items: flex-start; }
    .nc-jg-meta { width: 100%; justify-content: space-around; }
    .nc-score-head { flex-direction: column; align-items: flex-start; }
}

/* ===== D. 违规词检测专属样式（双引擎版） ===== */
/* 标题旁的聚光徽章 */
.nc-badge-jg { display: inline-block; margin-left: 10px; padding: 3px 12px; font-size: 12px; font-weight: 600; color: #fff; background: linear-gradient(90deg,#FF2442,#A8071A); border-radius: 16px; vertical-align: middle; letter-spacing: 1px; box-shadow: 0 2px 6px rgba(255,36,66,.25); }
/* 顶部聚光规则提示条 */
.nc-jg-banner { display: flex; gap: 14px; align-items: flex-start; padding: 16px 20px; margin-bottom: 20px; border-radius: var(--radius-md); border: 1.5px solid #ffd591; background: linear-gradient(135deg,#fff7e6 0%,#fff1f0 100%); box-shadow: 0 2px 8px rgba(255,77,79,.05); }
.nc-jg-banner-icon { width: 44px; height: 44px; display: grid; place-items: center; font-size: 24px; background: linear-gradient(135deg,#FF2442,#fa8c16); border-radius: 12px; flex-shrink: 0; box-shadow: 0 4px 12px rgba(255,77,79,.2); }
.nc-jg-banner-body { flex: 1; min-width: 0; }
.nc-jg-banner-body strong { display: block; font-size: 15px; color: #A8071A; margin-bottom: 4px; }
.nc-jg-banner-sub { font-size: 12.5px; color: #6c4a3a; line-height: 1.6; }
/* 行业 chip 切换 */
.nc-industry-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 10px 14px; margin-bottom: 14px; border-radius: var(--radius-md); background: var(--color-bg); border: 1px solid var(--color-border); }
.nc-industry-label { font-size: 12.5px; color: var(--color-text-secondary); font-weight: 600; flex-shrink: 0; }
.nc-industry-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.nc-chip { display: inline-flex; align-items: center; padding: 5px 12px; font-size: 12px; color: var(--color-text-secondary); background: #fff; border: 1px solid var(--color-border); border-radius: 16px; cursor: pointer; transition: all .15s; user-select: none; }
.nc-chip:hover { border-color: #FF2442; color: #FF2442; }
.nc-chip.active { color: #fff; background: linear-gradient(90deg,#FF2442,#A8071A); border-color: transparent; box-shadow: 0 2px 6px rgba(255,36,66,.25); font-weight: 600; }
/* 12 维统计条 */
.nc-score-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.nc-dim-card { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--radius-md); background: #fff; border: 1px solid var(--color-border); transition: transform .15s, border-color .15s; }
.nc-dim-card:hover { transform: translateY(-1px); border-color: #FF8FA3; }
.nc-dim-card.nc-dim-source-jg { background: linear-gradient(135deg,#fff7e6 0%,#fff1f0 100%); border-color: #ffd591; }
.nc-dim-card.nc-dim-source-tag { background: #fafafa; }
.nc-dim-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; font-size: 11px; font-weight: 700; color: #fff; background: linear-gradient(135deg,#FF2442,#fa8c16); flex-shrink: 0; }
.nc-dim-card.nc-dim-source-tag .nc-dim-icon { background: linear-gradient(135deg,#722ed1,#2f54eb); }
.nc-dim-info { flex: 1; min-width: 0; }
.nc-dim-name { font-size: 13px; font-weight: 700; color: var(--color-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nc-dim-platform { font-size: 10px; color: var(--color-text-tertiary); margin-top: 1px; }
.nc-dim-num { min-width: 28px; height: 28px; padding: 0 8px; display: grid; place-items: center; border-radius: 14px; font-size: 13px; font-weight: 800; }
.nc-dim-num.zero { background: #f0f0f0; color: #999; }
.nc-dim-num.has { background: linear-gradient(135deg,#FF2442,#cf1322); color: #fff; box-shadow: 0 2px 6px rgba(255,36,66,.25); }
/* 命中词分布面板 */
.nc-hits-panel { margin: 18px 0; padding: 16px 20px; border-radius: var(--radius-md); background: #fff; border: 1px solid var(--color-border); box-shadow: 0 2px 6px rgba(0,0,0,.02); }
.nc-hits-panel h4 { font-size: 15px; font-weight: 700; color: var(--color-text-primary); margin: 0 0 12px; }
.nc-hits-sub { font-size: 12px; font-weight: 400; color: var(--color-text-tertiary); margin-left: 6px; }
.nc-hits-groups { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.nc-hits-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: #fff; border: 1.5px solid var(--color-border); border-radius: 20px; font-size: 12.5px; cursor: pointer; transition: all .15s; user-select: none; }
.nc-hits-chip:hover { border-color: #FF2442; }
.nc-hits-chip.active { border-color: #FF2442; background: #fff1f0; box-shadow: 0 2px 6px rgba(255,36,66,.15); }
.nc-hits-chip.nc-hits-zero { opacity: .55; }
.nc-hits-chip.nc-hits-alert .nc-hits-name { color: #A8071A; font-weight: 600; }
.nc-hits-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.nc-hits-name { color: var(--color-text-primary); }
.nc-hits-count { min-width: 22px; height: 18px; padding: 0 6px; display: grid; place-items: center; border-radius: 9px; font-size: 11px; font-weight: 700; }
.nc-hits-zero .nc-hits-count { background: #f0f0f0; color: #999; }
.nc-hits-alert .nc-hits-count { background: #FF2442; color: #fff; }
/* 12 色命中点 */
.nc-hits-dot.nc-hits-adult      { background: #A8071A; }
.nc-hits-dot.nc-hits-violence   { background: #5C0011; }
.nc-hits-dot.nc-hits-abuse      { background: #CB1B1B; }
.nc-hits-dot.nc-hits-spam       { background: #7CB305; }
.nc-hits-dot.nc-hits-adlaw      { background: #722ED1; }
.nc-hits-dot.nc-hits-platform   { background: #444; }
.nc-hits-dot.nc-hits-jg_adlaw   { background: #F5222D; }
.nc-hits-dot.nc-hits-jg_outlink { background: #FA8C16; }
.nc-hits-dot.nc-hits-jg_sens    { background: #FA541C; }
.nc-hits-dot.nc-hits-jg_fake    { background: #EB2F96; }
.nc-hits-dot.nc-hits-jg_click   { background: #C41D7F; }
.nc-hits-dot.nc-hits-jg_promo   { background: #13C2C2; }
/* 命中词卡片列表 */
.nc-hits-list { border-top: 1px dashed var(--color-border); padding-top: 14px; }
.nc-hits-title { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: 14px; }
.nc-hits-title strong { color: var(--color-text-primary); }
.nc-hits-tag { margin-left: auto; padding: 2px 10px; font-size: 11px; background: #fff1f0; color: #cf1322; border-radius: 12px; font-weight: 600; }
.nc-hits-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.nc-hits-card { padding: 10px 12px; background: #fff; border-radius: var(--radius-md); border: 1px solid var(--color-border); border-left-width: 4px; transition: transform .15s, box-shadow .15s; }
.nc-hits-card:hover { transform: translateX(2px); box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.nc-hits-card-word { font-size: 14px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 4px; }
.nc-hits-card-word span { color: #A8071A; }
.nc-hits-card-ctx { font-size: 12px; color: var(--color-text-tertiary); line-height: 1.5; word-break: break-all; }
.nc-hits-card-meta { margin-top: 6px; font-size: 11px; color: var(--color-text-tertiary); }
.nc-hits-empty { padding: 20px; text-align: center; color: var(--color-text-tertiary); font-size: 13px; background: #fafafa; border-radius: var(--radius-md); }
/* 12 类命中文字底色（用于文本标注 mark） */
.comply-hl-adult      { background: rgba(168,7,26,.18); color: #A8071A; padding: 0 2px; border-radius: 3px; }
.comply-hl-violence   { background: rgba(92,0,17,.18); color: #5C0011; padding: 0 2px; border-radius: 3px; }
.comply-hl-abuse      { background: rgba(203,27,27,.16); color: #CB1B1B; padding: 0 2px; border-radius: 3px; }
.comply-hl-spam       { background: rgba(124,179,5,.18); color: #5b8a00; padding: 0 2px; border-radius: 3px; }
.comply-hl-adlaw      { background: rgba(114,46,209,.16); color: #722ED1; padding: 0 2px; border-radius: 3px; }
.comply-hl-platform   { background: rgba(68,68,68,.16); color: #333; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_adlaw   { background: rgba(245,34,45,.18); color: #cf1322; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_outlink { background: rgba(250,140,22,.18); color: #d46b08; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_sens    { background: rgba(250,84,28,.18); color: #ad4e00; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_fake    { background: rgba(235,47,150,.16); color: #c41d7f; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_click   { background: rgba(196,29,127,.16); color: #c41d7f; padding: 0 2px; border-radius: 3px; }
.comply-hl-jg_promo   { background: rgba(19,194,194,.18); color: #08979c; padding: 0 2px; border-radius: 3px; }
/* 详情标签：聚光/小红书 */
.cd-tag { display: inline-block; margin-left: 4px; padding: 1px 8px; font-size: 10px; font-weight: 700; border-radius: 10px; flex-shrink: 0; vertical-align: middle; }
.cd-tag.xhs { background: #fff1f0; color: #FF2442; border: 1px solid #FFCCC7; }
.cd-tag.jg  { background: #fff7e6; color: #d46b08; border: 1px solid #ffd591; }
/* 合规版本输出 */
.nc-fixed-output { margin: 18px 0; padding: 16px 20px; border-radius: var(--radius-md); background: linear-gradient(135deg,#f6ffed,#f0fff4); border: 1.5px dashed #52c41a; }
.nc-fixed-output h4 { font-size: 15px; color: #389e0d; margin: 0 0 10px; }
.nc-fixed-text { width: 100%; min-height: 140px; padding: 10px 12px; font-size: 13px; line-height: 1.7; border-radius: var(--radius-md); border: 1px solid #b7eb8f; background: #fff; color: var(--color-text-primary); resize: vertical; }
/* 响应式 */
@media (max-width: 768px) {
    .nc-jg-banner { flex-direction: column; }
    .nc-industry-bar { flex-direction: column; align-items: flex-start; }
    .nc-score-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .nc-hits-cards { grid-template-columns: 1fr; }
    .nc-hits-chip { font-size: 12px; }
}
@media (max-width: 480px) {
    .nc-score-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* C. 封面标题生成器 - 已砍（由「爆款拆解」页面替代，位置：导航 → 爆款拆解） */

/* 新页面响应式 */
@media (max-width: 768px) {
    .hn-grid { grid-template-columns: 1fr; }
    .hn-filter-row { flex-direction: column; }
    .hn-filter-row input { width: 100%; }
    .nc-score-row { flex-direction: column; text-align: center; }
}

/* ============================================
   内容创作 - 竞品爆款仿写器
   ============================================ */
.clone-analyze { background: #F7F9FC; border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 14px; margin-bottom: 14px; }
.clone-analyze-title { font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.clone-analyze-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.clone-analyze-item { background: var(--color-white); border-radius: var(--radius-sm); padding: 8px 10px; }
.clone-analyze-label { display: block; font-size: 11px; font-weight: 600; color: #165DFF; margin-bottom: 4px; }
.clone-analyze-val { display: block; font-size: 12px; color: var(--color-text-secondary); line-height: 1.6; }
.clone-result-card { background: var(--color-white); border: 1px solid var(--color-border); border-left: 4px solid #722ED1; border-radius: var(--radius-md); padding: 14px; margin-bottom: 12px; }
.clone-result-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.clone-result-badge { font-size: 12px; font-weight: 600; color: #722ED1; }
.clone-result-topic { font-size: 11px; color: var(--color-text-tertiary); }
.clone-result-title { font-size: 14px; font-weight: 700; margin-bottom: 8px; line-height: 1.5; }
.clone-result-body { font-size: 13px; color: var(--color-text); line-height: 1.8; background: var(--color-bg); border-radius: var(--radius-sm); padding: 10px; }
.clone-result-body:hover { background: #F0F9FF; }
.clone-result-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 10px; }
.clone-tag { font-size: 11px; color: #722ED1; background: #F4EFFF; padding: 2px 8px; border-radius: 10px; }

/* 内容创作 - 笔记改写润色 */
.rewrite-diff-card { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: stretch; margin-bottom: 14px; }
.rewrite-diff-side { background: var(--color-bg); border-radius: var(--radius-md); padding: 12px; min-height: 120px; }
.rewrite-diff-new { background: #E8F8EF; border: 1px solid #00B42A; }
.rewrite-diff-arrow { display: flex; align-items: center; justify-content: center; font-size: 24px; color: var(--color-text-tertiary); }
.rewrite-diff-label { font-size: 11px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 6px; }
.rewrite-diff-new .rewrite-diff-label { color: #00B42A; }
.rewrite-diff-text { font-size: 12px; line-height: 1.7; color: var(--color-text); white-space: pre-wrap; word-break: break-word; cursor: pointer; }
.rewrite-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rewrite-stat { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 10px; text-align: center; }
.rewrite-stat-val { display: block; font-size: 20px; font-weight: 700; color: var(--color-text); }
.rewrite-stat-label { display: block; font-size: 11px; color: var(--color-text-tertiary); margin-top: 2px; }

/* 内容创作 - AI 评论回复 */
.cr-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 10px; cursor: pointer; transition: all .2s; }
.cr-card:hover { border-color: var(--color-primary); background: #FFFBFC; }
.cr-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.cr-style { font-size: 12px; font-weight: 600; color: var(--color-primary); }
.cr-hint { font-size: 10px; color: var(--color-text-tertiary); }
.cr-text { font-size: 13px; line-height: 1.7; color: var(--color-text); }

@media (max-width: 768px) {
    .rewrite-diff-card { grid-template-columns: 1fr; }
    .rewrite-diff-arrow { transform: rotate(90deg); padding: 4px 0; }
    .rewrite-stats { grid-template-columns: 1fr; }
}

.status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.status-tag.online .status-dot { background: var(--color-success); }
.status-tag.offline .status-dot { background: var(--color-text-disabled); }
.status-tag.warning .status-dot { background: var(--color-warning); }

/* ============================================
   内容创作
   ============================================ */
.content-creation-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

.cc-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-md);
    text-align: center;
    transition: all var(--transition-normal);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-md);
    cursor: pointer;
}

.cc-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.cc-card-icon {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-xl);
    display: flex;
    align-items: center;
    justify-content: center;
}

.cc-card-icon.bg-red { background: linear-gradient(135deg, #FF2442, #FF6B81); }
.cc-card-icon.bg-orange { background: linear-gradient(135deg, #FF7D00, #FF9A2E); }
.cc-card-icon.bg-purple { background: linear-gradient(135deg, #722ED1, #9B67E0); }
.cc-card-icon.bg-blue { background: linear-gradient(135deg, #165DFF, #4080FF); }

.cc-card h3 {
    font-size: var(--font-size-lg);
    font-weight: 600;
}

.cc-card p {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    line-height: 1.5;
}

/* 会员专享卡片样式 */
.cc-card-premium {
    position: relative;
    border: 1px dashed #ffccc7;
}
.cc-card-premium:hover {
    border-color: var(--color-primary);
}

.card-pro-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: linear-gradient(135deg, #ff2442, #ff6b81);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    letter-spacing: 0.5px;
}

/* 侧边栏 PRO 标签 */
.premium-badge {
    display: inline-block;
    background: linear-gradient(135deg, #ff2442, #ff6b81);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 8px;
    margin-left: auto;
    letter-spacing: 0.5px;
    line-height: 1.6;
}

/* ============================================
   内容发布
   ============================================ */
.publish-stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.pub-stat {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-md);
    text-align: center;
    border-left: 3px solid;
    cursor: pointer;
    transition: all var(--transition-normal);
}

.pub-stat:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.pub-stat.pending { border-left-color: var(--color-warning); }
.pub-stat.running { border-left-color: var(--color-info); }
.pub-stat.success { border-left-color: var(--color-success); }
.pub-stat.failed { border-left-color: var(--color-danger); }

.pub-stat-num {
    display: block;
    font-size: var(--font-size-huge);
    font-weight: 700;
    margin-bottom: var(--spacing-xs);
}

.pub-stat-label {
    font-size: var(--font-size-md);
    color: var(--color-text-tertiary);
}

/* 日历 */
.calendar-placeholder {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-md);
}

.calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-md);
}

.calendar-header h3 { font-size: var(--font-size-lg); font-weight: 600; }
.text-muted { color: var(--color-text-tertiary); font-size: var(--font-size-md); }

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.calendar-day-header {
    text-align: center;
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    padding: var(--spacing-sm);
    font-weight: 500;
}

.calendar-day {
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    cursor: pointer;
    transition: all var(--transition-fast);
    position: relative;
}

.calendar-day:hover { background: var(--color-fill); }
.calendar-day.today { background: var(--color-primary); color: white; font-weight: 600; }
.calendar-day.has-task::after {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--color-primary);
    position: absolute;
    bottom: 4px;
}
.calendar-day.today.has-task::after { background: white; }
.calendar-day.other-month { color: var(--color-text-disabled); }

/* ============================================
   数据分析
   ============================================ */
.analytics-tabs {
    display: flex;
    gap: 0;
    margin-bottom: var(--spacing-lg);
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 4px;
    box-shadow: var(--shadow-md);
    width: fit-content;
}

.analytics-tab {
    padding: 8px 20px;
    font-size: var(--font-size-md);
    color: var(--color-text-secondary);
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    font-weight: 500;
}

.analytics-tab.active {
    background: var(--color-primary);
    color: white;
}

/* ============================================
   竞品监控
   ============================================ */
.competitor-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md);
}

.competitor-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    cursor: pointer;
}

.competitor-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.comp-card-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.comp-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--chart-4), var(--chart-5));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: var(--font-size-lg);
}

.comp-name {
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin-bottom: 2px;
}

.comp-category {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
}

.comp-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-sm);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border-light);
}

.comp-stat-item {
    text-align: center;
}

.comp-stat-val {
    font-size: var(--font-size-lg);
    font-weight: 600;
    display: block;
}

.comp-stat-lbl {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
    margin-top: 2px;
}

.comp-alert {
    margin-top: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-primary-bg);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

/* ============================================
   达人营销
   ============================================ */
.influencer-filters {
    display: flex;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
    flex-wrap: wrap;
}

.influencer-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

.influencer-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-md);
    text-align: center;
    transition: all var(--transition-normal);
    cursor: pointer;
}

.influencer-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.inf-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    margin: 0 auto var(--spacing-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: var(--font-size-xxl);
}

.inf-name {
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin-bottom: var(--spacing-xs);
}

.inf-category {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    margin-bottom: var(--spacing-md);
}

.inf-stats {
    display: flex;
    justify-content: space-around;
    margin-bottom: var(--spacing-md);
}

.inf-stat {
    text-align: center;
}

.inf-stat-val {
    font-size: var(--font-size-md);
    font-weight: 600;
    display: block;
}

.inf-stat-lbl {
    font-size: var(--font-size-xs);
    color: var(--color-text-tertiary);
}

.inf-score {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    background: var(--color-success-bg);
    border-radius: 12px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-success);
}

/* ============================================
   互动管理
   ============================================ */
.interaction-tabs {
    display: flex;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 0;
}

.interaction-tab {
    font-size: var(--font-size-lg);
    color: var(--color-text-tertiary);
    padding-bottom: var(--spacing-md);
    border-bottom: 2px solid transparent;
    transition: all var(--transition-fast);
    margin-bottom: -1px;
    font-weight: 500;
}

.interaction-tab.active {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

.comment-list {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.comment-item {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    border-bottom: 1px solid var(--color-border-light);
    transition: background var(--transition-fast);
}

.comment-item:hover { background: var(--color-fill-light); }
.comment-item:last-child { border-bottom: none; }

.comment-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex-shrink: 0;
    background: linear-gradient(135deg, #FF9A2E, #FFBE5C);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: var(--font-size-md);
}

.comment-body { flex: 1; min-width: 0; }

.comment-user {
    font-weight: 600;
    font-size: var(--font-size-md);
    margin-bottom: 2px;
}

.comment-text {
    color: var(--color-text-secondary);
    font-size: var(--font-size-md);
    margin-bottom: 4px;
}

.comment-meta {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    display: flex;
    gap: var(--spacing-md);
}

.comment-source {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
}

.comment-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-shrink: 0;
}

.comment-action-btn {
    padding: 6px 12px;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    transition: all var(--transition-fast);
}

.comment-action-btn:hover {
    background: var(--color-primary-bg);
    color: var(--color-primary);
}

/* ============================================
   弹窗
   ============================================ */
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2000;
    align-items: center;
    justify-content: center;
}

.modal.active {
    display: flex;
}

.modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-content {
    position: relative;
    background: var(--color-white);
    border-radius: var(--radius-xl);
    width: 520px;
    max-width: 90vw;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: var(--shadow-xl);
    animation: modalSlideIn 0.25s ease;
}

@keyframes modalSlideIn {
    from { opacity: 0; transform: translateY(-20px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-lg) var(--spacing-xl);
    border-bottom: 1px solid var(--color-border-light);
}

.modal-header h3 { font-size: var(--font-size-xl); font-weight: 600; }

.modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text-tertiary);
    transition: all var(--transition-fast);
    font-size: var(--font-size-lg);
}

.modal-close:hover { background: var(--color-fill); color: var(--color-text-primary); }

.modal-body { padding: var(--spacing-xl); }

/* 添加方式卡片 */
.add-methods {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.add-method-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xl);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    text-align: center;
    transition: all var(--transition-normal);
}

.add-method-card:hover {
    border-color: var(--color-primary);
    background: var(--color-primary-bg);
}

.add-method-card span {
    font-size: var(--font-size-lg);
    font-weight: 600;
}

.add-method-card small {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
}

/* 表单 */
.form-group { margin-bottom: var(--spacing-md); }

.form-group label {
    display: block;
    font-size: var(--font-size-md);
    font-weight: 500;
    color: var(--color-text-primary);
    margin-bottom: var(--spacing-sm);
}

.form-input {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-md);
    outline: none;
    transition: border-color var(--transition-fast);
}

.form-input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(255, 36, 66, 0.1);
}

/* ============================================
   页脚
   ============================================ */
.footer {
    border-top: 1px solid var(--color-border-light);
    background: var(--color-white);
    padding: var(--spacing-md) var(--spacing-lg);
    text-align: center;
}

.footer-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    flex-wrap: wrap;
}

.footer-divider { color: var(--color-border); }

/* ============================================
   遮罩层
   ============================================ */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 999;
}

/* ============================================
   响应式 - 平板 (768px - 1200px)
   ============================================ */
@media (max-width: 1200px) {
    .stats-grid { grid-template-columns: repeat(3, 1fr); }
    .charts-row { grid-template-columns: 1fr; }
    .info-row { grid-template-columns: 1fr; }
    .content-creation-grid { grid-template-columns: repeat(2, 1fr); }
    .competitor-grid { grid-template-columns: repeat(2, 1fr); }
    .influencer-grid { grid-template-columns: repeat(3, 1fr); }
    .publish-stats-row { grid-template-columns: repeat(2, 1fr); }

    .btn-label { display: none; }
}

/* ============================================
   响应式 - 手机 (< 768px)
   ============================================ */
@media (max-width: 768px) {
    .sidebar {
        transform: translateX(-100%);
    }

    .sidebar.mobile-open {
        transform: translateX(0);
    }

    .sidebar-overlay.active { display: block; }

    .main-wrapper {
        margin-left: 0 !important;
    }

    .topbar {
        padding: 0 var(--spacing-md);
    }

    .mobile-menu-btn { display: flex; }

    .page-title { font-size: var(--font-size-lg); }

    .main-content {
        padding: var(--spacing-md);
    }

    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .stat-value { font-size: var(--font-size-xxl); }

    .charts-row { grid-template-columns: 1fr; }
    .chart-body { height: 260px; }

    .info-row { grid-template-columns: 1fr; }

    .content-creation-grid { grid-template-columns: 1fr; }
    .competitor-grid { grid-template-columns: 1fr; }
    .influencer-grid { grid-template-columns: repeat(2, 1fr); }
    .publish-stats-row { grid-template-columns: repeat(2, 1fr); }

    .pub-stat-num { font-size: var(--font-size-xxl); }

    .header-actions .btn-text { display: none; }

    .filter-bar { flex-direction: column; align-items: stretch; }
    .filter-group { flex-direction: column; }
    .filter-input { min-width: auto; }

    .data-table { font-size: var(--font-size-sm); }
    .data-table th, .data-table td { padding: 8px var(--spacing-sm); }

    .modal-content { width: 95vw; }
    .add-methods { grid-template-columns: 1fr; }
    .compare-grid { grid-template-columns: repeat(2, 1fr); }
    .compare-section { padding: var(--spacing-md); }

    .footer-content { flex-direction: column; gap: 4px; }
    .footer-divider { display: none; }
}

@media (max-width: 480px) {
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .stat-card { padding: var(--spacing-md); }
    .influencer-grid { grid-template-columns: 1fr; }
    .calendar-grid { gap: 2px; }
    .calendar-day { font-size: var(--font-size-xs); }
}

/* ============================================
   表单文本域
   ============================================ */
.form-textarea { width: 100%; min-height: 120px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); font-size: var(--font-size-md); outline: none; resize: vertical; transition: border-color var(--transition-fast); line-height: 1.6; }
.form-textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(255, 36, 66, 0.1); }

/* ============================================
   Toast 通知系统
   ============================================ */
.toast-container { position: fixed; top: 20px; right: 20px; z-index: 9999; display: flex; flex-direction: column; gap: 8px; pointer-events: none; max-width: 400px; }
.toast { display: flex; align-items: flex-start; gap: 10px; padding: 14px 18px; border-radius: var(--radius-lg); background: var(--color-white); box-shadow: var(--shadow-xl); font-size: 14px; color: var(--color-text-primary); transform: translateX(120%); opacity: 0; transition: all 0.3s ease; pointer-events: auto; white-space: pre-line; line-height: 1.5; max-width: 100%; word-break: break-word; }
.toast.visible { transform: translateX(0); opacity: 1; }
.toast-icon { flex-shrink: 0; font-size: 18px; margin-top: 1px; }
.toast.toast-success { border-left: 4px solid var(--color-success); }
.toast.toast-error { border-left: 4px solid var(--color-danger); }
.toast.toast-warning { border-left: 4px solid var(--color-warning); }
.toast.toast-info { border-left: 4px solid var(--color-info); }



/* ============================================
   待办事项 - Checkbox 样式
   ============================================ */
.todo-item { cursor: default; transition: background var(--transition-fast); }
.todo-item.done { opacity: 0.45; }
.todo-item.done .todo-content { text-decoration: line-through; }
.todo-check { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--color-border); cursor: pointer; flex-shrink: 0; appearance: none; -webkit-appearance: none; position: relative; transition: all var(--transition-fast); margin-top: 2px; }
.todo-check:hover { border-color: var(--color-primary); }
.todo-check:checked { background: var(--color-success); border-color: var(--color-success); }
.todo-check:checked::after { content: '✓'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: white; font-size: 12px; font-weight: 700; }

/* ============================================
   草稿列表
   ============================================ */
.draft-item { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; background: var(--color-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); cursor: pointer; transition: all var(--transition-fast); margin-bottom: 8px; }
.draft-item:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
.draft-info { flex: 1; }
.draft-info strong { display: block; margin-bottom: 4px; }
.draft-meta { font-size: var(--font-size-sm); color: var(--color-text-tertiary); }
.draft-tags { font-size: var(--font-size-sm); color: var(--color-primary); margin-left: 8px; }
.draft-actions { display: flex; gap: var(--spacing-sm); flex-shrink: 0; }

/* ============================================
   AI 文案生成（升级版：卡片化结构）
   ============================================ */
.ai-result-wrap { display: flex; flex-direction: column; gap: 16px; }
.ai-section { background: var(--color-fill-light); border-radius: 10px; padding: 14px 16px; }
.ai-section-grad { background: linear-gradient(135deg, #FFF1F0 0%, #FFF7E6 100%); border: 1px solid #FFD59155; }
.ai-section-title { font-weight: 600; color: var(--color-text-primary); margin-bottom: 10px; font-size: 14px; }

.ai-suggestion { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #fff; border-radius: 8px; margin-top: 8px; cursor: pointer; transition: all 0.2s; font-size: 14px; border: 1px solid var(--color-border-light); }
.ai-suggestion:hover { background: #FFF1F0; border-color: #FF7D00; transform: translateX(2px); }
.ai-suggestion-type { display: inline-block; flex-shrink: 0; font-size: 11px; padding: 2px 8px; border-radius: 10px; background: linear-gradient(135deg, #FF7D00, #FFC53D); color: #fff; font-weight: 600; }
.ai-suggestion-text { flex: 1; word-break: break-all; line-height: 1.5; }
.ai-suggestion-text:hover { color: var(--color-primary); }
.ai-copy-btn { background: transparent; border: 1px solid var(--color-border); border-radius: 6px; padding: 4px 8px; cursor: pointer; font-size: 14px; transition: all 0.15s; }
.ai-copy-btn:hover { background: var(--color-primary-light); border-color: var(--color-primary); }

.ai-content-box { padding: 14px; background: #fff; border-radius: 8px; font-size: 14px; line-height: 1.85; white-space: pre-line; max-height: 360px; overflow-y: auto; margin-top: 8px; border: 1px solid var(--color-border-light); }

.ai-tags-box { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.ai-tag { display: inline-block; padding: 4px 10px; background: #FFF1F0; color: #FF2442; border-radius: 12px; font-size: 12px; cursor: pointer; transition: all 0.15s; }
.ai-tag:hover { background: #FF2442; color: #fff; transform: translateY(-1px); }

.ai-cover-text { padding: 18px 20px; background: linear-gradient(135deg, #FF2442 0%, #FF7D00 100%); color: #fff; border-radius: 8px; font-size: 18px; font-weight: 700; text-align: center; cursor: pointer; line-height: 1.5; letter-spacing: 1px; transition: all 0.2s; box-shadow: 0 4px 12px rgba(255, 36, 66, 0.25); }
.ai-cover-text:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255, 36, 66, 0.35); }

.ai-tips-box { padding: 12px 14px; background: #fff; border-radius: 8px; font-size: 13px; line-height: 1.8; border: 1px solid var(--color-border-light); margin-top: 8px; }

.ai-score-bar { background: #fff; border-radius: 8px; padding: 14px; border: 1px solid var(--color-border-light); }
.ai-score-label { font-weight: 600; font-size: 14px; margin-bottom: 8px; }
.ai-score-value { height: 36px; border-radius: 18px; display: flex; align-items: center; padding: 0 18px; color: #fff; font-weight: 600; font-size: 14px; box-shadow: inset 0 0 0 1px var(--color-border-light); position: relative; overflow: hidden; }
.ai-score-tip { font-size: 12px; color: var(--color-text-tertiary); margin-top: 8px; line-height: 1.6; }

.ai-ai-actions { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px; background: linear-gradient(135deg, #FFF7E6 0%, #E6F7FF 100%); border-radius: 10px; border: 1px dashed #FFD591; }

/* ====== 我的草稿列表（升级版） ====== */
.draft-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: linear-gradient(90deg, #E6F7FF 0%, #F0F9FF 100%); border-radius: 8px; border: 1px solid #91D5FF55; margin-bottom: 14px; flex-wrap: wrap; }
.draft-sync-tip { font-size: 12px; color: #262626; line-height: 1.6; }
.draft-sync-tip strong { color: #165DFF; }
.draft-toolbar-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.draft-toolbar-actions .btn { font-size: 12px; }

.draft-item { display: flex; align-items: flex-start; padding: 14px 16px; background: #fff; border-radius: 10px; border: 1px solid var(--color-border-light); margin-bottom: 10px; cursor: pointer; transition: all 0.2s; gap: 10px; }
.draft-item:hover { border-color: var(--color-primary); box-shadow: 0 2px 12px rgba(22, 93, 255, 0.08); transform: translateY(-1px); }
.draft-info { flex: 1; min-width: 0; }
.draft-title-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.draft-title-row strong { font-size: 14px; color: var(--color-text-primary); }
.draft-badge { display: inline-block; font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.draft-badge-ai { background: linear-gradient(135deg, #FF7D00, #FFC53D); color: #fff; }
.draft-badge-score { font-weight: 600; }
.draft-badge-sync { background: #F0FDF4; color: #15803D; border: 1px solid #86EFAC55; }

.draft-meta-row { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 11px; color: var(--color-text-tertiary); margin-bottom: 4px; }
.draft-meta-row span { white-space: nowrap; }

.draft-content-preview { font-size: 12px; color: var(--color-text-secondary); line-height: 1.6; padding: 6px 8px; background: var(--color-fill-light); border-radius: 4px; border-left: 3px solid #FF7D00; margin: 6px 0; font-style: italic; }

.draft-actions { display: flex; align-items: flex-start; gap: 4px; opacity: 0.65; transition: opacity 0.2s; }
.draft-item:hover .draft-actions { opacity: 1; }
.draft-actions .btn { padding: 4px 8px; font-size: 14px; }

/* ============================================
   发布队列
   ============================================ */
.publish-queue-list { display: flex; flex-direction: column; gap: 8px; }
.publish-queue-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--color-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); transition: all var(--transition-fast); }
.publish-queue-item:hover { box-shadow: var(--shadow-md); }
.pq-info { flex: 1; }
.pq-title { font-weight: 600; margin-bottom: 2px; }
.pq-meta { font-size: var(--font-size-sm); color: var(--color-text-tertiary); }
.pq-status { flex-shrink: 0; }
.pq-actions { flex-shrink: 0; }

/* ============================================
   详情弹窗网格
   ============================================ */
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.detail-item { background: var(--color-fill); border-radius: var(--radius-md); padding: 14px; text-align: center; }
.detail-label { display: block; font-size: var(--font-size-sm); color: var(--color-text-tertiary); margin-bottom: 4px; }
.detail-val { display: block; font-size: var(--font-size-lg); font-weight: 700; color: var(--color-text-primary); }

/* ============================================
   封面预览区
   ============================================ */
.cover-preview-area { min-height: 280px; display: flex; align-items: center; justify-content: center; background: var(--color-fill); border-radius: var(--radius-lg); margin: 16px 0; }

/* ============================================
   评论互动
   ============================================ */
.comment-item { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--color-border-light); align-items: flex-start; transition: background var(--transition-fast); }
.comment-item:hover { background: var(--color-fill-light); margin: 0 -12px; padding-left: 12px; padding-right: 12px; border-radius: var(--radius-md); }
.comment-item:last-child { border-bottom: none; }
.comment-avatar { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 16px; flex-shrink: 0; }
.comment-body { flex: 1; min-width: 0; }
.comment-user { font-weight: 600; margin-bottom: 4px; font-size: 14px; }
.comment-text { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 6px; line-height: 1.5; }
.comment-meta { display: flex; gap: 12px; font-size: 12px; color: var(--color-text-tertiary); }
.comment-source { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
.comment-actions { display: flex; gap: 8px; flex-shrink: 0; align-self: center; }
.comment-action-btn { padding: 6px 14px; border: 1px solid var(--color-border); border-radius: 20px; background: var(--color-white); cursor: pointer; font-size: 13px; color: var(--color-text-secondary); transition: all var(--transition-fast); }
.comment-action-btn:hover { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-primary-light); }

/* ============================================
   模态弹窗内部滚动
   ============================================ */
.modal-body-scroll { max-height: 55vh; overflow-y: auto; padding-right: 2px; }
.modal-body-scroll::-webkit-scrollbar { width: 6px; }
.modal-body-scroll::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: 3px; }

/* ============================================
   笔记评分系统
   ============================================ */
.page-subtitle { font-size: var(--font-size-md); color: var(--color-text-tertiary); margin-top: 4px; }

.scoring-input-card { background: var(--color-white); border-radius: var(--radius-xl); padding: 28px; box-shadow: var(--shadow-sm); margin-bottom: 24px; }

.scoring-form .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-md); }

.score-textarea { min-height: 180px; width: 100%; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); font-size: var(--font-size-md); outline: none; resize: vertical; transition: border-color var(--transition-fast); line-height: 1.6; font-family: inherit; }
.score-textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(255, 36, 66, 0.1); }

.scoring-actions { display: flex; gap: var(--spacing-md); justify-content: center; padding-top: 12px; }
.scoring-actions .btn-lg { padding: 12px 32px; font-size: 16px; border-radius: var(--radius-lg); }
.scoring-actions .btn-ghost { background: transparent; border: 1px solid var(--color-border); color: var(--color-text-secondary); cursor: pointer; padding: 12px 28px; font-size: 16px; border-radius: var(--radius-lg); transition: all var(--transition-fast); }
.scoring-actions .btn-ghost:hover { border-color: var(--color-primary); color: var(--color-primary); }

.required { color: var(--color-danger); }

/* 评分结果区域 */
.scoring-result { animation: fadeInUp 0.5s ease; }

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.result-card { background: var(--color-white); border-radius: var(--radius-xl); padding: 28px; box-shadow: var(--shadow-sm); margin-bottom: 20px; }

/* 总分圆圈 */
.score-overview-card { display: flex; justify-content: center; }
.score-circle-wrap { text-align: center; }
.score-circle { position: relative; width: 140px; height: 140px; margin: 0 auto 16px; }
.score-circle svg { width: 100%; height: 100%; }
.score-inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.score-number { font-size: 42px; font-weight: 800; color: var(--color-primary); line-height: 1; }
.score-unit { font-size: 16px; color: var(--color-text-tertiary); display: block; margin-top: 2px; }
.score-level { display: inline-block; padding: 6px 20px; border-radius: 20px; font-size: 15px; font-weight: 700; margin-bottom: 8px; }
.score-level.excellent { background: #fff0f0; color: #ff2442; }
.score-level.good { background: #fff7e6; color: #fa8c16; }
.score-level.great { background: linear-gradient(135deg, #fff0f0, #fff7e6); color: #ff4d6a; }
.score-level.average { background: #f0f5ff; color: #2f54eb; }
.score-level.poor { background: #f5f5f5; color: #8c8c8c; }
.score-comment { font-size: 14px; color: var(--color-text-secondary); max-width: 360px; margin: 0 auto; line-height: 1.6; }

/* 各维度评分 */
.dimension-list { display: grid; gap: 14px; }
.dimension-item { display: flex; align-items: center; gap: 14px; }
.dimension-icon { font-size: 24px; flex-shrink: 0; width: 36px; text-align: center; }
.dimension-info { flex: 1; min-width: 0; }
.dimension-name { font-size: 14px; font-weight: 600; color: var(--color-text-primary); margin-bottom: 4px; }
.dimension-desc { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 6px; line-height: 1.4; }
.dimension-bar { height: 8px; background: var(--color-fill); border-radius: 4px; overflow: hidden; position: relative; }
.dimension-bar-fill { height: 100%; border-radius: 4px; transition: width 0.8s ease; position: relative; }
.dimension-bar-fill.high { background: linear-gradient(90deg, #ff2442, #ff6b81); }
.dimension-bar-fill.medium { background: linear-gradient(90deg, #fa8c16, #ffa940); }
.dimension-bar-fill.low { background: linear-gradient(90deg, #2f54eb, #597ef7); }
.dimension-score { font-size: 20px; font-weight: 800; flex-shrink: 0; width: 44px; text-align: center; }
.dimension-score.high { color: #ff2442; }
.dimension-score.medium { color: #fa8c16; }
.dimension-score.low { color: #2f54eb; }

/* 优化建议 */
.suggest-list { display: grid; gap: 12px; }
.suggest-item { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; background: var(--color-fill-light); border-radius: var(--radius-md); transition: all var(--transition-fast); }
.suggest-item:hover { background: var(--color-fill); }
.suggest-priority { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; flex-shrink: 0; }
.suggest-priority.high { background: var(--color-danger); }
.suggest-priority.medium { background: var(--color-warning); }
.suggest-priority.low { background: var(--color-info); }
.suggest-content { flex: 1; font-size: 14px; color: var(--color-text-primary); line-height: 1.6; }
.suggest-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; margin-left: 8px; font-weight: 600; vertical-align: middle; }
.suggest-tag.must-do { background: #fff0f0; color: #ff2442; }
.suggest-tag.improve { background: #fff7e6; color: #fa8c16; }
.suggest-tag.tips { background: #f0f5ff; color: #2f54eb; }

/* 笔记亮点 */
.strength-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.strength-item { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px; background: #f6ffed; border: 1px solid #d9f7be; border-radius: var(--radius-md); }
.strength-icon { font-size: 18px; flex-shrink: 0; }
.strength-content { font-size: 13px; color: #389e0d; line-height: 1.6; }
.strength-content strong { display: block; color: #237804; margin-bottom: 2px; font-size: 14px; }

/* 结果操作区 */
.scoring-result-actions { display: flex; gap: var(--spacing-md); justify-content: center; padding-top: 8px; }

/* 评分页面响应式 */
@media (max-width: 768px) {
    .scoring-form .form-row-2 { grid-template-columns: 1fr; }
    .scoring-actions { flex-direction: column; align-items: center; }
    .dimension-list { gap: 16px; }
    .dimension-item { flex-wrap: wrap; }
    .dimension-score { width: auto; }
    .strength-list { grid-template-columns: 1fr; }
    .scoring-result-actions { flex-direction: column; align-items: center; }
}

/* ============================================
   种草文案大师
   ============================================ */
.seedw-input-card { background: var(--color-white); border-radius: var(--radius-xl); padding: 28px; box-shadow: var(--shadow-sm); margin-bottom: 24px; }

.seedw-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.seedw-col { display: flex; flex-direction: column; gap: 16px; }

.form-section-title { font-size: 15px; font-weight: 700; color: var(--color-primary); padding-bottom: 8px; border-bottom: 2px solid var(--color-fill); margin-bottom: 4px; }

.seedw-textarea { min-height: 80px; width: 100%; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); font-size: var(--font-size-sm); outline: none; resize: vertical; transition: border-color var(--transition-fast); line-height: 1.6; font-family: inherit; }
.seedw-textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(255, 36, 66, 0.1); }

/* 种草类型选择 */
.seedw-type-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.seedw-type-card { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px 8px; border: 2px solid var(--color-border); border-radius: var(--radius-md); cursor: pointer; transition: all var(--transition-fast); text-align: center; background: var(--color-white); }
.seedw-type-card:hover { border-color: #ff9688; background: #fff5f4; }
.seedw-type-card.active { border-color: var(--color-primary); background: linear-gradient(135deg, #fff5f5, #fff0f0); box-shadow: 0 0 0 1px var(--color-primary); }
.seedw-type-card .st-icon { font-size: 24px; }
.seedw-type-card .st-name { font-size: 13px; font-weight: 700; color: var(--color-text-primary); }
.seedw-type-card .st-desc { font-size: 11px; color: var(--color-text-tertiary); }
.seedw-type-card input { display: none; }

/* 文案长度选项卡 */
.seedw-length-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.sl-tab { padding: 8px 16px; border: 1.5px solid var(--color-border); border-radius: 20px; background: var(--color-white); font-size: 13px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition-fast); }
.sl-tab:hover { border-color: var(--color-primary); color: var(--color-primary); }
.sl-tab.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

/* 操作区域 */
.seedw-actions { display: flex; gap: var(--spacing-md); justify-content: center; padding-top: 20px; margin-top: 8px; border-top: 1px solid var(--color-fill); }
.seedw-actions .btn-lg { padding: 14px 36px; font-size: 16px; border-radius: var(--radius-lg); }
.seedw-actions .btn-ghost { background: transparent; border: 1px solid var(--color-border); color: var(--color-text-secondary); cursor: pointer; padding: 14px 32px; font-size: 16px; border-radius: var(--radius-lg); transition: all var(--transition-fast); }
.seedw-actions .btn-ghost:hover { border-color: var(--color-primary); color: var(--color-primary); }

/* 加载动画 */
.seedw-loading { padding: 40px 0; text-align: center; }
.seedw-loading-inner p { color: var(--color-text-secondary); font-size: 14px; margin-top: 12px; }
.seedw-loading-step { font-size: 12px!important; color: var(--color-text-tertiary)!important; animation: pulse-text 1.5s infinite; }
@keyframes pulse-text { 0%,100% { opacity: 0.5; } 50% { opacity: 1; } }

.seedw-dot-pulse { width: 48px; height: 48px; margin: 0 auto; border-radius: 50%; background: var(--color-primary); animation: dotPulse 1.2s ease-in-out infinite; }
@keyframes dotPulse {
    0% { transform: scale(0); opacity: 1; }
    100% { transform: scale(1.2); opacity: 0; }
}

/* 结果区 */
.seedw-result { animation: fadeInUp 0.5s ease; }

/* 标题卡片 */
.seedw-title-card .section-block-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.seedw-copy-all { font-size: 13px; color: var(--color-primary); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; transition: opacity var(--transition-fast); }
.seedw-copy-all:hover { opacity: 0.8; }

.seedw-title-list { display: grid; gap: 10px; }
.seedw-title-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--color-fill-light); border-radius: var(--radius-md); cursor: pointer; transition: all var(--transition-fast); border: 1.5px solid transparent; }
.seedw-title-item:hover { border-color: var(--color-primary); background: #fff5f5; }
.seedw-title-item .st-num { width: 28px; height: 28px; border-radius: 50%; background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex-shrink: 0; }
.seedw-title-item .st-text { flex: 1; font-size: 14px; color: var(--color-text-primary); line-height: 1.5; }
.seedw-title-item .st-copy { padding: 4px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-text-secondary); font-size: 12px; cursor: pointer; transition: all var(--transition-fast); flex-shrink: 0; }
.seedw-title-item .st-copy:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

/* 正文区 */
.seedw-body-tabs { display: flex; gap: 6px; }
.seedw-body-tab { padding: 5px 14px; border: 1px solid var(--color-border); border-radius: 16px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition-fast); background: var(--color-white); }
.seedw-body-tab:hover { border-color: var(--color-primary); color: var(--color-primary); }
.seedw-body-tab.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

.seedw-body-content { padding: 20px 24px; background: var(--color-fill-light); border-radius: var(--radius-md); margin-top: 12px; white-space: pre-wrap; font-size: 15px; line-height: 1.9; color: var(--color-text-primary); min-height: 120px; }

.seedw-body-actions { display: flex; gap: var(--spacing-md); margin-top: 16px; flex-wrap: wrap; }
.seedw-body-actions .btn-outline { background: transparent; border: 1px solid var(--color-border); color: var(--color-text-secondary); cursor: pointer; padding: 8px 20px; border-radius: var(--radius-md); transition: all var(--transition-fast); font-size: 13px; }
.seedw-body-actions .btn-outline:hover { border-color: var(--color-primary); color: var(--color-primary); }

/* 标签区 */
.seedw-tags-group { display: flex; flex-wrap: wrap; gap: 8px; }
.seedw-tag { display: inline-flex; align-items: center; gap: 4px; padding: 6px 14px; background: linear-gradient(135deg, #fff5f5, #ffe8e8); border: 1px solid #ffd4d4; border-radius: 20px; font-size: 13px; color: var(--color-primary); cursor: pointer; transition: all var(--transition-fast); }
.seedw-tag:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(255,36,66,0.15); }
.seedw-tag .stag-copy { margin-left: 2px; font-size: 11px; opacity: 0.6; }

/* 响应式 */
@media (max-width: 768px) {
    .seedw-form-grid { grid-template-columns: 1fr; gap: 20px; }
    .seedw-type-grid { grid-template-columns: repeat(2, 1fr); }
    .seedw-actions { flex-direction: column; align-items: center; }
    .seedw-body-actions { flex-direction: column; }
    .seedw-body-actions .btn { width: 100%; }
}

/* ============================================
   智能违规词检测
   ============================================ */
.comply-input-card { background: var(--color-white); border-radius: var(--radius-xl); padding: 28px; box-shadow: var(--shadow-sm); margin-bottom: 24px; }

.comply-textarea { min-height: 240px; width: 100%; padding: 14px 16px; border: 1.5px solid var(--color-border); border-radius: var(--radius-md); font-size: var(--font-size-md); outline: none; resize: vertical; transition: border-color var(--transition-fast), box-shadow var(--transition-fast); line-height: 1.8; font-family: inherit; }
.comply-textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255, 36, 66, 0.08); }

.comply-char-count { display: flex; justify-content: flex-end; gap: 4px; margin-top: 6px; font-size: 13px; color: var(--color-text-tertiary); }
.comply-char-count span:last-child { font-weight: 600; color: var(--color-text-secondary); }

.comply-checkboxes { display: flex; flex-wrap: wrap; gap: 10px 20px; padding: 14px 0; }
.comply-check-label { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--color-text-secondary); cursor: pointer; user-select: none; padding: 6px 12px; border-radius: var(--radius-sm); transition: all var(--transition-fast); }
.comply-check-label:hover { background: var(--color-fill-light); }
.comply-check-label input[type="checkbox"] { accent-color: var(--color-primary); width: 16px; height: 16px; cursor: pointer; }

.comply-actions { display: flex; gap: var(--spacing-md); justify-content: center; padding-top: 8px; border-top: 1px solid var(--color-fill); }
.comply-actions .btn-lg { padding: 14px 36px; font-size: 16px; border-radius: var(--radius-lg); }
.comply-actions .btn-ghost { background: transparent; border: 1px solid var(--color-border); color: var(--color-text-secondary); cursor: pointer; padding: 14px 32px; font-size: 16px; border-radius: var(--radius-lg); transition: all var(--transition-fast); }
.comply-actions .btn-ghost:hover { border-color: var(--color-primary); color: var(--color-primary); }
.comply-actions .btn-outline { background: transparent; border: 1px solid var(--color-border); color: var(--color-text-secondary); cursor: pointer; padding: 14px 28px; font-size: 15px; border-radius: var(--radius-lg); transition: all var(--transition-fast); }
.comply-actions .btn-outline:hover { border-color: var(--color-primary); color: var(--color-primary); }

/* 加载动画 */
.comply-loading { padding: 40px 0; }
.comply-loading-inner { text-align: center; }
.comply-loading-inner p { color: var(--color-text-secondary); font-size: 14px; margin-top: 16px; }
.comply-scan-bar { width: 100%; max-width: 400px; height: 6px; background: var(--color-fill); border-radius: 3px; margin: 0 auto; overflow: hidden; }
.comply-scan-progress { height: 100%; background: linear-gradient(90deg, var(--color-primary), #ff6b81, #fa8c16, #2f54eb, #722ed1); border-radius: 3px; width: 0%; transition: width 0.3s ease; }

/* 结果区 */
.comply-result { animation: fadeInUp 0.5s ease; }

/* 概览统计 */
.comply-overview { padding: 24px 28px!important; }
.comply-risk-level { text-align: center; margin-bottom: 20px; }
.comply-risk-badge { display: inline-block; padding: 8px 28px; border-radius: 24px; font-size: 18px; font-weight: 800; letter-spacing: 1px; }
.comply-risk-badge.safe { background: #f6ffed; color: #52c41a; border: 1.5px solid #b7eb8f; }
.comply-risk-badge.low { background: #fffbe6; color: #faad14; border: 1.5px solid #ffe58f; }
.comply-risk-badge.medium { background: #fff7e6; color: #fa8c16; border: 1.5px solid #ffd591; }
.comply-risk-badge.high { background: #fff2f0; color: #ff4d4f; border: 1.5px solid #ffccc7; }
.comply-risk-badge.critical { background: #fff1f0; color: #cf1322; border: 1.5px solid #ffa39e; }

.comply-risk-desc { font-size: 14px; color: var(--color-text-secondary); margin-top: 6px; line-height: 1.5; }

.comply-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.comply-stat-card { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px 10px; border-radius: var(--radius-md); transition: transform var(--transition-fast); }
.comply-stat-card:hover { transform: translateY(-2px); }
.comply-stat-card .cs-num { font-size: 28px; font-weight: 800; line-height: 1; }
.comply-stat-card .cs-label { font-size: 12px; color: var(--color-text-tertiary); }
.comply-stat-card.cs-adult { background: #fff1f0; }
.comply-stat-card.cs-adult .cs-num { color: #ff2442; }
.comply-stat-card.cs-violence { background: #fff2f0; }
.comply-stat-card.cs-violence .cs-num { color: #ff4d4f; }
.comply-stat-card.cs-abuse { background: #fff7e6; }
.comply-stat-card.cs-abuse .cs-num { color: #fa8c16; }
.comply-stat-card.cs-spam { background: #f0f5ff; }
.comply-stat-card.cs-spam .cs-num { color: #2f54eb; }
.comply-stat-card.cs-adlaw { background: #f9f0ff; }
.comply-stat-card.cs-adlaw .cs-num { color: #722ed1; }
.comply-stat-card.cs-platform { background: #e6fffb; }
.comply-stat-card.cs-platform .cs-num { color: #13c2c2; }

/* 图例 */
.comply-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12px; color: var(--color-text-tertiary); align-items: center; }
.cl-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 4px; }

/* 文本标注 */
.comply-text-annotated { padding: 20px; background: var(--color-fill-light); border-radius: var(--radius-md); font-size: 15px; line-height: 2; white-space: pre-wrap; word-break: break-all; color: var(--color-text-primary); }
.comply-highlight { padding: 2px 4px; border-radius: 3px; font-weight: 600; cursor: pointer; position: relative; transition: background var(--transition-fast); }
.comply-highlight:hover { filter: brightness(0.9); }
.comply-hl-adult { background: rgba(255, 36, 66, 0.15); border-bottom: 2px solid #ff2442; color: #cf1322; }
.comply-hl-violence { background: rgba(255, 77, 79, 0.15); border-bottom: 2px solid #ff4d4f; color: #cf1322; }
.comply-hl-abuse { background: rgba(250, 140, 22, 0.15); border-bottom: 2px solid #fa8c16; color: #d46b08; }
.comply-hl-spam { background: rgba(47, 84, 235, 0.12); border-bottom: 2px solid #2f54eb; color: #1d39c4; }
.comply-hl-adlaw { background: rgba(114, 46, 209, 0.12); border-bottom: 2px solid #722ed1; color: #531dab; }
.comply-hl-platform { background: rgba(19, 194, 194, 0.12); border-bottom: 2px solid #13c2c2; color: #08979c; }

/* 违规详情列表 */
.comply-detail-list { display: grid; gap: 10px; }
.comply-detail-item { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; border-radius: var(--radius-md); border-left: 4px solid; transition: all var(--transition-fast); }
.comply-detail-item:hover { transform: translateX(4px); }
.comply-detail-item.cd-adult { background: #fff1f0; border-left-color: #ff2442; }
.comply-detail-item.cd-violence { background: #fff2f0; border-left-color: #ff4d4f; }
.comply-detail-item.cd-abuse { background: #fff7e6; border-left-color: #fa8c16; }
.comply-detail-item.cd-spam { background: #f0f5ff; border-left-color: #2f54eb; }
.comply-detail-item.cd-adlaw { background: #f9f0ff; border-left-color: #722ed1; }
.comply-detail-item.cd-platform { background: #e6fffb; border-left-color: #13c2c2; }
.cd-category { padding: 2px 10px; border-radius: 12px; font-size: 11px; font-weight: 700; color: #fff; flex-shrink: 0; white-space: nowrap; }
.cd-cat-adult { background: #ff2442; }
.cd-cat-violence { background: #ff4d4f; }
.cd-cat-abuse { background: #fa8c16; }
.cd-cat-spam { background: #2f54eb; }
.cd-cat-adlaw { background: #722ed1; }
.cd-cat-platform { background: #13c2c2; }
.cd-content { flex: 1; min-width: 0; }
.cd-word { font-size: 15px; font-weight: 700; color: var(--color-text-primary); margin-bottom: 2px; }
.cd-desc { font-size: 12px; color: var(--color-text-tertiary); line-height: 1.5; }
.cd-replace { margin-top: 6px; font-size: 13px; color: #52c41a; }
.cd-replace strong { color: #389e0d; }

/* 通过状态 */
.comply-pass { text-align: center; padding: 48px 0; }
.comply-pass-icon { font-size: 64px; margin-bottom: 16px; animation: bounce 0.6s ease; }
@keyframes bounce { 0%, 100% { transform: translateY(0); } 30% { transform: translateY(-15px); } 50% { transform: translateY(0); } 70% { transform: translateY(-8px); } }
.comply-pass h3 { font-size: 22px; color: #52c41a; margin-bottom: 8px; }
.comply-pass p { font-size: 15px; color: var(--color-text-secondary); }

/* Section Block Header */
.section-block-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.section-block-header h3 { font-size: 16px; font-weight: 700; color: var(--color-text-primary); }
.btn-xs { padding: 4px 12px; font-size: 12px; border-radius: var(--radius-sm); }

/* 响应式 */
@media (max-width: 768px) {
    .comply-checkboxes { flex-direction: column; gap: 6px; }
    .comply-actions { flex-direction: column; align-items: center; }
    .comply-stats-grid { grid-template-columns: repeat(3, 1fr); }
    .comply-legend { gap: 4px 10px; font-size: 11px; }
    .comply-detail-item { flex-wrap: wrap; }
}

:root {
    --xhs-primary: #ff2442;
    --xhs-text: #333;
    --xhs-text-secondary: #666;
    --xhs-text-tertiary: #999;
    --xhs-border: #e5e5e5;
    --xhs-fill: #f5f5f5;
    --xhs-radius: 4px;
}

/* ============================================
   数据管理 - 小红书创作中心风格
   ============================================ */

/* 顶部标签页 */
.dm-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--xhs-border); margin-bottom: 16px; padding: 0 4px; background: transparent; }
.dm-tab { position: relative; padding: 12px 4px; font-size: 15px; font-weight: 600; color: var(--xhs-text-secondary); cursor: pointer; transition: color 0.2s; user-select: none; }
.dm-tab:hover { color: var(--xhs-text); }
.dm-tab.active { color: var(--xhs-primary); }
.dm-tab.active::after { content: ''; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background: var(--xhs-primary); border-radius: 2px 2px 0 0; }

/* 筛选栏 */
.dm-filter-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 16px; background: var(--color-white); border-radius: var(--xhs-radius); border: 1px solid var(--xhs-border); margin-bottom: 12px; flex-wrap: wrap; }
.dm-filter-left { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.dm-filter-right { display: flex; align-items: center; }
.dm-filter-item { display: flex; align-items: center; gap: 8px; }
.dm-filter-item label { font-size: 13px; color: var(--xhs-text-secondary); white-space: nowrap; }
.dm-filter-select, .dm-filter-date, .dm-filter-input { height: 32px; padding: 0 10px; border: 1px solid var(--xhs-border); border-radius: var(--xhs-radius); font-size: 13px; color: var(--xhs-text); background: var(--color-white); outline: none; transition: border-color 0.2s; }
.dm-filter-select { min-width: 110px; cursor: pointer; }
.dm-filter-date { width: 130px; }
.dm-filter-input { width: 180px; }
.dm-filter-select:focus, .dm-filter-date:focus, .dm-filter-input:focus { border-color: var(--xhs-primary); }
.dm-filter-sep { color: var(--xhs-text-tertiary); font-size: 13px; }
.btn-export { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; border: 1px solid var(--xhs-border); border-radius: var(--xhs-radius); background: var(--color-white); color: var(--xhs-text-secondary); font-size: 13px; cursor: pointer; transition: all 0.2s; }
.btn-export:hover { border-color: var(--xhs-primary); color: var(--xhs-primary); }
.btn-export svg { flex-shrink: 0; }

/* 表格工具栏 */
.dm-table-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; flex-wrap: wrap; }
.dm-table-toolbar-left { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dm-table-toolbar-right { display: flex; align-items: center; }
.dm-count { font-size: 13px; color: var(--xhs-text-tertiary); white-space: nowrap; }

/* 统计概览行 */
.dm-stats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 16px; }
.dm-stat-card { background: var(--color-white); border-radius: var(--xhs-radius); padding: 14px 16px; border: 1px solid var(--xhs-border); display: flex; align-items: center; gap: 12px; transition: box-shadow 0.2s; }
.dm-stat-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
.dm-stat-icon { width: 40px; height: 40px; border-radius: var(--xhs-radius); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.dm-stat-icon.blue { background: #e8f0ff; }
.dm-stat-icon.green { background: #e8ffea; }
.dm-stat-icon.orange { background: #fff7e8; }
.dm-stat-icon.purple { background: #f9f0ff; }
.dm-stat-icon.pink { background: #fff0f3; }
.dm-stat-icon.cyan { background: #e8fcff; }
.dm-stat-icon.red { background: #fff0f0; }
.dm-stat-value { font-size: 20px; font-weight: 700; color: var(--xhs-text); line-height: 1.2; }
.dm-stat-label { font-size: 12px; color: var(--xhs-text-tertiary); }

/* 表格容器 - 小红书风格 */
.dm-table-wrap.xhs-style { background: var(--color-white); border-radius: var(--xhs-radius); border: 1px solid var(--xhs-border); overflow: hidden; }
.dm-table { width: 100%; border-collapse: collapse; font-size: 13px; color: var(--xhs-text); }
.dm-table thead { position: sticky; top: 0; z-index: 1; }
.dm-table th { background: #fafafa; padding: 10px 12px; font-weight: 600; color: var(--xhs-text-secondary); font-size: 12px; white-space: nowrap; border-bottom: 1px solid var(--xhs-border); text-align: left; }
.dm-table th.sortable { cursor: pointer; user-select: none; transition: color 0.2s; }
.dm-table th.sortable:hover { color: var(--xhs-primary); }
.sort-arrow { font-size: 10px; margin-left: 2px; opacity: 0.4; }
.sort-arrow.active { opacity: 1; font-weight: 700; color: var(--xhs-primary); }

/* 列宽定义 */
.dm-th-info { text-align: left !important; min-width: 280px; }
.dm-th-num { width: 80px; text-align: right !important; }
.dm-th-actions { width: 90px; text-align: center !important; }

.dm-table tbody tr { border-bottom: 1px solid var(--xhs-border); transition: background 0.15s; }
.dm-table tbody tr:last-child { border-bottom: none; }
.dm-table tbody tr:hover { background: #fafafa; }
.dm-table td { padding: 12px; color: var(--xhs-text); vertical-align: middle; }

/* 封面列 */
.dm-td-cover { width: 72px; padding: 10px 6px 10px 12px !important; }
.dm-note-cover { width: 60px; height: 80px; object-fit: cover; border-radius: var(--xhs-radius); border: 1px solid var(--xhs-border); background: var(--xhs-fill); }

/* 笔记基础信息列 */
.dm-td-info { min-width: 200px; max-width: 280px; }
.dm-note-title { font-weight: 600; font-size: 13px; color: var(--xhs-text); line-height: 1.4; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.dm-note-title:hover { color: var(--xhs-primary); }
.dm-note-date { font-size: 12px; color: var(--xhs-text-tertiary); margin-top: 6px; display: inline-block; padding: 2px 8px; background: var(--xhs-fill); border-radius: 999px; letter-spacing: 0.2px; }

/* 数据列 */
.dm-table td.dm-td-num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; font-size: 13px; }
.dm-rate-trend { font-size: 10px; margin-left: 2px; }

/* 操作列 */
.dm-td-actions { text-align: center; }
.dm-detail-link { color: var(--color-info); font-size: 13px; text-decoration: none; transition: color 0.2s; }
.dm-detail-link:hover { color: var(--xhs-primary); text-decoration: underline; }

/* 互动率颜色 */
.dm-engage-high { color: #52c41a; font-weight: 600; }
.dm-engage-mid { color: #faad14; font-weight: 600; }
.dm-engage-low { color: var(--xhs-text-tertiary); }

/* 分页 */
.dm-pagination { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 14px 0; }
.dm-pagination-info { font-size: 12px; color: var(--xhs-text-tertiary); }
.dm-pagination-btns { display: flex; gap: 6px; align-items: center; }
.dm-page-btn { min-width: 28px; height: 28px; padding: 0 8px; border: 1px solid var(--xhs-border); border-radius: var(--xhs-radius); background: var(--color-white); color: var(--xhs-text-secondary); font-size: 12px; cursor: pointer; transition: all 0.2s; }
.dm-page-btn:hover:not(:disabled) { border-color: var(--xhs-primary); color: var(--xhs-primary); }
.dm-page-btn.active { border-color: var(--xhs-primary); background: var(--xhs-primary); color: white; }
.dm-page-btn:disabled { cursor: not-allowed; opacity: 0.5; }
.dm-page-ellipsis { color: var(--xhs-text-tertiary); font-size: 12px; padding: 0 4px; }

/* 空状态 */
.dm-empty-row td { padding: 0 !important; }
.dm-empty-state { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 20px; color: var(--xhs-text-tertiary); }
.dm-empty-state svg { opacity: 0.4; }
.dm-empty-state p { font-size: 15px; font-weight: 600; color: var(--xhs-text-secondary); }
.dm-empty-state span { font-size: 13px; }

/* 直播面板 */
.dm-live-panel { background: var(--color-white); border-radius: var(--xhs-radius); border: 1px solid var(--xhs-border); padding: 40px 20px; }

/* 编辑弹窗 */
.form-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--spacing-md); }
.form-section-divider { font-size: 14px; font-weight: 700; color: var(--color-primary); padding: 12px 0 4px; margin-top: 4px; border-top: 1px solid var(--color-fill); }

/* AI 建议弹窗 */
.ai-suggest-intro { text-align: center; color: var(--color-text-tertiary); padding: 30px 0; font-size: 14px; }
.ai-suggest-meta { font-size: 13px; color: var(--color-text-secondary); background: var(--color-fill-light); padding: 10px 14px; border-radius: var(--radius-md); margin-bottom: 14px; }
.ai-suggest-item { display: flex; gap: 12px; padding: 14px; border-radius: var(--radius-md); margin-bottom: 10px; border-left: 4px solid; background: var(--color-white); }
.ai-suggest-item:last-child { margin-bottom: 0; }
.ai-suggest-item.critical { border-left-color: var(--color-danger); background: #fff5f5; }
.ai-suggest-item.warning { border-left-color: var(--color-warning); background: #fffbf0; }
.ai-suggest-item.good { border-left-color: var(--color-success); background: #f6fff7; }
.ai-suggest-item.tip { border-left-color: var(--color-info); background: #f5f9ff; }
.ai-suggest-area { flex-shrink: 0; width: 80px; font-size: 12px; font-weight: 700; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.5px; }
.ai-suggest-text { flex: 1; font-size: 14px; line-height: 1.6; color: var(--color-text-primary); }

/* AI 诊断 - 笔记选择列表 */
.ai-note-select-item { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--color-border); border-radius: 8px; cursor: pointer; transition: all .15s; background: var(--color-white); }
.ai-note-select-item:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.ai-note-select-item.selected { border-color: var(--color-primary); background: #fff0f3; }
.ai-note-select-check { flex-shrink: 0; width: 20px; height: 20px; border: 2px solid var(--color-border); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #fff; transition: all .15s; }
.ai-note-select-item.selected .ai-note-select-check { background: var(--color-primary); border-color: var(--color-primary); }
.ai-note-select-info { flex: 1; min-width: 0; }
.ai-note-select-title { font-size: 14px; font-weight: 600; color: var(--color-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ai-note-select-meta { font-size: 12px; color: var(--color-text-tertiary); margin-top: 2px; }
.ai-note-select-stats { display: flex; gap: 12px; flex-shrink: 0; font-size: 12px; color: var(--color-text-secondary); }
.ai-note-select-badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.badge-gw { background: #fff0f3; color: #ff2442; }
.badge-sp { background: #f0f5ff; color: #1664ff; }

/* AI 诊断 - 账号概览 */
.ai-account-overview { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.ai-overview-card { padding: 14px; border-radius: 10px; text-align: center; background: var(--color-white); border: 1px solid var(--color-border); }
.ai-overview-card .ai-ov-value { font-size: 24px; font-weight: 800; color: var(--color-text-primary); }
.ai-overview-card .ai-ov-label { font-size: 12px; color: var(--color-text-tertiary); margin-top: 4px; }
.ai-overview-card.danger .ai-ov-value { color: var(--color-danger); }
.ai-overview-card.warning .ai-ov-value { color: var(--color-warning); }
.ai-overview-card.success .ai-ov-value { color: var(--color-success); }

/* AI 诊断 - 诊断结果卡片 */
.ai-diag-card { border: 1px solid var(--color-border); border-radius: 12px; margin-bottom: 18px; overflow: hidden; background: var(--color-white); }
.ai-diag-card-header { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--color-fill); background: var(--color-fill-light); }
.ai-diag-card-cover { width: 48px; height: 64px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }
.ai-diag-card-title { font-size: 15px; font-weight: 700; color: var(--color-text-primary); flex: 1; }
.ai-diag-card-type { flex-shrink: 0; }
.ai-diag-card-body { padding: 18px; }
.ai-diag-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 10px; margin-bottom: 14px; }
.ai-diag-metric { text-align: center; padding: 10px 6px; border-radius: 8px; background: var(--color-fill-light); }
.ai-diag-metric .ai-dm-val { font-size: 16px; font-weight: 700; color: var(--color-text-primary); }
.ai-diag-metric .ai-dm-label { font-size: 11px; color: var(--color-text-tertiary); margin-top: 2px; }
.ai-diag-metric.low .ai-dm-val { color: var(--color-danger); }
.ai-diag-metric.high .ai-dm-val { color: var(--color-success); }

/* AI 诊断 - 问题项 */
.ai-diag-section-title { font-size: 14px; font-weight: 700; color: var(--color-text-primary); margin: 14px 0 8px; padding-left: 4px; border-left: 3px solid var(--color-primary); padding-left: 8px; }
.ai-diag-problem { display: flex; gap: 12px; padding: 12px 14px; border-radius: 8px; margin-bottom: 8px; border-left: 4px solid; }
.ai-diag-problem.danger { border-left-color: var(--color-danger); background: #fff5f5; }
.ai-diag-problem.warning { border-left-color: var(--color-warning); background: #fffbf0; }
.ai-diag-problem.info { border-left-color: var(--color-info); background: #f5f9ff; }
.ai-diag-problem.success { border-left-color: var(--color-success); background: #f6fff7; }
.ai-diag-severity { flex-shrink: 0; width: 52px; font-size: 11px; font-weight: 800; padding-top: 2px; text-align: center; }
.ai-diag-severity .sev-badge { display: inline-block; padding: 3px 10px; border-radius: 10px; }
.danger .ai-diag-severity .sev-badge { background: #ff2442; color: #fff; }
.warning .ai-diag-severity .sev-badge { background: #ff7d00; color: #fff; }
.info .ai-diag-severity .sev-badge { background: #165dff; color: #fff; }
.success .ai-diag-severity .sev-badge { background: #00b42a; color: #fff; }
.ai-diag-detail { flex: 1; }
.ai-diag-detail .problem-desc { font-size: 14px; color: var(--color-text-primary); font-weight: 600; margin-bottom: 4px; }
.ai-diag-detail .problem-suggestion { font-size: 13px; color: var(--color-text-secondary); line-height: 1.6; }

/* CSV预览 */
.csv-preview-info { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 12px; }
.csv-preview-info strong { color: var(--color-primary); }
.dm-table-sm { font-size: 12px; }
.dm-table-sm th { padding: 8px 10px; }
.dm-table-sm td { padding: 6px 10px; }

/* 响应式 */
@media (max-width: 768px) {
    .dm-tabs { gap: 16px; }
    .dm-filter-bar { flex-direction: column; align-items: stretch; }
    .dm-filter-left { flex-direction: column; align-items: stretch; gap: 12px; }
    .dm-filter-item { flex-wrap: wrap; }
    .dm-table-toolbar { flex-direction: column; align-items: stretch; }
    .dm-table-toolbar-left { justify-content: center; }
    .dm-table-toolbar-right { justify-content: center; }
    .dm-table-wrap { overflow-x: auto; }
    .dm-table { min-width: 900px; }
    .dm-stats-row { grid-template-columns: repeat(2, 1fr); }
    .dm-stat-card { padding: 12px 14px; }
    .dm-pagination { flex-direction: column; align-items: center; }
    .dm-stat-value { font-size: 18px; }
    .form-row-3 { grid-template-columns: 1fr; }
}
/* ====== 新增：会员体系 & 账号管理 ====== */

/* 认证卡片 */
.auth-card:hover { border-color: var(--color-primary) !important; background: #fff5f7 !important; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(255,36,66,.1); }

/* Toast */
.toast-msg { font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif; }
@keyframes slideDown { from { opacity:0; transform:translate(-50%, -20px); } to { opacity:1; transform:translate(-50%, 0); } }
@keyframes slideUp { from { opacity:1; transform:translate(-50%, 0); } to { opacity:0; transform:translate(-50%, -20px); } }

/* 会员方案卡 */
.plan-card { transition: all .25s; }
.plan-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.08); }
.plan-card.popular:hover { box-shadow: 0 12px 36px rgba(255,36,66,.15); }

/* 账号管理 */
#accountTableBody td { vertical-align: middle; }

/* 批量导入拖放区 */
#batchAccountDropZone:hover { border-color: var(--color-primary); background: #fff5f7; }

/* 会员权限提示 */
.limit-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600;
    background: #fff0f3; color: var(--color-primary); cursor: pointer;
}

/* 侧边栏升级链接 */
#sidebarMembershipLink:hover { background: var(--color-primary) !important; color: #fff !important; }

/* SPA路由当前页 */
.page-section { display: none; }
.page-section.active { display: block; }

/* 移动端适配补充 */
@media (max-width: 768px) {
    .auth-method-cards { grid-template-columns: 1fr !important; }
    #membershipContent .plan-card { margin-bottom: 16px; }
}

/* ============================================
   导航分隔线
   ============================================ */
.nav-divider {
    padding: 12px 16px 6px 16px;
}

.nav-divider-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 12px;
    color: #ff6b35;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 6px 12px;
    background: linear-gradient(135deg, #fff4ec, #ffe5d2);
    border: 1px solid #ffd5c2;
    border-radius: 8px;
    user-select: none;
    cursor: default;
    transition: all var(--transition-fast);
}

.nav-divider-label:hover {
    background: linear-gradient(135deg, #ffe5d2, #ffd5c2);
    color: #e8590c;
}

.nav-divider-label::before {
    content: "💎";
    font-size: 12px;
}

/* ============================================
   工具页面通用
   ============================================ */
.page-subtitle {
    font-size: var(--font-size-md);
    color: var(--color-text-secondary);
    margin-top: -8px;
    margin-bottom: var(--spacing-lg);
}

.tool-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-md);
}

.tool-input-row {
    display: flex;
    gap: 12px;
    align-items: center;
}

.tool-input {
    flex: 1;
    height: 48px;
    padding: 0 16px;
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-md);
    outline: none;
    transition: border-color var(--transition-fast);
}

.tool-input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(255, 36, 66, 0.08);
}

.tool-input::placeholder {
    color: var(--color-text-tertiary);
}

.btn-lg {
    height: 48px;
    padding: 0 24px;
    font-size: var(--font-size-md);
    font-weight: 600;
    white-space: nowrap;
}

/* 加载状态 */
.tool-status {
    display: none;
    text-align: center;
    padding: 40px 0;
    color: var(--color-text-secondary);
    font-size: var(--font-size-md);
}

.tool-status .spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid var(--color-border-light);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 10px;
    vertical-align: middle;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* 工具结果区域 */
.tool-result {
    margin-top: var(--spacing-lg);
}

.result-card {
    background: var(--color-bg);
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-md);
    border: 1px solid var(--color-border-light);
}

.result-title {
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin-bottom: var(--spacing-md);
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.result-row {
    display: flex;
    align-items: flex-start;
    padding: 8px 0;
    border-bottom: 1px solid var(--color-border-light);
}

.result-row:last-child { border-bottom: none; }

.result-label {
    width: 90px;
    flex-shrink: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary);
    padding-top: 1px;
}

.result-val {
    flex: 1;
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
    line-height: 1.6;
}

.result-val.highlight {
    color: var(--color-primary);
    font-weight: 600;
}

/* AI 洞察 */
.ai-insight-box {
    background: linear-gradient(135deg, #f0f4ff, #f5f0ff);
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-md);
    border-left: 3px solid #722ED1;
}

.ai-insight-label {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: #722ED1;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.ai-insight-text {
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
    line-height: 1.8;
    white-space: pre-line;
}

.ai-suggestion {
    background: #fffbf0;
    border-radius: var(--radius-sm);
    padding: 0 12px;
    margin-bottom: 4px;
    border-left: 3px solid #FF7D00;
}

/* ============================================
   视频文案提取
   ============================================ */
.script-box {
    background: #1e1e1e;
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    max-height: 320px;
    overflow-y: auto;
}

.script-line {
    color: #e0e0e0;
    font-size: var(--font-size-md);
    line-height: 1.8;
    margin: 0 0 6px 0;
    font-family: 'SF Mono', 'Consolas', 'Menlo', monospace;
}

/* 结构流程 */
.structure-flow {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}

.struct-item {
    display: flex;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border-light);
    position: relative;
}

.struct-item:last-child { border-bottom: none; }

.struct-time {
    width: 52px;
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--color-white);
    background: var(--color-text-secondary);
    border-radius: var(--radius-sm);
    padding: 2px 8px;
    text-align: center;
    height: fit-content;
    margin-top: 3px;
}

.struct-item.hook .struct-time { background: #FF2442; }
.struct-item.body .struct-time { background: #165DFF; }
.struct-item.cta .struct-time { background: #00B42A; }

.struct-body { flex: 1; }

.struct-body strong {
    display: block;
    font-size: var(--font-size-md);
    margin-bottom: 4px;
    color: var(--color-text-primary);
}

.struct-body p {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin: 0;
}

/* ============================================
   爆款拆解
   ============================================ */
.formula-box {
    background: #fafafa;
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
    margin-bottom: var(--spacing-sm);
}

.formula-label {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text-secondary);
    margin-bottom: 6px;
}

.formula-text {
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
    line-height: 1.8;
}

.formula-tag {
    display: inline-block;
    background: linear-gradient(135deg, #ff2442, #ff6b81);
    color: #fff;
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 12px;
    margin: 0 2px;
}

.template-item {
    padding: 6px 0;
    padding-left: 16px;
    border-left: 2px solid var(--color-primary);
    margin-bottom: 6px;
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
}

/* 成功因素卡片 */
.factor-card {
    display: flex;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border-light);
}

.factor-card:last-child { border-bottom: none; }

.factor-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    background: var(--color-bg);
    border-radius: var(--radius-md);
}

.factor-body { flex: 1; }

.factor-body strong {
    display: block;
    font-size: var(--font-size-md);
    margin-bottom: 4px;
    color: var(--color-text-primary);
}

.factor-body p {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin: 0;
}

/* 模板卡片 */
.template-card {
    background: linear-gradient(135deg, #fff7e6, #fff0f6);
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    border: 1px solid #ffd591;
}

.template-header {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: var(--spacing-md);
    padding-bottom: var(--spacing-sm);
    border-bottom: 1px solid #ffccc7;
}

.template-section {
    padding: 8px 0;
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
    line-height: 1.7;
}

.template-section strong {
    color: var(--color-text-primary);
}

/* ============================================
   账号管理 - 实用工具卡片
   ============================================ */
.auth-method-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.auth-card {
    padding: 28px 20px;
    border: 2px dashed var(--color-border);
    border-radius: 14px;
    text-align: center;
    cursor: pointer;
    transition: all 0.25s ease;
    background: var(--color-bg-container, #fff);
    user-select: none;
}

.auth-card:hover {
    border-color: var(--color-primary);
    background: linear-gradient(135deg, #fff5f7 0%, #fff 100%);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(255, 36, 66, 0.12);
}

.auth-card-dashboard:hover {
    background: linear-gradient(135deg, #e8f3ff 0%, #fff 100%);
    box-shadow: 0 8px 24px rgba(22, 93, 255, 0.12);
}

.auth-card-group:hover {
    background: linear-gradient(135deg, #f0ebff 0%, #fff 100%);
    box-shadow: 0 8px 24px rgba(114, 46, 209, 0.12);
}

.auth-card-export:hover {
    background: linear-gradient(135deg, #fff7e8 0%, #fff 100%);
    box-shadow: 0 8px 24px rgba(255, 125, 0, 0.12);
}

.auth-card-icon {
    font-size: 36px;
    margin-bottom: 10px;
    line-height: 1;
}

.auth-card-title {
    font-weight: 700;
    font-size: 16px;
    color: var(--color-text-primary);
    margin-bottom: 6px;
}

.auth-card-desc {
    font-size: 12px;
    color: var(--color-text-tertiary);
    line-height: 1.5;
}

/* 账号表格中分组标签 */
.account-group-tag {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
}

/* ============================================
   数据看板
   ============================================ */
.dash-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 22px;
}

.dash-stat-card {
    background: linear-gradient(135deg, var(--c, #FF2442) 0%, var(--c, #FF2442) 100%);
    background: var(--color-bg-container, #fff);
    border: 1px solid var(--color-border-light);
    border-radius: 12px;
    padding: 18px 14px;
    text-align: center;
    position: relative;
    overflow: hidden;
    transition: all 0.2s;
}

.dash-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--c);
}

.dash-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.dash-stat-icon {
    font-size: 24px;
    margin-bottom: 6px;
}

.dash-stat-num {
    font-size: 24px;
    font-weight: 800;
    color: var(--c);
    line-height: 1.2;
    margin-bottom: 2px;
}

.dash-stat-label {
    font-size: 12px;
    color: var(--color-text-tertiary);
}

.dash-section {
    margin-bottom: 22px;
}

.dash-section h4 {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-border-light);
}

.dash-top-item,
.dash-group-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 4px;
    border-bottom: 1px dashed var(--color-border-light);
    font-size: 13px;
}

.dash-top-item:last-child,
.dash-group-item:last-child {
    border-bottom: none;
}

.dash-top-rank {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dash-top-name,
.dash-group-name {
    width: 100px;
    font-weight: 600;
    color: var(--color-text-primary);
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-top-bar-wrap,
.dash-group-bar-wrap {
    flex: 1;
    height: 8px;
    background: var(--color-fill);
    border-radius: 4px;
    overflow: hidden;
}

.dash-top-bar,
.dash-group-bar {
    height: 100%;
    border-radius: 4px;
    transition: width 0.5s ease;
}

.dash-top-val,
.dash-group-val {
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-secondary);
    flex-shrink: 0;
    min-width: 60px;
    text-align: right;
}

.dash-group-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dash-ai-suggest {
    background: linear-gradient(135deg, #f8f9fc 0%, #fff5f7 100%);
    border-radius: 10px;
    padding: 12px 16px;
    border-left: 3px solid var(--color-primary);
}

.dash-ai-item {
    font-size: 13px;
    color: var(--color-text-primary);
    line-height: 1.8;
    padding: 4px 0;
}

.dash-ai-item a {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
}

.dash-ai-item a:hover {
    text-decoration: underline;
}

/* ============================================
   分组管理
   ============================================ */
.group-add-row {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
    align-items: center;
}

.group-add-row .form-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font-size: 14px;
}

.group-list {
    margin-bottom: 18px;
    max-height: 320px;
    overflow-y: auto;
}

.group-empty {
    text-align: center;
    color: var(--color-text-tertiary);
    padding: 30px 20px;
    background: var(--color-fill);
    border-radius: 10px;
    font-size: 13px;
}

.group-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--color-border-light);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s;
}

.group-item:hover {
    background: var(--color-fill);
    border-color: var(--color-primary);
}

.group-color-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--color-border-light);
}

.group-name {
    font-weight: 600;
    font-size: 14px;
    color: var(--color-text-primary);
    min-width: 100px;
}

.group-meta {
    flex: 1;
    font-size: 12px;
    color: var(--color-text-tertiary);
}

.group-presets {
    border-top: 1px solid var(--color-border-light);
    padding-top: 14px;
}

.group-presets-title {
    font-size: 13px;
    color: var(--color-text-secondary);
    margin-bottom: 10px;
}

.group-preset-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* ============================================
   数据导出
   ============================================ */
.export-format-row {
    display: flex;
    gap: 16px;
    margin-bottom: 14px;
    font-size: 13px;
    color: var(--color-text-secondary);
}

.export-format-row label {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.export-preview {
    max-height: 320px;
    overflow: auto;
    border: 1px solid var(--color-border-light);
    border-radius: 10px;
    background: var(--color-bg-container, #fff);
}

.export-table-wrap {
    overflow-x: auto;
}

.export-preview-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.export-preview-table th,
.export-preview-table td {
    padding: 8px 12px;
    text-align: left;
    border-bottom: 1px solid var(--color-border-light);
    white-space: nowrap;
}

.export-preview-table th {
    background: var(--color-fill);
    color: var(--color-text-primary);
    font-weight: 700;
    position: sticky;
    top: 0;
}

.export-preview-table tr:hover td {
    background: #fafafa;
}

.export-more {
    text-align: center;
    padding: 10px;
    color: var(--color-text-tertiary);
    font-size: 12px;
    margin: 0;
    border-top: 1px dashed var(--color-border-light);
}

.export-empty {
    text-align: center;
    color: var(--color-text-tertiary);
    padding: 40px 20px;
    font-size: 13px;
}

.export-summary {
    margin-top: 14px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #fff5f7 0%, #f8f9fc 100%);
    border-radius: 10px;
}

.export-summary-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 13px;
    color: var(--color-text-secondary);
}

.export-summary-row b {
    color: var(--color-primary);
    font-size: 15px;
    margin: 0 2px;
}

/* 实用工具 移动端 */
@media (max-width: 768px) {
    .auth-method-cards {
        grid-template-columns: 1fr;
    }
    .dash-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .group-add-row {
        flex-direction: column;
        align-items: stretch;
    }
    .group-add-row .form-input {
        max-width: 100% !important;
    }
    .dash-top-name,
    .dash-group-name {
        width: 70px;
    }
    .dash-group-item {
        flex-wrap: wrap;
    }
    .dash-group-bar-wrap {
        width: 100%;
        flex-basis: 100%;
    }
}

/* ============================================
   工具页 移动端适配
   ============================================ */
@media (max-width: 768px) {
    .tool-input-row { flex-direction: column; }
    .btn-lg { width: 100%; }
    .result-row { flex-direction: column; gap: 4px; }
    .result-label { width: 100%; }
    .structure-flow .struct-item { flex-direction: column; gap: 8px; }
    .struct-time { width: fit-content; }
}

/* ============================================
   顶部公告 banner
   ============================================ */
.site-banner {
    background: linear-gradient(90deg, #ff6b35, #ff2442);
    color: #fff;
    text-align: center;
    padding: 8px 40px;
    font-size: 13px;
    position: relative;
    font-weight: 500;
}
.site-banner-close {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,0.2);
    border: none;
    color: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
}
.site-banner-close:hover { background: rgba(255,255,255,0.35); }

/* ============================================
   消息通知 铃铛 + 下拉
   ============================================ */
.notify-badge { display: none; /* JS 控制 */ }
.notify-dropdown { animation: notifySlideIn .2s ease; }
@keyframes notifySlideIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
.notify-item:hover { background: #f5f7fa !important; }
.notify-wrapper { position: relative; }

/* ============================================
   广告位（dashboard_top / footer_banner）
   ============================================ */
.dashboard-ad-slot { display: none; margin: 12px 0; }
.footer-ad-slot { display: none; margin: 12px 0; padding: 0 16px; }
.ad-slot-inner { position: relative; border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); }
.ad-link { display: block; cursor: pointer; transition: opacity .2s; }
.ad-link:hover { opacity: 0.92; }
.ad-link img { width: 100%; height: auto; max-height: 140px; object-fit: cover; display: block; }
.ad-text { padding: 14px 20px; background: linear-gradient(90deg, #ff8c5a, #ff6b35); color: #fff; text-align: center; font-weight: 600; font-size: 14px; }
.ad-label { position: absolute; bottom: 4px; right: 6px; font-size: 9px; color: rgba(255,255,255,0.7); background: rgba(0,0,0,0.15); padding: 1px 5px; border-radius: 3px; }

/* ============================================
   友情链接（页脚）
   ============================================ */
.friendly-links { padding: 16px; background: #fafbfc; border-top: 1px solid var(--color-border); }
.friendly-links-label { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 8px; font-weight: 600; }
.friendly-link { display: inline-block; padding: 4px 10px; margin: 2px 4px 2px 0; font-size: 12px; color: var(--color-text-secondary); background: #fff; border: 1px solid var(--color-border); border-radius: 14px; text-decoration: none; transition: all .2s; }
.friendly-link:hover { color: var(--color-primary); border-color: var(--color-primary); transform: translateY(-1px); }

/* ============================================
   联系客服弹窗
   ============================================ */
.cs-modal-body { padding: 4px 0; }
.cs-intro { background: linear-gradient(90deg, #fff5f0, #fff0f3); padding: 12px 16px; border-radius: var(--radius-md); font-size: 13px; color: #d46b08; margin-bottom: 16px; }
.cs-contact-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.cs-contact-item { background: #fafbfc; border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 10px 14px; }
.cs-contact-label { font-size: 11px; color: var(--color-text-tertiary); margin-bottom: 4px; font-weight: 600; }
.cs-contact-value { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cs-contact-text { font-size: 14px; font-weight: 600; color: var(--color-text); font-family: 'Consolas', monospace; }
.cs-copy-btn { font-size: 12px; padding: 4px 10px; background: var(--color-primary); color: #fff; border: none; border-radius: var(--radius-sm); cursor: pointer; }
.cs-copy-btn:hover { background: #e0203b; }
.cs-qrcode { text-align: center; padding: 20px; background: #fafbfc; border-radius: var(--radius-md); margin-bottom: 16px; }
.cs-qrcode-img { width: 140px; height: 140px; margin: 0 auto; background: linear-gradient(135deg, #fff, #f0f0f0); border: 2px dashed #ccc; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; color: #999; font-size: 13px; }
.cs-tips { background: #fffbe6; padding: 10px 14px; border-radius: var(--radius-md); font-size: 12px; color: #5b6677; line-height: 1.8; }
.cs-tips p { margin: 4px 0; }

/* ============================================
   管理后台
   ============================================ */
.admin-tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--color-border); margin-bottom: 20px; overflow-x: auto; }
.admin-tab { padding: 10px 18px; font-size: 14px; font-weight: 500; color: var(--color-text-secondary); background: transparent; border: none; border-bottom: 2px solid transparent; margin-bottom: -2px; cursor: pointer; transition: all .2s; white-space: nowrap; }
.admin-tab:hover { color: var(--color-primary); }
.admin-tab.active { color: #ff6b35; border-bottom-color: #ff6b35; font-weight: 600; }
.admin-tab-pane { display: none; }
.admin-tab-pane.active { display: block; }
.admin-toolbar { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.admin-search { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); font-size: 13px; min-width: 180px; }
.admin-table { background: var(--color-white); border-radius: var(--radius-md); border: 1px solid var(--color-border); overflow: hidden; }
.admin-thead { display: grid; grid-template-columns: 1.5fr 1fr 1.2fr 1fr 0.8fr 1.2fr; padding: 10px 14px; background: #fafbfc; font-size: 12px; font-weight: 600; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border); }
.admin-trow { display: grid; grid-template-columns: 1.5fr 1fr 1.2fr 1fr 0.8fr 1.2fr; padding: 12px 14px; border-bottom: 1px solid #f0f0f0; font-size: 13px; align-items: center; }
.admin-trow:last-child { border-bottom: none; }
.admin-trow:hover { background: #fafbfc; }
.admin-inline-select, .admin-inline-input { padding: 4px 8px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); font-size: 12px; width: 100%; }
.admin-actions { display: flex; gap: 4px; }
.admin-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 14px 16px; margin-bottom: 12px; }
.admin-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; flex-wrap: wrap; gap: 8px; }
.admin-card-head h4 { font-size: 16px; font-weight: 600; }
.admin-card-body { font-size: 13px; color: var(--color-text-secondary); }
.admin-row { display: flex; justify-content: space-between; align-items: center; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 12px 16px; margin-bottom: 8px; gap: 12px; }
.admin-row:hover { border-color: var(--color-primary); }
.admin-form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 20px; max-width: 640px; }
.admin-form h4 { font-size: 15px; font-weight: 600; margin-bottom: 12px; color: var(--color-text); }
.admin-form-row { display: grid; grid-template-columns: 100px 1fr; gap: 12px; align-items: center; margin-bottom: 12px; }
.admin-form-row label { font-size: 13px; color: var(--color-text-secondary); text-align: right; }
.admin-form-row input, .admin-form-row select, .admin-form-row textarea { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); font-size: 13px; width: 100%; }
.admin-form-row input:focus, .admin-form-row select:focus, .admin-form-row textarea:focus { outline: none; border-color: var(--color-primary); }
.admin-tag { display: inline-block; font-size: 10px; padding: 2px 6px; border-radius: 8px; background: #f0f0f0; color: #909399; margin: 0 4px; }
.admin-tag.on { background: #e8f8ef; color: #00B42A; }
.admin-tag.off { background: #f0f0f0; color: #909399; }
.btn-xs { padding: 3px 10px; font-size: 11px; }
.btn-danger { background: #f53f3f; color: #fff; border: 1px solid #f53f3f; }
.btn-danger:hover { background: #d62929; }
.btn-ghost.btn-danger-ghost { color: #F5222D; border-color: #FFCCC7; }
.btn-ghost.btn-danger-ghost:hover { background: #FFF1F0; color: #CF1322; border-color: #FFA39E; }

/* ============================================
   数据清理工具
   ============================================ */
.cleanup-summary { padding: 12px 16px; background: #F7F8FA; border-radius: 10px; font-size: 14px; color: var(--color-text-primary, #1D2129); margin-bottom: 16px; line-height: 1.6; }
.cleanup-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-bottom: 16px; }
.cleanup-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 10px; transition: all var(--transition-fast); }
.cleanup-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.cleanup-card.cleanup-card-ok { opacity: 0.55; }
.cleanup-card-head { display: flex; align-items: center; gap: 10px; }
.cleanup-icon { font-size: 22px; flex-shrink: 0; }
.cleanup-card-info { flex: 1; min-width: 0; }
.cleanup-card-title { font-size: 14px; font-weight: 700; color: var(--color-text-primary); }
.cleanup-card-desc { font-size: 12px; color: var(--color-text-tertiary); margin-top: 2px; line-height: 1.4; }
.cleanup-card-num { font-size: 28px; font-weight: 800; color: #F5222D; line-height: 1.1; }
.cleanup-card-ok .cleanup-card-num { color: #52C41A; }
.cleanup-btn { align-self: flex-start; }
.cleanup-btn-disabled { opacity: 0.5; cursor: not-allowed !important; }
.cleanup-danger-box { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; background: #FFF7F7; border: 1px solid #FFCCC7; border-radius: 10px; margin-bottom: 12px; }
.cleanup-danger-title { font-size: 14px; font-weight: 700; color: #CF1322; }
.cleanup-danger-desc { font-size: 12px; color: #B54248; margin-top: 2px; line-height: 1.4; }
.cleanup-storage { font-size: 12px; color: var(--color-text-tertiary); padding: 0 4px; }

@media (max-width: 768px) {
    .admin-thead, .admin-trow { grid-template-columns: 1fr; gap: 6px; }
    .admin-thead { display: none; }
    .admin-form-row { grid-template-columns: 1fr; }
    .admin-form-row label { text-align: left; }
}
