*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system}
body{background:#f5f7fa;padding:16px;color:#333}
.container{max-width:1400px;margin:0 auto}
.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}
.btn{padding:9px 18px;background:#409EFF;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px}
/* 顶部统计卡片 */
.card-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:24px}
.stat-card{background:#fff;padding:20px;border-radius:10px;box-shadow:0 1px 5px #e4e7ed}
.stat-card h3{font-size:15px;color:#666;margin-bottom:8px}
.stat-card p{font-size:28px;font-weight:bold;color:#111}
/* 图表区域自适应 */
.chart-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}
.chart-card{background:#fff;padding:16px;border-radius:10px;box-shadow:0 1px 5px #e4e7ed}
#gender-chart,#media-chart{height:340px;width:100%}
/* 移动端适配 */
@media(max-width:768px){
    .chart-row{grid-template-columns:1fr}
    .stat-card p{font-size:22px}
}
/* 搜索框 */
.search-box{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.search-box input{padding:10px;border:1px solid #ddd;border-radius:6px;flex:1;min-width:160px}
/* 表格 */
.table-wrap{overflow-x:auto;background:#fff;border-radius:10px;padding:12px}
table{width:100%;border-collapse:collapse;min-width:600px}
th,td{padding:12px 8px;border-bottom:1px solid #eee;text-align:left;font-size:14px}
th{background:#fafafa}
/* 分页 */
.page-box{margin-top:16px;display:flex;gap:12px;align-items:center}