/* lol-mixer 2026-11-03 v5 · 排版重构：只改 4 页的布局，不改数据、计算、排序、搜索、落盘与鉴权。
   作用域全部挂在 body[data-fx-page] 下，其他页面不受影响；动效层不挡点击；手机端全部回到单列可读布局。 */

/* ---------- 通用：斜切英雄区标题（4 页共用） ---------- */
body[data-fx-page="dashboard"] .v5-hero,
body[data-fx-page="profiles"] .v5-hero,
body[data-fx-page="autosched"] .v5-hero,
body[data-fx-page="board"] .v5-hero {
  position: relative; padding: 22px 24px 26px; border-radius: 26px 8px 26px 8px;
  background: linear-gradient(115deg, rgba(99,102,241,.20), rgba(15,23,42,.55) 55%, rgba(236,72,153,.14));
  border: 1px solid rgba(129,140,248,.25); overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 26px) 100%, 0 100%);
}
body[data-fx-page="dashboard"] .v5-hero h2,
body[data-fx-page="profiles"] .v5-hero h2,
body[data-fx-page="autosched"] .v5-hero h2,
body[data-fx-page="board"] .v5-hero h2 { font-size: 2.1rem; line-height: 1.15; }
body[data-fx-page="dashboard"] .v5-hero p,
body[data-fx-page="profiles"] .v5-hero p,
body[data-fx-page="autosched"] .v5-hero p,
body[data-fx-page="board"] .v5-hero p { max-width: 62ch; }

