/* ============================================================================
 * Jiguang Radar / 激光雷达 — 页面样式 (仅 /radar 加载)
 * 视觉系统: 电光蓝 #00d4ff / 激光紫 #8b5cf6 / 荧光青 #10b981 / 深蓝黑背景
 * 该页独立深色主题, 不影响全站 Bitget Light 设计.
 * ==========================================================================*/

.radar-root {
  --r-blue: #00d4ff;
  --r-purple: #8b5cf6;
  --r-cyan: #10b981;
  --r-red: #ff3b3b;
  --r-amber: #fbbf24;
  --r-bg: #070b18;
  --r-bg2: #0d1426;
  --r-card: rgba(18, 26, 48, 0.78);
  --r-border: rgba(0, 212, 255, 0.18);
  --r-border2: rgba(139, 92, 246, 0.22);
  --r-text: #e6edf6;
  --r-sub: #94a3b8;
}

/* 整页深色背景 (覆盖全站浅色 body 在本页的观感) */
.radar-page {
  position: relative;
  min-height: 100vh;
  padding: 18px 16px 96px;
  background:
    radial-gradient(900px 500px at 12% -8%, rgba(0, 212, 255, 0.16), transparent 60%),
    radial-gradient(800px 460px at 92% 4%, rgba(139, 92, 246, 0.18), transparent 60%),
    linear-gradient(180deg, #070b18 0%, #0a1020 55%, #070b18 100%);
  color: var(--r-text);
  font-family: 'Inter', system-ui, sans-serif;
}

/* ── 页头 ── */
.radar-header { max-width: 1320px; margin: 0 auto 18px; }
.radar-header-inner { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.radar-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 700;
  color: var(--r-blue); background: rgba(0, 212, 255, 0.12);
  border: 1px solid var(--r-border); margin-bottom: 8px;
}
.radar-title { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 0; }
.radar-title-en {
  font-size: 30px; font-weight: 800; letter-spacing: -0.5px;
  background: linear-gradient(90deg, #00d4ff, #8b5cf6 70%, #10b981);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.radar-title-cn { font-size: 20px; font-weight: 700; color: var(--r-text); opacity: 0.92; }
.radar-title-sep { font-size: 20px; font-weight: 700; color: var(--r-sub); opacity: 0.7; }
.radar-subtitle { margin: 6px 0 0; color: var(--r-sub); font-size: 13px; max-width: 640px; }
.radar-header-actions { display: flex; align-items: center; gap: 10px; }
.radar-demo-pill {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; color: var(--r-amber);
  background: rgba(251, 191, 36, 0.1); border: 1px solid rgba(251, 191, 36, 0.3);
}
.radar-icon-btn {
  width: 38px; height: 38px; border-radius: 10px; cursor: pointer;
  color: var(--r-blue); background: rgba(0, 212, 255, 0.1); border: 1px solid var(--r-border);
  transition: all 0.2s;
}
.radar-icon-btn:hover { background: rgba(0, 212, 255, 0.2); transform: rotate(60deg); }

/* ── ① Ticker ── */
.radar-ticker {
  display: flex; gap: 10px; overflow-x: auto; margin-top: 16px; padding-bottom: 4px;
  scrollbar-width: thin;
}
.radar-ticker::-webkit-scrollbar { height: 4px; }
.radar-ticker::-webkit-scrollbar-thumb { background: rgba(0, 212, 255, 0.3); border-radius: 4px; }
.radar-ticker-item {
  flex: 0 0 auto; display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; border-radius: 12px; white-space: nowrap;
  background: var(--r-card); border: 1px solid var(--r-border); backdrop-filter: blur(8px);
}
.radar-ticker-item .rt-k { font-size: 11px; font-weight: 700; color: var(--r-sub); }
.radar-ticker-item .rt-v { font-size: 13px; font-weight: 800; color: var(--r-text); font-family: 'JetBrains Mono', monospace; }
.radar-ticker-item .rt-c { font-size: 12px; font-weight: 700; font-family: 'JetBrains Mono', monospace; }

/* ── 主网格 ── */
.radar-grid { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 1040px) { .radar-grid { grid-template-columns: 1.9fr 1fr; align-items: start; } }
.radar-col-main, .radar-col-side { display: flex; flex-direction: column; gap: 16px; }

/* ── 卡片 ── */
.radar-card {
  background: var(--r-card); border: 1px solid var(--r-border);
  border-radius: 16px; padding: 16px; backdrop-filter: blur(10px);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
.radar-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.radar-card-title { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 700; color: var(--r-text); }
.radar-card-title i { color: var(--r-blue); }
.radar-card-sub { font-size: 11px; color: var(--r-sub); }
.radar-live-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--r-cyan); font-weight: 700; }
.radar-live-dot .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--r-cyan); box-shadow: 0 0 8px var(--r-cyan); animation: radar-pulse 1.4s infinite; }
@keyframes radar-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

