/* =====================================================================
   阵容编辑（#screen-team）—— TACTICS LAB 高保真复刻（tt- 前缀）。
   设计稿：design_handoff_tactics_editor（README 设计令牌 + 战术编辑器.html）。
   适配说明：设计是 100vh 响应式三段式；本工程是 1080x1920 固定舞台
   （app.js fitStage 整体缩放），因此取设计的【竖屏版式】为基调，
   设计 px 值统一 ×2.5（竖屏稿 ~420px 宽 → 舞台 1080px 宽），
   保持设计的比例 / 配色 / 圆角 / 阴影 / 动效时长不变。
   文件后半部分：customize 屏共用的 .tp-list 与 cz- 样式（原样保留）。
   ===================================================================== */

/* ---- 设计令牌（README「设计令牌」表，tt- 作用域内生效） ---- */
#screen-team {
  --tt-bg: #070a14;
  --tt-bg2: #0b1020;
  --tt-panel: rgba(20, 28, 48, 0.66);
  --tt-panel-solid: #101728;
  --tt-stroke: rgba(120, 150, 200, 0.16);
  --tt-stroke-strong: rgba(120, 160, 210, 0.30);
  --tt-txt: #e8eefc;
  --tt-txt-dim: #8a98b8;
  --tt-txt-faint: #5b6a8c;
  --tt-teal: #15e371;
  --tt-blue: #3b82f6;
  --tt-sky: #38bdf8;
  --tt-amber: #fbbf24;
  --tt-rose: #fb7185;
  --tt-gold: #f5c451;
  font-family: 'Oxanium', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
  color: var(--tt-txt);
}

/* 整屏容器：竖屏版式 = 顶栏(sticky) → 小标题 → 球场 → 详情卡 → 名单 → agent → 底栏(sticky)，
   整体在舞台内纵向滚动（对应设计竖屏 body{overflow-y:auto}） */
.tt-app {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  background:
    radial-gradient(1200px 800px at 18% -8%, rgba(21, 227, 113, 0.10), transparent 55%),
    radial-gradient(1000px 700px at 95% 8%, rgba(59, 130, 246, 0.12), transparent 50%),
    var(--tt-bg);
}
.tt-app::-webkit-scrollbar { width: 12px; }
.tt-app::-webkit-scrollbar-thumb { background: rgba(120, 150, 200, 0.25); border-radius: 6px; }

#screen-team button { font-family: inherit; cursor: pointer; color: inherit; }
#screen-team b { font-weight: 700; }

/* ============ 顶栏 TopBar（竖屏：两行 flex-wrap + sticky top） ============ */
.tt-topbar {
  flex: 0 0 auto;
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 25px;
  padding: 28px 40px;
  background: linear-gradient(180deg, rgba(16, 24, 44, 0.92), rgba(10, 14, 28, 0.78));
  border-bottom: 1px solid var(--tt-stroke);
  backdrop-filter: blur(12px);
}
.tt-top-left { display: flex; align-items: center; gap: 40px; flex: 1 1 auto; }
.tt-top-right { display: flex; align-items: center; gap: 25px; flex: 1 1 100%; justify-content: space-between; }

.tt-brand {
  font-weight: 800;
  font-size: 48px;
  letter-spacing: 2.5px;
  color: var(--tt-teal);
  text-shadow: 0 0 45px rgba(21, 227, 113, 0.45);
  white-space: nowrap;
}
.tt-brand em { font-style: normal; color: var(--tt-txt); margin-left: 5px; font-weight: 600; }

.tt-teamfield { display: flex; align-items: center; gap: 20px; flex: 1 1 auto; min-width: 0; }
.tt-teamlabel { font-size: 30px; color: var(--tt-txt-dim); letter-spacing: 2.5px; flex: none; }
.tt-teaminput {
  width: 300px;
  max-width: 100%;
  min-width: 0;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid var(--tt-stroke);
  border-radius: 20px;
  padding: 18px 30px;
  color: var(--tt-txt);
  font-size: 38px;
  font-weight: 600;
  font-family: inherit;
  letter-spacing: 2.5px;
  outline: none;
  transition: 0.2s;
}
.tt-teaminput:focus { border-color: var(--tt-teal); box-shadow: 0 0 0 8px rgba(21, 227, 113, 0.14); }

/* 步进器：◀ 值 ▶（阵型青 / 战术天蓝） */
.tt-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid var(--tt-stroke);
  border-radius: 25px;
  overflow: hidden;
}
.tt-stepbtn {
  background: transparent;
  border: none;
  padding: 20px 30px;
  color: var(--tt-txt-dim);
  font-size: 30px;
  transition: 0.15s;
}
.tt-stepbtn:hover { background: rgba(21, 227, 113, 0.14); color: var(--tt-teal); }
.tt-stepval {
  min-width: 160px;
  text-align: center;
  font-weight: 700;
  font-size: 38px;
  padding: 0 15px;
  letter-spacing: 2.5px;
}
.tt-stepval-f { color: var(--tt-teal); }
.tt-stepval-s { color: var(--tt-sky); }

.tt-closebtn {
  background: linear-gradient(180deg, rgba(251, 113, 133, 0.22), rgba(251, 113, 133, 0.10));
  border: 1px solid rgba(251, 113, 133, 0.5);
  color: #ffd9df;
  border-radius: 25px;
  padding: 20px 45px;
  font-weight: 700;
  font-size: 35px;
  transition: 0.18s;
  flex: none;
}
.tt-closebtn:hover { background: rgba(251, 113, 133, 0.32); box-shadow: 0 0 40px rgba(251, 113, 133, 0.35); }

/* ============ 主区（竖屏：纵向堆叠） ============ */
.tt-main {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 36px;
  padding: 36px;
}
.tt-leftcol { flex: 0 0 auto; display: flex; flex-direction: column; gap: 25px; min-width: 0; }
.tt-lefthead { display: flex; align-items: baseline; justify-content: space-between; padding: 0 10px 5px; }
.tt-lh-title { font-size: 42px; font-weight: 700; letter-spacing: 1.2px; color: #fff; }
.tt-lh-meta { font-size: 32px; color: var(--tt-txt-dim); }
.tt-lh-meta b { color: var(--tt-sky); font-weight: 700; }
.tt-lh-meta b.tt-lh-avg { color: var(--tt-teal); font-size: 40px; }

.tt-rightcol { flex: 0 0 auto; display: flex; flex-direction: column; gap: 36px; width: 100%; }

/* ============ 球场 Pitch ============ */
.tt-pitchwrap { position: relative; }
.tt-pitch {
  position: relative;
  width: 100%;
  aspect-ratio: 100 / 116;       /* 设计竖屏球场比例 */
  border-radius: 40px;
  overflow: hidden;
  background: linear-gradient(180deg, #0e3a26 0%, #0a2e1f 50%, #082619 100%);
  border: 2px solid rgba(21, 227, 113, 0.22);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4), 0 60px 150px rgba(0, 0, 0, 0.5), inset 0 0 300px rgba(0, 0, 0, 0.45);
}
.tt-pitch-stripes {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0 9%, transparent 9% 18%);
  pointer-events: none;
}
.tt-pitch-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  filter: drop-shadow(0 0 10px rgba(21, 227, 113, 0.25));
}
.tt-tokens { position: absolute; inset: 0; }
.tt-pitch-tag {
  position: absolute;
  top: 35px;
  right: 40px;
  font-size: 30px;
  letter-spacing: 2.5px;
  color: rgba(200, 255, 235, 0.65);
  background: rgba(0, 0, 0, 0.3);
  padding: 10px 25px;
  border-radius: 50px;
  border: 1px solid rgba(21, 227, 113, 0.2);
  pointer-events: none;
}