/* ---------- 数据大盘：bento 指挥舱 ---------- */
/* 旧：4 张等宽 KPI 卡排成一排；新：7/5 与 5/7 错落的两行，卡片斜切角 + 轻微错位 */
body[data-fx-page="dashboard"] .v5-kpi { display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px; }
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(1) { grid-column: span 7; border-radius: 24px 8px 24px 8px; }
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(2) { grid-column: span 5; border-radius: 8px 24px 8px 24px; transform: translateY(4px); }
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(3) { grid-column: span 5; border-radius: 24px 8px 8px 24px; transform: translateY(-2px); }
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(4) { grid-column: span 7; border-radius: 8px 24px 24px 8px; }
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(1) p:last-child,
body[data-fx-page="dashboard"] .v5-kpi > div:nth-child(4) p:last-child { font-size: 2.4rem; }
/* 旧：榜单两两等分；新：主榜 7 列、副榜 5 列，第二组反向 5/7，形成视觉动线 */
body[data-fx-page="dashboard"] .v5-boards { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
body[data-fx-page="dashboard"] .v5-boards > div:nth-child(1) { grid-column: span 7; border-radius: 26px 10px 26px 10px; }
body[data-fx-page="dashboard"] .v5-boards > div:nth-child(2) { grid-column: span 5; border-radius: 10px 26px 10px 26px; transform: translateY(8px); }
body[data-fx-page="dashboard"] .v5-boards-alt > div:nth-child(1) { grid-column: span 5; transform: none; }
body[data-fx-page="dashboard"] .v5-boards-alt > div:nth-child(2) { grid-column: span 7; transform: translateY(8px); }

/* ---------- 选手档案：立体档案布局 ---------- */
/* 选手芯片云：大小错落，不再是清一色小圆点 */
body[data-fx-page="profiles"] .v5-chipcloud button:nth-child(5n) { padding: 8px 16px; font-size: 14px; }
body[data-fx-page="profiles"] .v5-chipcloud button:nth-child(3n) { transform: rotate(-1deg); }
body[data-fx-page="profiles"] .v5-chipcloud button:nth-child(4n) { transform: rotate(.7deg); }
/* 主卡统计：旧 4 等分；新 7/5 与 5/7 错落 */
body[data-fx-page="profiles"] .v5-prof-stats { display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px; }
body[data-fx-page="profiles"] .v5-prof-stats > div:nth-child(1) { grid-column: span 7; }
body[data-fx-page="profiles"] .v5-prof-stats > div:nth-child(2) { grid-column: span 5; }
body[data-fx-page="profiles"] .v5-prof-stats > div:nth-child(3) { grid-column: span 5; }
body[data-fx-page="profiles"] .v5-prof-stats > div:nth-child(4) { grid-column: span 7; }
/* 搭档/对手：旧左右等分；新主区 7 列、次区 5 列且次区轻微倾斜下沉 */
body[data-fx-page="profiles"] .v5-duo { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
body[data-fx-page="profiles"] .v5-duo > div:nth-child(1) { grid-column: span 7; }
body[data-fx-page="profiles"] .v5-duo > div:nth-child(2) { grid-column: span 5; transform: rotate(.5deg) translateY(6px); }
/* 成长轨迹：旧全宽表格；新时间线卡片——日期作左柱，奇偶行左右错位 */
body[data-fx-page="profiles"] .v5-timeline table { display: block; }
body[data-fx-page="profiles"] .v5-timeline thead { display: none; }
body[data-fx-page="profiles"] .v5-timeline tbody { display: block; padding: 12px; }
body[data-fx-page="profiles"] .v5-timeline tbody tr {
  display: grid; grid-template-columns: 86px 1fr auto; align-items: center; gap: 4px 14px;
  grid-template-areas: "date match result" "date hero kda" "date rate rate";
  padding: 12px 14px; margin-bottom: 10px; border-radius: 18px 6px 18px 6px;
  background: rgba(15,23,42,.55); border: 1px solid rgba(51,65,85,.7);
}
body[data-fx-page="profiles"] .v5-timeline tbody tr:nth-child(even) { margin-left: 26px; }
body[data-fx-page="profiles"] .v5-timeline tbody tr:nth-child(odd) { margin-right: 26px; }
body[data-fx-page="profiles"] .v5-timeline tbody td { padding: 0; white-space: normal; border: none; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(1) { grid-area: date; font-size: 12px; color: #94a3b8; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(2) { grid-area: match; font-size: 13px; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(3) { grid-area: hero; color: #cbd5e1; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(4) { grid-area: kda; color: #cbd5e1; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(5) { grid-area: result; font-size: 15px; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(6) { grid-area: rate; color: #94a3b8; font-size: 12px; }
body[data-fx-page="profiles"] .v5-timeline tbody td:nth-child(6)::before { content: "累计胜率 "; }

/* ---------- 自动排片：舞台式对阵 ---------- */
/* 设置区：旧上下堆叠；新左 8 列选人池、右 4 列竖排参数，形成工作台 */
body[data-fx-page="autosched"] .v5-sched-setup { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(1) { grid-column: span 12; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(2) { grid-column: span 8; max-height: none; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(3) { grid-column: span 4; flex-direction: column; align-items: stretch; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(3) label { width: 100%; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(3) label input { width: 100%; }
body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(3) button { width: 100%; justify-content: center; }
/* 对阵舞台：旧规整两列；新蓝左红右 + 中央 VS 徽章微重叠对撞 */
body[data-fx-page="autosched"] .v5-stage { display: grid; grid-template-columns: 1fr 74px 1fr; align-items: stretch; }
body[data-fx-page="autosched"] .v5-stage > div:first-child { transform: rotate(-.5deg) translateX(8px); border-radius: 24px 8px 8px 24px; z-index: 1; }
body[data-fx-page="autosched"] .v5-stage > div:last-child { transform: rotate(.5deg) translateX(-8px); border-radius: 8px 24px 24px 8px; z-index: 1; }
body[data-fx-page="autosched"] .v5-vs {
  display: flex; align-items: center; justify-content: center; z-index: 2;
  font-size: 30px; font-weight: 900; color: #fbbf24; transform: rotate(-8deg);
  text-shadow: 0 0 18px rgba(251,191,36,.8), 0 2px 0 rgba(0,0,0,.6); pointer-events: none;
}
/* 已保存赛程：旧单列列表；新双列卡片墙，标题通栏 */
body[data-fx-page="autosched"] .v5-saved { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body[data-fx-page="autosched"] .v5-saved > h3 { grid-column: 1 / -1; }
body[data-fx-page="autosched"] .v5-saved > div { border: 1px solid rgba(51,65,85,.7); border-radius: 20px 8px 20px 8px; padding: 14px; background: rgba(15,23,42,.45); }
body[data-fx-page="autosched"] .v5-saved > p { grid-column: 1 / -1; }

/* ---------- 选手仪表盘：排名墙 + 选手条目卡 ---------- */
/* 控件：旧一排挤在一起；新搜索占主位、排序与计数分列，搜索框更醒目 */
body[data-fx-page="board"] .v5-board-controls { display: grid; grid-template-columns: 1fr 230px auto; align-items: center; gap: 12px; }
body[data-fx-page="board"] .v5-board-controls input { padding: 12px 16px; font-size: 15px; border-radius: 16px 6px 16px 6px; }
/* 旧：57 人全宽 9 列大表；新：表头隐藏、每行变一张选手卡，双列墙排布，字段带小标签 */
body[data-fx-page="board"] .v5-wall > div { overflow: visible; }
body[data-fx-page="board"] .v5-wall-table { display: block; }
body[data-fx-page="board"] .v5-wall-table thead { display: none; }
body[data-fx-page="board"] .v5-wall-table tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 14px; }
body[data-fx-page="board"] .v5-wall-table tbody tr {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px 12px; padding: 14px 16px;
  grid-template-areas: "name name rate" "games wl kda" "total mvp chef" "recent recent recent";
  border-radius: 20px 8px 20px 8px; background: rgba(15,23,42,.55); border: 1px solid rgba(51,65,85,.7);
}
body[data-fx-page="board"] .v5-wall-table tbody tr:nth-child(1) { border-color: rgba(251,191,36,.7); background: linear-gradient(135deg, rgba(251,191,36,.14), rgba(15,23,42,.6)); }
body[data-fx-page="board"] .v5-wall-table tbody tr:nth-child(2) { border-color: rgba(203,213,225,.55); }
body[data-fx-page="board"] .v5-wall-table tbody tr:nth-child(3) { border-color: rgba(217,119,6,.55); }
body[data-fx-page="board"] .v5-wall-table tbody td { padding: 0; white-space: normal; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(1) { grid-area: name; font-size: 15px; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(2) { grid-area: games; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(3) { grid-area: wl; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(4) { grid-area: rate; text-align: right; font-size: 18px; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(5) { grid-area: total; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(6) { grid-area: kda; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(7) { grid-area: mvp; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(8) { grid-area: chef; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(9) { grid-area: recent; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(2)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(3)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(5)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(6)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(7)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(8)::before,
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(9)::before {
  display: block; font-size: 10px; letter-spacing: .12em; color: #64748b; font-weight: 700; margin-bottom: 2px;
}
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(2)::before { content: "场次"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(3)::before { content: "胜 / 负"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(5)::before { content: "总 K / D / A"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(6)::before { content: "KDA"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(7)::before { content: "MVP"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(8)::before { content: "厨神"; }
body[data-fx-page="board"] .v5-wall-table tbody td:nth-child(9)::before { content: "近 5 场"; }

/* ---------- 手机端：全部回到单列可读布局 ---------- */
@media (max-width: 768px) {
  body[data-fx-page="dashboard"] .v5-kpi > div,
  body[data-fx-page="dashboard"] .v5-boards > div,
  body[data-fx-page="profiles"] .v5-prof-stats > div,
  body[data-fx-page="profiles"] .v5-duo > div,
  body[data-fx-page="autosched"] .v5-sched-setup > div,
  body[data-fx-page="autosched"] .v5-saved { grid-column: span 12 !important; }
  body[data-fx-page="dashboard"] .v5-kpi > div,
  body[data-fx-page="dashboard"] .v5-boards > div,
  body[data-fx-page="profiles"] .v5-duo > div { transform: none !important; }
  body[data-fx-page="autosched"] .v5-sched-setup > div:nth-child(2) { max-height: 16rem; overflow-y: auto; }
  body[data-fx-page="autosched"] .v5-stage { grid-template-columns: 1fr; }
  body[data-fx-page="autosched"] .v5-stage > div:first-child,
  body[data-fx-page="autosched"] .v5-stage > div:last-child { transform: none; }
  body[data-fx-page="autosched"] .v5-vs { font-size: 22px; padding: 4px 0; }
  body[data-fx-page="autosched"] .v5-saved { grid-template-columns: 1fr; }
  body[data-fx-page="profiles"] .v5-timeline tbody tr:nth-child(even),
  body[data-fx-page="profiles"] .v5-timeline tbody tr:nth-child(odd) { margin-left: 0; margin-right: 0; }
  body[data-fx-page="profiles"] .v5-timeline tbody tr { grid-template-columns: 74px 1fr auto; }
  body[data-fx-page="board"] .v5-board-controls { grid-template-columns: 1fr; }
  body[data-fx-page="board"] .v5-wall-table tbody { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-fx-page="dashboard"] .v5-kpi > div,
  body[data-fx-page="dashboard"] .v5-boards > div,
  body[data-fx-page="profiles"] .v5-duo > div,
  body[data-fx-page="autosched"] .v5-stage > div { transform: none !important; transition: none !important; animation: none !important; }
}