/* ── 图表容器 ── */
.radar-chart { width: 100%; height: 360px; }
.radar-chart-sm { height: 220px; }
.radar-gauge { height: 220px; }

/* ── 控制按钮组 ── */
.radar-controls { display: flex; gap: 10px; flex-wrap: wrap; }
.radar-btn-group { display: inline-flex; gap: 3px; padding: 3px; border-radius: 10px; background: rgba(0, 0, 0, 0.28); border: 1px solid var(--r-border); }
.radar-pill {
  padding: 5px 11px; border-radius: 7px; font-size: 12px; font-weight: 700; cursor: pointer;
  color: var(--r-sub); background: transparent; border: none; transition: all 0.18s;
}
.radar-pill:hover { color: var(--r-text); }
.radar-pill.active { color: #07101f; background: linear-gradient(90deg, var(--r-blue), var(--r-purple)); box-shadow: 0 0 12px rgba(0, 212, 255, 0.4); }

/* ── 激光信任摘要 chips ── */
.radar-trust-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.radar-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 600; color: var(--r-text);
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08);
  text-decoration: none;
}
.radar-chip-k { color: var(--r-sub); font-weight: 600; }
.radar-chip-v { font-weight: 800; font-family: 'JetBrains Mono', monospace; }
.radar-chip-swap { color: #07101f !important; background: linear-gradient(90deg, var(--r-cyan), var(--r-blue)); border-color: transparent; font-weight: 800; transition: transform 0.15s; }
.radar-chip-swap:hover { transform: translateY(-1px); }
.radar-chip-danger { color: var(--r-red); background: rgba(255, 59, 59, 0.12); border-color: rgba(255, 59, 59, 0.4); font-weight: 800; }

/* ── 信任表 ── */
.radar-trust-table-wrap { overflow-x: auto; margin-top: 8px; }
.radar-trust-table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 760px; }
.radar-trust-table thead th {
  text-align: left; padding: 9px 10px; color: var(--r-sub); font-weight: 700; font-size: 11px;
  border-bottom: 1px solid var(--r-border); white-space: nowrap;
}
.radar-trust-table tbody td { padding: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); white-space: nowrap; }
.radar-trust-table tbody tr:hover { background: rgba(0, 212, 255, 0.05); }
.radar-row-danger { background: rgba(255, 59, 59, 0.06); }
.radar-row-danger:hover { background: rgba(255, 59, 59, 0.1) !important; }
.rt-token { display: flex; flex-direction: column; }
.rt-sym { font-weight: 800; color: var(--r-text); font-family: 'JetBrains Mono', monospace; }
.rt-name { font-size: 10px; color: var(--r-sub); }
.rt-score { font-weight: 800; font-size: 14px; font-family: 'JetBrains Mono', monospace; }
.rt-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; border: 1px solid currentColor; }
.rt-yes { color: var(--r-cyan); font-weight: 700; }
.rt-no { color: var(--r-sub); }
.rt-action { text-align: right; }
.rt-act-btn { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 8px; font-size: 11px; font-weight: 800; text-decoration: none; transition: transform 0.15s; }
.rt-act-btn:hover { transform: translateY(-1px); }
.rt-act-swap { color: #07101f; background: linear-gradient(90deg, var(--r-cyan), var(--r-blue)); }
.rt-act-detect { color: #fff; background: linear-gradient(90deg, var(--r-red), #ff6b35); }
.radar-loading-cell { text-align: center; padding: 30px !important; color: var(--r-blue); }

/* ── Feed (巨鲸 / 大额) ── */
.radar-feed { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; scrollbar-width: thin; }
.radar-feed::-webkit-scrollbar { width: 4px; }
.radar-feed::-webkit-scrollbar-thumb { background: rgba(0, 212, 255, 0.3); border-radius: 4px; }
.radar-feed-large { max-height: 320px; }
.radar-feed-item {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 9px 11px; border-radius: 10px;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 12px; animation: radar-slide-in 0.4s ease;
}
.radar-feed-item.is-large { border-color: rgba(255, 59, 59, 0.35); background: rgba(255, 59, 59, 0.05); }
@keyframes radar-slide-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.rf-type { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; font-weight: 700; font-size: 11px; border: 1px solid currentColor; }
.rf-cur { font-weight: 800; color: var(--r-text); font-family: 'JetBrains Mono', monospace; }
.rf-usd { font-weight: 700; color: var(--r-blue); font-family: 'JetBrains Mono', monospace; }
.rf-large-tag { padding: 1px 7px; border-radius: 6px; font-size: 10px; font-weight: 800; color: #fff; background: var(--r-red); }
.rf-addr { color: var(--r-sub); font-size: 10px; font-family: 'JetBrains Mono', monospace; margin-left: auto; }
.rf-time { color: var(--r-sub); font-size: 10px; }

/* ── Roadmap ── */
.radar-roadmap { max-width: 1320px; margin: 18px auto 0; display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 720px) { .radar-roadmap { grid-template-columns: 1fr 1fr; } }
.radar-roadmap-item {
  display: flex; gap: 12px; padding: 14px 16px; border-radius: 14px;
  background: var(--r-card); border: 1px solid var(--r-border2);
}
.radar-roadmap-item.active { border-color: var(--r-border); box-shadow: 0 0 18px rgba(0, 212, 255, 0.12); }
.radar-roadmap-no {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  font-weight: 800; font-size: 14px; color: #07101f;
  background: linear-gradient(135deg, var(--r-blue), var(--r-purple));
}
.radar-roadmap-item strong { display: block; font-size: 14px; color: var(--r-text); margin-bottom: 3px; }
.radar-roadmap-item p { margin: 0; font-size: 12px; color: var(--r-sub); }

/* ── Toast ── */
.radar-toast-container { position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); z-index: 9999; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.radar-toast {
  padding: 10px 18px; border-radius: 10px; font-size: 13px; font-weight: 600; color: var(--r-text);
  background: rgba(13, 20, 38, 0.96); border: 1px solid var(--r-border);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4); opacity: 0; transform: translateY(10px); transition: all 0.3s;
}
.radar-toast.show { opacity: 1; transform: translateY(0); }

/* ── 移动端微调 ── */
@media (max-width: 640px) {
  .radar-title-en { font-size: 24px; }
  .radar-chart { height: 300px; }
  .radar-card { padding: 13px; }
}

/* ════════════════════════════════════════════════════════════════════════
 * §R8 Radar 去 Demo + 移动端完整展示 + 行情入口 + 白天模式 (2026-06-02)
 * ════════════════════════════════════════════════════════════════════════ */

/* ── R8.1 新按钮: 行情榜单 → /market + 数据监控 ── */
.radar-markets-btn {
  display: inline-flex; align-items: center; gap: 7px;
  height: 36px; padding: 0 14px; border-radius: 999px;
  font-size: 13px; font-weight: 800; text-decoration: none;
  color: #07101f; background: linear-gradient(90deg, var(--r-blue), var(--r-purple));
  box-shadow: 0 6px 16px rgba(0, 212, 255, 0.28);
  transition: transform 0.15s;
}
.radar-markets-btn:hover { transform: translateY(-1px); }
.radar-markets-btn .fa-arrow-right { font-size: 11px; }
.radar-monitor-pill {
  display: inline-flex; align-items: center; gap: 6px;
  height: 32px; padding: 0 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; color: var(--r-cyan);
  background: rgba(16, 185, 129, 0.12); border: 1px solid rgba(16, 185, 129, 0.3);
}

/* ── R8.2 "数据接入中" 占位 ── */
.radar-pending-host { display: flex !important; align-items: center; justify-content: center; }
.radar-pending {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; width: 100%; min-height: 160px; padding: 24px;
  color: var(--r-sub); text-align: center;
}
.radar-pending i { font-size: 30px; color: var(--r-blue); opacity: 0.75; }
.radar-pending-txt { font-size: 13px; font-weight: 700; letter-spacing: 0.3px; }
.radar-pending-cell { color: var(--r-blue) !important; font-weight: 700; }
.radar-chip-pending { color: var(--r-sub); }

/* ── R8.3 移动端完整展示: 单列 + 图表 100% + 不横向溢出 + padding-bottom 120 ── */
.radar-page { overflow-x: hidden; }
.radar-grid, .radar-header, .radar-ticker { max-width: 1320px; }
.radar-chart, .radar-card { max-width: 100%; }

@media (max-width: 1039px) {
  /* 强制单列, 右侧卡片纵向排列;
     minmax(0,1fr) 防止信任表 min-width:760px 把列撑破视口 (横向溢出根因) */
  .radar-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .radar-col-main, .radar-col-side { width: 100%; min-width: 0; }
}
@media (max-width: 768px) {
  .radar-page { padding: 14px 16px 124px !important; } /* 底部 ≥120px, 不被底栏遮挡 */
  .radar-header-inner { align-items: flex-start; }
  .radar-header-actions { width: 100%; gap: 8px; flex-wrap: wrap; }
  .radar-chart { height: 280px; }
  .radar-chart-sm, .radar-gauge { height: 240px; }
  .radar-card { padding: 16px; }
  /* 信任榜 / TVL 等超宽表格仅卡片内部横向滚动 */
  .radar-trust-table-wrap { overflow-x: auto; }
  /* tooltip 不被底栏遮挡: feed 最大高度收敛 */
  .radar-feed { max-height: 360px; }
  /* 移动端模块顺序: 价格图 → 市值+信任榜 → 数据监控入口网格 */
  .radar-col-main { display: flex; flex-direction: column; }
  #module-price      { order: 1; }
  #module-marketcap  { order: 2; }
  #module-monitor    { order: 3; }
}

/* ════════════════════════════════════════════════════════════════════════
 * §R8.LIGHT Radar 白天 / 白色模式 (跟随全站 html[data-theme="light"])
 * ════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .radar-root {
  --r-blue: #1E90FF;
  --r-purple: #2E6BF0;
  --r-cyan: #16A34A;
  --r-red: #DC2626;
  --r-amber: #D97706;
  --r-text: #0F172A;
  --r-sub: #64748B;
  --r-card: #FFFFFF;
  --r-border: #E2E8F0;
  --r-border2: #DBE4F3;
}
html[data-theme="light"] .radar-page {
  background:
    radial-gradient(900px 500px at 12% -8%, rgba(30, 144, 255, 0.08), transparent 60%),
    radial-gradient(800px 460px at 92% 4%, rgba(46, 107, 240, 0.06), transparent 60%),
    linear-gradient(180deg, #F4F7FD 0%, #F8FAFC 55%, #FFFFFF 100%);
  color: var(--r-text);
}
html[data-theme="light"] .radar-badge {
  color: #1E5FE6; background: #EAF3FF; border-color: #BFD8FF;
}
html[data-theme="light"] .radar-title-en {
  background: linear-gradient(90deg, #1E90FF, #2E6BF0 70%, #18AFFF);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
html[data-theme="light"] .radar-title-cn { color: #0F172A; opacity: 1; }
html[data-theme="light"] .radar-subtitle { color: #64748B; }
html[data-theme="light"] .radar-card {
  background: #FFFFFF; border: 1px solid #E8EEF7;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  backdrop-filter: none;
}
html[data-theme="light"] .radar-card-title { color: #0F172A; }
html[data-theme="light"] .radar-card-title i { color: #1E90FF; }
html[data-theme="light"] .radar-card-sub { color: #94A3B8; }
html[data-theme="light"] .radar-ticker-item {
  background: #FFFFFF; border: 1px solid #E8EEF7; backdrop-filter: none;
}
html[data-theme="light"] .radar-ticker-item .rt-k { color: #64748B; }
html[data-theme="light"] .radar-ticker-item .rt-v { color: #0F172A; }
html[data-theme="light"] .radar-btn-group {
  background: #F1F5FB; border: 1px solid #E2E8F0;
}
html[data-theme="light"] .radar-pill { color: #64748B; }
html[data-theme="light"] .radar-pill:hover { color: #0F172A; }
html[data-theme="light"] .radar-pill.active {
  color: #FFFFFF; background: linear-gradient(90deg, #1E90FF, #2E6BF0);
  box-shadow: 0 2px 8px rgba(30, 144, 255, 0.3);
}
html[data-theme="light"] .radar-monitor-pill {
  color: #16A34A; background: #E8F8EF; border-color: #B7E4C7;
}
html[data-theme="light"] .radar-icon-btn {
  color: #1E90FF; background: #EAF3FF; border: 1px solid #BFD8FF;
}
html[data-theme="light"] .radar-icon-btn:hover { background: #DCEBFF; }
html[data-theme="light"] .radar-pending { color: #64748B; }
html[data-theme="light"] .radar-pending i { color: #1E90FF; }
html[data-theme="light"] .radar-trust-table thead th { color: #64748B; border-bottom-color: #E2E8F0; }
html[data-theme="light"] .radar-trust-table tbody td { border-bottom-color: #EEF2F8; }
html[data-theme="light"] .radar-loading-cell { color: #1E90FF; }
html[data-theme="light"] .radar-feed-item {
  background: #F8FAFC; border: 1px solid #EEF2F8;
}
html[data-theme="light"] .radar-chip {
  color: #334155; background: #F1F5FB; border: 1px solid #E2E8F0;
}
html[data-theme="light"] .radar-chip-k { color: #64748B; }
html[data-theme="light"] .radar-toast {
  background: #FFFFFF; color: #0F172A; border: 1px solid #E2E8F0;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.14);
}

/* ════════════════════════════════════════════════════════════════════════
 * §R9 真实数据接入 — 信任榜行内样式 + chip 风险态 (深色默认 / 白天覆盖)
 * ════════════════════════════════════════════════════════════════════════ */
.radar-trust-table .rt-token { display: flex; flex-direction: column; gap: 2px; }
.rt-token-sym { font-weight: 800; color: var(--r-text); font-family: 'JetBrains Mono', monospace; font-size: 12.5px; }
.rt-token-chain { font-size: 10px; color: var(--r-sub); font-weight: 600; letter-spacing: 0.4px; }
.radar-trust-table .rt-num { font-family: 'JetBrains Mono', monospace; font-weight: 700; }
.radar-trust-table .rt-up { color: var(--r-cyan); }
.radar-trust-table .rt-down { color: var(--r-red); }
.radar-trust-table .rt-addr { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--r-sub); }
.rt-score { display: inline-block; min-width: 30px; text-align: center; padding: 2px 6px; border-radius: 8px; font-weight: 800; font-size: 13px; font-family: 'JetBrains Mono', monospace; }
.rt-score-low { color: var(--r-cyan); background: rgba(16,185,129,0.14); }
.rt-score-medium { color: var(--r-amber); background: rgba(251,191,36,0.14); }
.rt-score-high { color: var(--r-red); background: rgba(255,59,59,0.14); }
.rt-risk { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.rt-risk-low { color: var(--r-cyan); background: rgba(16,185,129,0.12); }
.rt-risk-medium { color: var(--r-amber); background: rgba(251,191,36,0.12); }
.rt-risk-high { color: var(--r-red); background: rgba(255,59,59,0.12); }
.rt-swap { font-size: 11px; font-weight: 700; }
.rt-swap-low { color: var(--r-cyan); }
.rt-swap-medium, .rt-swap-high { color: var(--r-sub); }
.rt-detect { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 8px; font-size: 11px; font-weight: 800; text-decoration: none; color: #fff; background: linear-gradient(90deg, #1E90FF, #2E6BF0); transition: transform 0.15s; white-space: nowrap; }
.rt-detect:hover { transform: translateY(-1px); }
.radar-risk-low { color: var(--r-cyan) !important; background: rgba(16,185,129,0.12) !important; border-color: rgba(16,185,129,0.3) !important; }
.radar-risk-medium { color: var(--r-amber) !important; background: rgba(251,191,36,0.12) !important; border-color: rgba(251,191,36,0.3) !important; }
.radar-risk-high { color: var(--r-red) !important; background: rgba(255,59,59,0.12) !important; border-color: rgba(255,59,59,0.3) !important; }

/* §R9 空状态 spinner 居中 */
.radar-pending .fa-spinner { color: var(--r-blue); }

/* §R9 白天模式: 信任榜行内颜色 */
html[data-theme="light"] .rt-token-sym { color: #0F172A; }
html[data-theme="light"] .rt-token-chain { color: #64748B; }
html[data-theme="light"] .radar-trust-table .rt-up { color: #16A34A; }
html[data-theme="light"] .radar-trust-table .rt-down { color: #DC2626; }
html[data-theme="light"] .radar-trust-table .rt-addr { color: #94A3B8; }
html[data-theme="light"] .rt-score-low { color: #16A34A; background: #E8F8EF; }
html[data-theme="light"] .rt-score-medium { color: #D97706; background: #FEF6E7; }
html[data-theme="light"] .rt-score-high { color: #DC2626; background: #FDECEC; }
html[data-theme="light"] .rt-risk-low { color: #16A34A; background: #E8F8EF; }
html[data-theme="light"] .rt-risk-medium { color: #D97706; background: #FEF6E7; }
html[data-theme="light"] .rt-risk-high { color: #DC2626; background: #FDECEC; }
html[data-theme="light"] .rt-swap-low { color: #16A34A; }
html[data-theme="light"] .radar-pending { color: #64748B; }

/* ════════════════════════════════════════════════════════════════════════
 * §R10 Radar 移动端 UI 二次修复 (2026-06-02)
 *  标题 / 横向溢出 / ticker / 图表高度 / 卡片内边距 / 底部遮挡
 * ════════════════════════════════════════════════════════════════════════ */

/* §R10.1 标题: 单行 "Jiguang Radar · 激光雷达", 移动端允许换行不重叠 */
.radar-title { row-gap: 2px; }
@media (max-width: 640px) {
  .radar-title-en { font-size: 22px; }
  .radar-title-cn,
  .radar-title-sep { font-size: 18px; }
}

/* §R10.2 横向溢出根治: html/body/页面容器都不允许横向滚动 */
html, body { overflow-x: hidden; max-width: 100%; }
.radar-root,
.radar-page { overflow-x: hidden; max-width: 100%; box-sizing: border-box; }
/* 所有卡片 / 图表 / 网格 容器: 不超出视口, 含 padding 计宽 */
.radar-grid,
.radar-header,
.radar-header-inner,
.radar-card,
.radar-chart,
.radar-card-head,
.radar-controls,
.radar-trust-table-wrap,
.radar-feed { max-width: 100%; box-sizing: border-box; }

/* §R10.3 顶部 ticker: 仅内部横向滚动, 不撑开页面, 不被裁切 */
.radar-ticker {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* 左右各 16px 安全留白, 末卡片不贴边/不被裁切 */
  padding-left: 16px;
  padding-right: 16px;
  margin-left: -16px;
  margin-right: -16px;
  scroll-padding: 0 16px;
}
.radar-ticker-item { flex: 0 0 auto; }

/* §R10.4 移动端图表高度收敛到 260–300px, 不抢首屏 */
@media (max-width: 640px) {
  .radar-card { padding: 14px; }                 /* 卡片内边距 14–16px */
  .radar-card-head { margin-bottom: 10px; }
  .radar-chart { height: 260px !important; }      /* 多币种价格图表 */
  .radar-chart-sm { height: 260px !important; }   /* 市值前十图表 */
  .radar-gauge { height: 220px !important; }      /* 恐惧贪婪仪表保持紧凑 */
  /* 横向标签 pill 组允许横滑, 不换行撑高 */
  .radar-controls { width: 100%; }
  .radar-btn-group {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    max-width: 100%;
    scrollbar-width: none;
  }
  .radar-btn-group::-webkit-scrollbar { display: none; }
  .radar-pill { flex: 0 0 auto; white-space: nowrap; }
}
@media (max-width: 768px) {
  .radar-chart { height: 280px !important; }
  .radar-chart-sm { height: 280px !important; }
}

/* §R10.5 移动端表格: 仅卡片内横向滚动, 不展开为桌面全宽表 */
.radar-trust-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

/* §R10.6 底部导航遮挡修复: 主内容底部留 140px 安全距离 */
.radar-page { padding-bottom: 140px; }
@media (max-width: 768px) {
  .radar-page { padding-bottom: 140px !important; }
}

/* ════════════════════════════════════════════════════════════════════════
 * §R11 Radar 移动端密度与留白优化 (2026-06-02)
 *  数据监控入口网格 / 间距压缩 / 紧凑空状态 / 完整榜单链接 / Footer 压缩
 *  参考金融科技交易端质感: 卡片小圆角+轻阴影+紧凑留白 (不照搬任何第三方品牌/色值)
 * ════════════════════════════════════════════════════════════════════════ */

/* §R11.1 数据监控入口网格: 2 列紧凑入口卡片, 不占大块空白 */
.radar-monitor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  max-width: 100%;
}
.radar-monitor-card { max-width: 100%; box-sizing: border-box; overflow: hidden; }
.radar-entry {
  display: flex; align-items: flex-start; gap: 11px;
  min-height: 88px; max-height: 104px;
  padding: 13px 13px; border-radius: 14px; text-decoration: none;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--r-border);
  transition: transform 0.15s, border-color 0.15s, background 0.15s;
}
.radar-entry:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 212, 255, 0.4);
  background: rgba(0, 212, 255, 0.07);
}
.radar-entry-ico {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 11px;
  display: grid; place-items: center; font-size: 16px;
  color: var(--r-blue); background: rgba(0, 212, 255, 0.12);
}
/* 差异化浅色图标背景 (App 感) */
.radar-entry-ico.tone-whale { color: #38bdf8; background: rgba(56, 189, 248, 0.14); }
.radar-entry-ico.tone-risk  { color: #fb7185; background: rgba(251, 113, 133, 0.14); }
.radar-entry-ico.tone-new   { color: #34d399; background: rgba(52, 211, 153, 0.14); }
.radar-entry-ico.tone-score { color: #818cf8; background: rgba(129, 140, 248, 0.16); }
.radar-entry-ico.tone-liq   { color: #22d3ee; background: rgba(34, 211, 238, 0.14); }
.radar-entry-ico.tone-chain { color: #a78bfa; background: rgba(167, 139, 250, 0.16); }
.radar-entry-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.radar-entry-title {
  font-size: 13px; font-weight: 800; color: var(--r-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.radar-entry-desc {
  font-size: 11px; font-weight: 500; color: var(--r-sub);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.radar-entry-status {
  display: inline-flex; align-items: center; gap: 4px; align-self: flex-start;
  margin-top: 3px; padding: 2px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700;
}
.radar-entry-status::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor;
}
.radar-entry-status.is-live { color: var(--r-cyan); background: rgba(16, 185, 129, 0.14); }
.radar-entry-status.is-pending { color: var(--r-blue); background: rgba(0, 212, 255, 0.12); }
.radar-monitor-card .radar-card-sub { font-size: 11px; }

/* §R11.2 完整榜单链接 (表格仅前 5 条) */
.radar-more-link {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 10px;
  font-size: 13px; font-weight: 700; text-decoration: none; color: var(--r-blue);
}
.radar-more-link:hover { text-decoration: underline; }
.radar-more-link .fa-arrow-right { font-size: 11px; }

/* §R11.3 移动端: 模块间距压缩 + 紧凑空状态 + 图表高度收敛 */
@media (max-width: 768px) {
  /* 模块纵向间距 14–18px (覆盖 16px gap) */
  .radar-col-main { gap: 14px; }
  .radar-card { padding: 14px; margin-bottom: 0; }
  .radar-card-head { margin-bottom: 10px; }
  /* R12: 移动端图表高度收敛 220–260px, 不抢首屏 */
  .radar-chart { height: 250px !important; }      /* 多币种价格图表 */
  .radar-chart-sm { height: 230px !important; }   /* 市值前十图表 */
  /* 紧凑空状态: 高度 80–120px, 不超 160px */
  .radar-pending { min-height: 84px !important; padding: 14px !important; gap: 6px; }
  .radar-pending i { font-size: 22px; }
  .radar-pending-txt { font-size: 12px; }
}
@media (max-width: 640px) {
  .radar-chart { height: 240px !important; }
  .radar-chart-sm { height: 220px !important; }
  /* 入口网格在窄屏保持 2 列, 但卡片更紧凑 (高度仍在 88–104px) */
  .radar-monitor-grid { gap: 9px; }
  .radar-entry { min-height: 90px; max-height: 104px; padding: 12px 11px; gap: 9px; }
  .radar-entry-ico { width: 34px; height: 34px; font-size: 15px; }
  .radar-entry-title { font-size: 12.5px; }
  .radar-entry-desc { font-size: 10.5px; }
}

/* §R11.4 Footer 移动端压缩 (仅 radar 页作用域 .radar-root footer, 不影响其它页)
 * 目标: Footer 不占过长屏幕。折叠品牌区的「平台说明 5 条」(落款区已含合规声明),
 *       产品/法务/资源链接栏收紧为紧凑列, 整体内边距与字体压缩。 */
@media (max-width: 768px) {
  /* 整体上边距收敛, 不与 Radar 主内容拉开太远 */
  .radar-root footer { margin-top: 10px !important; }
  /* 内边距收紧 (原 py-10 = 40px → 20/24) */
  .radar-root footer > div { padding-top: 20px !important; padding-bottom: 24px !important; }
  /* 4 列主体: 列间距压缩 */
  .radar-root footer .grid { gap: 16px !important; }
  /* 品牌区: tagline / headline 字体缩小, 行距收敛 */
  .radar-root footer p { font-size: 12px !important; line-height: 1.45 !important; }
  /* 折叠品牌区「平台说明 5 条」列表 (视觉冗余, 合规声明在落款区保留) */
  .radar-root footer .col-span-2 > ul { display: none !important; }
  /* 链接栏: 标题 + 链接字体收紧, 行距压缩 */
  .radar-root footer h4 { font-size: 12px !important; margin-bottom: 6px !important; }
  .radar-root footer ul li { font-size: 11px !important; }
  .radar-root footer .space-y-2 > * + * { margin-top: 5px !important; }
  /* 落款小字进一步压缩, 行距收敛 */
  .radar-root footer .mt-8 { margin-top: 18px !important; padding-top: 14px !important; }
  /* 风险横条字体缩小 */
  .radar-root footer .risk-banner-text { font-size: 11px !important; padding-top: 9px !important; padding-bottom: 9px !important; }
}

/* §R11.LIGHT 白天模式入口卡片 (白卡 + 保留差异化 tone 图标) */
html[data-theme="light"] .radar-entry {
  background: #FFFFFF; border: 1px solid #E8EEF7;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
html[data-theme="light"] .radar-entry:hover {
  background: #F6FAFF; border-color: #BFD8FF;
  box-shadow: 0 4px 14px rgba(30, 144, 255, 0.12);
}
html[data-theme="light"] .radar-entry-title { color: #0F172A; }
html[data-theme="light"] .radar-entry-desc { color: #64748B; }
html[data-theme="light"] .radar-entry-status.is-live { color: #16A34A; background: #E8F8EF; }
html[data-theme="light"] .radar-entry-status.is-pending { color: #1E5FE6; background: #EAF3FF; }
html[data-theme="light"] .radar-more-link { color: #1E5FE6; }

/* ════════════════════════════════════════════════════════════════════════
 * §R12 科技雷达主视觉 Hero (2026-06-03)
 *  深蓝科技渐变卡片 + CSS 雷达扫描光环 + 数据点; 圆角 24px; 不大面积红色
 *  参考金融科技交易端质感 (留白克制 / 蓝色主调), 不照搬任何第三方品牌
 * ════════════════════════════════════════════════════════════════════════ */
.radar-hero {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: 26px 24px;
  display: flex; align-items: center; gap: 20px;
  background:
    radial-gradient(620px 320px at 88% 18%, rgba(0, 212, 255, 0.20), transparent 62%),
    radial-gradient(520px 300px at 96% 92%, rgba(139, 92, 246, 0.18), transparent 60%),
    linear-gradient(135deg, #0a1430 0%, #0c1b3d 48%, #0a1228 100%);
  border: 1px solid rgba(0, 212, 255, 0.22);
  box-shadow: 0 18px 48px rgba(2, 10, 30, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
/* 细蓝色网格底纹 */
.radar-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
  background-image:
    linear-gradient(rgba(0, 212, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 255, 0.06) 1px, transparent 1px);
  background-size: 30px 30px;
  -webkit-mask-image: radial-gradient(120% 120% at 80% 30%, #000 30%, transparent 78%);
  mask-image: radial-gradient(120% 120% at 80% 30%, #000 30%, transparent 78%);
}
.radar-hero-body { position: relative; z-index: 2; flex: 1; min-width: 0; }
.radar-hero-body .radar-badge { margin-bottom: 10px; }
.radar-hero-body .radar-title { margin-bottom: 8px; }
.radar-hero-body .radar-subtitle { margin: 0 0 16px; max-width: 560px; }
.radar-hero-body .radar-header-actions { margin: 0; }

/* 雷达扫描主视觉 */
.radar-hero-visual {
  position: relative; z-index: 2; flex: 0 0 auto;
  width: 156px; height: 156px; display: grid; place-items: center;
}
.radar-scope {
  position: relative; width: 150px; height: 150px; border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, rgba(0,212,255,0.10), rgba(7,16,32,0.4) 70%);
}
.radar-scope-ring {
  position: absolute; border-radius: 50%; border: 1px solid rgba(0, 212, 255, 0.28);
  top: 50%; left: 50%; transform: translate(-50%, -50%);
}
.radar-scope-ring.r1 { width: 100%; height: 100%; }
.radar-scope-ring.r2 { width: 66%; height: 66%; border-color: rgba(0, 212, 255, 0.22); }
.radar-scope-ring.r3 { width: 32%; height: 32%; border-color: rgba(139, 92, 246, 0.30); }
/* 扫描光束 (旋转扇形) */
.radar-scope-sweep {
  position: absolute; top: 50%; left: 50%; width: 50%; height: 50%;
  transform-origin: top left;
  background: conic-gradient(from 0deg, rgba(0, 212, 255, 0.45), rgba(0, 212, 255, 0) 60deg);
  border-radius: 0 0 0 100%;
  animation: radar-sweep 3.2s linear infinite;
}
@keyframes radar-sweep { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* 数据点 */
.radar-scope-dot {
  position: absolute; width: 7px; height: 7px; border-radius: 50%;
  background: var(--r-cyan); box-shadow: 0 0 10px var(--r-cyan);
  animation: radar-blip 3.2s ease-in-out infinite;
}
.radar-scope-dot.d1 { top: 26%; left: 64%; animation-delay: 0.4s; }
.radar-scope-dot.d2 { top: 58%; left: 30%; background: var(--r-blue); box-shadow: 0 0 10px var(--r-blue); animation-delay: 1.3s; }
.radar-scope-dot.d3 { top: 70%; left: 70%; background: var(--r-purple); box-shadow: 0 0 10px var(--r-purple); animation-delay: 2.2s; }
@keyframes radar-blip { 0%, 100% { opacity: 0.25; transform: scale(0.7); } 50% { opacity: 1; transform: scale(1); } }
.radar-scope-core {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle, #fff, var(--r-blue));
  box-shadow: 0 0 16px var(--r-blue);
}

/* 移动端 Hero: 主视觉缩小并右上角浮放, 文字优先 */
@media (max-width: 768px) {
  .radar-hero { padding: 20px 16px; border-radius: 20px; gap: 0; }
  .radar-hero-visual {
    position: absolute; top: 12px; right: 10px; z-index: 1;
    width: 112px; height: 112px; opacity: 0.85;
  }
  .radar-scope { width: 108px; height: 108px; }
  .radar-hero-body { width: 100%; }
  .radar-hero-body .radar-subtitle { max-width: 70%; }
  .radar-hero-body .radar-header-actions { width: 100%; gap: 8px; flex-wrap: wrap; }
}
@media (max-width: 380px) {
  .radar-hero-visual { width: 92px; height: 92px; opacity: 0.7; }
  .radar-scope { width: 88px; height: 88px; }
  .radar-hero-body .radar-subtitle { max-width: 100%; }
}

/* §R12 白天模式 Hero */
html[data-theme="light"] .radar-hero {
  background:
    radial-gradient(620px 320px at 88% 18%, rgba(30, 144, 255, 0.14), transparent 62%),
    radial-gradient(520px 300px at 96% 92%, rgba(46, 107, 240, 0.10), transparent 60%),
    linear-gradient(135deg, #EAF3FF 0%, #F3F8FF 48%, #FFFFFF 100%);
  border: 1px solid #CFE3FF;
  box-shadow: 0 10px 30px rgba(30, 144, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
html[data-theme="light"] .radar-hero::before {
  background-image:
    linear-gradient(rgba(30, 144, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30, 144, 255, 0.08) 1px, transparent 1px);
}
html[data-theme="light"] .radar-scope {
  background: radial-gradient(circle at 50% 50%, rgba(30,144,255,0.12), rgba(255,255,255,0.4) 70%);
}
html[data-theme="light"] .radar-scope-ring.r1,
html[data-theme="light"] .radar-scope-ring.r2 { border-color: rgba(30, 144, 255, 0.30); }
html[data-theme="light"] .radar-scope-ring.r3 { border-color: rgba(46, 107, 240, 0.35); }
html[data-theme="light"] .radar-scope-sweep {
  background: conic-gradient(from 0deg, rgba(30, 144, 255, 0.40), rgba(30, 144, 255, 0) 60deg);
}