* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: rgb(var(--p-slate-950)); color: rgb(var(--p-slate-200)); font-size: 13px; }

/* 滚动条 */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: rgb(var(--p-slate-800)); }
::-webkit-scrollbar-thumb { background: rgb(var(--p-slate-600)); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgb(var(--p-slate-500)); }

/* 表格容器自适应高度 */
.table-adaptive { max-height: 65vh; overflow-y: auto; overflow-x: auto; }

/* 表格 */
.data-table { width: 100%; border-collapse: collapse; table-layout: auto; }
.data-table th { background: rgb(var(--p-slate-800) / 0.9); padding: 8px 12px; text-align: left; font-weight: 600; color: rgb(var(--p-slate-400)); font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid rgb(var(--p-slate-700) / 0.5); position: sticky; top: 0; z-index: 10; white-space: nowrap; }
.data-table td { padding: 6px 12px; border-bottom: 1px solid rgb(var(--p-slate-700) / 0.2); vertical-align: middle; }
.data-table tbody tr { transition: all 0.2s ease; }
.data-table tbody tr:hover { background: rgb(var(--p-blue-500) / 0.1); }
.data-table tbody tr:nth-child(even) { background: rgb(var(--p-slate-950) / 0.3); }
.data-table tbody tr:nth-child(even):hover { background: rgb(var(--p-blue-500) / 0.1); }

/* 输入框 */
.input { background: rgb(var(--p-slate-800)); border: 1px solid rgb(var(--p-slate-700)); border-radius: 6px; padding: 6px 10px; color: rgb(var(--p-slate-200)); font-size: 12px; width: 100%; transition: all 0.2s; }
.input:focus { outline: none; border-color: rgb(var(--p-blue-500)); box-shadow: 0 0 0 3px rgb(var(--p-blue-500) / 0.1); }

/* 筛选输入框 */
.filter-input { 
    background: rgb(var(--p-slate-800) / 0.6); 
    border: 1px solid rgb(var(--p-slate-700) / 0.4); 
    border-radius: 8px; 
    padding: 8px 12px; 
    color: rgb(var(--p-slate-200)); 
    font-size: 12px; 
    transition: all 0.2s;
}
.filter-input:focus { 
    outline: none; 
    border-color: rgb(var(--p-blue-500) / 0.5); 
    background: rgb(var(--p-slate-800) / 0.8);
    box-shadow: 0 0 0 3px rgb(var(--p-blue-500) / 0.1);
}
.filter-input::placeholder { color: rgb(var(--p-slate-500)); }

/* 按钮 */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 6px 12px; border-radius: 8px; font-size: 12px; font-weight: 500; cursor: pointer; transition: all 0.2s ease; border: none; }
.btn-primary { background: linear-gradient(135deg, rgb(var(--p-blue-500)) 0%, rgb(var(--p-blue-600)) 100%); color: white; box-shadow: 0 2px 8px rgb(var(--p-blue-500) / 0.3); }
.btn-primary:hover { background: linear-gradient(135deg, rgb(var(--p-blue-600)) 0%, rgb(var(--p-blue-700)) 100%); transform: translateY(-1px); box-shadow: 0 4px 12px rgb(var(--p-blue-500) / 0.4); }
.btn-success { background: linear-gradient(135deg, rgb(var(--p-emerald-500)) 0%, rgb(var(--p-emerald-600)) 100%); color: white; box-shadow: 0 2px 8px rgb(var(--p-emerald-500) / 0.3); }
.btn-success:hover { background: linear-gradient(135deg, rgb(var(--p-emerald-600)) 0%, rgb(var(--p-emerald-700)) 100%); transform: translateY(-1px); }
.btn-danger { background: linear-gradient(135deg, rgb(var(--p-red-500)) 0%, rgb(var(--p-red-600)) 100%); color: white; box-shadow: 0 2px 8px rgb(var(--p-red-500) / 0.3); }
.btn-danger:hover { background: linear-gradient(135deg, rgb(var(--p-red-600)) 0%, rgb(var(--p-red-700)) 100%); transform: translateY(-1px); }
.btn-ghost { background: rgb(var(--p-slate-700) / 0.3); color: rgb(var(--p-slate-400)); border: 1px solid rgb(var(--p-slate-700) / 0.5); }
.btn-ghost:hover { background: rgb(var(--p-slate-700) / 0.5); color: rgb(var(--p-slate-200)); border-color: rgb(var(--p-slate-600) / 0.8); }
.btn-xs { padding: 4px 10px; font-size: 11px; min-width: 28px; }