/* ---- 球员棋子 Token（圆盘 = 位置缩写 + 评分；盘下 = 球员名 + agent 名） ---- */
.tt-token {
  position: absolute;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;            /* 行距收紧：压缩文字块总高，配合 JS displayYMap 防层间重叠 */
  background: none;
  border: none;
  padding: 0;
  width: 210px;
  transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.2, 1), filter 0.18s;
  z-index: 2;
}
/* 位置配色：门将金 / 后卫蓝 / 中场青 / 前锋玫红 */
.tt-token.tok-gk { --tok: #fbbf24; }
.tt-token.tok-df { --tok: #38bdf8; }
.tt-token.tok-mf { --tok: #15e371; }
.tt-token.tok-fw { --tok: #fb7185; }
.tt-token:hover, .tt-token.hov { z-index: 5; }
.tt-token-disc {
  position: relative;
  width: 125px;
  height: 125px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 35%, rgba(255, 255, 255, 0.18), rgba(10, 16, 28, 0.92) 70%);
  border: 5px solid var(--tok);
  box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.35), 0 15px 40px rgba(0, 0, 0, 0.5), 0 0 35px color-mix(in srgb, var(--tok) 45%, transparent);
  transition: 0.18s;
}
.tt-token-role { font-size: 27px; font-weight: 800; color: var(--tok); line-height: 1; letter-spacing: 1.2px; }
.tt-token-rating { font-size: 35px; font-weight: 800; color: #fff; line-height: 1; margin-top: 3px; }
.tt-token-name {
  font-size: 26px;     /* 31→26：压缩文字块高度（任务：棋子防重叠） */
  font-weight: 700;
  color: #fff;
  line-height: 1.05;
  text-align: center;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
  font-family: 'Noto Sans SC', sans-serif;
  max-width: 110px;   /* 210→110：352/532 中场横向仅隔 118px，名字盒不入邻盘（≤4 字全显，更长省略） */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* agent 标签做成半透明深色底 chip：轻微压线时仍可读（25→22 同步压高度） */
.tt-token-agent {
  font-size: 22px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.2;
  font-family: 'Noto Sans SC', sans-serif;
  max-width: 150px;   /* 同上：与名字一致，防同排 chip 互压 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: rgba(6, 10, 20, 0.72);
  border-radius: 12px;
  padding: 2px 12px;
  box-sizing: border-box;
}
.tt-token-agent:empty { display: none; } /* 空位棋子无 agent 文案：不渲染空 chip */
.tt-token.hov .tt-token-disc, .tt-token:hover .tt-token-disc { transform: scale(1.12); }
.tt-token.selected { transform: translate(-50%, -50%) scale(1.06); z-index: 6; }
.tt-token.selected .tt-token-disc {
  background: radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--tok) 55%, transparent), rgba(10, 16, 28, 0.92) 72%);
  border-color: #fff;
  box-shadow: 0 0 0 7px var(--tok), 0 0 55px color-mix(in srgb, var(--tok) 80%, transparent), 0 20px 50px rgba(0, 0, 0, 0.6);
  animation: tt-tokpulse 1.8s ease-in-out infinite;
}
@keyframes tt-tokpulse {
  0%, 100% { box-shadow: 0 0 0 7px var(--tok), 0 0 45px color-mix(in srgb, var(--tok) 60%, transparent); }
  50% { box-shadow: 0 0 0 10px var(--tok), 0 0 75px color-mix(in srgb, var(--tok) 95%, transparent); }
}
.tt-token.selected .tt-token-name { color: #fff; }
/* 空位棋子：虚线圆盘（位置色 60%）+ ＋号，名字灰显 */
.tt-token.empty .tt-token-disc {
  border-style: dashed;
  border-color: color-mix(in srgb, var(--tok) 60%, transparent);
  background: rgba(8, 14, 26, 0.5);
  box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.25), 0 10px 30px rgba(0, 0, 0, 0.4);
}
.tt-token.empty .tt-token-rating { color: rgba(255, 255, 255, 0.55); font-weight: 600; }
.tt-token.empty .tt-token-name { color: rgba(255, 255, 255, 0.55); font-weight: 500; }

/* ============ 右列玻璃面板 ============ */
.tt-section {
  background: var(--tt-panel);
  border: 1px solid var(--tt-stroke);
  border-radius: 35px;
  backdrop-filter: blur(14px);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.35);
  padding: 35px;
}
.tt-ptitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--tt-txt-dim);
  text-transform: uppercase;
  margin-bottom: 30px;
}
.tt-pcount { font-size: 27px; color: var(--tt-txt-faint); font-weight: 600; letter-spacing: 1px; }
/* 标题左簇：标题 + 计数同组，让右侧快捷入口按钮（.tt-mini）靠右 */
.tt-ptitle-l { display: flex; align-items: baseline; gap: 14px; min-width: 0; }
.tt-mini {
  font-size: 26px;
  font-weight: 700;
  color: var(--tt-teal);
  background: rgba(21, 227, 113, 0.1);
  border: 1px solid rgba(21, 227, 113, 0.3);
  border-radius: 17px;
  padding: 10px 25px;
  font-family: 'Noto Sans SC', sans-serif;
  transition: 0.15s;
  text-transform: none;
  letter-spacing: 0;
}
.tt-mini:hover { background: rgba(21, 227, 113, 0.2); }
.tt-empty { text-align: center; color: var(--tt-txt-faint); padding: 60px 20px; font-size: 32px; font-family: 'Noto Sans SC', sans-serif; }

/* ============ 球员详情卡 PlayerCard ============ */
.tt-pcard { position: relative; border-radius: 30px; overflow: hidden; }
.tt-pcard-head { display: flex; align-items: center; gap: 30px; padding: 10px 5px 35px; }
.tt-pcard-id { flex: 1 1 auto; min-width: 0; }
/* 「查看球员详情」按钮：仅横屏精简内嵌卡显示（竖屏/弹窗里完整信息已在，故隐藏） */
.tt-pcard-more { display: none; }

/* ===== 球员详情弹窗（横屏内嵌卡精简后，点开看全部属性） ===== */
.tt-pmodal { position: absolute; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; }
.tt-pmodal[hidden] { display: none; }
.tt-pmodal-backdrop { position: absolute; inset: 0; background: rgba(5, 9, 18, 0.74); backdrop-filter: blur(7px); }
.tt-pmodal-panel {
  position: relative; z-index: 1;
  width: min(820px, 88%); max-height: 88%;
  display: flex; flex-direction: column;
  background: var(--tt-panel-solid);
  border: 1px solid var(--tt-stroke-strong);
  border-radius: 28px;
  box-shadow: 0 40px 130px rgba(0, 0, 0, 0.62);
  padding: 26px 30px 30px;
}
.tt-pmodal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; flex: 0 0 auto; }
.tt-pmodal-title { font-family: var(--tt-display, inherit); font-weight: 800; font-style: italic; letter-spacing: 1.5px; color: var(--tt-txt); font-size: 26px; text-transform: uppercase; }
.tt-pmodal-close {
  flex: 0 0 auto; width: 48px; height: 48px; border-radius: 14px;
  font-size: 26px; color: #ffb3bd; cursor: pointer;
  background: rgba(251, 113, 133, 0.14); border: 1px solid rgba(251, 113, 133, 0.35);
  transition: 0.15s;
}
.tt-pmodal-close:hover { background: rgba(251, 113, 133, 0.28); }
.tt-pmodal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; }

