/* ===== 网球赢球平台 · 网页端浅色品牌主题（对齐小程序设计令牌） ===== */
:root {
  --brand: #0E7A53;          /* 小程序主绿 */
  --brand-deep: #095A3E;
  --brand-soft: #E8F5EF;     /* 浅绿底 */
  --bg: #F3F5F4;             /* 页面背景 */
  --card: #FFFFFF;
  --border: #E5E7EB;
  --text: #1F2937;
  --muted: #6B7280;
  --muted-2: #9CA3AF;
  --danger: #d32f2f;
  --required: #d32f2f;
  --shadow: 0 4rpx 16rpx rgba(16,40,30,.06);
}

* { box-sizing: border-box; font-family: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* ===== 顶栏 ===== */
.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  background: #fff;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 10px rgba(16,40,30,.04);
}
.topbar-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand { display: flex; align-items: center; gap: 10px; }
.brand-dot { width: 22px; height: 22px; border-radius: 999px; background: conic-gradient(from 200deg, #14B8A6, #0E7A53, #22C55E, #14B8A6); }
.brand-name { font-size: 19px; font-weight: 800; color: var(--text); letter-spacing: -.5px; }
#user-bar { display: flex; align-items: center; gap: 8px; }
#btn-login-top {
  background: var(--brand); color: #fff; border: none; border-radius: 999px;
  padding: 9px 22px; font-size: 14px; font-weight: 600; cursor: pointer; line-height: 1.2;
  box-shadow: 0 2px 8px rgba(14,122,83,.25); letter-spacing: .5px; white-space: nowrap;
  transition: background .15s, transform .15s, box-shadow .15s;
}
#btn-login-top:hover { background: var(--brand-deep, #0a5f41); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(14,122,83,.3); }

/* ===== Tab 导航 ===== */
.tabnav {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  gap: 4px;
  padding: 0 12px;
  border-bottom: 1px solid var(--border);
  background: #fff;
  overflow-x: auto;
}
.tab-btn {
  padding: 12px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: .15s;
}
.tab-btn:hover { color: var(--brand); }
.tab-btn.active { color: var(--brand); border-bottom-color: var(--brand); }

main { max-width: 1100px; margin: 0 auto; padding: 18px 16px 60px; }
footer { text-align: center; color: var(--muted-2); font-size: 12px; padding: 24px 0 36px; line-height: 1.8; }
footer a { color: var(--brand); text-decoration: none; }
footer a:hover { text-decoration: underline; }

/* ===== 通用组件 ===== */
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 18px;
  margin-bottom: 16px;
  box-shadow: 0 4px 16px rgba(16,40,30,.06);
}
.section-title {
  font-size: 18px; font-weight: 800; color: var(--text);
  margin: 4px 0 16px; padding-bottom: 10px; border-bottom: 3px solid var(--brand);
  display: inline-block;
}
.btn-primary {
  background: var(--brand); color: #fff; font-weight: 700;
  border: none; border-radius: 999px; padding: 12px 22px;
  cursor: pointer; transition: .15s; font-size: 15px;
}
.btn-primary:hover { background: var(--brand-deep); }
.btn-ghost {
  background: var(--brand-soft); color: var(--brand); font-weight: 600;
  border: none; border-radius: 999px; padding: 9px 16px; cursor: pointer; font-size: 14px;
}
.btn-ghost:hover { background: #d7efe6; }
.btn-block { display: block; width: 100%; }
.field {
  width: 100%; background: var(--bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px 14px; color: var(--text); font-size: 15px; outline: none;
}
.field:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(14,122,83,.15); }
textarea.field { min-height: 56px; resize: vertical; }
.chip { display:inline-block; font-size:12px; padding:4px 10px; border-radius:999px; background:var(--brand-soft); color:var(--brand); margin:2px; }
.chip.amber { background:#fff7e6; color:#ad6800; }
.chip.copyable { cursor:pointer; user-select:all; transition:box-shadow .15s; }
.chip.copyable:hover { box-shadow:0 2px 8px rgba(14,122,83,.25); }
.unbind-btn { display:inline-block; background:#fff1f0; color:#d32f2f; font-size:12px; padding:4px 10px; border-radius:999px; border:1px solid #ffccc7; cursor:pointer; margin:2px 2px 2px 6px; transition:all .15s; }
.unbind-btn:hover { background:#d32f2f; color:#fff; border-color:#d32f2f; }
.copy-chip-btn { display:inline-block; background:var(--brand-soft); color:var(--brand); font-size:12px; padding:4px 10px; border-radius:999px; border:1px solid var(--brand); cursor:pointer; margin:2px 2px 2px 6px; transition:all .15s; }
.copy-chip-btn:hover { background:var(--brand); color:#fff; }
/* 跨端绑定（web-id ↔ wx-id）*/
.link-status { font-size:13px; font-weight:500; padding:6px 12px; border-radius:999px; }
.link-status.linked { background:#eaf3de; color:#27500a; }
.link-status.unlinked { background:#fcebeb; color:#791f1f; }
.rebind-btn { background:var(--brand-soft); color:var(--brand); border:1px solid var(--brand); border-radius:999px; padding:4px 12px; font-size:12px; cursor:pointer; margin-left:6px; }
.bind-btn { background:var(--brand); color:#fff; border:none; border-radius:999px; padding:2px 12px; font-size:12px; cursor:pointer; margin-left:4px; }
.bind-btn:hover { background:var(--brand-deep, #0a5f41); }
.bind-req-card { background:#fff7e6; border:1px solid #ffd591; border-radius:12px; padding:10px 14px; margin-bottom:10px; font-size:13px; }
.bind-req-title { font-weight:700; color:#ad6800; margin-bottom:6px; }
.bind-req-item { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:4px 0; }
.bind-req-btns { display:flex; gap:8px; flex:none; }
.bind-ok { background:var(--brand); color:#fff; border:none; border-radius:999px; padding:3px 14px; font-size:12px; cursor:pointer; }
.bind-ok:hover { background:var(--brand-deep, #0a5f41); }
.bind-no { background:#fff; color:var(--muted); border:1px solid var(--border); border-radius:999px; padding:3px 14px; font-size:12px; cursor:pointer; }
.bind-no:hover { background:var(--bg); }
.empty { text-align:center; color:var(--muted); padding:40px 0; }
.hidden { display: none !important; }

/* ===== 表格型信息卡（对齐小程序 .table / .table-row） ===== */
.table { background: var(--card); border:1px solid var(--border); border-radius:16px; margin-bottom:16px; overflow:hidden; box-shadow:0 4px 16px rgba(16,40,30,.06); }
.table-row { display:flex; border-bottom:1px solid var(--border); }
.table-row:last-child { border-bottom:none; }
.table-cell { padding:14px 16px; }
.table-cell.label { width:130px; flex:none; background:var(--bg); font-size:15px; font-weight:600; color:var(--text); border-right:1px solid var(--border); display:flex; align-items:center; }
.table-cell.content { flex:1; background:var(--card); display:flex; align-items:center; min-height:52px; }
.required { color: var(--required); margin-left:4px; }

/* ===== 选择框（模拟小程序 picker） ===== */
.picker {
  width:100%; background:var(--bg); border:1px solid var(--border); border-radius:10px;
  padding:10px 14px; font-size:15px; color:var(--text); cursor:pointer; display:flex; justify-content:space-between; align-items:center;
}
.picker .ph { color: var(--muted-2); }
.picker-options { margin-top:6px; display:flex; flex-wrap:wrap; gap:8px; }
.picker-options .opt { padding:8px 14px; border:1px solid var(--border); border-radius:999px; font-size:14px; cursor:pointer; background:#fff; }
.picker-options .opt.sel { background:var(--brand); color:#fff; border-color:var(--brand); }

/* ===== 资料页：问候 + 角色按钮 ===== */
.header-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; padding:0 4px; }
.greeting-text { font-size:20px; font-weight:800; color:var(--text); }
.role-btn { background:var(--brand-soft); color:var(--brand); padding:8px 16px; border-radius:999px; font-size:14px; font-weight:600; border:none; cursor:pointer; }
.notice { margin:8px 0 14px; padding:12px 14px; border-radius:12px; font-size:13px; }
.notice.warn { background:#fff7e6; border:1px solid #ffd591; color:#ad6800; }
.notice.err { background:#fff1f0; border:1px solid #ffa39e; color:#cf1322; }

/* ===== 联系我们卡片 ===== */
.social-row { display:flex; gap:12px; flex-wrap:wrap; }
.social-card { flex:1; min-width:90px; background:var(--bg); border-radius:14px; padding:14px 8px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.social-icon { font-size:22px; margin-bottom:4px; }
.social-name { font-size:13px; color:var(--muted); margin-bottom:4px; font-weight:600; }
.account-name { font-size:12px; color:var(--brand); font-weight:600; margin-bottom:8px; word-break:break-all; }
.copy-btn { background:var(--brand); color:#fff; font-size:12px; padding:5px 12px; border-radius:999px; border:none; cursor:pointer; }

/* ===== 弹窗（教练/陪练） ===== */
.modal-mask { position:fixed; inset:0; background:rgba(16,40,30,.5); z-index:1000; display:flex; align-items:center; justify-content:center; padding:16px; }
.modal-box { background:#fff; border-radius:18px; padding:22px; width:100%; max-width:520px; max-height:88vh; overflow:auto; box-shadow:0 12px 40px rgba(16,40,30,.18); }
.modal-title { font-size:20px; font-weight:800; text-align:center; margin-bottom:12px; }
.modal-tabs { display:flex; border-bottom:1px solid var(--border); margin-bottom:12px; }
.modal-tab { flex:1; text-align:center; padding:10px 0; font-size:15px; font-weight:600; color:var(--muted-2); cursor:pointer; border-bottom:3px solid transparent; }
.modal-tab.active { color:var(--brand); border-bottom-color:var(--brand); }
.modal-switch-row { display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid var(--border); margin-bottom:10px; }
.switch-label { font-size:15px; font-weight:600; color:var(--text); }
.compact-row { display:flex; align-items:center; padding:8px 0; border-bottom:1px solid var(--border); }
.compact-row:last-child { border-bottom:none; }
.compact-label { width:110px; flex:none; font-size:15px; font-weight:600; color:var(--text); }
.compact-content { flex:1; display:flex; align-items:center; gap:8px; }
.compact-input { flex:1; height:42px; background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:0 12px; font-size:15px; }
.compact-sub-title { font-size:15px; font-weight:700; margin:10px 0 6px; }
.sub-tip { font-size:12px; color:var(--muted-2); font-weight:normal; margin-left:8px; }
.modal-btns { display:flex; gap:12px; margin-top:14px; }
.modal-cancel { flex:1; background:var(--bg); color:var(--muted); border:none; border-radius:12px; padding:11px; font-size:15px; cursor:pointer; }

/* ===== 球场地图 ===== */
.map-wrap { position:relative; height:62vh; min-height:420px; border-radius:16px; overflow:hidden; box-shadow:0 4px 16px rgba(16,40,30,.06); margin-bottom:16px; }
#court-map { width:100%; height:100%; }
.float-card {
  position:absolute; left:12px; top:12px; width:300px; max-width:78%;
  background:#fff; border-radius:14px; box-shadow:0 8px 24px rgba(16,40,30,.16);
  padding:12px; max-height:calc(100% - 24px); display:flex; flex-direction:column;
  z-index:1100;
}
.card-toggle { position:absolute; right:-28px; top:50%; transform:translateY(-50%); width:28px; height:72px; background:#0E7A53; border-radius:0 14px 14px 0; display:flex; align-items:center; justify-content:center; cursor:pointer; color:#fff; font-size:14px; z-index:20; pointer-events:auto; box-shadow:0 4px 12px rgba(16,40,30,.18); }
.card-content { overflow:auto; }
.search-box { display:flex; align-items:center; gap:6px; background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:8px 10px; margin-bottom:10px; }
.search-input { flex:1; border:none; background:transparent; outline:none; font-size:14px; }
.clear-icon { cursor:pointer; color:var(--muted-2); }
.list-header { font-size:14px; font-weight:700; color:var(--text); margin-bottom:8px; }
.court-item, .court-card {
	  background:var(--card); border:1px solid var(--border); border-radius:12px; padding:12px; margin-bottom:10px; cursor:pointer; transition:.15s;
	}
	.cm-nearby-list .court-card,
	#cm-courtlist .court-card {
	  display:flex; flex-direction:column; min-height:310px;
	}
	.cm-nearby-list .court-card .court-nav-map,
	#cm-courtlist .court-card .court-nav-map {
	  flex:1; min-height:100px; max-height:160px; margin-top:auto;
	}
.court-item:hover, .court-card:hover { border-color:var(--brand); box-shadow:0 4px 14px rgba(14,122,83,.12); }
.court-header { display:flex; justify-content:space-between; align-items:center; }
.court-name { font-size:15px; font-weight:700; color:var(--text); }
.court-distance { font-size:13px; color:var(--brand); font-weight:600; }
.court-info { font-size:13px; color:var(--muted); display:block; margin-top:4px; }
.court-stats { font-size:13px; color:var(--muted); margin-top:6px; }
.stat-section { margin-top:6px; }
.stat-label { font-size:12px; color:var(--muted-2); margin-right:6px; }
.stat-tags { display:inline-flex; flex-wrap:wrap; gap:6px; }
.stat-tag { font-size:12px; background:var(--brand-soft); color:var(--brand); padding:2px 8px; border-radius:999px; }
.court-nav-map { width:100%; height:120px; object-fit:cover; border-radius:10px; margin-top:8px; }
.float-btn { position:absolute; width:44px; height:44px; border-radius:999px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.18); display:flex; align-items:center; justify-content:center; font-size:20px; cursor:pointer; color:var(--brand); z-index:1100; }
.float-refresh { right:14px; bottom:18px; }
.float-notif { right:14px; bottom:72px; }
.detail-panel { background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px; margin-bottom:16px; }
.detail-panel h3 { margin:0 0 8px; font-size:16px; }
.detail-row { display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed var(--border); font-size:14px; }
.vote-bar { display:flex; gap:8px; margin-top:10px; }

/* ===== 训练打卡（对齐小程序 training） ===== */
.nav { position:sticky; top:0; z-index:10; background:var(--bg); padding:10px 14px 0; }
.nav-tabs { display:flex; background:#fff; border-radius:12px; overflow:hidden; }
.nav-tab { flex:1; text-align:center; padding:11px 0; font-size:15px; font-weight:600; color:var(--muted); cursor:pointer; }
.nav-tab.active { background:var(--brand); color:#fff; font-weight:700; }
.section { padding:12px 14px; }
.list-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.list-title { font-size:18px; font-weight:700; color:var(--text); }
.list-add { font-size:14px; color:var(--brand); padding:6px 12px; cursor:pointer; }
.list-action { font-size:14px; color:var(--brand); cursor:pointer; }
.header-actions { display:flex; gap:12px; }
.section-title { font-size:16px; font-weight:700; color:var(--text); }
.plan-create-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.create-actions { display:flex; gap:8px; }
.action-btn { flex:1; text-align:center; padding:11px 6px; border-radius:12px; font-size:14px; font-weight:600; background:#fff; color:var(--text); border:1px solid var(--border); cursor:pointer; }
.action-btn.primary { background:var(--brand); color:#fff; border:none; }
.action-btn.danger { background:#d32f2f; color:#fff; border:none; }
.nearby-btn { flex:none; }
.month-nav { display:flex; justify-content:space-between; align-items:center; padding:6px 0 12px; }
.month-arrow { font-size:22px; color:var(--brand); padding:4px 18px; font-weight:700; cursor:pointer; }
.month-label { font-size:16px; font-weight:600; color:var(--text); }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; background:#fff; border-radius:14px; padding:10px; }
.cal-weekday { text-align:center; font-size:12px; color:#9CA3AF; padding:6px 0; }
.cal-day { text-align:center; padding:6px 0; min-height:48px; position:relative; border-radius:8px; }
.cal-day.empty { visibility:hidden; }
.cal-day.today { background:var(--brand-soft); }
.cal-day.has-checkin { background:var(--brand-soft); }
.cal-day-num { font-size:14px; color:var(--text); display:block; }
.cal-day.today .cal-day-num { background:var(--brand); color:#fff; display:inline-block; width:22px; height:22px; line-height:22px; border-radius:50%; }
.cal-day-dot { font-size:10px; display:block; }
.checkin-dot { color:var(--brand); }
.stats-row { display:flex; justify-content:space-around; padding:12px 0; font-size:13px; color:var(--muted); background:#fff; border-radius:14px; margin-top:10px; }
.stats-num { color:var(--brand); font-weight:700; font-size:16px; }
.plan-tabs { display:flex; background:#fff; border-radius:10px; overflow:hidden; border:1px solid var(--border); margin:14px 0 12px; }
.plan-tab { flex:1; text-align:center; padding:10px 0; font-size:13px; color:var(--muted); cursor:pointer; }
.plan-tab.active { background:var(--brand); color:#fff; font-weight:600; }
.plan-list-wrap { min-height:140px; }
.plan-list { display:flex; flex-direction:column; gap:12px; }
.plan-folder { background:#fff; border-radius:14px; padding:14px; box-shadow:0 2px 10px rgba(16,40,30,.06); cursor:pointer; }
.pf-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.pf-name { font-size:15px; font-weight:600; color:var(--text); }
.pf-delete { font-size:13px; color:#d32f2f; cursor:pointer; padding:2px 8px; border-radius:8px; background:rgba(211,47,47,.1); }
.pf-info { display:flex; flex-direction:column; gap:3px; }
.pf-info-row { font-size:12px; color:var(--muted); }
.pf-bottom { display:flex; justify-content:space-between; align-items:center; margin-top:10px; }
.pf-meta { font-size:12px; color:var(--muted); }
.pf-badge { font-size:11px; padding:3px 10px; border-radius:8px; }
.pf-badge.active { background:var(--brand-soft); color:var(--brand); }
.pf-badge.paused { background:var(--bg); color:var(--muted); }
.empty-text { font-size:14px; color:var(--muted); text-align:center; padding:30px 0; }
.empty-tip { font-size:14px; color:var(--muted); text-align:center; padding:30px 0; }
/* 打卡视图 */
.ci-progress-section { background:#fff; border-radius:14px; padding:14px; margin-bottom:12px; }
.ci-progress-bar-wrap { height:10px; background:var(--border); border-radius:6px; overflow:hidden; }
.ci-progress-bar { height:100%; background:var(--brand); border-radius:6px; }
.ci-progress-label { font-size:13px; color:var(--muted); display:block; margin-top:8px; text-align:center; }
.ci-num { color:var(--brand); font-weight:700; }
.ci-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }
.ci-summary-item { background:#fff; border-radius:12px; padding:12px 6px; text-align:center; }
.ci-summary-num { font-size:20px; font-weight:800; color:var(--brand); display:block; }
.ci-summary-label { font-size:11px; color:var(--muted); display:block; margin-top:2px; }
.ci-section { background:#fff; border-radius:14px; padding:14px; margin-bottom:12px; }
.ci-section-title { font-size:14px; font-weight:600; color:var(--text); margin-bottom:10px; display:block; }
.ci-dist-row { display:flex; align-items:center; gap:8px; margin-bottom:8px; font-size:12px; }
.ci-dist-label { width:48px; color:var(--muted); flex:none; }
.ci-dist-bars { flex:1; }
.ci-dist-bar-bg { height:10px; background:var(--border); border-radius:5px; position:relative; }
.ci-dist-bar-rec { position:absolute; left:0; top:0; height:100%; background:#C6E33B; border-radius:5px; }
.ci-dist-bar-act { position:absolute; left:0; top:0; height:100%; background:var(--brand); border-radius:5px; opacity:.85; }
.ci-dist-pct { width:36px; text-align:right; color:var(--text); flex:none; }
.ci-dist-rec { width:54px; text-align:right; color:var(--muted); flex:none; }
.ci-suggest-item { margin-bottom:8px; }
.ci-suggest-text { font-size:13px; color:var(--text); background:var(--bg); border-radius:8px; padding:8px 10px; }
.ci-suggest-text.sug-red { color:#d32f2f; } .ci-suggest-text.sug-orange { color:#e67e22; } .ci-suggest-text.sug-yellow { color:#caa60a; }
.sug-hl { font-weight:700; }
/* 计划列表 */
.plan-table { background:#fff; border-radius:14px; padding:6px 12px; overflow:hidden; }
.plan-table-head, .plan-table-row { display:grid; grid-template-columns:36px 1fr 60px 80px 56px; gap:6px; align-items:center; padding:10px 0; font-size:12px; }
.plan-table-head { color:var(--muted); border-bottom:1px solid var(--border); }
.plan-table-row { border-bottom:1px dashed var(--border); cursor:pointer; }
.pt-col-name { font-weight:600; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pt-col-joined.joined { color:var(--brand); } .pt-col-joined.not-joined { color:var(--muted); }
.search-row { display:flex; gap:8px; margin-top:6px; }
.search-input { flex:1; height:38px; border:1px solid var(--border); border-radius:10px; padding:0 12px; font-size:14px; box-sizing:border-box; }
.search-btn { padding:0 18px; height:38px; line-height:38px; background:var(--brand); color:#fff; border-radius:10px; font-size:14px; cursor:pointer; }
/* 表单 */
.form-group { background:#fff; border-radius:14px; padding:14px; margin-bottom:12px; }
.form-label { font-size:13px; font-weight:600; color:var(--text); display:block; margin-bottom:8px; }
.form-label-sm { font-size:12px; color:var(--muted); width:40px; flex:none; }
.form-input { width:100%; height:40px; border:1px solid var(--border); border-radius:10px; padding:0 12px; font-size:14px; box-sizing:border-box; box-sizing:border-box; }
.form-textarea { width:100%; min-height:80px; border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-size:14px; box-sizing:border-box; }
.form-row { display:flex; align-items:center; gap:8px; margin-top:8px; }
.area-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.area-card { background:var(--bg); border-radius:10px; padding:14px 6px; text-align:center; border:1px solid transparent; cursor:pointer; }
.area-card.selected { background:var(--brand-soft); border-color:var(--brand); }
.area-name { font-size:13px; color:var(--text); display:block; }
.freq-toggle { display:flex; gap:10px; }
.freq-btn { flex:1; text-align:center; padding:10px 0; border:1px solid var(--border); border-radius:10px; font-size:14px; color:var(--muted); cursor:pointer; }
.freq-btn.active { background:var(--brand); color:#fff; border-color:var(--brand); }
.submit-btn { background:var(--brand); color:#fff; text-align:center; padding:13px 0; border-radius:999px; font-size:15px; font-weight:600; margin-top:6px; cursor:pointer; }
.date-time-row { display:flex; align-items:center; gap:8px; }
.date-time-row .form-input { flex:1; }
.time-sep { font-size:14px; color:var(--muted); }
/* 佛系打卡选择 */
.area9-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.area9-item { background:var(--bg); border-radius:10px; padding:12px 4px; text-align:center; border:1px solid transparent; cursor:pointer; }
.area9-item.expanded { background:var(--brand-soft); border-color:var(--brand); }
.area9-name { font-size:12px; color:var(--text); display:block; }
.level5-list { margin-top:6px; }
.level5-item { display:flex; align-items:center; gap:8px; background:var(--bg); border-radius:8px; padding:8px 12px; margin-bottom:4px; border:1px solid transparent; cursor:pointer; }
.level5-item.selected { background:var(--brand-soft); border-color:var(--brand); }
.level5-tag { font-size:11px; color:#fff; background:var(--brand); border-radius:6px; padding:2px 8px; font-weight:600; flex:none; }
.level5-phase { font-size:12px; color:var(--brand); font-weight:600; width:36px; flex:none; }
.level5-desc { font-size:13px; color:var(--text); flex:1; }
.sel-drill-list { display:flex; flex-direction:column; gap:8px; }
.sel-drill-row { display:flex; align-items:center; gap:8px; background:var(--bg); border-radius:10px; padding:8px 12px; }
.sel-order { font-size:12px; color:#fff; background:var(--brand); border-radius:6px; padding:2px 8px; font-weight:600; flex:none; }
/* ===== 课程服务 ===== */
.role-tabs { display:flex; align-items:center; gap:8px; margin:4px 0 14px; }
.role-tab { flex:none; padding:9px 18px; border-radius:999px; font-size:14px; border:1px solid var(--border); background:#fff; color:var(--muted); cursor:pointer; }
.role-tab.on { background:var(--brand); color:#fff; border-color:var(--brand); font-weight:600; }
.role-id-bar { margin-left:auto; }
.id-bar { display:flex; align-items:center; gap:8px; background:#fff; border-radius:12px; padding:10px 14px; margin-bottom:12px; font-size:13px; }
.id-label { color:var(--muted); }
.id-val { font-weight:700; color:var(--brand); letter-spacing:.5px; }
.section-head { display:flex; align-items:center; justify-content:space-between; margin:16px 0 8px; font-size:15px; font-weight:600; color:var(--text); }
.section-head .muted, .section-head .muted.small { font-weight:400; }
.cal-nav { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.mini-btn { padding:4px 10px; border-radius:8px; border:1px solid var(--border); background:#fff; font-size:12px; color:var(--text); cursor:pointer; }
.mini-btn.danger { color:#d32f2f; border-color:rgba(211,47,47,.3); }
.mini-sel { padding:4px 8px; border-radius:8px; border:1px solid var(--border); background:#fff; font-size:12px; }
.cal-scroll { overflow-x:hidden; background:#fff; border-radius:14px; padding:8px; }
.cal-grid { display:grid; grid-template-columns:40px repeat(7, minmax(0, 1fr)); font-size:11px; }
.cal-corner { }
.cal-col-h { text-align:center; font-weight:600; color:var(--muted); padding:6px 0; position:sticky; top:0; background:#fff; }
.cal-row-h { color:var(--muted); text-align:right; padding:4px 6px 4px 0; white-space:nowrap; border-top:1px solid var(--border); }
.cal-cell { border-top:1px solid var(--border); border-left:1px solid var(--border); min-height:34px; padding:2px; display:flex; align-items:center; justify-content:center; text-align:center; cursor:pointer; }
.cal-cell.empty { cursor:default; }
.cal-cell span { line-height:1.2; }
.cal-cell.busy { background:#E3F2FD; color:#1565C0; }
.cal-cell.booked { background:var(--brand-soft); color:var(--brand); }
.cal-cell.attended { background:#ECEFF1; color:#607D8B; }
.cal-cell.mine { background:#FFF3E0; color:#E65100; }
.cal-cell.class { background:#F3E5F5; color:#7B1FA2; }
.actions-row { display:flex; gap:10px; margin:12px 0; }
.btn-primary { flex:1; text-align:center; padding:11px 0; border-radius:999px; background:var(--brand); color:#fff; font-size:14px; font-weight:600; border:none; cursor:pointer; }
.btn-ghost { flex:1; text-align:center; padding:11px 0; border-radius:999px; background:#fff; color:var(--brand); border:1px solid var(--brand); font-size:14px; font-weight:600; cursor:pointer; }
.coach-stu-list { display:flex; flex-direction:column; gap:8px; }
.coach-stu { display:flex; align-items:center; justify-content:space-between; background:#fff; border-radius:12px; padding:10px 14px; }
.cs-main { font-size:14px; }
.tag-custom { font-size:11px; background:var(--bg); color:var(--muted); border-radius:6px; padding:1px 6px; margin-left:6px; }
.attn-list { display:flex; flex-direction:column; gap:6px; }
.attn-item { display:flex; gap:10px; align-items:center; background:#fff; border-radius:10px; padding:8px 12px; font-size:13px; }
.attn-date { color:var(--muted); width:84px; flex:none; }
.attn-stu { font-weight:600; }
.mgmt-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:14px; }
.mgmt-card { background:#fff; border:1px dashed var(--border); border-radius:12px; padding:16px; text-align:center; font-size:13px; color:var(--muted); }
.pkg-list { display:flex; flex-direction:column; gap:10px; }
.pkg-item { background:#fff; border-radius:12px; padding:12px 14px; }
.pkg-name { font-weight:600; margin-bottom:8px; }
.pkg-bar { height:8px; background:var(--border); border-radius:5px; overflow:hidden; margin-bottom:6px; }
.pkg-fill { height:100%; background:var(--brand); }
.bind-results { display:flex; flex-direction:column; gap:6px; margin:8px 0; max-height:160px; overflow:auto; }
.bind-item { background:var(--bg); border-radius:8px; padding:8px 12px; font-size:13px; cursor:pointer; }
.modal-card { background:#fff; border-radius:16px; padding:18px; box-shadow:0 10px 40px rgba(0,0,0,.2); }
.modal-card h3 { margin:0 0 12px; font-size:17px; color:var(--text); }
.modal-card label { display:block; font-size:12px; color:var(--muted); margin:10px 0 4px; }
.modal-card select, .modal-card input { width:100%; height:40px; border:1px solid var(--border); border-radius:10px; padding:0 12px; font-size:14px; box-sizing:border-box; }
.modal-actions { display:flex; gap:10px; margin-top:16px; }
.sel-area { font-size:13px; color:var(--brand); font-weight:600; flex:none; }
.sel-name { font-size:14px; color:var(--text); flex:1; font-weight:700; }
.sel-detail-input { font-size:12px; color:var(--text); background:var(--brand-soft); width:52px; padding:5px 4px; border-radius:6px; border:none; text-align:center; flex:none; }
.sel-min { font-size:12px; color:var(--muted); flex:none; }
.sel-del { font-size:14px; color:#d32f2f; padding:2px; flex:none; cursor:pointer; }
.total-time { font-size:12px; color:var(--muted); text-align:right; display:block; margin-top:6px; }
.rating-row { display:flex; gap:8px; }
.rating-star { font-size:26px; color:var(--border); cursor:pointer; }
.rating-star.active { color:#C6E33B; }
/* 记录 / 详情 */
.history-list { display:flex; flex-direction:column; gap:8px; }
.history-item { background:#fff; border-radius:12px; padding:10px 12px; display:flex; align-items:center; gap:12px; font-size:13px; }
.history-date { font-weight:700; color:var(--text); flex:none; }
.history-time { color:var(--muted); flex:none; font-size:12px; }
.history-plan { color:var(--brand); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.history-dur { color:var(--muted); flex:none; font-size:12px; }
/* 我的记录 · 比赛记录汇总表（对齐小程序 match-record-block） */
.match-record-block { margin-top:14px; }
.mr-title { font-size:14px; font-weight:700; margin-bottom:8px; color:var(--text); }
.mr-scroll { overflow-x:auto; background:#fff; border-radius:12px; padding:8px; }
.mr-table { display:flex; flex-direction:column; min-width:620px; font-size:12px; }
.mr-thead, .mr-row { display:grid; grid-template-columns:78px 76px 76px repeat(5, 48px) 44px 52px; gap:4px; align-items:center; padding:6px 8px; }
.mr-thead { background:var(--bg); font-weight:700; color:var(--muted); border-radius:8px; }
.mr-row { border-top:1px solid var(--border); }
.mr-td { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.mr-win { color:var(--brand); }
.mr-lose { color:#e53935; }
.mr-tie { color:var(--muted); }
.pd-info-card { background:#fff; border-radius:14px; padding:14px; margin-bottom:12px; }
.pd-meta-row { display:flex; justify-content:space-between; gap:8px; font-size:13px; color:var(--muted); margin-bottom:6px; }
.pd-meta-creator { color:var(--text); }
.pd-meta-uid { color:var(--brand); }
.pd-areas { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.plan-area-tag { background:var(--brand-soft); color:var(--brand); padding:3px 10px; border-radius:8px; font-size:12px; }
.pd-participants { background:#fff; border-radius:14px; padding:14px; margin-bottom:12px; }
.pd-participants-title { font-size:13px; color:var(--muted); }
.pd-avatar-row { display:flex; gap:8px; margin-top:8px; }
.pd-avatar { width:36px; height:36px; border-radius:999px; background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; font-weight:700; }

/* ===== 课程服务 ===== */
.coach-card { background:#fff; border:1px solid var(--border); border-radius:14px; padding:14px; margin-bottom:12px; display:flex; gap:12px; }
.coach-avatar { width:54px; height:54px; border-radius:999px; background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800; flex:none; }
.coach-main { flex:1; }
.coach-name { font-size:16px; font-weight:700; }
.coach-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.coach-tag { font-size:12px; background:var(--brand-soft); color:var(--brand); padding:3px 9px; border-radius:999px; }
.week-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin:10px 0; }
.day-col { background:var(--bg); border-radius:10px; padding:8px 4px; text-align:center; min-height:120px; }
.day-name { font-size:13px; font-weight:700; color:var(--text); margin-bottom:6px; }
.slot { background:#fff; border:1px solid var(--border); border-radius:8px; padding:4px; font-size:11px; margin-bottom:4px; color:var(--text); }
.slot.booked { background:var(--brand-soft); color:var(--brand); border-color:var(--brand); }

/* ===== 登录弹窗 ===== */
.login-mask { position:fixed; inset:0; background:rgba(16,40,30,.55); z-index:10000; display:flex; align-items:center; justify-content:center; padding:16px; }
.login-box { background:#fff; border-radius:18px; padding:24px; width:100%; max-width:400px; box-shadow:0 12px 40px rgba(16,40,30,.2); position:relative; }
.login-close { position:absolute; top:12px; right:16px; color:var(--muted); cursor:pointer; font-size:18px; }
.login-box h3 { margin:0 0 14px; font-size:18px; }
.hint { font-size:12px; color:var(--muted); margin-top:10px; line-height:1.6; }

/* ===== 球场地图 v2（对齐小程序 courtmap：剩余时间/统计/我的球场/详情/推荐弹窗）===== */
.court-name-wrap { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.court-expire { font-size:12px; color:var(--muted-2); background:var(--bg); padding:2px 8px; border-radius:999px; }
.mine-badge { font-size:11px; color:#fff; background:#ff4444; padding:1px 6px; border-radius:999px; margin-left:4px; vertical-align:2px; }
.clear-all-joined { margin-top:14px; text-align:center; color:#d32f2f; font-size:14px; padding:12px; border:1px dashed #d32f2f55; border-radius:12px; cursor:pointer; }
.clear-all-joined:hover { background:#d32f2f11; }
.btn-ghost.sm { flex:none; font-size:12px; padding:3px 10px; border-radius:8px; }
.modal-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.modal-close { color:var(--muted); cursor:pointer; font-size:18px; line-height:1; }
.modal-input { width:100%; box-sizing:border-box; border:1px solid var(--border); border-radius:12px; padding:11px 12px; font-size:15px; outline:none; }
.modal-input:focus { border-color:var(--brand); }
.cm-detail-body .detail-row { font-size:14px; }
.cm-tel-row { display:flex; align-items:center; gap:8px; padding:8px 0; border-bottom:1px dashed var(--border); font-size:14px; flex-wrap:wrap; }
.cm-tel-row > span:first-child { color:var(--muted); min-width:64px; }
.cm-vote { font-size:12px; color:var(--muted-2); margin-left:auto; }
.cm-detail-actions { display:flex; gap:8px; margin-top:14px; }
.cm-recommend-box { max-width:440px; }
.cm-rec-name { font-size:18px; font-weight:800; margin-bottom:10px; }
.cm-rec-info { margin-top:10px; }
.cm-rec-info .detail-row { font-size:14px; }

/* ===== 课程服务 v2（严格对齐小程序 10study：tabs/身份卡/统计/日历图例/弹窗）===== */
.muted { color:var(--muted); }
.small { font-size:12px; }
.study-tabs { display:flex; gap:8px; margin-bottom:10px; }
.card-title { font-size:16px; font-weight:800; color:var(--text); margin-bottom:12px; }
.cal-nav-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.cal-nav-row .card-title { margin-bottom:0; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(90px,1fr)); gap:8px; }
.stats-grid.mini { grid-template-columns:repeat(4,1fr); gap:6px; }
.stat-box { background:var(--bg); border-radius:12px; padding:12px 8px; text-align:center; }
.stat-box.clickable { cursor:pointer; transition:transform .1s, box-shadow .1s; }
.stat-box.clickable:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.08); }
.stat-box.clickable .stat-cap { color:var(--brand); }
.stat-num { font-size:18px; font-weight:800; color:var(--text); }
.stat-cap { font-size:11px; color:var(--muted); margin-top:4px; }
.stu-coach-sel { padding:4px 8px; border-radius:8px; border:1px solid var(--brand); background:#fff; color:var(--brand); font-size:12px; font-weight:600; cursor:pointer; max-width:150px; }
/* 学员端：学习统计+我的教练 合并块，与左栏「教学概览」水平对齐；左右日历等高 */
.stats-coach-block { display:flex; flex-direction:column; gap:12px; min-height:150px; }
#study-content > .card:nth-child(2) { min-height:150px; }
/* 教学概览/预收/收入 明细列表弹窗 */
.list-table { display:flex; flex-direction:column; gap:2px; max-height:56vh; overflow:auto; margin:8px 0; }
.lt-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(70px,1fr)); gap:6px; padding:7px 10px; font-size:13px; border-bottom:1px solid var(--border); align-items:center; }
.lt-row.lt-head { background:var(--bg); font-weight:700; font-size:12px; color:var(--muted); position:sticky; top:0; }
.modal-card.wide { width:min(680px, 92vw); }
.owe { color:#e53935; font-weight:700; }
.id-card { display:flex; align-items:center; gap:8px; background:#fff; border-radius:14px; padding:12px 14px; margin-bottom:12px; font-size:14px; flex-wrap:wrap; }
.id-role { background:var(--brand); color:#fff; font-size:12px; padding:2px 10px; border-radius:999px; }
.id-nick { font-size:15px; }
.id-code { color:var(--muted); font-size:13px; }
.id-val { color:var(--brand); font-family:monospace; letter-spacing:1px; }
.cal-col-h.today { color:var(--brand); }
.cal-date { display:block; font-size:10px; color:var(--muted-2); }
.cal-legend { display:flex; flex-wrap:wrap; gap:10px; font-size:11px; color:var(--muted); padding:10px 2px 0; }
.cal-legend span { display:inline-flex; align-items:center; gap:3px; }
.cal-cell { position:relative; overflow:visible; }
.cal-cell.has-slot { cursor:pointer; }
.cal-slot { position:absolute; left:2px; right:2px; border-radius:6px; padding:1px 4px; font-size:10px; line-height:1.35; overflow:hidden; cursor:pointer; display:flex; align-items:center; }
.cal-slot span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sl-stu { background:var(--brand-soft); color:var(--brand); border:1px solid rgba(14,122,83,.3); }
.sl-cls { background:#F3E5F5; color:#7B1FA2; border:1px solid rgba(123,31,162,.25); }
.sl-bk { background:#FFEBEE; color:#e53935; border:1px solid rgba(229,57,53,.3); }
.sl-ok { background:var(--brand-soft); color:var(--brand); border:1px solid rgba(14,122,83,.3); }
.sl-done { background:#ECEFF1; color:#607D8B; border:1px solid rgba(96,125,139,.3); }
.sl-busy { background:rgba(0,0,0,.05); color:var(--muted-2); border:1px dashed var(--border); }
.coach-list { display:flex; flex-direction:column; gap:8px; }
.coach-item { display:flex; align-items:center; gap:10px; background:#fff; border-radius:12px; padding:10px 12px; }
.coach-avatar { width:40px; height:40px; border-radius:999px; background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; font-size:18px; flex:none; }
.coach-info { flex:1; min-width:0; }
.coach-name { font-size:15px; font-weight:700; }
.menu-list { display:flex; flex-direction:column; gap:8px; margin:10px 0; }
.menu-item { text-align:left; padding:11px 14px; border-radius:10px; background:var(--bg); border:1px solid var(--border); font-size:14px; color:var(--text); cursor:pointer; }
.menu-item:hover { border-color:var(--brand); color:var(--brand); }
.detail-header { font-size:15px; margin-bottom:10px; }
.section-title.small { font-size:13px; font-weight:700; color:var(--muted); margin:12px 0 6px; border:none; padding:0; display:block; }
.detail-line { font-size:13px; color:var(--text); padding:3px 0; line-height:1.5; }
.stu-chips { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:13px; }
.stu-chip { width:26px; height:26px; border-radius:999px; background:var(--brand-soft); color:var(--brand); display:inline-flex; align-items:center; justify-content:center; font-size:12px; }
.fee-check { background:#f7f9ff; border:1px solid #e0e6ff; border-radius:12px; padding:8px 12px; margin:6px 0; }
.attn-rows { display:flex; flex-direction:column; gap:8px; margin:10px 0; }
.attn-row { display:flex; justify-content:space-between; align-items:center; gap:10px; background:var(--bg); border-radius:10px; padding:8px 12px; }
.attn-name { font-size:14px; }
.attn-used { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--muted); }
.modal-input.sm { width:70px; padding:6px 8px; font-size:14px; }
.btn-danger { background:#d32f2f; color:#fff; border:none; border-radius:12px; padding:11px 0; font-size:15px; cursor:pointer; }
.owe { color:#d32f2f; font-weight:700; }
.sched-search { max-height:160px; overflow:auto; }
.sched-tags { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0; }
.sched-tag { background:var(--brand-soft); color:var(--brand); font-size:12px; padding:3px 10px; border-radius:999px; display:inline-flex; align-items:center; gap:6px; }
.sched-tag-del { cursor:pointer; font-weight:700; }
.bind-results { max-height:160px; overflow:auto; }

/* ===== 球场地图 v2.1：悬浮卡片折叠 + 拖拽调宽 ===== */
.float-card.collapsed { width:44px !important; min-width:44px; padding:12px 6px; }
.float-card.collapsed .card-content { display:none; }
.card-resizer { position:absolute; right:-4px; bottom:-4px; width:18px; height:18px; cursor:se-resize; z-index:5; border-radius:0 0 12px 0; border-right:2px solid var(--brand); border-bottom:2px solid var(--brand); }
.card-resizer:hover { background:rgba(14,122,83,.15); }
.float-card.collapsed .card-resizer { display:none; }

/* ===== 球场地图 v3（对齐 4court：球局/场地价格/投票/球友/电话/通知/引导）===== */
.section-title { font-size:15px; font-weight:800; color:var(--text); margin:14px 0 8px; padding-bottom:6px; border-bottom:1px solid var(--border); }
.section-title.small { font-size:13px; font-weight:700; color:var(--muted); margin:10px 0 6px; border:none; padding:0; display:block; }
.detail-divider { border-top:1px dashed var(--border); margin:14px 0; }
.cm-detail-box { width:min(560px, 92vw); max-height:86vh; display:flex; flex-direction:column; }
.cm-detail-body { overflow:auto; padding-right:4px; }
.cm-detail-actions { display:flex; gap:8px; flex-wrap:wrap; }
.cm-detail-actions .action-btn { flex:1; min-width:110px; }

/* 球局 */
.act-list { display:flex; flex-direction:column; gap:8px; margin:8px 0; }
.act-card { background:var(--bg); border:1px solid var(--border); border-radius:12px; padding:10px 12px; }
.act-card-view { cursor:pointer; }
.act-head-row { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.act-title { font-size:14px; font-weight:700; flex:1; min-width:0; }
.act-status { font-size:12px; color:var(--brand); flex:none; }
.act-meta { font-size:13px; color:var(--muted); margin-top:4px; }
.act-detail { margin-top:8px; }
.act-purpose { background:#fff; border-radius:8px; padding:6px 10px; font-size:13px; color:var(--text); margin-top:4px; }

/* 场地价格 */
.price-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:8px; }
.price-group { background:var(--bg); border-radius:10px; padding:10px; }
.price-lab { font-weight:700; font-size:14px; margin-bottom:6px; color:var(--text); }
.price-row { display:flex; align-items:center; gap:8px; margin-bottom:6px; font-size:13px; }
.price-row .muted { flex:none; width:40px; }
.price-row .modal-input.sm { width:70px; }
.avg-row { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--text); margin-top:8px; padding:8px 10px; background:var(--bg); border-radius:10px; }
.avg-row .day { color:#2e7d32; }
.avg-row .night { color:#c62828; }

/* 投票 */
.vote-buttons { display:flex; gap:8px; margin-top:6px; }
.vote-btn { flex:1; padding:9px 6px; border-radius:10px; border:1px solid var(--border); background:#fff; font-size:13px; color:var(--text); cursor:pointer; text-align:center; }
.vote-btn:hover { border-color:var(--brand); }
.vote-active { background:var(--brand-soft); border-color:var(--brand); color:var(--brand); font-weight:700; }
.vote-active-warning { background:#FFEBEE; border-color:#e53935; color:#e53935; font-weight:700; }
.vote-tip { font-size:12px; color:#e53935; margin-top:6px; }

/* 球友列表 */
.user-list { display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.user-card { background:#fff; border:1px solid var(--border); border-radius:12px; padding:10px 12px; }
.user-info { cursor:pointer; }
.info-line { font-size:13px; color:var(--text); padding:2px 0; line-height:1.5; }
.user-contact { margin-top:8px; border-top:1px dashed var(--border); padding-top:6px; }
.contact-value { background:var(--bg); border-radius:8px; padding:6px 10px; font-size:13px; color:var(--text); margin:4px 0; word-break:break-all; }
.tnsti-tag { display:inline-block; background:#E3F2FD; color:#1565C0; font-size:11px; padding:1px 6px; border-radius:6px; margin-left:6px; vertical-align:1px; }
.coach-icon { display:inline-block; margin-left:4px; font-size:13px; }
.partner-icon { display:inline-block; margin-left:2px; font-size:13px; }

/* 电话弹窗 */
.cm-tel-body { display:flex; flex-direction:column; gap:10px; }
.cm-tel-row { display:flex; align-items:center; gap:8px; padding:8px 0; border-bottom:1px dashed var(--border); font-size:14px; flex-wrap:wrap; }
.cm-tel-lab { color:var(--muted); min-width:52px; font-size:13px; }
.cm-tel-body .modal-input.sm { width:120px; }
.cm-vote { font-size:12px; color:var(--muted-2); margin-left:auto; display:inline-flex; gap:8px; align-items:center; }
.cm-vote span { cursor:pointer; }
.cm-vote span:hover { color:var(--brand); }

/* 用户详情 */
.cm-user-box { width:min(420px, 90vw); }
.cm-user-body { max-height:64vh; overflow:auto; }

/* 发起球局 */
.cm-act-body { display:flex; flex-direction:column; gap:10px; }
.act-auto-title { background:var(--bg); border-radius:10px; padding:8px 12px; font-size:13px; color:var(--brand); }
.act-static { font-size:14px; color:var(--text); flex:1; }
.form-row { display:flex; align-items:center; gap:10px; font-size:14px; }
.form-row label { flex:none; width:76px; color:var(--muted); font-size:13px; }
.form-row input[type="date"], .form-row input[type="time"] { flex:1; border:1px solid var(--border); border-radius:10px; padding:8px 10px; font-size:14px; outline:none; box-sizing:border-box; }
.form-row select { border:1px solid var(--border); border-radius:10px; padding:8px 10px; font-size:14px; outline:none; background:#fff; }

/* 通知 */
.float-scope { right:14px; bottom:126px; font-size:17px; }
/* 导入球场按钮 + 临时搜索范围框（对齐小程序 float-import-btn / temp-search-box） */
.float-import { right:14px; bottom:180px; font-size:18px; background:var(--brand); color:#fff; }
.temp-search-box { position:fixed; top:35%; left:25%; width:50%; height:30%; border:3px dashed #d32f2f; background:rgba(211,47,47,.08); border-radius:10px; z-index:1500; display:flex; align-items:center; justify-content:center; pointer-events:none; animation:cm-pulse .5s ease-in-out; }
.temp-box-text { font-size:16px; color:#d32f2f; background:rgba(255,255,255,.92); padding:6px 14px; border-radius:999px; font-weight:700; }
@keyframes cm-pulse { 0% { transform:scale(.95); opacity:.5; } 100% { transform:scale(1); opacity:1; } }

/* 顶部三 tab（对齐小程序 courtmap top-tabs） */
.cm-top-tabs { display:flex; background:#fff; border-radius:12px; overflow:hidden; margin-bottom:12px; box-shadow:0 2px 10px rgba(16,40,30,.05); }
.cm-top-tab { flex:1; text-align:center; padding:11px 0; font-size:15px; font-weight:600; color:var(--muted); cursor:pointer; transition:background .15s, color .15s; }
.cm-top-tab.active { background:var(--brand); color:#fff; font-weight:700; }

/* 搜索放大镜图标（对齐小程序 search-icon） */
.search-icon { font-size:14px; color:var(--muted-2); flex:none; }

/* 附近视图容器 */
.cm-nearby { padding:2px 0; }
.nearby-actions { display:flex; gap:8px; align-items:center; margin-bottom:10px; flex-wrap:wrap; }
.notif-badge { position:absolute; top:-4px; right:-4px; min-width:16px; height:16px; border-radius:999px; background:#ff4444; color:#fff; font-size:10px; line-height:16px; text-align:center; padding:0 4px; box-sizing:border-box; }
.notif-item { background:var(--bg); border-radius:10px; padding:8px 12px; margin-bottom:8px; font-size:13px; }

/* ===== LV2 平铺框架（多栏合并、点击区域高亮对应 tab）===== */
.split-view { display:flex; align-items:stretch; }
.split-view > .split-pane { flex:1 1 0; min-width:0; }
.split-pane {
  border:none; border-radius:0; padding:14px 16px;
  background:transparent;
  transition:background .18s;
  position:relative; overflow:hidden;
}
.split-pane + .split-pane { border-left:1px solid var(--border, #e9edec); }
.split-pane:hover { background:rgba(0,0,0,.02); }
.split-pane.active { background:var(--brand-soft, rgba(14,122,83,.05)); cursor:default; }
.split-pane .pane-badge { position:absolute; top:0; left:0; right:0; text-align:center; font-size:11px; color:var(--brand); padding:2px 0; opacity:0; transition:opacity .15s; }
.split-pane.active .pane-badge { opacity:.9; }
.split-pane .section { margin:0; border:none; padding:0; box-shadow:none; }
.split-pane .pane-title { font-size:14px; font-weight:800; color:var(--text); margin-bottom:10px; }
/* 球场地图：地图栏占屏幕左侧 2/3，附近栏 1/3，两栏严格等高 */
.split-pane.map-pane { flex:2 1 0; }
#tab-courtmap .cm-split { height:calc(100vh - 175px); min-height:440px; }
#tab-courtmap .cm-split > .split-pane { overflow-y:auto; }
#tab-courtmap .cm-split > .split-pane.map-pane { overflow:hidden; padding-bottom:0; display:flex; flex-direction:column; }
#tab-courtmap .cm-toolbar { display:flex; align-items:center; margin-bottom:10px; flex:none; }
#tab-courtmap .cm-new-btn {
  background:var(--brand); color:#fff; border:none; border-radius:999px;
  padding:8px 18px; font-size:13px; font-weight:600; cursor:pointer;
  box-shadow:0 2px 8px rgba(14,122,83,.22); transition:.15s; letter-spacing:.3px;
}
#tab-courtmap .cm-new-btn:hover { background:var(--brand-deep, #0a5f41); }
#tab-courtmap .cm-split .map-wrap { flex:1; height:auto; margin:0; min-height:0; }
#tab-courtmap .cm-split #cm-map { width:100%; height:100%; }
/* 我的资料：两栏等高 */
#tab-profile .split-view { min-height:calc(100vh - 260px); align-items:stretch; }
#tab-profile .split-pane { display:flex; flex-direction:column; }
/* 页脚 · 联系我们（全局底部，数据库文案上方，一行平铺/超宽折行） */
.site-contact { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px 18px; margin-bottom:14px; padding:10px 16px; background:#fff; border-radius:14px; max-width:780px; margin-left:auto; margin-right:auto; }
.site-contact-title { font-size:15px; font-weight:800; color:var(--text); }
.site-contact-item { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--muted); white-space:nowrap; }
.site-contact-item .social-icon { font-size:16px; }
.site-contact-item .copy-btn { padding:3px 10px; font-size:11px; border-radius:999px; background:var(--brand); color:#fff; border:none; cursor:pointer; }
/* 新建球场 · 大头针放置模式 */
.cm-place-tip {
  position:absolute; left:50%; top:14px; transform:translateX(-50%); z-index:1300;
  background:var(--brand, #0e7a53); color:#fff; padding:8px 14px; border-radius:999px;
  font-size:13px; box-shadow:0 4px 14px rgba(0,0,0,.25); display:flex; align-items:center; gap:10px;
  white-space:nowrap; max-width:94%; line-height:1.4;
}
.cm-place-tip .cm-place-pos { font-family:Consolas,monospace; font-size:12px; opacity:.9; }
.cm-place-tip .cm-place-name {
  width:150px; border:none; border-radius:999px; padding:6px 12px; font-size:13px; outline:none;
  background:#fff; color:#1f2937;
}
.cm-place-tip .cm-place-ok, .cm-place-tip .cm-place-cancel { cursor:pointer; font-weight:700; padding:2px 10px; border-radius:999px; flex:none; }
.cm-place-tip .cm-place-ok { background:#fff; color:var(--brand, #0e7a53); }
.cm-place-tip .cm-place-cancel { background:rgba(255,255,255,.22); }
.cm-place-tip.confirm { background:#26312c; }
.map-wrap.cm-place-mode #cm-map { cursor:crosshair !important; }

/* 发起球局弹窗（对齐小程序 activity-modal：绿渐变头/可滚动体/灰块输入/时间一行/footer 分隔）*/
.cm-act-box { padding:0; max-width:440px; overflow:hidden; }
.cm-act-box .modal-header.cm-act-header { background:linear-gradient(135deg, #0E7A53 0%, #095A3E 100%); padding:14px 18px; }
.cm-act-box .modal-header.cm-act-header .modal-title { color:#fff; font-size:16px; font-weight:700; }
.cm-act-box .modal-header.cm-act-header .modal-close { color:rgba(255,255,255,.85); font-size:18px; }
.cm-act-body { padding:16px 18px; max-height:60vh; overflow-y:auto; }
.cm-act-body .form-group { margin-bottom:14px; }
.cm-act-body .form-group:last-child { margin-bottom:4px; }
.cm-act-body .form-label { display:block; font-size:13px; color:#1f2937; font-weight:500; margin-bottom:6px; }
.cm-act-body .required { color:#d32f2f; font-weight:700; margin-left:2px; }
.cm-act-body .act-input {
  width:100%; height:40px; background:#f3f5f4; border:none; border-radius:10px;
  padding:0 12px; font-size:14px; color:#1f2937; box-sizing:border-box; outline:none;
}
.cm-act-body select.act-input { appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0l5 6 5-6z' fill='%239ca3af'/></svg>"); background-repeat:no-repeat; background-position:right 12px center; cursor:pointer; }
.cm-act-body .act-auto-title {
  width:100%; min-height:40px; background:#e8f5ef; border-radius:10px; padding:0 12px;
  font-size:14px; line-height:40px; color:#0e7a53; font-weight:500; box-sizing:border-box; margin-bottom:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cm-act-body .act-static, .cm-act-body .act-info {
  width:100%; min-height:40px; background:#f3f5f4; border-radius:10px; padding:0 12px;
  font-size:14px; line-height:40px; box-sizing:border-box; word-break:break-all;
}
.cm-act-body .act-static { color:#0e7a53; }
.cm-act-body .act-info { color:#6b7280; }
.cm-act-body .time-range { display:flex; align-items:center; gap:10px; }
.cm-act-body .time-picker { flex:1; min-width:0; }
.cm-act-body .time-to { font-size:14px; color:#9ca3af; flex:none; }
.cm-act-footer { display:flex; gap:12px; padding:14px 18px 18px; border-top:1px solid #e5e7eb; background:#fff; }
.cm-act-footer button { flex:1; padding:11px 0; border-radius:10px; font-size:14px; font-weight:600; }
.cm-act-footer .action-btn.primary { border:none; }
/* LV2 子操作弹窗 */
.tr-modal-box { width:min(640px, 94vw); max-height:88vh; display:flex; flex-direction:column; }
.tr-modal-body { overflow:auto; padding-right:2px; }
.tr-modal-body .section { margin:0; border:none; padding:0; box-shadow:none; }

/* ===== 微信一键登录 ===== */

/* ===== 绑定二维码弹窗 ===== */
.bind-qr-box { width: min(380px, 92vw); text-align: center; }
.bind-qr-tip { font-size: 13px; color: var(--muted, #6b7280); line-height: 1.6; margin: 4px 2px 14px; }
.bind-qr-img-wrap { display: flex; justify-content: center; padding: 10px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; }
.bind-qr-img { width: 240px; height: 240px; display: block; }
.bind-qr-status { margin: 12px 0 4px; font-size: 14px; font-weight: 600; color: #0E7A53; }


/* ===== 球拍测评页（小程序 8racket 视觉风格，作用域 #tab-racket） ===== */
/* ============================================================================
   球拍测评页 · 小程序 8racket 视觉风格搬运（网页端）
   配色对齐小程序：品牌绿 #0E7A53 / 金 #C6E33B / 页面底 #F3F5F4 / 危险红 #E74C3C
   本段作用域限定在 #tab-racket，避免影响其他页面（弹窗也挂在 #tab-racket 内）
   rpx → px 统一 ÷2
   ============================================================================ */
#tab-racket {
  --brand-bg: #e7f6ef;
  --brand-dark: #095A3E;
  --brand-tint: #E8F5EF;
  --accent: #C6E33B;
  --accent-dark: #A8C62E;
  --atp: #2D7FF9;
  --atp-bg: #EAF2FF;
  --seed: #00c853;
  --seed-bg: #E6F9EE;
  --china: #ff6f00;
  --china-bg: #FFF1E0;
  --danger: #E74C3C;
  background: var(--bg);
  min-height: 100vh;
}

/* ========== 顶部数据源等级徽章（#rk-level） ========== */
#tab-racket .rk-level { display:inline-block; font-size:12px; padding:3px 9px; border-radius:12px; white-space:nowrap; font-weight:600; }
#tab-racket .lvl-l1 { background:#e8f1ff; color:#2b6fd6; }
#tab-racket .lvl-l2 { background:var(--seed-bg); color:var(--seed); }
#tab-racket .lvl-init { background:#f0f0f0; color:#888; }
#tab-racket .rk-pill { display:inline-flex; align-items:center; justify-content:center; }

/* ========== 导航栏（首页/分层/详情共用） ========== */
#tab-racket .nav-bar {
  display:flex; justify-content:space-between; align-items:center;
  background:#fff; padding:12px 15px; border-bottom:1px solid var(--border);
}
#tab-racket .nav-left { min-width:80px; }
#tab-racket .nav-back-text { font-size:15px; color:var(--brand); font-weight:500; cursor:pointer; }
#tab-racket .nav-title { font-size:18px; font-weight:bold; color:var(--text); flex:1; text-align:center; }
#tab-racket .nav-right { min-width:80px; text-align:right; display:flex; align-items:center; justify-content:flex-end; gap:8px; }
#tab-racket .nav-icon { width:22px; height:22px; background-repeat:no-repeat; background-position:center; background-size:contain; cursor:pointer; }
#tab-racket .nav-icon.ic-search { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%230E7A53%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2210.5%22%20cy%3D%2210.5%22%20r%3D%226.5%22%2F%3E%3Cpath%20d%3D%22M15.5%2015.5L20%2020%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .nav-icon.ic-refresh { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%230E7A53%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2012a8%208%200%200%201%2014-5l2%202M20%2012a8%208%200%200%201-14%205l-2-2%22%2F%3E%3Cpath%20d%3D%22M18%204v5h-5M6%2020v-5h5%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .nav-icon.ic-compare { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%230E7A53%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2220%22%20r%3D%221.4%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2220%22%20r%3D%221.4%22%2F%3E%3Cpath%20d%3D%22M2%203h2.2l2.2%2011.2a1.6%201.6%200%200%200%201.6%201.3h8.6a1.6%201.6%200%200%200%201.55-1.2L20.5%207H6%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .cart-badge-wrap { position:relative; display:flex; align-items:center; }
#tab-racket .cart-badge { position:absolute; top:-3px; right:-5px; min-width:14px; height:14px; line-height:14px; padding:0 3px; border-radius:999px; background:var(--danger); color:#fff; font-size:9px; text-align:center; box-sizing:border-box; }
#tab-racket .nav-link { font-size:13px; color:var(--brand); padding:4px 8px; background:var(--brand-tint); border-radius:16px; cursor:pointer; }

/* 详情页导航（sticky） */
#tab-racket .detail-nav-bar {
  display:flex; align-items:center; justify-content:space-between;
  background:#fff; padding:12px 15px; border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:30;
}
#tab-racket .detail-nav-bar .nav-back { font-size:16px; color:var(--brand); font-weight:500; cursor:pointer; }
#tab-racket .detail-nav-bar .nav-title { font-size:16px; font-weight:bold; color:var(--text); }

/* ========== 首页聚合 ========== */
#tab-racket .hm-home { padding-bottom:30px; }
#tab-racket .hm-top { background:linear-gradient(135deg, var(--brand), #0b6344); padding:14px 14px 15px; }
#tab-racket .hm-toprow { display:flex; align-items:center; gap:9px; }
#tab-racket .hm-loc { display:flex; align-items:center; gap:4px; color:#fff; font-size:15px; font-weight:700; flex-shrink:0; }
#tab-racket .hm-pin { width:8px; height:8px; border:2px solid var(--accent); border-radius:50%; box-sizing:border-box; }
#tab-racket .hm-search { flex:1; height:34px; background:#fff; border-radius:20px; display:flex; align-items:center; padding:0 5px 0 11px; }
#tab-racket .hm-mag { width:12px; height:12px; border:2px solid #9aa0a6; border-radius:50%; position:relative; flex-shrink:0; }
#tab-racket .hm-mag::after { content:''; position:absolute; right:-4px; bottom:-3px; width:6px; height:2px; background:#9aa0a6; transform:rotate(45deg); border-radius:1px; }
#tab-racket .hm-input { flex:1; font-size:13px; color:#222; margin-left:7px; border:none; outline:none; background:transparent; }
#tab-racket .hm-ph { color:#b5b9be; font-size:12px; }
#tab-racket .hm-go { flex-shrink:0; background:var(--brand); color:#fff; font-size:13px; font-weight:700; padding:6px 13px; border-radius:17px; cursor:pointer; }
#tab-racket .hm-sub { display:flex; flex-wrap:wrap; gap:11px; margin-top:10px; color:rgba(255,255,255,.82); font-size:11px; }
#tab-racket .hm-b { color:var(--accent); font-weight:800; }

/* 数据源控制条 */
#tab-racket .hm-ds { display:flex; align-items:center; gap:6px; margin:10px 10px 0; padding:7px 9px; background:#fff; border-radius:9px; box-shadow:0 2px 7px rgba(0,0,0,.04); }
#tab-racket .hm-ds-label { font-size:11px; color:#9aa0a6; flex-shrink:0; }
#tab-racket .hm-ds-seg { flex:1; display:flex; gap:4px; overflow-x:auto; }
#tab-racket .hm-sg { display:flex; align-items:center; gap:3px; font-size:10px; color:#6b7280; background:#f2f4f3; padding:4px 7px; border-radius:12px; white-space:nowrap; }
#tab-racket .hm-sg.on { background:var(--brand-bg); color:var(--brand); font-weight:700; }
#tab-racket .hm-sg.sg-active .hm-sg-dot { background:var(--brand); animation:sg-pulse 1s infinite; }
#tab-racket .hm-sg.sg-done .hm-sg-dot { background:#22c55e; }
#tab-racket .hm-sg.sg-skip .hm-sg-dot { background:#cbd0cd; }
#tab-racket .hm-sg.sg-skip { opacity:.5; }
#tab-racket .hm-sg.sg-fail .hm-sg-dot { background:#ef4444; }
#tab-racket .hm-sg-dot { width:6px; height:6px; border-radius:50%; background:#cbd0cd; flex-shrink:0; }
#tab-racket .hm-sg-disp { font-size:8px; opacity:.8; margin-left:2px; }
@keyframes sg-pulse { 0%,100% { opacity:1; } 50% { opacity:.3; } }
#tab-racket .hm-ds-refresh { flex-shrink:0; display:flex; align-items:center; gap:3px; font-size:11px; color:#6b7280; font-weight:600; padding:4px 8px; background:#f2f4f3; border-radius:12px; cursor:pointer; }
#tab-racket .hm-ds-refresh .ic-refresh-sm { width:13px; height:13px; background-repeat:no-repeat; background-position:center; background-size:contain; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%236b7280%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2012a8%208%200%200%201%2014-5l2%202M20%2012a8%208%200%200%201-14%205l-2-2%22%2F%3E%3Cpath%20d%3D%22M18%204v5h-5M6%2020v-5h5%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .hm-ds-load { font-size:11px; color:var(--brand); margin:6px 10px 0; min-height:14px; }

/* 品牌金刚区 */
#tab-racket .hm-kong { background:#fff; margin:-10px 10px 0; border-radius:12px; padding:12px 8px 9px; position:relative; z-index:3; box-shadow:0 4px 12px rgba(14,122,83,.10); }
#tab-racket .hm-kong-h { display:flex; align-items:center; justify-content:space-between; padding:0 4px 8px; }
#tab-racket .hm-kt { display:flex; align-items:center; gap:6px; font-size:14px; font-weight:800; color:#1f2a24; }
#tab-racket .hm-kbar { width:4px; height:14px; background:var(--brand); border-radius:2px; }
#tab-racket .hm-kmore { font-size:11px; color:#9aa0a6; }
#tab-racket .hm-kong-grid { display:flex; flex-wrap:wrap; }
#tab-racket .hm-kong-i { width:20%; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; gap:5px; padding:7px 2px; cursor:pointer; }
#tab-racket .hm-kong-pill { width:60px; height:60px; border-radius:12px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:4px; box-sizing:border-box; border:1px solid #D9D9D9; box-shadow:0 1px 4px rgba(0,0,0,.08); }
#tab-racket .hm-kong-pill.all { background:#f0f3f7; color:#6b7280; }
#tab-racket .hm-kong-ab { font-size:17px; font-weight:900; color:var(--brand); }
#tab-racket .hm-kong-pt { font-size:11px; line-height:1.2; text-align:center; white-space:normal; word-break:break-word; color:inherit; }
#tab-racket .hm-kong-pc { font-size:10px; line-height:1; opacity:.8; color:inherit; }

/* 通用区块标题 */
#tab-racket .hm-sec { margin-top:12px; }
#tab-racket .hm-sec-h { display:flex; align-items:center; justify-content:space-between; padding:0 12px 7px; }
#tab-racket .hm-sec-t { display:flex; align-items:center; gap:6px; font-size:14px; font-weight:800; color:#1f2a24; }
#tab-racket .hm-sbar { width:4px; height:14px; background:var(--accent); border-radius:2px; }
#tab-racket .hm-em { font-style:normal; font-size:10px; color:var(--china); background:rgba(255,111,0,.10); padding:1px 6px; border-radius:10px; font-weight:600; }
#tab-racket .hm-sec-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
#tab-racket .hm-sec-filter { flex-shrink:0; display:flex; align-items:center; gap:3px; font-size:11px; color:#6b7280; font-weight:600; padding:4px 8px; background:#f2f4f3; border-radius:12px; cursor:pointer; }
#tab-racket .hm-sec-filter .ic-filter-sm { width:12px; height:12px; background-repeat:no-repeat; background-position:center; background-size:contain; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%236b7280%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205h16l-6%206.5V19l-4%202v-9.5L4%205z%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .hm-sec-my { flex-shrink:0; font-size:11px; color:var(--brand); font-weight:700; padding:4px 8px; background:var(--brand-bg); border-radius:12px; cursor:pointer; }

/* 热门测评榜横滑 */
#tab-racket .hm-hscroll { white-space:nowrap; padding:0 10px 8px; overflow-x:auto; }
#tab-racket .hm-rankcard { display:inline-block; width:112px; height:180px; background:#fff; border-radius:10px; margin-right:8px; box-shadow:0 2px 8px rgba(0,0,0,.05); overflow:hidden; vertical-align:top; cursor:pointer; }
#tab-racket .hm-rank-top { height:56px; background:linear-gradient(135deg, var(--brand-bg), #dff0e7); display:flex; align-items:center; justify-content:center; position:relative; }
#tab-racket .hm-rank-no { position:absolute; left:6px; top:5px; font-size:10px; font-weight:900; color:#fff; background:linear-gradient(135deg,#ff8a3c,#ff5a3c); padding:2px 7px; border-radius:0 8px 8px 8px; }
#tab-racket .hm-rank-no.n2 { background:linear-gradient(135deg,#7fa9ff,#4d7bff); }
#tab-racket .hm-rank-no.n3 { background:linear-gradient(135deg,#9ad3b8,#5bbf8f); }
#tab-racket .hm-rk-racket { width:18px; }
#tab-racket .hm-rk-racket .head { width:18px; height:22px; border:2px solid currentColor; border-radius:50%; box-sizing:border-box; }
#tab-racket .hm-rk-racket .neck { width:2px; height:10px; background:currentColor; margin:0 auto; }
#tab-racket .hm-rk-racket .grip { width:8px; height:8px; background:currentColor; margin:0 auto; border-radius:0 0 2px 2px; }
#tab-racket .hm-rank-b { padding:7px 8px 8px; }
#tab-racket .hm-rank-brand { display:block; font-size:10px; color:inherit; }
#tab-racket .hm-rank-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:12px; font-weight:700; color:#1f2a24; margin-top:1px; white-space:normal; word-break:break-word; line-height:1.3; }
#tab-racket .hm-rank-meta { display:flex; align-items:baseline; justify-content:space-between; margin-top:5px; }
#tab-racket .hm-rank-cnt { font-size:10px; color:#9aa0a6; }
#tab-racket .hm-rank-dims7 { display:flex; flex-wrap:wrap; margin-top:5px; gap:3px 0; }
#tab-racket .hm-d7 { width:25%; display:flex; flex-direction:column; align-items:center; gap:1px; }
#tab-racket .hm-d7-l { font-size:9px; color:#9aa0a6; line-height:1.1; }
#tab-racket .hm-d7-v { font-size:11px; font-weight:800; color:#1f2a24; }
#tab-racket .hm-d7-v.score-green { color:var(--seed); }
#tab-racket .hm-d7-v.score-blue { color:#9aa0a6; }
#tab-racket .hm-d7-v.score-red { color:var(--danger); }

/* Tab + 双列瀑布 */
#tab-racket .hm-tabbar { display:flex; gap:15px; padding:12px 14px 4px; }
#tab-racket .hm-tab { font-size:14px; color:#6b7280; position:relative; padding-bottom:4px; cursor:pointer; }
#tab-racket .hm-tab.on { color:#1f2a24; font-weight:800; font-size:15px; }
#tab-racket .hm-tab.on::after { content:''; position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:20px; height:3px; background:var(--accent); border-radius:2px; }
#tab-racket .hm-waterfall { display:flex; flex-wrap:wrap; padding:6px 7px 15px; }
#tab-racket .hm-wcard { position:relative; width:calc(50% - 6px); margin:3px; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,.05); cursor:pointer; }
#tab-racket .hm-wcover { height:62px; background:linear-gradient(135deg, var(--brand-bg), #e2f1e9); position:relative; display:flex; align-items:center; justify-content:center; }
#tab-racket .hm-wcover.v1 { background:linear-gradient(135deg,#eaf2ff,#dbe9ff); }
#tab-racket .hm-wcover.v2 { background:linear-gradient(135deg,#fff3e6,#ffe6cc); }
#tab-racket .hm-wtag { position:absolute; left:6px; top:6px; font-size:9px; font-weight:800; color:#fff; padding:2px 6px; border-radius:7px; background:var(--china); }
#tab-racket .hm-wk-racket { width:22px; }
#tab-racket .hm-wk-racket .head { width:22px; height:27px; border:2px solid var(--brand); border-radius:50%; box-sizing:border-box; }
#tab-racket .hm-wk-racket.v1 .head { border-color:var(--atp); }
#tab-racket .hm-wk-racket.v2 .head { border-color:var(--china); }
#tab-racket .hm-wk-racket .neck { width:2px; height:12px; background:var(--brand); margin:0 auto; }
#tab-racket .hm-wk-racket.v1 .neck { background:var(--atp); }
#tab-racket .hm-wk-racket.v2 .neck { background:var(--china); }
#tab-racket .hm-wk-racket .grip { width:9px; height:9px; background:var(--brand); margin:0 auto; border-radius:0 0 2px 2px; }
#tab-racket .hm-wk-racket.v1 .grip { background:var(--atp); }
#tab-racket .hm-wk-racket.v2 .grip { background:var(--china); }
#tab-racket .hm-wb { padding:8px 9px 9px; }
#tab-racket .hm-wbrand { display:block; font-size:10px; }
#tab-racket .hm-wname { display:block; font-size:13px; font-weight:700; color:#1f2a24; margin-top:1px; white-space:normal; word-break:break-word; line-height:1.32; }
#tab-racket .hm-wbars { margin-top:7px; display:flex; flex-direction:column; gap:4px; }
#tab-racket .hm-wline { display:flex; align-items:center; gap:5px; }
#tab-racket .hm-wlb { font-size:10px; color:#9aa0a6; width:12px; flex-shrink:0; }
#tab-racket .hm-wtrack { flex:1; height:5px; background:#eef1f0; border-radius:3px; overflow:hidden; }
#tab-racket .hm-wfill { height:100%; border-radius:3px; }
#tab-racket .hm-wfill.f-power { background:var(--danger); }
#tab-racket .hm-wfill.f-spin { background:var(--atp); }
#tab-racket .hm-wfill.f-control { background:var(--seed); }
#tab-racket .hm-wval { font-size:10px; font-weight:700; color:#6b7280; width:20px; text-align:right; flex-shrink:0; }
#tab-racket .hm-wfoot { display:flex; align-items:center; justify-content:space-between; margin-top:8px; }
#tab-racket .hm-wcnt { font-size:10px; color:#9aa0a6; }
#tab-racket .hm-whl { display:flex; align-items:center; gap:4px; margin-top:7px; font-size:11px; font-weight:700; color:var(--brand); background:var(--brand-bg); padding:4px 8px; border-radius:10px; align-self:flex-start; }
#tab-racket .hm-whl-bar { width:3px; height:11px; border-radius:2px; background:var(--accent); }
#tab-racket .hm-wadd-corner { position:absolute; top:6px; right:6px; z-index:6; display:flex; align-items:center; gap:3px; padding:4px 8px; border-radius:13px; background:rgba(255,255,255,.92); border:1px solid var(--brand); color:var(--brand); font-size:10px; font-weight:700; box-shadow:0 1px 4px rgba(14,122,83,.12); cursor:pointer; }
#tab-racket .hm-wadd-corner.on { background:var(--brand); color:#fff; border-color:var(--brand); }
#tab-racket .hm-wadd-below { position:absolute; top:23px; left:6px; z-index:6; display:flex; align-items:center; gap:3px; padding:4px 7px; border-radius:12px; background:rgba(255,255,255,.92); border:1px solid var(--brand); color:var(--brand); font-size:10px; font-weight:700; box-shadow:0 1px 4px rgba(14,122,83,.12); cursor:pointer; }
#tab-racket .hm-wadd-below.on { background:var(--brand); color:#fff; border-color:var(--brand); }
#tab-racket .hm-add-ic { position:relative; width:11px; height:11px; }
#tab-racket .hm-add-ic.plus::before, #tab-racket .hm-add-ic.plus::after { content:""; position:absolute; background:currentColor; border-radius:2px; }
#tab-racket .hm-add-ic.plus::before { left:2px; right:2px; top:50%; height:2px; transform:translateY(-50%); }
#tab-racket .hm-add-ic.plus::after { top:2px; bottom:2px; left:50%; width:2px; transform:translateX(-50%); }
#tab-racket .hm-add-ic.check::before { content:""; position:absolute; left:3px; top:1px; width:4px; height:6px; border:solid currentColor; border-width:0 2px 2px 0; transform:rotate(45deg); }
#tab-racket .hm-wadd-txt { line-height:1; }

/* 悬浮对比车 FAB */
#tab-racket .hm-fab-cart { position:fixed; right:30px; bottom:74px; width:48px; height:48px; border-radius:50%; background:var(--brand); box-shadow:0 4px 12px rgba(14,122,83,.35); display:flex; align-items:center; justify-content:center; z-index:40; cursor:pointer; }
#tab-racket .hm-fab-cart .fab-plus { position:relative; width:22px; height:22px; }
#tab-racket .hm-fab-cart .fab-plus::before, #tab-racket .hm-fab-cart .fab-plus::after { content:""; position:absolute; background:#fff; border-radius:2px; }
#tab-racket .hm-fab-cart .fab-plus::before { left:4px; right:4px; top:50%; height:3px; transform:translateY(-50%); }
#tab-racket .hm-fab-cart .fab-plus::after { top:4px; bottom:4px; left:50%; width:3px; transform:translateX(-50%); }
#tab-racket .hm-fab-badge { position:absolute; top:-3px; right:-3px; min-width:17px; height:17px; line-height:17px; text-align:center; background:var(--danger); color:#fff; font-size:10px; font-weight:800; border-radius:9px; padding:0 4px; box-sizing:border-box; }

/* ========== 分层浏览列表 ========== */
#tab-racket .browse-list { padding:10px 15px; }
#tab-racket .browse-item { display:flex; justify-content:space-between; align-items:center; background:#fff; border-radius:8px; padding:14px 15px; margin-bottom:8px; box-shadow:0 1px 4px rgba(16,40,30,.08); cursor:pointer; }
#tab-racket .browse-item:hover { box-shadow:0 2px 8px rgba(14,122,83,.12); }
#tab-racket .series-info, #tab-racket .year-info { display:flex; justify-content:space-between; align-items:center; flex:1; }
#tab-racket .series-name, #tab-racket .year-name { font-size:16px; font-weight:500; color:var(--text); }
#tab-racket .series-count, #tab-racket .year-count { font-size:13px; color:#9CA3AF; background:var(--bg); padding:2px 8px; border-radius:8px; margin-left:8px; white-space:nowrap; }
#tab-racket .review-count-inline { font-size:12px; color:var(--brand); margin-left:4px; }
#tab-racket .arrow { font-size:18px; color:#9CA3AF; margin-left:8px; }
#tab-racket .result-header { font-size:13px; color:#9CA3AF; margin-bottom:8px; }

/* ========== 球拍卡片 ========== */
#tab-racket .racquet-card { background:#fff; border-radius:8px; padding:12px; margin-bottom:8px; box-shadow:0 1px 4px rgba(16,40,30,.08); cursor:pointer; }
#tab-racket .racquet-card:hover { box-shadow:0 2px 8px rgba(14,122,83,.12); }
#tab-racket .card-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
#tab-racket .racquet-name { font-size:15px; font-weight:bold; color:var(--text); flex:1; }
#tab-racket .card-actions { display:flex; gap:10px; }
#tab-racket .action-icon { width:24px; height:24px; border-radius:50%; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; cursor:pointer; color:#9CA3AF; font-size:13px; }
#tab-racket .action-icon.active { background:var(--brand); color:#fff; border-color:var(--brand); }
#tab-racket .action-icon .ic-check::before { content:'✓'; }
#tab-racket .action-icon .ic-plus::before { content:'＋'; }
#tab-racket .card-spec { font-size:12px; color:#9CA3AF; line-height:1.5; }
#tab-racket .card-scores { font-size:12px; margin-bottom:4px; display:flex; justify-content:space-between; align-items:center; }
#tab-racket .scores-left, #tab-racket .scores-right { flex:none; }
#tab-racket .score-power { color:var(--danger); }
#tab-racket .score-spin { color:var(--atp); }
#tab-racket .score-control { color:var(--seed); }
#tab-racket .score-sep { color:#9CA3AF; }
#tab-racket .score-player { color:var(--text); }
#tab-racket .score-player-num { font-weight:bold; color:var(--text); }
#tab-racket .review-count-blue { color:var(--brand); }

/* ========== 详情页 ========== */
#tab-racket .detail-scroll { padding-bottom:15px; }
#tab-racket .detail-hero { background:linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%); padding:20px 15px 18px; display:flex; flex-direction:column; align-items:center; text-align:center; }
#tab-racket .detail-hero .detail-brand { color:rgba(255,255,255,.85); font-size:13px; }
#tab-racket .detail-hero .detail-model { color:#fff; font-size:22px; margin-top:3px; font-weight:800; }
#tab-racket .hero-divider { width:32px; height:2px; background:var(--accent); border-radius:1px; margin:10px 0 6px; }
#tab-racket .hero-sub { color:rgba(255,255,255,.72); font-size:11px; }
#tab-racket .detail-source { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; padding-bottom:6px; border-bottom:1px solid var(--border); }
#tab-racket .source-label { font-size:11px; color:#9CA3AF; }
#tab-racket .detail-card { background:#fff; border-radius:8px; padding:12px; margin-bottom:10px; box-shadow:0 1px 6px rgba(16,40,30,.08); }
#tab-racket .card-title { font-size:16px; font-weight:bold; color:var(--text); margin-bottom:10px; padding-bottom:6px; border-bottom:2px solid var(--brand); display:flex; justify-content:space-between; align-items:center; }
#tab-racket .translate-hint { font-size:12px; font-weight:normal; color:var(--brand); cursor:pointer; }
#tab-racket .spec-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
#tab-racket .spec-item { display:flex; justify-content:space-between; align-items:center; }
#tab-racket .spec-label { font-size:13px; color:#9CA3AF; }
#tab-racket .spec-value { font-size:13px; font-weight:500; color:var(--text); }
#tab-racket .desc-text { font-size:13px; color:#6B7280; line-height:1.6; }
#tab-racket .player-list { display:flex; flex-direction:column; gap:4px; margin-top:5px; }
#tab-racket .player-group { font-size:13px; line-height:1.6; }
#tab-racket .player-cat { font-weight:bold; color:var(--text); }
#tab-racket .player-names { color:#6B7280; }
#tab-racket .action-buttons { display:flex; gap:10px; margin-top:10px 0 30px; }
#tab-racket .btn-review, #tab-racket .btn-compare { flex:1; padding:12px 0; border-radius:22px; font-size:15px; border:none; cursor:pointer; font-weight:600; }
#tab-racket .btn-review { background:var(--brand); color:#fff; }
#tab-racket .btn-review.disabled { opacity:.55; cursor:not-allowed; }
#tab-racket .btn-compare { background:var(--brand); color:#fff; }
#tab-racket .btn-compare.active { background:#9CA3AF; color:#fff; }

/* ========== 用户测评汇总：图例 + 维度Tab + 轴 ========== */
#tab-racket .legend { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; padding-bottom:6px; border-bottom:1px solid var(--border); }
#tab-racket .legend-item { display:flex; align-items:center; font-size:11px; color:#6B7280; margin-right:4px; }
#tab-racket .lg-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:3px; flex-shrink:0; }
#tab-racket .lg-dot.lg-user { background:var(--brand); }
#tab-racket .lg-dot.lg-avg { background:var(--danger); }
#tab-racket .lg-dot.lg-med { background:var(--atp); }
#tab-racket .dim-tabs { padding:1px 5px 0; background:var(--bg); }
#tab-racket .dim-tab-row { display:flex; gap:5px; margin-bottom:5px; }
#tab-racket .dim-tab { flex:1; text-align:center; padding:6px 0; border-radius:12px; background:#E5E7EB; font-size:12px; color:#9CA3AF; font-weight:bold; cursor:pointer; }
#tab-racket .dim-tab.score-green { background:var(--seed-bg); color:var(--seed); }
#tab-racket .dim-tab.score-blue { background:var(--atp-bg); color:var(--atp); }
#tab-racket .dim-tab.score-red { background:rgba(231,76,60,.10); color:var(--danger); }
#tab-racket .dim-tab.active.score-green { color:var(--brand-dark); text-decoration:underline; font-size:14px; }
#tab-racket .dim-tab.active.score-blue { color:var(--atp); text-decoration:underline; font-size:14px; }
#tab-racket .dim-tab.active.score-red { color:#d32f2f; text-decoration:underline; font-size:14px; }
#tab-racket .dim-tab-empty { visibility:hidden; }
#tab-racket .axis-list { display:flex; flex-direction:column; gap:2px; }
#tab-racket .axis-fixed { height:330px; }
#tab-racket .sub-axis { display:flex; align-items:flex-start; gap:4px; padding:0; }
#tab-racket .sub-axis-label { font-size:12px; font-weight:bold; color:var(--text); min-width:40px; padding-top:3px; flex-shrink:0; }
#tab-racket .sub-axis-track { flex:1; position:relative; min-height:60px; padding-top:6px; }
#tab-racket .sub-axis-line { position:absolute; top:7px; left:0; height:2px; background:#E5E7EB; border-radius:1px; }
#tab-racket .sub-axis-ticks { position:absolute; top:6px; left:0; right:0; height:8px; }
#tab-racket .sub-tick { position:absolute; width:1px; height:7px; background:#9CA3AF; transform:translateX(-50%); }
#tab-racket .sub-axis-opt-labels { position:absolute; top:15px; left:0; right:0; bottom:20px; }
#tab-racket .sub-opt-label { position:absolute; font-size:9px; color:#9CA3AF; white-space:normal; line-height:1.4; word-break:break-all; overflow:hidden; }
#tab-racket .sub-opt-first { transform:translateX(0); text-align:left; }
#tab-racket .sub-opt-mid { transform:translateX(-50%); text-align:center; }
#tab-racket .sub-opt-last { transform:translateX(-100%); text-align:right; }
#tab-racket .opt-med { color:var(--atp); }
#tab-racket .sub-axis-dots { position:absolute; top:0; left:0; right:0; height:14px; }
#tab-racket .sub-dot-css { position:absolute; top:2px; transform:translateX(-50%); z-index:3; }
#tab-racket .sub-dot-css.sub-dot-user { width:9px; height:9px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 2px rgba(14,122,83,.18); }
#tab-racket .sub-dot-css.sub-dot-avg { width:8px; height:8px; border-radius:2px; background:var(--danger); }
#tab-racket .sub-dot-css.sub-dot-med { width:7px; height:7px; top:3px; background:var(--atp); transform:translateX(-50%) rotate(45deg); }
#tab-racket .sub-axis-answer { position:absolute; top:-10px; transform:translateX(-50%); font-size:9px; color:var(--brand); font-weight:bold; background:transparent; padding:0; border-radius:2px; white-space:nowrap; }

/* ========== 我的球拍 ========== */
#tab-racket .del-my-btn { background:var(--brand-soft); color:var(--brand); border:1px solid var(--brand); border-radius:16px; padding:4px 12px; font-size:12px; cursor:pointer; }
#tab-racket .delete-all-btn-wrapper { margin-top:20px; padding:0 15px 30px; }
#tab-racket .delete-all-btn { width:100%; background:#fff; color:var(--danger); border:1px solid var(--danger); border-radius:22px; font-size:14px; height:44px; line-height:44px; text-align:center; padding:0; cursor:pointer; }
#tab-racket .delete-all-btn:hover { background:rgba(231,76,60,.10); }
#tab-racket .empty-hint { display:block; font-size:12px; margin-top:8px; color:#9CA3AF; }

/* ========== 对比车抽屉 ========== */
#tab-racket .drawer-mask { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:1000; }
#tab-racket .drawer { position:fixed; top:0; right:0; bottom:0; width:70%; max-width:280px; background:#fff; z-index:1001; transform:translateX(100%); transition:transform .3s ease; display:flex; flex-direction:column; }
#tab-racket .drawer-open { transform:translateX(0); }
#tab-racket .drawer-header { display:flex; justify-content:space-between; align-items:center; padding:15px; border-bottom:1px solid var(--border); background:#fff; }
#tab-racket .drawer-title { font-size:16px; font-weight:bold; color:var(--text); }
#tab-racket .drawer-close { width:20px; height:20px; background-repeat:no-repeat; background-position:center; background-size:contain; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239CA3AF%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228%22%2F%3E%3Cpath%20d%3D%22M9%209l6%206M15%209l-6%206%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .drawer-body { flex:1; padding:0 15px; overflow-y:auto; }
#tab-racket .cart-item { display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid var(--border); }
#tab-racket .cart-item-info { flex:1; }
#tab-racket .cart-item-name { font-size:14px; font-weight:500; color:var(--text); display:block; word-break:break-word; }
#tab-racket .cart-item-spec { font-size:12px; color:#9CA3AF; margin-top:4px; display:block; }
#tab-racket .cart-remove { color:var(--danger); font-size:13px; padding:0 0 0 12px; display:flex; align-items:center; cursor:pointer; }
#tab-racket .empty-cart { text-align:center; padding:40px 0; color:#9CA3AF; }
#tab-racket .drawer-footer { padding:10px 15px 20px; border-top:1px solid var(--border); display:flex; gap:10px; }
#tab-racket .clear-btn { flex:1; background:var(--bg); color:#6B7280; border-radius:22px; font-size:14px; border:none; display:flex; align-items:center; justify-content:center; height:40px; cursor:pointer; }
#tab-racket .compare-btn { flex:1; background:var(--brand); color:#fff; border-radius:22px; font-size:14px; border:none; display:flex; align-items:center; justify-content:center; height:40px; cursor:pointer; }
#tab-racket .compare-btn.disabled { background:#9CA3AF; opacity:.6; }

/* ========== 弹窗通用 ========== */
#tab-racket .modal { position:fixed; top:0; left:0; right:0; bottom:0; z-index:1000; }
#tab-racket .modal-mask { position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); }
#tab-racket .modal-content { position:relative; background:#fff; border-radius:12px; width:90%; max-height:85vh; overflow:hidden; display:flex; flex-direction:column; margin:0 auto; top:50%; transform:translateY(-50%); }
#tab-racket .modal-header { display:flex; justify-content:space-between; align-items:center; padding:15px 15px 10px; border-bottom:1px solid var(--border); }
#tab-racket .modal-title { font-size:16px; font-weight:bold; color:var(--text); }
#tab-racket .modal-close { width:20px; height:20px; background-repeat:no-repeat; background-position:center; background-size:contain; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239CA3AF%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228%22%2F%3E%3Cpath%20d%3D%22M9%209l6%206M15%209l-6%206%22%2F%3E%3C%2Fsvg%3E"); }
#tab-racket .modal-body { flex:1; padding:10px 15px; overflow-y:auto; }
#tab-racket .modal-footer { display:flex; gap:8px; padding:10px 15px 15px; border-top:1px solid var(--border); }
#tab-racket .cancel-btn, #tab-racket .confirm-btn { flex:1; border-radius:22px; font-size:14px; border:none; display:flex; align-items:center; justify-content:center; height:40px; cursor:pointer; }
#tab-racket .cancel-btn { background:var(--bg); color:#6B7280; }
#tab-racket .confirm-btn { background:var(--brand); color:#fff; }

/* ========== 筛选弹窗 ========== */
#tab-racket .filter-modal { width:90%; }
#tab-racket .filter-scroll-body { max-height:60vh; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:10px 15px; }
#tab-racket .filter-group { margin-bottom:15px; }
#tab-racket .filter-title { font-size:14px; font-weight:bold; color:var(--text); margin-bottom:8px; }
#tab-racket .filter-hint { font-size:12px; color:#9CA3AF; margin-top:6px; display:block; }
#tab-racket .filter-options { display:flex; flex-wrap:wrap; gap:6px; }
#tab-racket .filter-tag { background:var(--bg); padding:8px 14px; border-radius:16px; font-size:13px; color:#6B7280; border:1px solid transparent; text-align:center; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; }
#tab-racket .filter-tag.active { background:var(--brand); color:#fff; border-color:var(--brand); }
#tab-racket .filter-range { display:flex; align-items:center; gap:8px; }
#tab-racket .range-sep { font-size:14px; color:#9CA3AF; flex-shrink:0; width:20px; text-align:center; }
#tab-racket .range-input { flex:1; background:var(--bg); padding:0 8px; border-radius:6px; font-size:13px; text-align:center; height:40px; line-height:40px; box-sizing:border-box; min-height:40px; border:1px solid var(--border); }
#tab-racket .text-input { width:100%; background:var(--bg); padding:0 12px; border-radius:6px; font-size:14px; height:40px; line-height:40px; box-sizing:border-box; border:1px solid var(--border); }
#tab-racket .filter-footer { display:flex; gap:10px; padding:10px 15px 15px; border-top:1px solid var(--border); }
#tab-racket .filter-footer .reset-btn { flex:1; background:var(--bg); color:#6B7280; border-radius:22px; font-size:14px; border:none; height:40px; line-height:40px; cursor:pointer; }
#tab-racket .filter-footer .confirm-btn { flex:1; background:var(--brand); color:#fff; border-radius:22px; font-size:14px; border:none; height:40px; line-height:40px; cursor:pointer; }

/* ========== 测评弹窗 ========== */
#tab-racket .review-modal { width:90%; height:auto; max-height:88vh; display:flex; flex-direction:column; }
#tab-racket .progress-bar { position:relative; background:#E5E7EB; height:4px; margin:10px 15px; border-radius:2px; flex-shrink:0; }
#tab-racket .progress-fill { height:100%; background:var(--brand); border-radius:2px; }
#tab-racket .progress-text { position:absolute; right:0; top:-15px; font-size:12px; color:#6B7280; }
#tab-racket .question-card { padding:15px; text-align:center; flex:1; overflow-y:auto; min-height:0; }
#tab-racket .question-text { font-size:17px; font-weight:bold; color:var(--text); display:block; margin-bottom:20px; line-height:1.4; }
#tab-racket .question-options { display:flex; flex-direction:column; gap:8px; }
#tab-racket .question-option { background:var(--bg); padding:10px; border-radius:30px; font-size:14px; color:var(--text); text-align:center; cursor:pointer; }
#tab-racket .question-option.selected { background:var(--brand); color:#fff; }
#tab-racket .delete-action { padding:0 15px 15px; border-top:1px solid var(--border); padding-top:10px; }
#tab-racket .delete-btn { width:100%; background:#fff; color:var(--danger); border:1px solid var(--danger); border-radius:22px; font-size:14px; height:40px; line-height:40px; text-align:center; padding:0; cursor:pointer; }
#tab-racket .question-actions { display:flex; gap:8px; padding:10px 15px 15px; flex-shrink:0; }
#tab-racket .prev-btn, #tab-racket .skip-btn, #tab-racket .next-btn { flex:1; padding:0; border-radius:22px; font-size:14px; border:none; height:40px; line-height:40px; cursor:pointer; }
#tab-racket .prev-btn { background:var(--bg); color:#6B7280; }
#tab-racket .prev-btn[disabled] { opacity:.5; }
#tab-racket .skip-btn { background:var(--brand); color:#fff; }
#tab-racket .next-btn { background:var(--brand); color:#fff; }

/* ========== 对比结果弹窗 ========== */
#tab-racket .compare-result-modal { width:95%; max-height:85vh; }
#tab-racket .compare-table { min-width:100%; display:flex; flex-direction:column; }
#tab-racket .compare-row { display:flex; border-bottom:1px solid var(--border); min-height:40px; }
#tab-racket .header-row { background:var(--bg); position:sticky; top:0; }
#tab-racket .compare-cell { padding:8px 6px; font-size:13px; word-break:break-word; white-space:normal; word-wrap:break-word; }
#tab-racket .label-cell { width:90px; background:var(--bg); font-weight:bold; color:var(--text); flex-shrink:0; display:flex; align-items:center; }
#tab-racket .value-cell { min-width:100px; max-width:125px; flex-shrink:0; text-align:center; color:#6B7280; display:flex; align-items:center; justify-content:center; flex-direction:column; word-break:break-word; white-space:normal; word-wrap:break-word; }
#tab-racket .compare-racquet-name { font-size:12px; font-weight:bold; color:var(--text); display:block; word-break:break-word; white-space:normal; word-wrap:break-word; line-height:1.4; max-width:100%; text-align:center; }

/* 通用空状态（细调，优先用全局 .empty-state/.empty-tip） */
#tab-racket .empty-tip { color:#999; font-size:14px; padding:24px 0; text-align:center; line-height:1.6; }