/* =========================================================
   老页面翻新公共样式 (pg_common.css)
   ★ 与怪物/物件图鉴/任务清单同一套视觉语言:
     浅色卡片 + 白面板 12px 圆角 + 0 2px 10px 软阴影 / 主色 #2f6fa8 / 边框 #d8dee5
     文字 #2c3e50(标题) · #34495e(正文) · #97a3b0(次要)
   2026-09-30 批量翻新共用: download / 排行 / 挑战 / 序列奖励 / 网络时间 / 封禁 / 任务登记
   前缀 pg- , 避免与 bootstrap / app.css 冲突
   ========================================================= */

/* ---------- 页面骨架 ---------- */
.pg-wrapper { max-width: 1180px; margin: 2em auto 3em; padding: 0 15px; }
.pg-title { font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 4px; letter-spacing: 6px; color: #2c3e50; }
.pg-subtitle { text-align: center; color: #97a3b0; font-size: 12px; letter-spacing: 1px; margin-bottom: 20px; line-height: 1.8; }
.pg-wrapper a { color: #2f6fa8; text-decoration: none; }
.pg-wrapper a:hover { text-decoration: underline; }

/* ---------- 卡片 ---------- */
.pg-card { background: #fff; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.06); padding: 14px 16px; margin-bottom: 16px; }
.pg-card-title { font-size: 13px; font-weight: bold; color: #7b8894; letter-spacing: 2px; margin: 2px 0 10px; display: flex; align-items: center; gap: 8px; }
.pg-card-title::after { content: ""; flex: 1; height: 1px; background: #edf1f5; }

/* ---------- 过滤面板 ---------- */
.pg-filter-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pg-filter-row + .pg-filter-row { margin-top: 10px; }
.pg-input, .pg-select {
    border: 1px solid #d8dee5; border-radius: 8px; padding: 8px 10px; font-size: 13px;
    color: #34495e; background: #fff; font-family: inherit;
}
.pg-input { flex: 1 1 220px; min-width: 160px; }
.pg-input:focus, .pg-select:focus { outline: none; border-color: #7fb3d5; box-shadow: 0 0 0 3px rgba(127,179,213,.18); }
.pg-input[type="search"]::-webkit-search-cancel-button { cursor: pointer; }
.pg-seg { display: inline-flex; flex-wrap: wrap; gap: 4px; background: #f0f3f6; border-radius: 8px; padding: 3px; }
.pg-seg button {
    border: none; background: transparent; color: #7b8894; font-size: 12px; font-family: inherit;
    padding: 5px 12px; border-radius: 6px; cursor: pointer; line-height: 1.4; transition: background .12s, color .12s;
}
.pg-seg a {
    display: inline-block; background: transparent; color: #7b8894; font-size: 12px; text-decoration: none;
    padding: 5px 12px; border-radius: 6px; line-height: 1.4; transition: background .12s, color .12s;
}
.pg-seg button.on, .pg-seg a.on { background: #fff; color: #2f6fa8; font-weight: bold; box-shadow: 0 1px 4px rgba(31,74,111,.14); }
.pg-seg-label { font-size: 12px; color: #97a3b0; margin-right: 2px; }
.pg-chk { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #7b8894; cursor: pointer; user-select: none; white-space: nowrap; padding: 5px 2px; }
.pg-chk input { margin: 0; accent-color: #2f6fa8; width: 15px; height: 15px; }
.pg-count { color: #97a3b0; font-size: 12px; margin-left: auto; white-space: nowrap; }
.pg-count b { color: #2f6fa8; }

/* ---------- 徽章 ---------- */
.pg-badge {
    display: inline-block; font-size: 11px; line-height: 1; padding: 4px 7px;
    border-radius: 5px; background: #f0f3f6; color: #7b8894; white-space: nowrap; font-weight: 600;
}
.pg-b-ep { background: #2f6fa8; color: #fff; }
.pg-b-solo { background: #f1ecf9; color: #6b4fa8; }
.pg-b-normal { background: #e8f1f8; color: #2f6fa8; }
.pg-b-government { background: #e6f4f1; color: #1d7a6f; }
.pg-b-battle { background: #fdecec; color: #c0392b; }
.pg-b-challenge { background: #fdf3e7; color: #b9770e; }
.pg-oneperson { background: #f1ecf9; color: #6b4fa8; }
.pg-b-limit { background: #fff4e5; color: #c87f0a; }
.pg-b-upcoming { background: #e8f1f8; color: #2f6fa8; }
.pg-b-ended { background: #f0f2f5; color: #97a3b0; }
.pg-b-ok { background: #e6f4f1; color: #1d7a6f; }
.pg-b-no { background: #f0f2f5; color: #97a3b0; }
.pg-b-hot { background: #fdecec; color: #c0392b; }

/* 名次徽章 (金银铜) */
.pg-rank-badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border-radius: 50%; font-size: 12px; font-weight: bold;
    background: #f0f3f6; color: #7b8894;
}
.pg-rank-1 { background: linear-gradient(135deg, #ffd76e, #ffb830); color: #7a4c00; }
.pg-rank-2 { background: linear-gradient(135deg, #e3e9ef, #b8c4d0); color: #4a5a6a; }
.pg-rank-3 { background: linear-gradient(135deg, #f0b98a, #d98d4f); color: #6b3a10; }

/* ---------- 前三名领奖台 ---------- */
.pg-podium { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.pg-pod {
    background: #fff; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.06);
    padding: 16px 14px 14px; text-align: center; position: relative;
}
.pg-pod .pg-rank-badge { width: 34px; height: 34px; font-size: 15px; margin-bottom: 8px; }
.pg-pod-name { font-size: 16px; font-weight: bold; color: #2c3e50; word-break: break-all; line-height: 1.4; }
.pg-pod-name a { color: #2c3e50; }
.pg-pod-name a:hover { color: #2f6fa8; }
.pg-pod-sub { margin-top: 6px; font-size: 12px; color: #97a3b0; line-height: 1.7; }
.pg-pod-score { margin-top: 8px; font-size: 20px; font-weight: bold; color: #2f6fa8; font-variant-numeric: tabular-nums; }
.pg-pod-score small { font-size: 11px; color: #97a3b0; font-weight: normal; margin-left: 3px; }

/* ---------- 数据表格 (卡壳 + 横向滚动) ---------- */
.pg-table-wrap {
    background: #fff; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.06);
    overflow: hidden; margin-bottom: 16px;
}
.pg-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* 兜底: 容器里没挂 pg-table 类的裸表格 (如共用函数 displayLeaderboard 直接 echo 的表) 同样吃新样式 */
.pg-table, .pg-table-wrap table { width: 100%; border-collapse: collapse; font-size: 13px; color: #34495e; min-width: 640px; }
.pg-table th, .pg-table td, .pg-table-wrap table th, .pg-table-wrap table td { padding: 11px 14px; text-align: left; white-space: nowrap; }
.pg-table td.wrap { white-space: normal; word-break: break-word; }
.pg-table th, .pg-table-wrap table th {
    background: #f0f4f8; color: #2c3e50; font-size: 12px; font-weight: bold;
    border-bottom: 1px solid #e4e9ee; position: sticky; top: 0;
}
.pg-table td, .pg-table-wrap table td { border-bottom: 1px solid #f0f3f6; }
.pg-table tbody tr:last-child td, .pg-table-wrap table tr:last-child td { border-bottom: none; }
.pg-table tbody tr:hover, .pg-table-wrap table tr:hover { background: #f7fafc; }
.pg-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.pg-table .ctr { text-align: center; }
.pg-table a { font-weight: 600; }

/* ---------- 空态 / 提示 ---------- */
.pg-empty { text-align: center; color: #97a3b0; padding: 46px 0; font-size: 13px; line-height: 2; background: #fff; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.pg-note {
    border-radius: 10px; padding: 12px 16px; font-size: 13px; line-height: 1.9; margin-bottom: 16px;
    background: #e8f1f8; color: #23517a; border: 1px solid #cfe2f0;
}
.pg-note.warn { background: #fff4e5; color: #8a5a10; border-color: #f2dfc0; }
.pg-note.err { background: #fdecec; color: #8a1c13; border-color: #f3cdca; }
.pg-note a { color: inherit; font-weight: 600; }

/* ---------- 大字时钟 (网络时间页) ---------- */
.pg-clock {
    background: #fff; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.06);
    padding: 22px 18px; text-align: center; margin-bottom: 16px;
}
.pg-clock-main { font-size: 34px; font-weight: bold; color: #2f6fa8; font-variant-numeric: tabular-nums; letter-spacing: 2px; }
.pg-clock-sub { margin-top: 8px; font-size: 14px; color: #7b8894; font-variant-numeric: tabular-nums; }

/* ---------- 文件下载列表 ---------- */
.pg-dl-list { display: flex; flex-direction: column; gap: 8px; }
.pg-dl {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
    border: 1px solid #e4e9ee; border-radius: 10px; padding: 11px 14px;
    transition: border-color .12s, box-shadow .12s;
}
.pg-dl:hover { border-color: #a9c9e2; box-shadow: 0 2px 8px rgba(31,74,111,.08); }
.pg-dl-name { font-size: 14px; font-weight: 600; color: #2c3e50; flex: 1 1 auto; min-width: 0; }
.pg-dl-links { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; }
.pg-dl-links a { font-weight: 600; }
.pg-dl-desc { flex-basis: 100%; font-size: 12px; color: #97a3b0; line-height: 1.7; }

/* ---------- 说明文字区 ---------- */
.pg-sec { margin-bottom: 16px; }
.pg-sec-title { font-size: 15px; font-weight: bold; color: #2c3e50; margin: 0 0 8px; padding-left: 10px; border-left: 3px solid #2f6fa8; }
.pg-text { font-size: 13px; color: #34495e; line-height: 2; }
.pg-text ul, .pg-text ol { padding-left: 20px; margin: 6px 0; }
.pg-text li { margin: 3px 0; }
.pg-text p { margin: 6px 0; }
.pg-text img { max-width: 100%; border-radius: 8px; cursor: zoom-in; margin: 6px 0; }

/* ---------- 表单 (任务登记) ---------- */
.pg-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.pg-form .full { grid-column: 1 / -1; }
.pg-field label { display: block; font-size: 12px; color: #7b8894; margin-bottom: 5px; font-weight: 600; }
.pg-field .pg-input, .pg-field .pg-select, .pg-field textarea {
    width: 100%; border: 1px solid #d8dee5; border-radius: 8px; padding: 9px 10px; font-size: 13px;
    color: #34495e; background: #fff; font-family: inherit; box-sizing: border-box;
}
.pg-field textarea { min-height: 72px; resize: vertical; line-height: 1.7; }
.pg-field input:focus, .pg-field select:focus, .pg-field textarea:focus { outline: none; border-color: #7fb3d5; box-shadow: 0 0 0 3px rgba(127,179,213,.18); }
.pg-checks { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.pg-checks label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #34495e; cursor: pointer; }
.pg-checks input { accent-color: #2f6fa8; width: 15px; height: 15px; margin: 0; }
.pg-submit {
    border: none; background: #2f6fa8; color: #fff; font-size: 14px; font-family: inherit; font-weight: 600;
    padding: 11px 34px; border-radius: 8px; cursor: pointer; transition: background .12s; min-height: 44px;
}
.pg-submit:hover { background: #275c8d; }

/* ---------- 移动端 ---------- */
@media (max-width: 720px) {
    .pg-wrapper { margin: 1.2em auto 2.5em; padding: 0 10px; }
    .pg-title { font-size: 20px; letter-spacing: 4px; }
    .pg-subtitle { font-size: 11px; }
    .pg-card { padding: 10px 12px; border-radius: 10px; }
    .pg-filter-row { gap: 6px; }
    .pg-input { flex-basis: 100%; }
    .pg-select { flex: 1 1 auto; max-width: none; }
    .pg-count { margin-left: 0; flex-basis: 100%; }
    .pg-seg button { padding: 6px 12px; }
    /* 领奖台: 竖排 */
    .pg-podium { grid-template-columns: 1fr; gap: 8px; }
    .pg-pod { display: flex; align-items: center; text-align: left; gap: 12px; padding: 12px; }
    .pg-pod .pg-rank-badge { margin-bottom: 0; flex: none; }
    .pg-pod-name { flex: 1; }
    .pg-pod-score { margin-top: 0; font-size: 17px; }
    .pg-pod-sub { display: none; }
    /* 表格: 允许横向滑动 (保持完整列) */
    .pg-table { min-width: 560px; }
    .pg-form { grid-template-columns: 1fr; }
    .pg-clock-main { font-size: 26px; }
}