/* 头像：真实球员照片（设计预留的替换位），段位渐变底 + 段位色描边发光 */
.tt-avatar {
  position: relative;
  width: 155px;
  height: 155px;
  flex: 0 0 auto;
  border-radius: 35px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 30%, rgba(21, 227, 113, 0.30), rgba(8, 14, 26, 0.95) 75%);
  border: 2px solid rgba(21, 227, 113, 0.4);
  box-shadow: 0 0 40px rgba(21, 227, 113, 0.25), inset 0 2px 0 rgba(255, 255, 255, 0.08);
}
.tt-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tt-avatar-pos {
  position: absolute;
  top: 8px;
  left: 12px;
  font-size: 25px;
  font-weight: 800;
  letter-spacing: 1.2px;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
}
.tier-gold .tt-avatar {
  background: radial-gradient(circle at 50% 30%, rgba(245, 196, 81, 0.32), rgba(8, 14, 26, 0.95) 75%);
  border-color: rgba(245, 196, 81, 0.5);
  box-shadow: 0 0 40px rgba(245, 196, 81, 0.28), inset 0 2px 0 rgba(255, 255, 255, 0.08);
}
.tier-silver .tt-avatar {
  background: radial-gradient(circle at 50% 30%, rgba(186, 205, 230, 0.28), rgba(8, 14, 26, 0.95) 75%);
  border-color: rgba(186, 205, 230, 0.45);
  box-shadow: 0 0 30px rgba(186, 205, 230, 0.2), inset 0 2px 0 rgba(255, 255, 255, 0.08);
}
.is-gk .tt-avatar {
  background: radial-gradient(circle at 50% 30%, rgba(251, 191, 36, 0.3), rgba(8, 14, 26, 0.95) 75%);
  border-color: rgba(251, 191, 36, 0.5);
  box-shadow: 0 0 40px rgba(251, 191, 36, 0.28), inset 0 2px 0 rgba(255, 255, 255, 0.08);
}

/* 姓名：可编辑输入框（球员改名，对应 Unity detailNameInput），视觉按设计 21px×2.5 文本 */
.tt-pcard-name {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 2px dashed transparent;
  border-radius: 0;
  padding: 0 0 4px;
  color: var(--tt-txt);
  font-size: 52px;
  font-weight: 700;
  font-family: 'Noto Sans SC', sans-serif;
  line-height: 1.1;
  outline: none;
  transition: border-color 0.15s;
}
.tt-pcard-name:hover { border-bottom-color: var(--tt-stroke-strong); }
.tt-pcard-name:focus { border-bottom-color: var(--tt-teal); }

.tt-pcard-sub { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 20px; }
.tt-chip {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 1.2px;
  padding: 8px 20px;
  border-radius: 15px;
  border: 1px solid var(--tt-stroke);
  color: var(--tt-txt-dim);
  font-family: 'Noto Sans SC', sans-serif;
}
.tt-chip-tier { color: var(--tt-gold); border-color: rgba(245, 196, 81, 0.4); background: rgba(245, 196, 81, 0.1); letter-spacing: 2.5px; font-family: 'Oxanium', sans-serif; }
.tt-chip-on { color: var(--tt-teal); border-color: rgba(21, 227, 113, 0.4); background: rgba(21, 227, 113, 0.1); }
.tt-chip-off { color: var(--tt-txt-faint); }
.tt-chip-agent { color: var(--tt-sky); border-color: rgba(56, 189, 248, 0.3); background: rgba(56, 189, 248, 0.08); }
.tt-chip-gk { color: var(--tt-amber); border-color: rgba(251, 191, 36, 0.4); background: rgba(251, 191, 36, 0.1); }