/* 标签 */
.badge { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 6px; font-size: 11px; font-weight: 500; letter-spacing: 0.3px; }
.badge-blue { background: linear-gradient(135deg, rgb(var(--p-blue-500) / 0.2) 0%, rgb(var(--p-blue-600) / 0.2) 100%); color: rgb(var(--p-blue-300)); border: 1px solid rgb(var(--p-blue-500) / 0.3); }
.badge-green { background: linear-gradient(135deg, rgb(var(--p-emerald-500) / 0.2) 0%, rgb(var(--p-emerald-600) / 0.2) 100%); color: rgb(var(--p-emerald-300)); border: 1px solid rgb(var(--p-emerald-500) / 0.3); }
.badge-red { background: linear-gradient(135deg, rgb(var(--p-red-500) / 0.2) 0%, rgb(var(--p-red-600) / 0.2) 100%); color: rgb(var(--p-red-300)); border: 1px solid rgb(var(--p-red-500) / 0.3); }
.badge-purple { background: linear-gradient(135deg, rgb(var(--p-violet-500) / 0.2) 0%, rgb(var(--p-violet-600) / 0.2) 100%); color: rgb(var(--p-violet-300)); border: 1px solid rgb(var(--p-violet-500) / 0.3); }

/* 卡密代码样式 */
.code-text { font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: 11px; padding: 3px 8px; border-radius: 4px; background: rgb(var(--p-cyan-500) / 0.1); color: rgb(var(--p-cyan-400)); cursor: pointer; transition: all 0.2s; max-width: 220px; overflow: hidden; text-overflow: ellipsis; display: inline-block; white-space: nowrap; border: 1px solid rgb(var(--p-cyan-500) / 0.2); }
.code-text:hover { background: rgb(var(--p-cyan-500) / 0.2); border-color: rgb(var(--p-cyan-500) / 0.4); }
.code-text-yellow { background: rgb(var(--p-yellow-400) / 0.1); color: rgb(var(--p-yellow-300)); border: 1px solid rgb(var(--p-yellow-400) / 0.2); }
.code-text-yellow:hover { background: rgb(var(--p-yellow-400) / 0.2); border-color: rgb(var(--p-yellow-400) / 0.4); }

/* 统计卡片 */
.stat-card { background: linear-gradient(135deg, rgb(var(--p-slate-800)) 0%, rgb(var(--p-slate-950)) 100%); border: 1px solid rgb(var(--p-slate-700)); border-radius: 8px; padding: 12px 16px; }

/* Tab */
.tab-nav { display: flex; background: rgb(var(--p-navy-900)); border-radius: 16px; padding: 6px; gap: 4px; }
.tab-btn { flex: 1; padding: 12px 20px; border-radius: 12px; font-size: 13px; font-weight: 500; color: rgb(var(--p-slate-500)); background: transparent; border: none; cursor: pointer; transition: all 0.2s; }
.tab-btn:hover { color: rgb(var(--p-slate-200)); background: rgb(var(--p-slate-700) / 0.3); }
.tab-btn.active { background: linear-gradient(135deg, rgb(var(--p-blue-500)) 0%, rgb(var(--p-blue-700)) 100%); color: white; box-shadow: 0 4px 15px rgb(var(--p-blue-500) / 0.3); }

/* Toast */
.toast-container { position: fixed; top: 20px; right: 20px; z-index: 9999; display: flex; flex-direction: column; gap: 10px; }
.toast { padding: 14px 20px; border-radius: 12px; font-size: 13px; font-weight: 500; animation: slideIn 0.3s ease; box-shadow: 0 10px 40px rgb(var(--p-black) / 0.3); }
.toast-success { background: linear-gradient(135deg, rgb(var(--p-emerald-500)) 0%, rgb(var(--p-emerald-600)) 100%); color: white; }
.toast-error { background: linear-gradient(135deg, rgb(var(--p-red-500)) 0%, rgb(var(--p-red-600)) 100%); color: white; }
@keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* 开关 */
.switch { position: relative; width: 36px; height: 20px; }
.switch input { opacity: 0; width: 0; height: 0; }
.switch-slider { position: absolute; cursor: pointer; inset: 0; background: rgb(var(--p-slate-600)); border-radius: 20px; transition: 0.2s; }
.switch-slider:before { content: ''; position: absolute; height: 16px; width: 16px; left: 2px; bottom: 2px; background: white; border-radius: 50%; transition: 0.2s; }
.switch input:checked + .switch-slider { background: rgb(var(--p-emerald-500)); }
.switch input:checked + .switch-slider:before { transform: translateX(16px); }

/* 模态框 */
.modal { position: fixed; inset: 0; background: rgb(var(--p-black) / 0.85); backdrop-filter: blur(4px); z-index: 100; display: none; align-items: center; justify-content: center; padding: 16px; }
.modal.show { display: flex; }
.modal-content { background: rgb(var(--p-navy-900)); border: 1px solid rgb(var(--p-slate-700) / 0.5); border-radius: 20px; max-width: 420px; width: 100%; max-height: 90vh; overflow-y: auto; box-shadow: 0 25px 50px -12px rgb(var(--p-black) / 0.5); }
.modal-header { padding: 20px 24px; border-bottom: 1px solid rgb(var(--p-slate-700) / 0.5); display: flex; align-items: center; justify-content: space-between; }
.modal-body { padding: 24px; }
.modal-footer { padding: 16px 24px 24px; display: flex; gap: 12px; justify-content: flex-end; }