/* 评分徽章（54×60 → 135×150） */
.tt-pcard-rating {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 135px;
  height: 150px;
  border-radius: 30px;
  flex: 0 0 auto;
  background: linear-gradient(160deg, rgba(21, 227, 113, 0.18), rgba(21, 227, 113, 0.04));
  border: 1px solid rgba(21, 227, 113, 0.35);
}
.tier-gold .tt-pcard-rating { background: linear-gradient(160deg, rgba(245, 196, 81, 0.22), rgba(245, 196, 81, 0.05)); border-color: rgba(245, 196, 81, 0.45); }
.tier-silver .tt-pcard-rating { background: linear-gradient(160deg, rgba(186, 205, 230, 0.18), rgba(186, 205, 230, 0.04)); border-color: rgba(186, 205, 230, 0.4); }
.is-gk .tt-pcard-rating { background: linear-gradient(160deg, rgba(251, 191, 36, 0.2), rgba(251, 191, 36, 0.04)); border-color: rgba(251, 191, 36, 0.4); }
.tt-rating-num { font-size: 70px; font-weight: 800; line-height: 1; color: #fff; text-shadow: 0 0 40px rgba(21, 227, 113, 0.4); }
.tier-gold .tt-rating-num { text-shadow: 0 0 40px rgba(245, 196, 81, 0.5); }
.tt-rating-pos { font-size: 27px; font-weight: 700; letter-spacing: 2.5px; color: var(--tt-teal); margin-top: 8px; }
.tier-gold .tt-rating-pos { color: var(--tt-gold); }
.is-gk .tt-rating-pos { color: var(--tt-amber); }
.tt-rating-num.bt1, .tt-token-rating.bt1, .tt-rrow-rating.bt1 { color: #c4b5fd; text-shadow: 0 0 18px rgba(167, 139, 250, 0.55); }
.tt-rating-num.bt2, .tt-token-rating.bt2, .tt-rrow-rating.bt2 { color: #fdba74; text-shadow: 0 0 18px rgba(251, 146, 60, 0.55); }
.tt-rating-num.bt3, .tt-token-rating.bt3, .tt-rrow-rating.bt3 { color: #fb7185; text-shadow: 0 0 18px rgba(251, 77, 106, 0.6); }
.tt-rating-num.bt4, .tt-token-rating.bt4, .tt-rrow-rating.bt4 { color: #67e8f9; text-shadow: 0 0 18px rgba(103, 232, 249, 0.65), 0 0 26px rgba(251, 196, 81, 0.35); }
.tt-rating-num.bt1, .tt-rating-num.bt2, .tt-rating-num.bt3, .tt-rating-num.bt4 { font-size: 60px; }
.tt-token-rating.bt1, .tt-token-rating.bt2, .tt-token-rating.bt3, .tt-token-rating.bt4 { font-size: 31px; }
.tt-rating-num.bt1::after, .tt-rating-num.bt2::after, .tt-rating-num.bt3::after, .tt-rating-num.bt4::after,
.tt-token-rating.bt1::after, .tt-token-rating.bt2::after, .tt-token-rating.bt3::after, .tt-token-rating.bt4::after,
.tt-rrow-rating.bt1::after, .tt-rrow-rating.bt2::after, .tt-rrow-rating.bt3::after, .tt-rrow-rating.bt4::after {
  content: "";
  display: inline-block;
  width: 0.34em;
  height: 0.56em;
  margin-left: 0.08em;
  vertical-align: -0.02em;
  border-radius: 55% 55% 48% 48%;
  transform: skew(-8deg);
  animation: tt-rating-breakthrough-glow 1.25s ease-in-out infinite;
}
.tt-rating-num.bt1::after, .tt-token-rating.bt1::after, .tt-rrow-rating.bt1::after { background: radial-gradient(circle at 50% 25%, #ffffff, #c4b5fd 35%, #8b5cf6 72%); filter: drop-shadow(0 0 9px rgba(167, 139, 250, 0.8)); }
.tt-rating-num.bt2::after, .tt-token-rating.bt2::after, .tt-rrow-rating.bt2::after { background: radial-gradient(circle at 50% 25%, #ffffff, #fdba74 35%, #f97316 72%); filter: drop-shadow(0 0 9px rgba(251, 146, 60, 0.8)); }
.tt-rating-num.bt3::after, .tt-token-rating.bt3::after, .tt-rrow-rating.bt3::after { background: radial-gradient(circle at 50% 25%, #ffffff, #fb7185 35%, #e11d48 72%); filter: drop-shadow(0 0 10px rgba(251, 77, 106, 0.85)); }
.tt-rating-num.bt4::after, .tt-token-rating.bt4::after, .tt-rrow-rating.bt4::after { background: linear-gradient(180deg, #ffffff, #67e8f9 30%, #22c55e 52%, #f97316 72%, #8b5cf6); filter: drop-shadow(0 0 11px rgba(103, 232, 249, 0.9)); }
@keyframes tt-rating-breakthrough-glow {
  0%, 100% { opacity: 0.72; transform: skew(-8deg) scale(0.95); }
  50% { opacity: 1; transform: skew(-8deg) scale(1.08); }
}

/* 主体：左雷达 + 右能力条（设计 176px 1fr → 440px 1fr） */
.tt-pcard-body { display: grid; grid-template-columns: 440px 1fr; gap: 20px; align-items: center; }
.tt-pcard-radar { display: flex; justify-content: center; align-items: center; }
.tt-radar-svg { overflow: visible; }
.tt-radar-label { fill: var(--tt-txt-dim); font-size: 27px; font-weight: 600; font-family: 'Noto Sans SC', sans-serif; }
.tt-radar-val { fill: #fff; font-size: 30px; font-weight: 800; font-family: 'Oxanium', sans-serif; }

.tt-pcard-bars { display: flex; flex-direction: column; gap: 15px; min-width: 0; }
.tt-statbar { display: grid; grid-template-columns: 96px 1fr 88px; align-items: center; gap: 18px; }
.tt-statbar-label { font-size: 24px; color: var(--tt-txt-dim); font-family: 'Noto Sans SC', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-statbar-track { height: 15px; background: rgba(255, 255, 255, 0.07); border-radius: 10px; overflow: hidden; }
.tt-statbar-track > i { display: block; height: 100%; border-radius: 10px; transition: width 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
.tt-statbar-val { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; font-size: 30px; font-weight: 700; text-align: right; }
.tt-statbar.bt1 .tt-statbar-track > i { background: linear-gradient(90deg, #8b5cf6, #c4b5fd) !important; }
.tt-statbar.bt2 .tt-statbar-track > i { background: linear-gradient(90deg, #f97316, #fdba74) !important; }
.tt-statbar.bt3 .tt-statbar-track > i { background: linear-gradient(90deg, #e11d48, #fb7185) !important; }
.tt-statbar.bt4 .tt-statbar-track > i { background: linear-gradient(90deg, #8b5cf6, #f97316, #22c55e, #67e8f9) !important; }
.tt-statbar.bt1 .tt-statbar-val::after,
.tt-statbar.bt2 .tt-statbar-val::after,
.tt-statbar.bt3 .tt-statbar-val::after,
.tt-statbar.bt4 .tt-statbar-val::after {
  content: "";
  display: inline-block;
  width: 0.38em;
  height: 0.66em;
  border-radius: 55% 55% 48% 48%;
  transform: skew(-8deg);
  animation: tt-breakthrough-glow 1.25s ease-in-out infinite;
}
.tt-statbar.bt1 .tt-statbar-val::after { background: radial-gradient(circle at 50% 25%, #ffffff, #c4b5fd 35%, #8b5cf6 72%); filter: drop-shadow(0 0 10px rgba(167, 139, 250, 0.8)); }
.tt-statbar.bt2 .tt-statbar-val::after { background: radial-gradient(circle at 50% 25%, #ffffff, #fdba74 35%, #f97316 72%); filter: drop-shadow(0 0 10px rgba(251, 146, 60, 0.8)); }
.tt-statbar.bt3 .tt-statbar-val::after { background: radial-gradient(circle at 50% 25%, #ffffff, #fb7185 35%, #e11d48 72%); filter: drop-shadow(0 0 12px rgba(251, 77, 106, 0.85)); }
.tt-statbar.bt4 .tt-statbar-val::after { background: linear-gradient(180deg, #ffffff, #67e8f9 30%, #22c55e 52%, #f97316 72%, #8b5cf6); filter: drop-shadow(0 0 13px rgba(103, 232, 249, 0.9)); }
@keyframes tt-breakthrough-glow {
  0%, 100% { opacity: 0.72; transform: skew(-8deg) scale(0.95); }
  50% { opacity: 1; transform: skew(-8deg) scale(1.08); }
}

/* ============ 球队名单 Roster（竖屏：随整屏滚动，不内部滚） ============ */
.tt-roster { display: flex; flex-direction: column; }
.tt-rgroup { margin-bottom: 20px; }
.tt-rgroup:last-child { margin-bottom: 0; }
.tt-rgroup-label {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 27px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--tt-txt-faint);
  margin: 20px 0 15px;
  text-transform: uppercase;
}
.tt-rgroup:first-child .tt-rgroup-label { margin-top: 0; }
.tt-rgroup-n { font-size: 25px; background: rgba(255, 255, 255, 0.06); padding: 2px 15px; border-radius: 20px; }
.tt-rrow {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 25px;
  padding: 22px 30px;
  margin-bottom: 12px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid transparent;
  border-left: 7px solid var(--rrowc, rgba(120, 150, 200, 0.4));
  transition: 0.14s;
  text-align: left;
}
.tt-rrow.tier-gold { --rrowc: var(--tt-gold); }
.tt-rrow.tier-silver { --rrowc: #bcd0e6; }
.tt-rrow.tier-bronze { --rrowc: #c98a5a; }
.tt-rrow:hover, .tt-rrow.rrow-hov { background: rgba(21, 227, 113, 0.07); transform: translateX(5px); }
.tt-rrow.rrow-sel {
  background: rgba(21, 227, 113, 0.13);
  border-color: rgba(21, 227, 113, 0.35);
  box-shadow: 0 0 0 2px rgba(21, 227, 113, 0.25), 0 10px 35px rgba(21, 227, 113, 0.12);
}
.tt-rrow-pos { font-size: 27px; font-weight: 800; color: var(--rrowc); min-width: 90px; letter-spacing: 1.2px; flex: none; }
.tt-rrow-name { flex: 1 1 auto; min-width: 0; font-size: 35px; font-weight: 600; font-family: 'Noto Sans SC', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-rrow-dep {
  font-size: 25px;
  font-weight: 700;
  color: var(--tt-teal);
  background: rgba(21, 227, 113, 0.12);
  border: 1px solid rgba(21, 227, 113, 0.3);
  padding: 5px 17px;
  border-radius: 15px;
  font-family: 'Noto Sans SC', sans-serif;
  flex: none;
}
.tt-rrow-rating { font-size: 40px; font-weight: 800; min-width: 84px; text-align: right; color: #fff; flex: none; }

/* ============ agent 列表 AgentPanel ============ */
.tt-agentlist { display: flex; flex-direction: column; gap: 15px; }
.tt-arow {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 22px 30px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid var(--tt-stroke);
  cursor: pointer;
  transition: 0.14s;
}
.tt-arow:hover { background: rgba(21, 227, 113, 0.06); border-color: rgba(21, 227, 113, 0.25); }
.tt-arow-builtin { opacity: 0.7; }
.tt-arow-dot { width: 17px; height: 17px; border-radius: 50%; background: var(--tt-sky); box-shadow: 0 0 20px var(--tt-sky); flex: 0 0 auto; }
.tt-arow-builtin .tt-arow-dot { background: var(--tt-txt-faint); box-shadow: none; }
.tt-arow-name { font-size: 34px; font-weight: 600; font-family: 'Noto Sans SC', sans-serif; flex: 0 0 auto; }
.tt-arow-code { flex: 1 1 auto; font-size: 27px; color: var(--tt-txt-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tt-arow-del {
  font-size: 27px;
  font-weight: 700;
  color: #ffb3bd;
  background: rgba(251, 113, 133, 0.14);
  border: 1px solid rgba(251, 113, 133, 0.35);
  border-radius: 17px;
  padding: 10px 27px;
  font-family: 'Noto Sans SC', sans-serif;
  transition: 0.15s;
  flex: 0 0 auto;
}
.tt-arow-del:hover { background: rgba(251, 113, 133, 0.28); }

/* ============ 底部操作栏 BottomBar（sticky bottom） ============ */
.tt-bottombar {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 25px;
  padding: 30px 40px;
  background: linear-gradient(0deg, rgba(16, 24, 44, 0.95), rgba(10, 14, 28, 0.7));
  border-top: 1px solid var(--tt-stroke);
  backdrop-filter: blur(12px);
}
.tt-actions { display: flex; gap: 25px; flex: 1 1 auto; flex-wrap: wrap; }
.tt-abtn {
  flex: 1 1 auto;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--tt-stroke);
  border-radius: 25px;
  padding: 25px 45px;
  font-size: 35px;
  font-weight: 600;
  font-family: 'Noto Sans SC', sans-serif;
  color: var(--tt-txt);
  text-align: center;
  transition: 0.16s;
}
.tt-abtn:hover { background: rgba(255, 255, 255, 0.09); border-color: var(--tt-stroke-strong); transform: translateY(-2px); }
.tt-abtn-primary {
  background: linear-gradient(180deg, var(--tt-teal), #0aa14e);
  color: #04221a;
  border-color: transparent;
  font-weight: 800;
  box-shadow: 0 15px 45px rgba(21, 227, 113, 0.35);
}
.tt-abtn-primary:hover { box-shadow: 0 20px 65px rgba(21, 227, 113, 0.55); background: linear-gradient(180deg, #34d399, #0bb058); }
/* 状态文字：前置青色呼吸小圆点 */
.tt-status {
  flex: 1 1 100%;
  min-height: 40px;
  font-size: 32px;
  color: var(--tt-txt-dim);
  font-family: 'Noto Sans SC', sans-serif;
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0;
}
.tt-status::before {
  content: '';
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--tt-teal);
  box-shadow: 0 0 25px var(--tt-teal);
  animation: tt-blink 1.6s ease-in-out infinite;
  flex: none;
}
@keyframes tt-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

/* ---- 无障碍：减少动态效果时跳过装饰动画 ---- */
@media (prefers-reduced-motion: reduce) {
  .tt-token, .tt-token-disc, .tt-statbar-track > i, .tt-rrow, .tt-abtn { transition: none; }
  .tt-token.selected .tt-token-disc { animation: none; }
  .tt-status::before { animation: none; }
  .tt-statbar.bt1 .tt-statbar-val::after,
  .tt-statbar.bt2 .tt-statbar-val::after,
  .tt-statbar.bt3 .tt-statbar-val::after,
  .tt-statbar.bt4 .tt-statbar-val::after,
  .tt-rating-num.bt1::after, .tt-rating-num.bt2::after, .tt-rating-num.bt3::after, .tt-rating-num.bt4::after,
  .tt-token-rating.bt1::after, .tt-token-rating.bt2::after, .tt-token-rating.bt3::after, .tt-token-rating.bt4::after,
  .tt-rrow-rating.bt1::after, .tt-rrow-rating.bt2::after, .tt-rrow-rating.bt3::after, .tt-rrow-rating.bt4::after { animation: none; }
}

/* =====================================================================
   以下为球员自定义（#screen-customize）使用的共享列表样式 + cz- 样式。
   （customize 屏的 #cz-players 复用 .tp-list；本段原样保留，勿删。）
   ===================================================================== */

.tp-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
  min-height: 0;
  flex: 1 1 auto;
  padding-right: 4px;
}
.tp-list .t-row { flex: none; }
.tp-list .rgap { flex: 1 1 auto; }      /* 行内弹性占位：把徽章/评分推到右侧 */
.tp-list .rname, .tp-list .aname, .tp-list .cname {
  font-size: 25px;
  color: var(--text-0);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tp-list .t-badge { font-size: 18px; padding: 2px 9px; flex: none; }
.tp-list .rovr { flex: none; min-width: 52px; text-align: right; }

/* ---------------------------------------------------------------------
   4. 球员自定义（cz- 前缀）
   --------------------------------------------------------------------- */

.cz-panel { padding: 22px; gap: 14px; }

.cz-topbar {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  flex-wrap: nowrap;
}
.cz-topbar .t-title { font-size: 32px; }
.cz-small { padding: 8px 18px; font-size: 22px; }
.cz-topbar .t-btn-danger { margin-left: 8px; }

/* 预算：金色大数字醒目展示；积分耗尽变红（.over 由 JS 切换） */
.cz-budget {
  margin-left: auto;
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 22px;
  color: var(--text-1);
  white-space: nowrap;
}
.cz-budget b {
  font-size: 44px;
  font-weight: 800;
  color: var(--gold);
  text-shadow: 0 0 14px rgba(245, 195, 75, 0.4);
  line-height: 1;
}
.cz-budget i { font-style: normal; font-size: 20px; color: var(--text-2); }
.cz-budget.over b { color: var(--danger); text-shadow: 0 0 14px rgba(243, 100, 92, 0.4); }

/* 左侧首发列表：覆盖 main.css 旧底色，加宽 */
#screen-customize .cz-players {
  width: 380px;
  flex: 0 0 auto;
  background: transparent;
  padding: 4px 4px 4px 0;
}
#screen-customize .cz-players .ccost { font-size: 20px; color: var(--gold); flex: none; }

/* 右侧属性卡 */
#screen-customize .cz-attrs-wrap { padding: 16px; gap: 14px; }
#screen-customize .cz-attrs { gap: 10px; }

/* 属性行：t-stat 风格双色条（青=基础，金=额外点）+ 加减按钮 */
.cz-attr {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 16px;
  border-radius: var(--r-sm);
  background: rgba(30, 44, 76, 0.45);
  border: 1px solid transparent;
  font-size: 24px;
  transition: all 0.12s ease;
}
.cz-attr:hover { background: rgba(40, 60, 104, 0.6); border-color: var(--line); }
.cz-attr .aname { width: 92px; color: var(--text-1); flex: none; }
.cz-attr .abase { width: 96px; color: var(--text-2); font-size: 20px; flex: none; }
.cz-attr .abar {
  flex: 1 1 auto;
  height: 10px;
  border-radius: 5px;
  background: rgba(20, 30, 52, 0.9);
  overflow: hidden;
  display: flex;
}
.cz-attr .abar i { display: block; height: 100%; }
.cz-attr .abar i.base { background: linear-gradient(90deg, #1ba7d8, var(--accent)); }
.cz-attr .abar i.extra { background: linear-gradient(90deg, #d8a31b, var(--gold)); }
.cz-attr .aval { width: 116px; text-align: right; color: var(--text-0); font-weight: 700; flex: none; }
.cz-attr .acost { width: 150px; text-align: right; font-size: 19px; color: var(--gold); flex: none; }
.cz-attr .t-btn { padding: 4px 18px; font-size: 26px; border-radius: 8px; flex: none; }

/* 属性卡底部操作栏 */
.cz-foot { display: flex; gap: 12px; }
.cz-foot .t-btn { font-size: 24px; padding: 12px 22px; }
.cz-foot .t-btn-primary { flex: 1 1 auto; }

/* =====================================================================
   PC 横屏版式（body.landscape，舞台 1920x1080，由 https://d1u4k7xc6u3yed.cloudfront.net/agent-soccer/js/app.js fitStage 切换）。
   仅追加覆盖，不动上方竖版规则。对齐设计稿【两列】结构：
     顶栏(单行)
     主区 grid[ 左:球场列 minmax(0,1fr)（球场宽高铺满左列，场线 SVG 随拉伸）
              | 右:单列 440px —— ①选中球员紧凑卡(auto)
                                 ②球队名单(flex:1 内部滚动)
                                 ③我的 AGENT(≤260px 内部滚动) ]
     底栏(单行)。
   高度预算（舞台 1080）：顶栏 ~113 + 底栏 ~105 → 主区 ~862，
   上下 padding 16 → 右栏可用 ~830 = 详情卡 ≤398(48%) + gap 20
     + 名单 ≥132(flex:1) + gap 20 + AGENT ≤260；三段各自 overflow 兜底。
   棋子仍由 JS 写百分比 left/top 定位，这里只缩小棋子自身尺寸
   （横版球场约 1390x790，棋子按竖版 ~0.66 倍缩放）。
   雷达 SVG 自带 viewBox(425)，CSS 限宽 175px 整体等比缩放（轴标签同步缩小）。
   ===================================================================== */

/* ---- 整屏：横版下全部内容收进 1080 高，禁止页面级滚动 ---- */
body.landscape #screen-team .tt-app { overflow: hidden; }

/* ---- 顶栏：收成单行（竖版是两行 wrap） ---- */
body.landscape #screen-team .tt-topbar {
  flex-wrap: nowrap;
  padding: 14px 36px;
  gap: 30px;
}
body.landscape #screen-team .tt-top-left { flex: 1 1 auto; min-width: 0; }
body.landscape #screen-team .tt-top-right {
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: 20px;
}
body.landscape #screen-team .tt-stepper { flex: 0 0 auto; }

/* ---- 主区：grid 两列 = 左「竖向球场」(窄, 600) + 右「信息区」(占满剩余宽) ----
   球场不再横向拉伸铺满（旧版几乎占满半屏），改回竖版比例只占左侧窄条，
   把腾出的横向空间给右侧信息区做两栏布局（名单独占整列、agent 拿到大块）。 */
body.landscape #screen-team .tt-main {
  display: grid;
  grid-template-columns: 600px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  gap: 30px;
  padding: 16px 32px;
  min-height: 0;
  overflow: hidden;
}

/* 左列：小标题行 + 球场；球场以剩余高度定尺寸，等比（aspect-ratio 不变），水平居中 */
body.landscape #screen-team .tt-leftcol {
  min-width: 0;
  min-height: 0;
  gap: 14px;
}
body.landscape #screen-team .tt-lefthead { flex: 0 0 auto; }
body.landscape #screen-team .tt-lh-title { font-size: 30px; }
body.landscape #screen-team .tt-lh-meta { font-size: 22px; }
body.landscape #screen-team .tt-lh-meta b.tt-lh-avg { font-size: 28px; }
body.landscape #screen-team .tt-pitchwrap {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  justify-content: center;
  align-items: center;       /* 竖版球场在窄列里垂直居中 */
}
/* 竖向球场：宽度占满 600 窄列，按竖版比例(100:130)定高，超高则按列高回缩。
   场线 SVG preserveAspectRatio="none"、棋子百分比定位 → 缩放安全。 */
body.landscape #screen-team .tt-pitch {
  width: 100%;
  height: auto;
  max-height: 100%;
  aspect-ratio: 100 / 130;
  border-radius: 28px;
}
body.landscape #screen-team .tt-pitch-tag {
  top: 20px;
  right: 24px;
  font-size: 20px;
  padding: 6px 16px;
}

/* 棋子：随球场缩小，百分比定位由 JS 维持不动 */
/* 棋子随窄球场缩小（球场约 600 宽，比旧的横向拉伸版小很多）→ 棋子等比收小防重叠 */
body.landscape #screen-team .tt-token { width: 104px; gap: 3px; }
body.landscape #screen-team .tt-token-disc {
  width: 66px;
  height: 66px;
  border-width: 4px;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.35), 0 8px 20px rgba(0, 0, 0, 0.5),
    0 0 18px color-mix(in srgb, var(--tok) 45%, transparent);
}
body.landscape #screen-team .tt-token-role { font-size: 15px; }
body.landscape #screen-team .tt-token-rating { font-size: 20px; margin-top: 1px; }
body.landscape #screen-team .tt-token-rating.bt1,
body.landscape #screen-team .tt-token-rating.bt2,
body.landscape #screen-team .tt-token-rating.bt3,
body.landscape #screen-team .tt-token-rating.bt4 { font-size: 18px; }
body.landscape #screen-team .tt-token-name { font-size: 16px; max-width: 104px; }
body.landscape #screen-team .tt-token-agent { font-size: 13px; max-width: 104px; padding: 1px 7px; border-radius: 8px; }
body.landscape #screen-team .tt-token.empty .tt-token-disc {
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.25), 0 7px 20px rgba(0, 0, 0, 0.4);
}
/* 选中态：环宽随棋子等比缩小（独立 keyframes，竖版动画不受影响） */
body.landscape #screen-team .tt-token.selected .tt-token-disc {
  box-shadow: 0 0 0 4px var(--tok), 0 0 36px color-mix(in srgb, var(--tok) 80%, transparent),
    0 13px 32px rgba(0, 0, 0, 0.6);
  animation: tt-tokpulse-land 1.8s ease-in-out infinite;
}
@keyframes tt-tokpulse-land {
  0%, 100% { box-shadow: 0 0 0 4px var(--tok), 0 0 28px color-mix(in srgb, var(--tok) 60%, transparent); }
  50% { box-shadow: 0 0 0 7px var(--tok), 0 0 48px color-mix(in srgb, var(--tok) 95%, transparent); }
}

/* ---- 信息区：两栏 grid。左栏=选中球员(上,自然高)+我的AGENT(下,吃满)；
   右栏=球队名单整列通高（终于有大块空间显示多行）。 ---- */
body.landscape #screen-team .tt-rightcol {
  width: auto;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 18px 20px;
  align-items: stretch;
}
body.landscape #screen-team .tt-detail-sec { grid-column: 1; grid-row: 1; }
body.landscape #screen-team .tt-agents-sec { grid-column: 1; grid-row: 2; }
body.landscape #screen-team .tt-roster-sec { grid-column: 2; grid-row: 1 / span 2; }
body.landscape #screen-team .tt-section { padding: 18px 20px; border-radius: 24px; }
body.landscape #screen-team .tt-ptitle { font-size: 20px; letter-spacing: 1.5px; margin-bottom: 12px; }
body.landscape #screen-team .tt-pcount { font-size: 17px; }
body.landscape #screen-team .tt-mini { font-size: 18px; padding: 6px 16px; border-radius: 11px; }
body.landscape #screen-team .tt-empty { padding: 26px 16px; font-size: 22px; }

/* ① 选中球员卡（横屏精简）：固定自然高、不占满栏——只展示「头像+姓名+评分 + 雷达」，
   chips 与九维属性条隐藏（移入弹窗），把垂直空间让给下面的「球队名单」。 */
body.landscape #screen-team .tt-detail-sec {
  flex: 0 0 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body.landscape #screen-team .tt-pcard-host { min-height: 0; }
/* 内嵌精简卡：藏 chips 行与属性条，雷达独占一列居中放大、成为视觉重点 */
body.landscape #screen-team .tt-pcard-inline .tt-pcard-sub,
body.landscape #screen-team .tt-pcard-inline .tt-pcard-bars { display: none; }
body.landscape #screen-team .tt-pcard-inline .tt-pcard-head { padding: 0 0 6px; gap: 16px; }
body.landscape #screen-team .tt-pcard-inline .tt-avatar { width: 76px; height: 76px; border-radius: 16px; }
body.landscape #screen-team .tt-pcard-inline .tt-pcard-name { font-size: 30px; }
body.landscape #screen-team .tt-pcard-inline .tt-pcard-rating { width: 78px; height: 84px; border-radius: 15px; }
body.landscape #screen-team .tt-pcard-inline .tt-rating-num { font-size: 42px; }
body.landscape #screen-team .tt-pcard-inline .tt-rating-num.bt1,
body.landscape #screen-team .tt-pcard-inline .tt-rating-num.bt2,
body.landscape #screen-team .tt-pcard-inline .tt-rating-num.bt3,
body.landscape #screen-team .tt-pcard-inline .tt-rating-num.bt4 { font-size: 34px; }
body.landscape #screen-team .tt-pcard-inline .tt-rating-pos { font-size: 15px; margin-top: 3px; }
body.landscape #screen-team .tt-pcard-inline .tt-pcard-body { grid-template-columns: 1fr; justify-items: center; gap: 2px; }
body.landscape #screen-team .tt-pcard-inline .tt-radar-svg { width: 208px; }
/* 「查看球员详情」按钮（整行，点开弹窗看全部属性） */
body.landscape #screen-team .tt-pcard-inline .tt-pcard-more {
  display: block; width: 100%; margin-top: 8px; padding: 9px 0;
  font-family: 'Noto Sans SC', sans-serif; font-size: 18px; font-weight: 700; letter-spacing: 0.5px;
  color: var(--tt-teal, #15e371); cursor: pointer;
  background: rgba(21, 227, 113, 0.08); border: 1px solid rgba(21, 227, 113, 0.32); border-radius: 14px;
  transition: 0.15s;
}
body.landscape #screen-team .tt-pcard-inline .tt-pcard-more:hover { background: rgba(21, 227, 113, 0.16); }
/* 顶行：小头像 + 姓名/徽章行 + 右侧 OVR 方块（设计稿顶行结构） */
body.landscape #screen-team .tt-pcard-head { padding: 0 0 14px; gap: 16px; }
body.landscape #screen-team .tt-avatar { width: 88px; height: 88px; border-radius: 18px; }
body.landscape #screen-team .tt-avatar-pos { font-size: 15px; top: 4px; left: 7px; }
body.landscape #screen-team .tt-pcard-name { font-size: 32px; }
/* 徽章行：允许换行（440px 栏宽下第三个 agent chip 不再被挤成裁切的细条），
   换行撑高由详情卡 max-height 48% + .tt-pcard-host 内部滚动兜底；
   agent chip 仍可收缩 ellipsis，应对独占一行也放不下的超长名。 */
body.landscape #screen-team .tt-pcard-sub { flex-wrap: wrap; min-width: 0; gap: 8px; margin-top: 8px; }
body.landscape #screen-team .tt-chip { font-size: 16px; padding: 3px 11px; border-radius: 8px; letter-spacing: 0.5px; flex: 0 0 auto; white-space: nowrap; }
body.landscape #screen-team .tt-chip-agent { flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
body.landscape #screen-team .tt-pcard-rating { width: 84px; height: 92px; border-radius: 16px; }
body.landscape #screen-team .tt-rating-num { font-size: 44px; }
body.landscape #screen-team .tt-rating-num.bt1,
body.landscape #screen-team .tt-rating-num.bt2,
body.landscape #screen-team .tt-rating-num.bt3,
body.landscape #screen-team .tt-rating-num.bt4 { font-size: 38px; }
body.landscape #screen-team .tt-rating-pos { font-size: 16px; margin-top: 4px; }
/* 主体：左小雷达（200px 列＝175px SVG＋轴标签出血余量）+ 右 9 条紧凑属性条 */
body.landscape #screen-team .tt-pcard-body { grid-template-columns: 200px minmax(0, 1fr); gap: 12px; }
body.landscape #screen-team .tt-radar-svg { width: 175px; height: auto; display: block; }
body.landscape #screen-team .tt-pcard-bars { gap: 4px; }
body.landscape #screen-team .tt-statbar { grid-template-columns: 56px minmax(0, 1fr) 68px; gap: 8px; }
body.landscape #screen-team .tt-statbar-label { font-size: 16px; line-height: 1.15; }
body.landscape #screen-team .tt-statbar-track { height: 9px; }
body.landscape #screen-team .tt-statbar-val { font-size: 18px; line-height: 1.15; }

/* ② 球队名单：独占信息区右整列、通高，内部滚动；
   行内「位置 | 姓名(可收缩 ellipsis) | 已上阵徽章(固定) | 评分(固定)」同行绝不重叠 */
body.landscape #screen-team .tt-roster-sec {
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body.landscape #screen-team .tt-roster {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 6px;
}
body.landscape #screen-team .tt-rgroup { margin-bottom: 10px; }
body.landscape #screen-team .tt-rgroup-label { font-size: 17px; margin: 10px 0 8px; gap: 10px; }
body.landscape #screen-team .tt-rgroup-n { font-size: 15px; padding: 1px 10px; }
body.landscape #screen-team .tt-rrow {
  padding: 10px 14px;
  gap: 12px;
  margin-bottom: 8px;
  border-radius: 14px;
  border-left-width: 5px;
}
body.landscape #screen-team .tt-rrow-pos { font-size: 17px; min-width: 50px; }
body.landscape #screen-team .tt-rrow-name { font-size: 22px; min-width: 0; } /* 关键：姓名可收缩 → ellipsis 生效 */
body.landscape #screen-team .tt-rrow-dep { font-size: 15px; padding: 3px 10px; border-radius: 9px; white-space: nowrap; }
body.landscape #screen-team .tt-rrow-rating { font-size: 24px; min-width: 58px; }

/* ③ 我的 AGENT：限高 260，内部滚动；agent 名可收缩 ellipsis，删除钮固定不压缩 */
/* ③ 我的 AGENT：占左信息列下半（grid row2），吃满剩余高、内部滚动 */
body.landscape #screen-team .tt-agents-sec {
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body.landscape #screen-team .tt-agentlist {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  gap: 8px;
  padding-right: 6px;
}
body.landscape #screen-team .tt-arow { padding: 10px 14px; gap: 12px; border-radius: 14px; min-width: 0; }
body.landscape #screen-team .tt-arow-dot { width: 12px; height: 12px; }
/* 横屏右侧面板窄：把整行宽度让给「agent 名」，名字尽量完整显示、过长才省略。
   次要的代码 ID 在窄面板里隐藏（价值低且占地方；完整 ID 仍可悬停整行 title 查看）。
   修复名字被截成「Codex稳…」的问题。 */
body.landscape #screen-team .tt-arow-name { font-size: 20px; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.landscape #screen-team .tt-arow-code { display: none; }
body.landscape #screen-team .tt-arow-del { font-size: 16px; padding: 6px 14px; border-radius: 10px; }

/* 横版内部滚动条：窄条样式 */
body.landscape #screen-team .tt-roster::-webkit-scrollbar,
body.landscape #screen-team .tt-agentlist::-webkit-scrollbar,
body.landscape #screen-team .tt-pcard-host::-webkit-scrollbar { width: 10px; }
body.landscape #screen-team .tt-roster::-webkit-scrollbar-thumb,
body.landscape #screen-team .tt-agentlist::-webkit-scrollbar-thumb,
body.landscape #screen-team .tt-pcard-host::-webkit-scrollbar-thumb {
  background: rgba(120, 150, 200, 0.25);
  border-radius: 5px;
}

/* ---- 底栏：收成单行，状态文字与按钮同排 ---- */
body.landscape #screen-team .tt-bottombar {
  flex-wrap: nowrap;
  padding: 14px 36px;
  gap: 24px;
}
body.landscape #screen-team .tt-actions { flex: 0 0 auto; flex-wrap: nowrap; gap: 20px; }
body.landscape #screen-team .tt-abtn { flex: 0 0 auto; padding: 16px 34px; }
body.landscape #screen-team .tt-status {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;        /* 与竖版一致，但允许整行收缩 */
}

/* 减少动态效果：横版选中棋子同样停掉呼吸动画（覆盖上面的高优先级规则） */
@media (prefers-reduced-motion: reduce) {
  body.landscape #screen-team .tt-token.selected .tt-token-disc { animation: none; }
}

/* 程序化漫画头像：名单行小头像（avatarGen.js 接入，竖/横版各一档尺寸） */
.tt-rrow-ava { width: 56px; height: 56px; flex: 0 0 auto; border-radius: 12px; background: #0a1020; object-fit: cover; }
body.landscape #screen-team .tt-rrow-ava { width: 30px; height: 30px; border-radius: 7px; }

/* =====================================================================
   全站风格统一覆盖：把本屏的「圆润」外形改成 FC 全站的斜切硬朗风
   （按钮/卡片切角复刻 .fc-btn / .fc-card；用 !important 同时压住竖版基样式
    与 body.landscape 覆盖样式，无需逐条改两遍。配色已在上方迁移为电光绿）。
   ===================================================================== */
/* 按钮：左上+右下切角 + 大写斜体显示字（同 .fc-btn） */
#screen-team .tt-abtn,
#screen-team .tt-closebtn {
  border-radius: 0 !important;
  clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
  font-family: var(--fc-d, 'Oxanium', sans-serif);
  font-style: italic; font-weight: 700; letter-spacing: 2px;
}
/* 步进器容器 / 输入框：同款切角 */
#screen-team .tt-stepper {
  border-radius: 0 !important;
  clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}
#screen-team .tt-teaminput {
  border-radius: 0 !important;
  clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%, 0 10px);
}
/* 玻璃面板 / 球员卡：右上+左下切角（同 .fc-card）；切角会裁掉外阴影，故改用边框微光 */
#screen-team .tt-section,
#screen-team .tt-pcard {
  border-radius: 0 !important;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
  box-shadow: none !important;
}
/* 球场：clip-path 会裁掉其大投影，故仅收紧圆角不切角 */
#screen-team .tt-pitch { border-radius: 8px !important; }
/* 小标签/小按钮/头像：去圆润，改小直角 */
#screen-team .tt-pitch-tag,
#screen-team .tt-mini { border-radius: 4px !important; }
#screen-team .tt-avatar { border-radius: 10px !important; }

/* =====================================================================
   阵型解析（足球科普）速览卡 + 弹层（fk = football knowledge）。
   速览卡 .tt-fmttip 在 #screen-team 作用域内（可用 --tt-* 令牌）；
   弹层 .tt-fk-overlay 挂在 document.body（脱离 #stage 的 transform），
   故用字面色值（不依赖 --tt-* 作用域变量）。
   ===================================================================== */

/* ---- 速览卡：球场上方一条紧凑提示，点击展开完整科普 ---- */
#screen-team .tt-fmttip {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  margin: 6px 0 10px;
  padding: 12px 16px;
  text-align: left;
  background: linear-gradient(100deg, rgba(21, 227, 113, 0.12), rgba(56, 189, 248, 0.08));
  border: 1px solid rgba(120, 160, 210, 0.30);
  border-radius: 0 !important;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
  transition: 0.15s;
}
#screen-team .tt-fmttip:hover {
  border-color: rgba(21, 227, 113, 0.55);
  background: linear-gradient(100deg, rgba(21, 227, 113, 0.18), rgba(56, 189, 248, 0.12));
}
#screen-team .tt-fmttip-ico { flex: 0 0 auto; font-size: 26px; line-height: 1.1; }
#screen-team .tt-fmttip-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#screen-team .tt-fmttip-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
#screen-team .tt-fmttip-name {
  font-weight: 800; font-size: 19px; letter-spacing: 0.5px; color: var(--tt-txt);
}
#screen-team .tt-fmttip-more { font-size: 14px; color: var(--tt-teal); font-weight: 700; }
#screen-team .tt-fmttip-tag { font-size: 15px; color: var(--tt-txt-dim); line-height: 1.4; }
#screen-team .tt-fmttip-key { font-size: 14px; color: var(--tt-sky); }

/* ---- 弹层（挂 body）：全屏居中，竖横屏通用 ---- */
.tt-fk-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  font-family: 'Oxanium', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
}
.tt-fk-backdrop {
  position: absolute; inset: 0;
  background: rgba(5, 9, 18, 0.78);
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
}
.tt-fk-panel {
  position: relative; z-index: 1;
  width: min(720px, 94vw); max-height: 88vh;
  display: flex; flex-direction: column;
  background: #101728;
  color: #e8eefc;
  border: 1px solid rgba(120, 160, 210, 0.30);
  border-radius: 22px;
  box-shadow: 0 40px 130px rgba(0, 0, 0, 0.62);
  padding: 22px 26px 26px;
}
.tt-fk-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex: 0 0 auto; }
.tt-fk-title {
  font-weight: 800; font-size: 23px; letter-spacing: 0.6px; color: #e8eefc;
}
.tt-fk-close {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px;
  font-size: 22px; color: #ffb3bd; cursor: pointer;
  background: rgba(251, 113, 133, 0.14); border: 1px solid rgba(251, 113, 133, 0.35);
  transition: 0.15s;
}
.tt-fk-close:hover { background: rgba(251, 113, 133, 0.28); }
.tt-fk-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 4px; }
.tt-fk-body::-webkit-scrollbar { width: 10px; }
.tt-fk-body::-webkit-scrollbar-thumb { background: rgba(120, 150, 200, 0.25); border-radius: 5px; }

.tt-fk-section { margin-bottom: 22px; }
.tt-fk-section:last-child { margin-bottom: 0; }
.tt-fk-sectitle {
  font-weight: 800; font-size: 16px; letter-spacing: 1px; text-transform: uppercase;
  color: #15e371; margin-bottom: 12px;
  border-left: 3px solid #15e371; padding-left: 10px;
}
.tt-fk-tagline { font-size: 16px; color: #c6d0e6; line-height: 1.5; margin: 0 0 14px; }
.tt-fk-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
@media (max-width: 560px) { .tt-fk-cols { grid-template-columns: 1fr; } }
.tt-fk-col {
  background: rgba(20, 28, 48, 0.55);
  border: 1px solid rgba(120, 150, 200, 0.16);
  border-radius: 12px; padding: 12px 14px;
}
.tt-fk-pros { border-left: 3px solid #15e371; }
.tt-fk-cons { border-left: 3px solid #fb7185; }
.tt-fk-colhead { font-weight: 700; font-size: 15px; margin-bottom: 8px; color: #e8eefc; }
.tt-fk-pros .tt-fk-colhead { color: #6ee7a8; }
.tt-fk-cons .tt-fk-colhead { color: #fda4af; }
.tt-fk-key {
  background: rgba(20, 28, 48, 0.55);
  border: 1px solid rgba(120, 150, 200, 0.16);
  border-left: 3px solid #38bdf8;
  border-radius: 12px; padding: 12px 14px;
}
.tt-fk-key .tt-fk-colhead { color: #7dd3fc; }
.tt-fk-overlay ul { margin: 0; padding-left: 20px; }
.tt-fk-overlay li { font-size: 14.5px; color: #c6d0e6; line-height: 1.5; margin-bottom: 5px; }
.tt-fk-overlay li:last-child { margin-bottom: 0; }
.tt-fk-roles { display: flex; flex-direction: column; gap: 10px; }
.tt-fk-role {
  background: rgba(20, 28, 48, 0.45);
  border: 1px solid rgba(120, 150, 200, 0.14);
  border-radius: 10px; padding: 10px 14px;
}
.tt-fk-role b { display: block; font-size: 15px; color: #e8eefc; margin-bottom: 4px; }
.tt-fk-role span { font-size: 14px; color: #9aa8c4; line-height: 1.5; }