/* 设置导航项 */
.settings-nav-item { color: rgb(var(--p-slate-400)); background: transparent; }
.settings-nav-item:hover { background: rgb(var(--p-slate-700) / 0.5); color: rgb(var(--p-slate-200)); }
.settings-nav-item.active { background: linear-gradient(90deg, rgb(var(--p-blue-500) / 0.2) 0%, transparent 100%); color: rgb(var(--p-white)); border-left: 3px solid rgb(var(--p-blue-500)); }

/* 分页器 */
.pagination-btn { 
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 32px; height: 32px; padding: 0 10px;
    border-radius: 8px; font-size: 12px; font-weight: 500;
    color: rgb(var(--p-slate-400)); background: rgb(var(--p-slate-700) / 0.3);
    border: 1px solid rgb(var(--p-slate-700) / 0.5);
    cursor: pointer; transition: all 0.2s ease;
}
.pagination-btn:hover { 
    background: rgb(var(--p-blue-500) / 0.15); 
    border-color: rgb(var(--p-blue-500) / 0.4); 
    color: rgb(var(--p-slate-200)); 
}
.pagination-btn.active { 
    background: linear-gradient(135deg, rgb(var(--p-blue-500)) 0%, rgb(var(--p-blue-600)) 100%); 
    border-color: transparent;
    color: white; 
    box-shadow: 0 2px 8px rgb(var(--p-blue-500) / 0.4);
}
.pagination-dots { 
    display: inline-flex; align-items: center; 
    padding: 0 6px; color: rgb(var(--p-slate-500)); font-size: 12px; 
}

/* 复选框美化 */
input[type="checkbox"] { 
    width: 16px; height: 16px; cursor: pointer;
    border-radius: 4px;
}

/* 平台卡片悬停效果 */
.platform-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgb(var(--p-black) / 0.3);
}

/* 操作按钮 */
.action-btn {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 8px 14px; border-radius: 10px;
    font-size: 12px; font-weight: 500;
    cursor: pointer; transition: all 0.2s ease;
    border: none;
}
.action-btn-ghost {
    background: rgb(var(--p-slate-700) / 0.4);
    color: rgb(var(--p-slate-400));
    border: 1px solid rgb(var(--p-slate-700) / 0.5);
}
.action-btn-ghost:hover {
    background: rgb(var(--p-slate-700) / 0.6);
    color: rgb(var(--p-slate-200));
}
.action-btn-danger {
    background: rgb(var(--p-red-500) / 0.15);
    color: rgb(var(--p-red-400));
    border: 1px solid rgb(var(--p-red-500) / 0.3);
}
.action-btn-danger:hover {
    background: rgb(var(--p-red-500) / 0.25);
    border-color: rgb(var(--p-red-500) / 0.5);
}
.action-btn-warning {
    background: rgb(var(--p-amber-500) / 0.15);
    color: rgb(var(--p-amber-400));
    border: 1px solid rgb(var(--p-amber-500) / 0.3);
}
.action-btn-warning:hover {
    background: rgb(var(--p-amber-500) / 0.25);
    border-color: rgb(var(--p-amber-500) / 0.5);
}
.action-btn-success {
    background: rgb(var(--p-emerald-500) / 0.15);
    color: rgb(var(--p-emerald-400));
    border: 1px solid rgb(var(--p-emerald-500) / 0.3);
}
.action-btn-success:hover {
    background: rgb(var(--p-emerald-500) / 0.25);
    border-color: rgb(var(--p-emerald-500) / 0.5);
}

/* ========== 管理后台移动端适配 ========== */
@media (max-width: 768px) {
    /* 登录页：偏上居中 */
    #loginPage {
        padding: 0 16px !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
        padding-top: 12vh !important;
        padding-bottom: 0 !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }
    #loginPage > div { width: 100% !important; }

    /* 顶栏紧凑 */
    header { padding: 8px 12px !important; }
    header .text-lg, header .font-bold { font-size: 13px !important; }
    header .text-xs { font-size: 10px !important; }
    header .w-10 { width: 32px !important; height: 32px !important; }
    header a, header button { padding: 6px 10px !important; font-size: 11px !important; }

    /* Tab导航：横向滚动不换行 */
    .tab-nav {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        padding: 4px !important;
        gap: 2px !important;
        -webkit-overflow-scrolling: touch;
    }
    .tab-btn {
        padding: 8px 10px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
        border-radius: 8px !important;
        min-width: fit-content !important;
    }

    /* 内容区 */
    main { padding: 8px !important; }
    .max-w-6xl { max-width: 100% !important; }

    /* 统计卡片：2列 */
    .grid-cols-5 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-cols-5 .text-3xl { font-size: 1.3rem !important; }
    .grid-cols-5 .text-sm { font-size: 10px !important; }
    .grid-cols-5 > div { padding: 12px !important; border-radius: 12px !important; }
    .grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-cols-4 .text-3xl { font-size: 1.3rem !important; }
    .grid-cols-4 .text-sm { font-size: 10px !important; }
    .grid-cols-4 > div { padding: 12px !important; border-radius: 12px !important; }

    /* 平台卡片：单列 */
    .grid.grid-cols-1.md\\:grid-cols-2.lg\\:grid-cols-3 {
        grid-template-columns: 1fr !important;
    }

    /* 版本/日志表格：强制横向滚动 */
    .table-adaptive {
        max-height: 55vh !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .data-table {
        table-layout: auto !important;
        min-width: 600px !important;
        width: max-content !important;
    }
    .data-table th, .data-table td { padding: 6px 8px !important; font-size: 11px !important; white-space: nowrap !important; }
    .data-table th { font-size: 10px !important; }

    /* 平台管理头部 */
    .platform-card { padding: 12px !important; }
    .platform-card .w-12 { width: 36px !important; height: 36px !important; }

    /* 筛选栏：换行 */
    .flex.items-center.gap-3.flex-1 {
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    .filter-input { font-size: 11px !important; padding: 6px 8px !important; }

    /* 操作按钮栏 */
    .flex.gap-2 { flex-wrap: wrap !important; gap: 4px !important; }
    .action-btn { padding: 6px 10px !important; font-size: 10px !important; }

    /* 设置页 */
    #content-settings > .flex {
        flex-direction: column !important;
        min-height: auto !important;
        gap: 8px !important;
    }
    #content-settings > .flex > .w-56 {
        width: 100% !important;
        flex-shrink: 1 !important;
        padding: 6px !important;
    }
    #content-settings .settings-nav-item {
        padding: 6px 10px !important;
        font-size: 12px !important;
        flex-direction: row !important;
    }
    #content-settings .settings-nav-item .w-8 {
        width: 20px !important; height: 20px !important; font-size: 12px !important;
    }
    #content-settings .settings-nav-item .text-sm { font-size: 12px !important; }
    #content-settings .settings-nav-item .text-xs { display: none !important; }
    /* 设置页底部统计缩小 */
    #content-settings .grid-cols-2 { gap: 4px !important; }
    #content-settings .text-lg { font-size: 14px !important; }

    /* 黑名单：输入框堆叠 */
    #content-blacklist .flex.gap-3 {
        flex-direction: column !important;
        gap: 8px !important;
    }
    #content-blacklist .flex.gap-3 > input {
        width: 100% !important;
        flex: none !important;
    }
    #content-blacklist .flex.gap-3 > button {
        width: 100% !important;
    }

    /* 设置右侧内容 */
    .settings-panel .px-6 { padding-left: 14px !important; padding-right: 14px !important; }
    .settings-panel .py-5 { padding-top: 12px !important; padding-bottom: 12px !important; }
    .settings-panel .p-6 { padding: 12px !important; }
    .settings-panel .text-lg { font-size: 14px !important; }
    .settings-panel .grid-cols-2 { grid-template-columns: 1fr !important; }
    .settings-panel .grid-cols-3 { grid-template-columns: 1fr !important; }

    /* 上传区 */
    .lg\\:grid-cols-3 { grid-template-columns: 1fr !important; }
    .lg\\:col-span-2 { grid-column: span 1 !important; }

    /* 模态框 */
    .modal-content { max-width: 95vw !important; }
    .modal-header { padding: 14px 16px !important; }
    .modal-body { padding: 16px !important; }
    .modal-footer { padding: 12px 16px 16px !important; }

    /* 卡片区域 */
    .rounded-2xl { border-radius: 14px !important; }
    .px-6 { padding-left: 12px !important; padding-right: 12px !important; }
    .py-5 { padding-top: 10px !important; padding-bottom: 10px !important; }
    .p-6 { padding: 12px !important; }
    .p-5 { padding: 10px !important; }

    /* 分页区域：上下堆叠 */
    .px-4.py-3.flex.items-center.justify-between {
        flex-direction: column !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 10px 12px !important;
    }
    .pagination-btn {
        min-width: 30px !important;
        height: 30px !important;
        padding: 0 8px !important;
        font-size: 12px !important;
    }

    /* 代码文本 */
    .code-text { font-size: 10px !important; max-width: 140px !important; }

    /* 底部统计 */
    .stat-card { padding: 10px !important; }
}