@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(./assets/font-63e313fb9c65b6b2.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/font-6d37a86241a25d63.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/font-1724047c8988ca51.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/font-69e7ae35cba23d96.ttf) format('truetype');
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/font-0c2fad18ed36cc40.ttf) format('truetype');
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/font-ff7cf63717c27756.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/font-1b08e7fc267a5c7e.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/font-8c883f63b2c4157d.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/font-e7a1aaf7eda9f2fa.ttf) format('truetype');
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/font-a7a0a9114e29fbf6.ttf) format('truetype');
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/font-b8f5e0a8bdd6a12c.ttf) format('truetype');
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/font-68c4493c7c6c9aaf.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(./assets/font-643f64e9bfc140a9.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/font-6a8c9be856a6b9e0.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/font-9a9f465776e653cd.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/font-8900df5726b5a6f2.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./assets/font-49dcdf653a004a25.ttf) format('truetype');
}

    :root {
      --abyss: #020b14;
      --depth: #061a2b;
      --panel: #0c2a3e;
      --sonar: #5fe3ee;
      --mist: #8fb0c1;
      --alert: #f2b65e;
      --foam: #e8f6f8;
      --line: rgba(150, 222, 236, 0.13);
      --line-strong: rgba(150, 222, 236, 0.26);
      --sans: "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      --display: "Palatino Linotype", Palatino, "Times New Roman", serif;
      --mono: "SF Mono", "JetBrains Mono", "Roboto Mono", Menlo, Consolas, monospace;
      --ease: cubic-bezier(0.22, 1, 0.36, 1);
    }
    * { box-sizing: border-box; }
    html, body { margin: 0; background: var(--abyss); color: var(--foam); font-family: var(--sans); overflow-x: clip; -webkit-tap-highlight-color: transparent; }
    body { min-height: 100dvh; -webkit-font-smoothing: antialiased; }
    html:not(.gl) body { background: radial-gradient(80% 40% at 50% -10%, rgba(95, 227, 238, 0.08), transparent 60%), var(--abyss); }
    a { color: inherit; text-decoration: none; }
    button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
    :focus-visible { outline: 2px solid var(--sonar); outline-offset: 3px; }

    /* ---------- 实时水体画布：固定在所有内容之后 ---------- */
    #abyss { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; pointer-events: none; opacity: 0; transition: opacity 1.2s var(--ease); }
    html.gl #abyss { opacity: 1; }
    .app { position: relative; z-index: 1; width: min(100%, 560px); margin: 0 auto; min-height: 100dvh; }

    /* 无 WebGL 时保留原有渐变海洋 */
    html:not(.gl) .ocean {
      background:
        radial-gradient(78% 46% at 50% -6%, rgba(95, 227, 238, 0.22), transparent 56%),
        radial-gradient(36% 28% at 92% 12%, rgba(242, 182, 94, 0.045), transparent 70%),
        linear-gradient(180deg, #0b3c54 0%, #07283c 24%, #04111f 64%, #030b14 100%);
    }
    html.gl .page-head { background: linear-gradient(180deg, rgba(2, 10, 18, 0.28), rgba(2, 10, 18, 0)); }

    /* ---------- 统一的“深海仪表玻璃” ---------- */
    .glass {
      background: linear-gradient(180deg, rgba(14, 46, 64, 0.70), rgba(4, 18, 30, 0.84));
      border: 1px solid var(--line);
      box-shadow: inset 0 1px 0 rgba(200, 245, 255, 0.07), 0 18px 40px rgba(0, 0, 0, 0.32);
    }
    .kicker { display: flex; align-items: center; gap: 10px; font-family: var(--display); letter-spacing: 0.34em; color: var(--sonar); font-size: 11px; margin: 0; }
    .kicker::before { content: ""; width: 20px; height: 1px; background: linear-gradient(90deg, transparent, currentColor); }
    .title { font-size: 1.95rem; font-weight: 500; line-height: 1.18; margin: 10px 0 0; letter-spacing: 0.01em; text-shadow: 0 2px 28px rgba(0, 0, 0, 0.55); }
    .lede { color: var(--mist); font-size: 14px; line-height: 1.65; margin: 12px 0 0; }
    .demo {
      display: inline-flex; align-items: center; gap: 6px; flex: none; border: 1px solid rgba(95, 227, 238, 0.42);
      background: rgba(95, 227, 238, 0.09); color: var(--sonar); border-radius: 999px;
      padding: 3px 9px 3px 7px; font-size: 10px; letter-spacing: 0.18em; font-weight: 700; line-height: 1.2;
    }
    .demo::before, .tag::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: 0.85; }
    .tag { display: inline-flex; align-items: center; gap: 6px; flex: none; border-radius: 999px; padding: 3px 9px 3px 7px; font-size: 10px; letter-spacing: 0.18em; font-weight: 700; line-height: 1.2; }
    .tag-snap { border: 1px solid rgba(95, 227, 238, 0.45); color: var(--sonar); background: rgba(95, 227, 238, 0.05); }
    .tag-na { border: 1px solid rgba(242, 182, 94, 0.65); color: var(--alert); background: rgba(242, 182, 94, 0.08); }
    .status-line { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 13px; }
    .page-head { padding: max(18px, env(safe-area-inset-top)) 16px 20px; position: relative; }
    .page-body { padding: 8px 16px calc(5.75rem + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 16px; }
    .back { display: inline-flex; align-items: center; min-height: 44px; gap: 4px; margin-bottom: 6px; font-size: 14px; color: var(--mist); }
    .back svg { width: 18px; height: 18px; }
    .row { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 6px; border-radius: 14px; transition: background 0.2s; }
    .row:active { background: rgba(95, 227, 238, 0.06); }
    .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sonar); box-shadow: 0 0 0 3px rgba(95, 227, 238, 0.12), 0 0 14px rgba(95, 227, 238, 0.8); flex: none; }
    .meta { display: block; color: var(--mist); font-size: 12px; margin-top: 3px; font-variant-numeric: tabular-nums; }
    .card { border-radius: 24px; padding: 16px; }
    .split { display: flex; justify-content: space-between; gap: 16px; padding: 13px 16px; }
    .split dt { color: var(--mist); font-size: 12px; flex: none; }
    .split dd { margin: 0; font-size: 14px; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
    .divide > * + * { border-top: 1px solid var(--line); }
    ul.divide { margin: 12px 0 0; padding: 0; list-style: none; }
    .card a[href^="https://etherscan"] { color: var(--sonar); font-family: var(--mono); font-size: 11px; overflow-wrap: anywhere; display: block; margin-top: 4px; }

    /* ---------- 底部导航 ---------- */
    .nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; }
    .nav-inner {
      width: min(100%, 560px); margin: 0 auto; display: grid; grid-template-columns: repeat(5, 1fr);
      background: linear-gradient(180deg, rgba(3, 14, 25, 0.82), rgba(2, 9, 16, 0.96)); border-top: 1px solid var(--line);
      -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); padding-bottom: env(safe-area-inset-bottom);
    }
    .nav a { position: relative; min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: var(--mist); font-size: 11px; letter-spacing: 0.06em; }
    .nav a[aria-current="page"] { color: var(--sonar); }
    .nav a[aria-current="page"]::before { content: ""; position: absolute; top: -1px; left: 30%; right: 30%; height: 2px; border-radius: 2px; background: var(--sonar); box-shadow: 0 0 12px rgba(95, 227, 238, 0.9); }
    .nav svg { width: 22px; height: 22px; }

    /* ---------- 首页：巨鲸是主角 ---------- */
    .hero { min-height: 100dvh; display: flex; flex-direction: column; position: relative; overflow: hidden; }
    html.gl .hero { overflow: visible; }
    .hero-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: max(18px, env(safe-area-inset-top)) 16px 0; }
    .word { font-family: var(--display); letter-spacing: 0.22em; font-size: 1.35rem; margin: 0; text-shadow: 0 0 24px rgba(95, 227, 238, 0.25); }
    .hero-sub { margin: 8px 0 0; color: rgba(232, 246, 248, 0.86); font-size: 14px; }
    .hero-depth { margin: 6px 0 0; color: rgba(95, 227, 238, 0.82); font-size: 10px; letter-spacing: 0.2em; font-family: var(--mono); }
    .bell { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-strong); background: rgba(3, 16, 27, 0.45); display: inline-flex; align-items: center; justify-content: center; flex: none; }
    .bell svg { width: 20px; height: 20px; }
    .whale-wrap { flex: 1; display: flex; align-items: center; position: relative; z-index: 1; min-height: 46vh; }
    .whale-link { display: block; width: 100%; }
    html.gl .whale-link { position: absolute; inset: 0; }
    .hero-top, .shortcuts, .hero-caption { position: relative; z-index: 2; }
    .hero-caption { padding: 0 20px 14px; margin: 0; font-size: 15px; line-height: 1.6; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.7); }
    .lock { position: absolute; left: 16px; bottom: 6px; display: flex; align-items: center; gap: 8px; pointer-events: none; font-size: 10px; letter-spacing: 0.18em; color: rgba(232, 246, 248, 0.72); font-family: var(--mono); }
    .lock::before { content: ""; width: 26px; height: 26px; border: 1px solid rgba(95, 227, 238, 0.55); border-radius: 50%; box-shadow: inset 0 0 0 5px rgba(2, 11, 20, 0.2), 0 0 14px rgba(95, 227, 238, 0.3); background: radial-gradient(circle, var(--sonar) 0 2px, transparent 3px); }
    .gauge { position: absolute; right: 14px; top: 8%; bottom: 14%; width: 22px; pointer-events: none; z-index: 1;
      background: repeating-linear-gradient(180deg, rgba(150, 222, 236, 0.32) 0 1px, transparent 1px 14px) right / 6px 100% no-repeat,
                  repeating-linear-gradient(180deg, rgba(150, 222, 236, 0.5) 0 1px, transparent 1px 70px) right / 12px 100% no-repeat;
      mask-image: linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent); -webkit-mask-image: linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent); }
    .shortcuts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 16px calc(5.25rem + env(safe-area-inset-bottom)); }
    .shortcut { display: flex; align-items: center; gap: 10px; min-height: 56px; border-radius: 18px; padding: 10px 12px; font-size: 14px; }
    .shortcut svg { width: 22px; height: 22px; flex: none; color: var(--sonar); }
    .sheet { position: relative; z-index: 2; margin-top: -16px; background: linear-gradient(180deg, rgba(6, 26, 43, 0.94), rgba(3, 13, 23, 0.97)); border-top: 1px solid var(--line-strong); border-radius: 28px 28px 0 0; padding: 18px 16px calc(5.75rem + env(safe-area-inset-bottom)); box-shadow: 0 -24px 60px rgba(0, 0, 0, 0.35); }
    .sheet::before { content: ""; position: absolute; top: 8px; left: 50%; width: 36px; height: 4px; margin-left: -18px; border-radius: 4px; background: rgba(232, 246, 248, 0.16); }
    .sheet h2 { font-size: 16px; font-weight: 500; margin: 0; }
    .sheet-head { display: flex; justify-content: space-between; align-items: center; margin: 6px 0 8px; }

    /* ---------- 声呐雷达 ---------- */
    .dial { position: relative; width: min(100%, 320px); aspect-ratio: 1; margin: 4px auto 8px; }
    .dial { --sonar-period: 8s; }
    .sonar-dial {
      overflow: hidden; border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, rgba(95, 227, 238, 0.10), transparent 40%),
        radial-gradient(circle at 50% 50%, rgba(6, 40, 52, 0.85), rgba(2, 10, 17, 0.96) 72%);
      box-shadow: 0 0 0 1px rgba(95, 227, 238, 0.28), 0 0 0 7px rgba(3, 15, 25, 0.92), 0 0 0 8px rgba(150, 222, 236, 0.14), 0 0 46px rgba(95, 227, 238, 0.10), 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 0 70px rgba(95, 227, 238, 0.07);
    }
    .sonar-dial::after { content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none; z-index: 4; background: radial-gradient(circle at 50% 50%, transparent 56%, rgba(2, 10, 17, 0.55) 100%), repeating-radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 3px); }
    .ring { position: absolute; border: 1px solid rgba(95, 227, 238, 0.22); border-radius: 50%; }
    .bearing text { font-family: var(--mono); font-size: 3.1px; fill: rgba(232, 246, 248, 0.55); letter-spacing: 0.05em; }
    .ping { position: absolute; z-index: 3; width: 44px; height: 44px; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; }
    .ping.is-dim { visibility: hidden; pointer-events: none; }
    .ping span { width: 10px; height: 10px; border-radius: 50%; background: radial-gradient(circle, #f1feff 0 30%, var(--sonar) 60%); box-shadow: 0 0 12px rgba(95, 227, 238, 0.95), 0 0 30px rgba(95, 227, 238, 0.4); animation: sonar-hit var(--sonar-period, 8s) linear infinite; transform-origin: center; }
    .ping .echo { position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; border: 1px solid rgba(95, 227, 238, 0.7); animation: sonar-echo var(--sonar-period, 8s) linear infinite; pointer-events: none; }
    .sweep { position: absolute; inset: 2%; z-index: 2; border-radius: 50%; pointer-events: none; background: conic-gradient(from 0deg, transparent 0deg, transparent 280deg, rgba(95, 227, 238, 0.03) 312deg, rgba(95, 227, 238, 0.13) 342deg, rgba(160, 245, 250, 0.32) 357deg, rgba(232, 252, 255, 0.75) 360deg); animation: sonar-spin var(--sonar-period, 8s) linear infinite; mask: radial-gradient(circle, transparent 5%, #000 14%); -webkit-mask: radial-gradient(circle, transparent 5%, #000 14%); }
    .panel-label { display: flex; justify-content: space-between; align-items: center; font-size: 10px; letter-spacing: 0.22em; color: var(--mist); font-family: var(--mono); }

    /* ---------- 迁徙图 ---------- */
    .migration-stage::after { content: ""; position: absolute; inset: 0; z-index: 25; pointer-events: none; border-radius: inherit; background: radial-gradient(78% 72% at 50% 46%, transparent 42%, rgba(2, 9, 16, 0.6) 100%); }
    .map { position: relative; height: 26rem; border-radius: 26px; overflow: hidden; }
    .map.glass { background: radial-gradient(60% 50% at 70% 72%, rgba(1, 6, 12, 0.6), transparent 70%), radial-gradient(70% 55% at 30% 20%, rgba(18, 70, 92, 0.42), transparent 72%), linear-gradient(180deg, rgba(8, 34, 50, 0.82), rgba(2, 11, 19, 0.92)); }
    .map svg.lines, .map svg.bathy { position: absolute; inset: 0; width: 100%; height: 100%; }
    .bathy path { fill: none; stroke: rgba(130, 210, 228, 0.11); stroke-width: 1px; vector-effect: non-scaling-stroke; }
    .bathy path.major { stroke: rgba(130, 210, 228, 0.2); }
    .bathy .grid { stroke: rgba(130, 210, 228, 0.05); stroke-width: 1px; vector-effect: non-scaling-stroke; }
    .edge-glow { stroke: #5fe3ee; stroke-width: 10px; opacity: 0.08; stroke-linecap: round; vector-effect: non-scaling-stroke; }
    .edge-core { stroke: #5fe3ee; stroke-width: 1.4px; opacity: 0.75; stroke-linecap: round; vector-effect: non-scaling-stroke; }
    .edge-current { stroke: #e8f6f8; stroke-width: 2px; opacity: 0.55; stroke-linecap: round; stroke-dasharray: 1 7; vector-effect: non-scaling-stroke; animation: current-run 2.6s linear infinite; }
    .node, .flow { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; }
    .node { width: 44px; height: 44px; z-index: 2; }
    .flow { width: 44px; height: 44px; z-index: 1; justify-content: center; }
    .badge { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; position: relative; }
    .whale-badge { border: 1px solid rgba(95, 227, 238, 0.7); background: radial-gradient(circle at 40% 30%, #17506a, #071d2e 70%); color: var(--sonar); box-shadow: 0 0 0 5px rgba(95, 227, 238, 0.06), 0 0 22px rgba(95, 227, 238, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.1); }
    .place-badge { border: 1px solid rgba(242, 182, 94, 0.7); background: radial-gradient(circle at 40% 30%, #2b2a20, #08131d 70%); color: var(--alert); box-shadow: 0 0 0 5px rgba(242, 182, 94, 0.05), 0 0 18px rgba(242, 182, 94, 0.2); }
    .exchange-badge { border-radius: 12px; }
    .defi-badge { border-style: dashed; border-color: rgba(95, 227, 238, 0.55); background: radial-gradient(circle, #04121f, #020a12); color: var(--foam); box-shadow: 0 0 0 5px rgba(95, 227, 238, 0.04); }
    .node small { position: absolute; top: calc(100% + 5px); left: 50%; width: 4.75rem; margin: 0; transform: translateX(-50%); font-size: 11px; text-align: center; text-shadow: 0 1px 8px #000; }
    .flow .dot { width: 10px; height: 10px; }
    .map-tools { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 12px; }
    .map-stage { position: absolute; inset: 0; touch-action: none; }

    /* ---------- 列表、时间线、警报 ---------- */
    .pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .stat-tile { display: block; min-height: 88px; padding: 14px; border-radius: 22px; background: #08243b; }
    .stat-tile.gold { background: linear-gradient(160deg, #3a2a12, #08243b); }
    .stat-tile.violet { background: linear-gradient(160deg, #241c4a, #08243b); }
    .stat-tile.coral { background: linear-gradient(160deg, #4a241c, #08243b); }
    .pair a { min-height: 176px; display: flex; flex-direction: column; }
    .timeline { border-left: 1px solid rgba(95, 227, 238, 0.28); padding-left: 16px; display: flex; flex-direction: column; gap: 12px; margin: 0; }
    .timeline li { position: relative; list-style: none; transition: border-color 0.3s, background 0.3s; }
    .timeline li::before { content: ""; position: absolute; left: -1.32rem; top: 24px; width: 9px; height: 9px; border-radius: 50%; background: var(--sonar); animation: node-flow 3.4s ease-in-out infinite; }
    .timeline li.active { border: 1px solid rgba(95, 227, 238, 0.5); background: linear-gradient(90deg, rgba(95, 227, 238, 0.14), rgba(4, 18, 30, 0.84)); }
    .timeline li.active::before { background: var(--foam); box-shadow: 0 0 12px #5fe3ee; }
    .alert-card { border-left: 1px solid rgba(242, 182, 94, 0.5); display: block; position: relative; overflow: hidden; background: linear-gradient(100deg, rgba(242, 182, 94, 0.07), transparent 38%), linear-gradient(180deg, rgba(14, 46, 64, 0.70), rgba(4, 18, 30, 0.84)); }
    .alert-card::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 2px; background: var(--alert); box-shadow: 0 0 12px rgba(242, 182, 94, 0.8); animation: alert-breath 3.2s ease-in-out infinite; }
    .alert-card .when { color: var(--alert); font-size: 13px; font-variant-numeric: tabular-nums; font-family: var(--mono); letter-spacing: 0.02em; }
    .ocean-card { position: relative; overflow: hidden; }
    .ocean-card::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle, rgba(95, 227, 238, 0.12), transparent 70%); pointer-events: none; }
    .ocean-card:active { transform: translate3d(0, 1px, 0); }
    .profile-whale { position: relative; overflow: hidden; border-radius: 26px; padding: 8px 4px 0; background: radial-gradient(70% 80% at 72% 42%, rgba(95, 227, 238, 0.12), transparent 62%), linear-gradient(180deg, #0c3b52, #04111f 78%); }
    html.gl .profile-whale { background: none; overflow: visible; border: 0; min-height: 230px; padding: 0; }
    .profile-stage { display: block; height: 230px; }
    html:not(.gl) .profile-whale::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 28%; background: linear-gradient(transparent, #04111f); pointer-events: none; }
    html:not(.gl) .cabin-head { box-shadow: inset 0 -48px 60px rgba(4, 17, 31, 0.35); }
    .page-rise { animation: page-rise 520ms var(--ease); }
    .stack { display: flex; flex-direction: column; gap: 12px; }
    .choice { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
    .choice::-webkit-scrollbar { display: none; }
    .choice button, .tool-btn { min-height: 44px; border: 1px solid rgba(232, 246, 248, 0.14); border-radius: 999px; padding: 0 14px; color: var(--foam); background: rgba(3, 14, 24, 0.5); white-space: nowrap; transition: border-color 0.2s, background 0.2s, color 0.2s; }
    .choice button[aria-pressed="true"], .tool-btn[aria-pressed="true"] { color: var(--sonar); border-color: rgba(95, 227, 238, 0.75); background: rgba(95, 227, 238, 0.12); box-shadow: 0 0 18px rgba(95, 227, 238, 0.12), inset 0 0 12px rgba(95, 227, 238, 0.08); }
    .tool-btn:disabled { opacity: 0.4; }
    .field, .select { min-height: 44px; width: 100%; border-radius: 14px; border: 1px solid rgba(232, 246, 248, 0.15); background: rgba(2, 10, 18, 0.8); color: var(--foam); padding: 0 12px; font-size: 16px; }
    .field:focus, .select:focus { border-color: rgba(95, 227, 238, 0.6); outline: none; box-shadow: 0 0 0 3px rgba(95, 227, 238, 0.12); }
    .read { opacity: 0.66; }
    .pill { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; width: 100%; border-radius: 999px; border: 1px solid rgba(95, 227, 238, 0.4); padding: 8px 16px; font-size: 14px; text-align: center; background: rgba(3, 14, 24, 0.4); }
    .pill svg { width: 16px; height: 16px; flex: none; }
    .solid { background: linear-gradient(180deg, rgba(95, 227, 238, 0.18), rgba(95, 227, 238, 0.08)); border-color: rgba(95, 227, 238, 0.55); color: var(--foam); }
    .note { color: var(--mist); font-size: 12px; line-height: 1.6; margin: 0; }
    .lost { min-height: 100dvh; display: flex; flex-direction: column; justify-content: center; padding: 24px 24px 7rem; }
    .home-link { margin-top: 24px; background: var(--sonar); color: var(--abyss); font-weight: 600; }
    .render-state { font-family: var(--mono); font-size: 12px; color: var(--sonar); margin: 10px 0 0; }

    /* ---------- 无 WebGL 降级：原 CSS 海洋 + SVG 鲸 ---------- */
    .sea { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
    .sea-far, .sea-haze, .sea-shaft, .sea-caustic, .sea-current, .sea-mote, .sea-bubble, .sea-vignette { position: absolute; pointer-events: none; }
    .sea-vignette { inset: auto 0 0; height: 42%; background: linear-gradient(transparent, rgba(3,11,20,.78)); }
    .sea-haze { inset: 0; background: radial-gradient(42% 36% at 28% 42%, rgba(12,58,82,.45), transparent 72%), radial-gradient(36% 30% at 78% 58%, rgba(4,16,28,.55), transparent 70%); animation: haze-breathe 26s ease-in-out infinite; }
    .sea-far { inset: -6% -14% auto; height: 72%; background: radial-gradient(46% 38% at 72% 78%, rgba(3,10,18,.72), transparent 70%), radial-gradient(30% 24% at 18% 62%, rgba(8,36,59,.55), transparent 72%); animation: far-drift 42s ease-in-out infinite alternate; }
    .sea-shaft { top: -8%; height: 78%; background: linear-gradient(180deg, rgba(95,227,238,.28), transparent 78%); animation: shaft-sway 18s ease-in-out infinite; }
    .sea-shaft.a { left: 16%; width: 72px; transform: rotate(12deg); }
    .sea-shaft.b { right: 10%; width: 46px; opacity: .5; animation-duration: 24s; }
    .sea-shaft.c { left: 58%; width: 18px; opacity: .35; background: linear-gradient(180deg, rgba(242,182,94,.08), transparent 70%); animation-duration: 21s; }
    .sea-caustic { top: 6%; left: -18%; width: 136%; height: 48%; background: repeating-linear-gradient(108deg, transparent 0 42px, rgba(95,227,238,.045) 48px, transparent 62px); mask-image: linear-gradient(180deg, transparent, #000 22%, #000 58%, transparent); animation: caustic-drift 32s linear infinite; }
    .sea-current { right: -8%; bottom: 18%; left: -12%; height: 18%; background: linear-gradient(90deg, transparent, rgba(95,227,238,.05), transparent 80%); animation: current-drift 38s ease-in-out infinite alternate; }
    .sea-mote { border-radius: 50%; background: rgba(214,244,248,.7); animation: mote-drift linear infinite; }
    .sea-mote.far { background: rgba(95,227,238,.45); opacity: .45; }
    .sea-bubble { width: 6px; height: 6px; border-radius: 50%; border: 1px solid rgba(231,246,248,.4); animation: bubble-rise linear infinite; }
    .whale-mass, .whale-torso, .whale-tail, .whale-fin { transform-box: fill-box; }
    .whale-mass { transform-origin: 62% 54%; animation: whale-swim 16s ease-in-out infinite; }
    .whale-torso { transform-origin: 74% 46%; animation: whale-flex 11s ease-in-out infinite; }
    .whale-tail { transform-origin: 100% 48%; animation: whale-beat 4.2s ease-in-out infinite; }
    .whale-fin { transform-origin: 96% 8%; animation: fin-flutter 6.4s ease-in-out infinite; }
    .whale-sheen { animation: sheen 7s ease-in-out infinite; }

    @keyframes page-rise { from { opacity: 0; transform: translate3d(0, 14px, 0); } to { opacity: 1; transform: none; } }
    @keyframes haze-breathe { 0%, 100% { opacity: .72; } 50% { opacity: 1; } }
    @keyframes caustic-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(-7%, 1.5%, 0); } }
    @keyframes current-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(6%, -2%, 0); } }
    @keyframes far-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(-4%, 2%, 0); } }
    @keyframes shaft-sway { 0%, 100% { opacity: .45; } 50% { opacity: .8; } }
    @keyframes mote-drift { from { transform: translate3d(0, 10px, 0); } to { transform: translate3d(-16px, -14px, 0); } }
    @keyframes bubble-rise { from { opacity: .15; transform: translate3d(0, 18px, 0); } to { opacity: .5; transform: translate3d(6px, -36px, 0); } }
    @keyframes whale-swim { 0%, 100% { transform: translate3d(0, 2px, 0) rotate(-0.6deg); } 50% { transform: translate3d(4px, -6px, 0) rotate(0.7deg); } }
    @keyframes whale-flex { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(0.9deg); } }
    @keyframes whale-beat { 0%, 100% { transform: rotate(8deg); } 50% { transform: rotate(-14deg); } }
    @keyframes fin-flutter { 0%, 100% { transform: rotate(1deg); } 50% { transform: rotate(7deg); } }
    @keyframes sheen { 0%, 100% { opacity: .42; } 50% { opacity: .78; } }
    @keyframes sonar-spin { to { transform: rotate(360deg); } }
    @keyframes sonar-hit { 0%, 4% { opacity: 1; transform: scale(1.6); } 16%, 100% { opacity: .62; transform: scale(1); } }
    @keyframes sonar-echo { 0% { opacity: .9; transform: scale(1); } 22% { opacity: 0; transform: scale(4.2); } 100% { opacity: 0; transform: scale(4.2); } }
    @keyframes current-run { to { stroke-dashoffset: -16; } }
    @keyframes alert-breath { 0%, 100% { opacity: 1; } 50% { opacity: .28; } }
    @keyframes node-flow { 0%, 100% { opacity: .5; transform: scale(1); } 50% { opacity: 1; transform: scale(1.28); } }

    html[data-motion="paused"] .anim,
    html[data-motion="paused"] .whale-mass,
    html[data-motion="paused"] .whale-torso,
    html[data-motion="paused"] .whale-tail,
    html[data-motion="paused"] .whale-fin,
    html[data-motion="paused"] .whale-sheen,
    html[data-motion="paused"] .sea-far,
    html[data-motion="paused"] .sea-haze,
    html[data-motion="paused"] .sea-shaft,
    html[data-motion="paused"] .sea-caustic,
    html[data-motion="paused"] .sea-current,
    html[data-motion="paused"] .sea-mote,
    html[data-motion="paused"] .sea-bubble,
    html[data-motion="paused"] .sweep,
    html[data-motion="paused"] .ping span,
    html[data-motion="paused"] .ping .echo,
    html[data-motion="paused"] .edge-current,
    html[data-motion="paused"] .alert-card::before,
    html[data-motion="paused"] .timeline li::before { animation-play-state: paused; }
    html[data-motion-setting="reduced"] .page-rise,
    html[data-motion-setting="reduced"] .anim,
    html[data-motion-setting="reduced"] .whale-mass,
    html[data-motion-setting="reduced"] .whale-torso,
    html[data-motion-setting="reduced"] .whale-tail,
    html[data-motion-setting="reduced"] .whale-fin,
    html[data-motion-setting="reduced"] .whale-sheen,
    html[data-motion-setting="reduced"] .sea-far,
    html[data-motion-setting="reduced"] .sea-haze,
    html[data-motion-setting="reduced"] .sea-shaft,
    html[data-motion-setting="reduced"] .sea-caustic,
    html[data-motion-setting="reduced"] .sea-current,
    html[data-motion-setting="reduced"] .sea-mote,
    html[data-motion-setting="reduced"] .sea-bubble,
    html[data-motion-setting="reduced"] .sweep,
    html[data-motion-setting="reduced"] .ping span,
    html[data-motion-setting="reduced"] .edge-current,
    html[data-motion-setting="reduced"] .alert-card::before,
    html[data-motion-setting="reduced"] .timeline li::before { animation: none; }
    html[data-motion-setting="reduced"] .flow-particle,
    html[data-motion-setting="reduced"] .ping .echo { display: none; }
    @media (prefers-reduced-motion: reduce) {
      html:not([data-motion-setting="full"]) .page-rise,
      html:not([data-motion-setting="full"]) .anim,
      html:not([data-motion-setting="full"]) .whale-mass,
      html:not([data-motion-setting="full"]) .whale-torso,
      html:not([data-motion-setting="full"]) .whale-tail,
      html:not([data-motion-setting="full"]) .whale-fin,
      html:not([data-motion-setting="full"]) .whale-sheen,
      html:not([data-motion-setting="full"]) .sea-far,
      html:not([data-motion-setting="full"]) .sea-haze,
      html:not([data-motion-setting="full"]) .sea-shaft,
      html:not([data-motion-setting="full"]) .sea-caustic,
      html:not([data-motion-setting="full"]) .sea-current,
      html:not([data-motion-setting="full"]) .sea-mote,
      html:not([data-motion-setting="full"]) .sea-bubble,
      html:not([data-motion-setting="full"]) .sweep,
      html:not([data-motion-setting="full"]) .ping span,
      html:not([data-motion-setting="full"]) .edge-current,
      html:not([data-motion-setting="full"]) .alert-card::before,
      html:not([data-motion-setting="full"]) .timeline li::before { animation: none; }
      html:not([data-motion-setting="full"]) .flow-particle,
      html:not([data-motion-setting="full"]) .ping .echo { display: none; }
      html:not([data-motion-setting="full"]) #abyss { transition: none; }
    }

    .art-frame { position: relative; overflow: hidden; border-radius: 24px; background: #04111f; margin: 0 0 12px; }
    .art-frame img, .art-fallback { display: block; width: 100%; max-height: 200px; object-fit: cover; }
    .art-fallback { min-height: 120px; background: radial-gradient(40% 80% at 70% 40%, rgba(139,124,255,.45), transparent 70%), linear-gradient(160deg, #0b3c54, #04111f); }
    .art-frame figcaption { position: absolute; left: 10px; bottom: 8px; border-radius: 999px; background: rgba(4,17,31,.72); color: #d5e4ec; font-size: 10px; letter-spacing: .12em; padding: 3px 8px; }
    .amount-hot { color: #f5b85a; font-size: 1.2rem; line-height: 1.1; overflow-wrap: anywhere; }
    .quiet { color: #8aa4b5; font-size: 12px; }
    .rank-row { display: grid; grid-template-columns: 28px minmax(0,1fr) minmax(0,34%); gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid rgba(231,246,248,.08); }
    .rank-bar { display: block; height: 6px; border-radius: 999px; background: rgba(231,246,248,.08); margin-top: 4px; }
    .rank-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1f8a9a, #f5b85a); }
    .flow-in, .flow-out { font-size: 12px; letter-spacing: .08em; }
    .flow-in { color: #8fd8e4; }
    .flow-out { color: #ffb199; }
    .flow-in::before { content: "↓ "; }
    .flow-out::before { content: "↑ "; }
    .graph-stage { background: radial-gradient(55% 45% at 50% 42%, rgba(31,138,154,.35), transparent 72%), linear-gradient(180deg, #071a2c, #04111f); }
    .offline-banner { position: relative; z-index: 5; max-width: 560px; margin: 0 auto; padding: 8px 16px; font-size: 12px; line-height: 1.5; color: #e7f6f8; background: rgba(139,124,255,.28); border-bottom: 1px solid rgba(139,124,255,.5); }
    .offline-banner strong { color: #c9c1ff; margin-right: 6px; }
    .summary { color: #e7f6f8; font-size: 14px; line-height: 1.6; border-left: 3px solid #55e5f2; padding: 2px 0 2px 12px; margin: 0; }
    .intel-chart { display: flex; flex-direction: column; gap: 6px; margin: 0; }
    .intel-bars { display: flex; align-items: flex-end; gap: 2px; height: 72px; }
    .intel-bars > span { position: relative; flex: 1 1 0; min-width: 2px; border-radius: 3px 3px 0 0; background: rgba(31,138,154,.75); overflow: hidden; }
    .intel-bars > span > i { position: absolute; left: 0; right: 0; bottom: 0; display: block; background: #f5b85a; }
    li.slim { list-style: none; border-bottom: 1px solid rgba(231,246,248,.08); }
    li.slim a { display: flex; flex-direction: column; min-height: 48px; justify-content: center; color: inherit; text-decoration: none; }
    .note-box, .demo-zone { border-radius: 20px; border: 1px solid rgba(231,246,248,.12); padding: 0 14px; }
    .note-box > summary, .demo-zone > summary { min-height: 44px; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; }
    .demo-zone { margin-top: 16px; border-color: rgba(139,124,255,.45); background: rgba(42,33,88,.35); }
    .formal-shot { margin: 16px 0 0; }
    .formal-shot img { display: block; width: 100%; height: auto; border-radius: 20px; border: 1px solid rgba(231,246,248,.15); }
    .formal-shot figcaption { margin-top: 8px; font-size: 12px; color: #8aa4b5; line-height: 1.5; }
    /* Inter 字体（SIL Open Font License 1.1，作者 Rasmus Andersson），已裁剪为拉丁字母、数字和常用符号 */
    @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(./assets/0229656fc7ada27ac16f.woff) format('woff'); }
    @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(./assets/3cc668e301c81ba76758.woff) format('woff'); }
    @font-face { font-family: 'Inter Display'; font-style: normal; font-weight: 600; font-display: swap; src: url(./assets/98daf7fe4b6d81c1ca1c.woff) format('woff'); }
    @font-face { font-family: 'Inter Display'; font-style: normal; font-weight: 700; font-display: swap; src: url(./assets/6759aec9ec86d6458a1b.woff) format('woff'); }

    /* ================================================================
       设计系统 v2：深海指挥舱
       ================================================================ */
    :root {
      --live: #3ee0a8; --violet: #a78bfa; --coral: #ff8a78; --gold: #f2b65e;
      --eth: #8fa4ff; --usdt: #2fc79a; --usdc: #4c9bff; --btc: #f7a440;
      --hull: rgba(4, 17, 28, 0.80); --hull-2: rgba(10, 34, 50, 0.62);
      --edge: rgba(140, 220, 236, 0.12); --edge-hi: rgba(140, 220, 236, 0.28);
      --topbar: 48px;
      --r-lg: 22px; --r-md: 16px; --r-sm: 10px;
    }
    body::before {
      content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
      background-image: linear-gradient(rgba(120, 210, 230, 0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(120, 210, 230, 0.045) 1px, transparent 1px);
      background-size: 32px 32px;
      mask-image: radial-gradient(120% 70% at 50% 0%, #000 20%, transparent 75%); -webkit-mask-image: radial-gradient(120% 70% at 50% 0%, #000 20%, transparent 75%);
    }
    .app { padding-top: calc(var(--topbar) + env(safe-area-inset-top)); }
    .num, .kpi-value, .amt, .usd, .tk b, .sec-idx, .ld-rank, time, .addr-full, .spec dd, .hs-item, .pulse-stats b, .radar-core b { font-variant-numeric: tabular-nums; }

    /* ---------- 顶部实时状态栏 ---------- */
    .topbar {
      position: fixed; top: 0; left: 0; right: 0; z-index: 30;
      height: calc(var(--topbar) + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 12px 0;
      display: flex; align-items: center; gap: 10px;
      background: linear-gradient(180deg, rgba(2, 9, 16, 0.92), rgba(2, 9, 16, 0.72));
      border-bottom: 1px solid var(--edge);
      -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    }
    .tb-brand { display: flex; align-items: center; gap: 8px; flex: none; font-family: var(--display); letter-spacing: 0.2em; font-size: 12px; }
    .tb-logo { width: 22px; height: 22px; border-radius: 7px; background: conic-gradient(from 210deg, #5fe3ee, #1b5f7a, #5fe3ee); box-shadow: 0 0 14px rgba(95, 227, 238, 0.45); position: relative; }
    .tb-logo::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: #031019; box-shadow: inset 0 0 0 2px rgba(95, 227, 238, 0.85); }
    .tb-name { display: none; }
    .tb-ticker { flex: 1; min-width: 0; display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; mask-image: linear-gradient(90deg, #000 85%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); }
    .tb-ticker::-webkit-scrollbar { display: none; }
    .tk { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; font-size: 12px; }
    .tk em { font-style: normal; font-size: 9px; letter-spacing: 0.16em; color: var(--mist); font-family: var(--mono); }
    .tk b { font-family: var(--mono); font-weight: 600; color: var(--foam); }
    .tk i { font-style: normal; color: var(--mist); font-size: 10px; }
    .tb-status { flex: none; }

    /* ---------- 状态徽章 ---------- */
    .lv { display: inline-flex; align-items: center; gap: 6px; flex: none; border-radius: 999px; padding: 3px 9px; font: 700 10px/1.2 var(--mono); letter-spacing: 0.16em; }
    .lv i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
    .lv-on { color: var(--live); border: 1px solid rgba(62, 224, 168, 0.55); background: rgba(62, 224, 168, 0.1); }
    .lv-on i { box-shadow: 0 0 0 0 rgba(62, 224, 168, 0.7); animation: live-dot 1.8s ease-out infinite; }
    .lv-stale { color: var(--gold); border: 1px solid rgba(242, 182, 94, 0.55); background: rgba(242, 182, 94, 0.08); }
    .lv-wait { color: var(--mist); border: 1px solid rgba(143, 176, 193, 0.4); }
    .lv-wait i { animation: wait-dot 1s ease-in-out infinite alternate; }
    @keyframes live-dot { 0% { box-shadow: 0 0 0 0 rgba(62, 224, 168, 0.7); } 100% { box-shadow: 0 0 0 7px rgba(62, 224, 168, 0); } }
    @keyframes wait-dot { from { opacity: 0.25; } to { opacity: 1; } }

    /* ---------- 首页英雄区 ---------- */
    .hero { min-height: calc(92dvh - var(--topbar)); }
    .hero-eyebrow { margin: 0 0 6px; font: 600 9px/1 var(--mono); letter-spacing: 0.32em; color: var(--sonar); opacity: 0.85; }
    .word { font-size: 1.6rem; letter-spacing: 0.2em; }
    .whale-wrap { min-height: 40vh; }
    .hero-live { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 16px 14px; padding: 10px 12px; border-radius: 14px; background: rgba(2, 12, 20, 0.62); border: 1px solid var(--edge); font-size: 12px; min-height: 44px; }
    .hs-item { display: inline-flex; gap: 6px; align-items: baseline; font-family: var(--mono); color: var(--foam); }
    .hs-item em { font: 400 10px var(--sans); color: var(--mist); font-style: normal; letter-spacing: 0.06em; }
    a.hs-item { color: var(--gold); }
    .shortcuts { padding-bottom: 24px; }

    /* ---------- 页头（带插画横幅） ---------- */
    .page-head { padding: 20px 16px 18px; overflow: hidden; }
    .page-head.has-art { padding-top: 132px; }
    .head-art { position: absolute; inset: 0 0 auto; height: 230px; z-index: 0; mask-image: linear-gradient(180deg, #000 30%, transparent 96%); -webkit-mask-image: linear-gradient(180deg, #000 30%, transparent 96%); }
    .head-art img { width: 100%; height: 100%; object-fit: cover; opacity: 0.62; display: block; }
    .art-cap { position: absolute; top: 12px; right: 12px; z-index: 1; font-size: 9px; letter-spacing: 0.14em; color: rgba(232, 246, 248, 0.7); background: rgba(2, 10, 18, 0.6); border-radius: 999px; padding: 3px 8px; }
    .head-inner { position: relative; z-index: 1; }
    .title { font-size: 2.05rem; font-weight: 600; letter-spacing: -0.01em; }
    .kicker { font-family: var(--mono); font-size: 10px; letter-spacing: 0.3em; }

    /* ---------- 模块 ---------- */
    .page-body { gap: 14px; position: relative; z-index: 1; }
    .home-body { padding-top: 16px; background: linear-gradient(180deg, rgba(2, 9, 16, 0.0), rgba(2, 9, 16, 0.55) 120px); }
    .mod { position: relative; border-radius: var(--r-lg); background: linear-gradient(180deg, var(--hull-2), var(--hull)); border: 1px solid var(--edge); box-shadow: inset 0 1px 0 rgba(200, 245, 255, 0.06), 0 20px 50px rgba(0, 0, 0, 0.28); min-width: 0; }
    .mod::before, .mod::after { content: ""; position: absolute; width: 14px; height: 14px; border-color: rgba(95, 227, 238, 0.55); border-style: solid; pointer-events: none; }
    .mod::before { top: -1px; left: -1px; border-width: 1px 0 0 1px; border-top-left-radius: var(--r-lg); }
    .mod::after { bottom: -1px; right: -1px; border-width: 0 1px 1px 0; border-bottom-right-radius: var(--r-lg); }
    .mod.zone { background: linear-gradient(180deg, rgba(48, 34, 96, 0.42), rgba(12, 10, 32, 0.72)); border: 1px dashed rgba(167, 139, 250, 0.45); }
    .mod.zone::before, .mod.zone::after { border-color: rgba(167, 139, 250, 0.6); }
    .sec-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 16px 0; }
    .sec-idx { flex: none; font: 600 11px/1 var(--mono); color: var(--sonar); padding: 6px 7px; border: 1px solid rgba(95, 227, 238, 0.35); border-radius: 8px; background: rgba(95, 227, 238, 0.06); }
    .sec-txt { flex: 1; min-width: 0; }
    .sec-txt h2 { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: 0.01em; }
    .sec-txt p { margin: 4px 0 0; color: var(--mist); font-size: 12px; line-height: 1.5; }
    .sec-badge { flex: none; display: inline-flex; align-items: center; gap: 6px; padding-top: 2px; }
    .mod-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
    .mod-tools { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
    .link-more { color: var(--sonar); font-size: 13px; min-height: 44px; display: inline-flex; align-items: center; }
    .sub-h { margin: 6px 0 0; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; color: var(--mist); }
    .src-line { margin: 0; color: rgba(143, 176, 193, 0.85); font-size: 11px; font-family: var(--mono); letter-spacing: 0.02em; line-height: 1.6; }
    .src-line:empty { display: none; }

    /* ---------- 数据模式切换条 ---------- */
    .mode-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: var(--r-md); background: linear-gradient(90deg, rgba(62, 224, 168, 0.10), rgba(4, 17, 28, 0.6) 60%); border: 1px solid rgba(62, 224, 168, 0.25); }
    .mode-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
    .mode-copy strong { font-size: 14px; }
    .mode-copy span { font-size: 11px; color: var(--mist); line-height: 1.4; }
    .mode-bar .stack > .meta { display: none; }
    .mode-bar .choice { flex-wrap: nowrap; }

    /* ---------- KPI ---------- */
    .kpi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .kpi-grid.kpi-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .kpi { position: relative; display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px; border-radius: var(--r-md); background: rgba(2, 12, 20, 0.55); border: 1px solid var(--edge); overflow: hidden; }
    .kpi-wide { grid-column: span 1; }
    .kpi-label { font: 600 9px/1.2 var(--mono); letter-spacing: 0.18em; color: var(--mist); text-transform: uppercase; }
    .kpi-value { font-family: var(--mono); font-size: 19px; font-weight: 600; color: var(--foam); line-height: 1.15; overflow-wrap: anywhere; }
    .kpi-value small { font-size: 11px; color: var(--mist); margin-left: 3px; font-weight: 400; }
    .kpi-sub { font-size: 11px; color: var(--mist); line-height: 1.45; }
    .kpi-sub a { color: var(--sonar); }
    .kpi-gold { background: linear-gradient(150deg, rgba(242, 182, 94, 0.16), rgba(2, 12, 20, 0.6) 60%); border-color: rgba(242, 182, 94, 0.3); }
    .kpi-gold .kpi-value { color: var(--gold); }
    .kpi-3 .kpi-value { font-size: 15px; white-space: nowrap; overflow-wrap: normal; letter-spacing: -0.02em; }
    .na { color: var(--mist); opacity: 0.6; }
    .spark { width: 100%; height: 26px; margin-top: 4px; overflow: visible; }
    .spark polyline, .spark line { fill: none; stroke-width: 1.5px; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
    .spark line { stroke: rgba(143, 176, 193, 0.25); stroke-dasharray: 2 4; }
    .sp-cyan polyline { stroke: var(--sonar); filter: drop-shadow(0 0 4px rgba(95, 227, 238, 0.6)); }
    .sp-gold polyline { stroke: var(--gold); filter: drop-shadow(0 0 4px rgba(242, 182, 94, 0.5)); }
    .chg { font-family: var(--mono); font-size: 11px; }
    .chg.up { color: var(--live); }
    .chg.down { color: var(--coral); }

    /* ---------- 交易流 ---------- */
    .feed { display: flex; flex-direction: column; border-radius: var(--r-md); background: rgba(1, 8, 14, 0.5); border: 1px solid var(--edge); overflow: hidden; }
    .feed > .row { padding: 10px 12px; border-radius: 0; }
    .feed > * + * { border-top: 1px solid rgba(140, 220, 236, 0.07); }
    .tx-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 58px; padding: 9px 12px; color: inherit; transition: background 0.25s; animation: row-in 0.6s var(--ease); }
    .tx-row:hover, .tx-row:focus-visible { background: rgba(95, 227, 238, 0.05); }
    .tx-row.static { animation: none; }
    @keyframes row-in { from { background: rgba(95, 227, 238, 0.14); } to { background: transparent; } }
    .tok { justify-self: start; font: 700 9px/1 var(--mono); letter-spacing: 0.08em; padding: 5px 6px; border-radius: 6px; border: 1px solid currentColor; }
    .tok-eth { color: var(--eth); background: rgba(143, 164, 255, 0.08); }
    .tok-usdt { color: var(--usdt); background: rgba(47, 199, 154, 0.08); }
    .tok-usdc { color: var(--usdc); background: rgba(76, 155, 255, 0.08); }
    .tok-btc { color: var(--btc); background: rgba(247, 164, 64, 0.08); }
    .tx-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
    .amt { font-family: var(--mono); font-size: 15px; color: var(--gold); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tx-route { font-family: var(--mono); font-size: 11px; color: var(--mist); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tx-route b { color: rgba(95, 227, 238, 0.7); margin: 0 5px; font-weight: 400; }
    .tx-side { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 11px; color: var(--mist); text-align: right; }
    .usd { font-family: var(--mono); color: var(--foam); font-size: 12px; }
    .empty { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 14px; color: var(--mist); font-size: 13px; line-height: 1.6; }
    .empty p { margin: 0; }
    .scanline { width: 100%; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--sonar), transparent); background-size: 40% 100%; background-repeat: no-repeat; animation: scan 1.4s linear infinite; }
    @keyframes scan { from { background-position: -40% 0; } to { background-position: 140% 0; } }

    /* ---------- 流量脉冲 ---------- */
    .pulse-stats, .radar-core { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .pulse-stats > div, .radar-core > div { display: flex; flex-direction: column; gap: 2px; padding: 10px; border-radius: 12px; background: rgba(2, 12, 20, 0.5); border: 1px solid var(--edge); min-width: 0; }
    .pulse-stats em, .radar-core em { font: 600 9px var(--mono); letter-spacing: 0.14em; color: var(--mist); font-style: normal; }
    .pulse-stats b, .radar-core b { font: 600 18px var(--mono); color: var(--foam); }
    .pulse-stats span, .radar-core span { font-size: 10px; color: var(--mist); overflow-wrap: anywhere; }
    .pulse-bars { display: flex; align-items: flex-end; gap: 3px; height: 96px; padding: 8px 6px 0; border-bottom: 1px solid var(--edge-hi); background: repeating-linear-gradient(0deg, rgba(140, 220, 236, 0.05) 0 1px, transparent 1px 24px); border-radius: 10px 10px 0 0; }
    .pulse-bars > span { flex: 1 1 0; min-width: 4px; height: 100%; display: flex; flex-direction: column-reverse; gap: 1px; }
    .pulse-bars i { display: block; border-radius: 2px; }
    .seg-eth { background: linear-gradient(0deg, rgba(242, 182, 94, 0.55), var(--gold)); }
    .seg-st { background: linear-gradient(0deg, rgba(47, 199, 154, 0.5), var(--usdt)); }
    .seg-zero { height: 2px; background: rgba(140, 220, 236, 0.2); }
    .axis { display: flex; justify-content: space-between; align-items: center; gap: 8px; font: 10px var(--mono); color: var(--mist); }
    .legend, .legend-row { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: 11px; color: var(--mist); }
    .legend i, .legend-row i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }
    .lg-eth { background: var(--gold); } .lg-st, .lg-usdt { background: var(--usdt); } .lg-usdc { background: var(--usdc); }

    /* ---------- 雷达 ---------- */
    .radar-grid { display: flex; flex-direction: column; gap: 14px; }
    .radar-scope { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
    .dial { width: min(100%, 340px); }
    .cross-h { position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(95, 227, 238, 0.14); }
    .cross-v { position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: rgba(95, 227, 238, 0.14); }
    .core-dot { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    .ring-label { position: absolute; left: 51.5%; z-index: 1; font: 9px var(--mono); color: rgba(143, 176, 193, 0.65); pointer-events: none; }
    .ping-layer { position: absolute; inset: 0; z-index: 3; }
    .ping-sm span { width: 7px; height: 7px; }
    .ping-lg span { width: 11px; height: 11px; }
    .ping-xl span { width: 15px; height: 15px; }
    .ping-usdt span { background: radial-gradient(circle, #eafff7 0 30%, var(--usdt) 62%); box-shadow: 0 0 12px rgba(47, 199, 154, 0.9); }
    .ping-usdc span { background: radial-gradient(circle, #eef5ff 0 30%, var(--usdc) 62%); box-shadow: 0 0 12px rgba(76, 155, 255, 0.9); }
    .ping-eth span { background: radial-gradient(circle, #fff6e6 0 30%, var(--gold) 62%); box-shadow: 0 0 12px rgba(242, 182, 94, 0.9); }
    .ping-usdt .echo { border-color: rgba(47, 199, 154, 0.7); } .ping-usdc .echo { border-color: rgba(76, 155, 255, 0.7); } .ping-eth .echo { border-color: rgba(242, 182, 94, 0.7); }

    /* ---------- 活跃地址 ---------- */
    .search { display: block; }
    .search .field { min-height: 50px; padding-left: 40px; border-radius: var(--r-md); background: rgba(2, 10, 18, 0.8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fb0c1' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E") 12px 50% / 18px no-repeat; }
    .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .leader { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
    .leader li { display: grid; grid-template-columns: 30px minmax(0, 1fr) 44px; align-items: center; gap: 8px; border-bottom: 1px solid rgba(140, 220, 236, 0.07); }
    .ld-rank { font: 600 12px var(--mono); color: var(--mist); }
    .leader li:nth-child(-n+3) .ld-rank { color: var(--gold); }
    .ld-main { display: flex; flex-direction: column; gap: 5px; padding: 10px 0; min-width: 0; color: inherit; }
    .ld-main strong { font-family: var(--mono); font-size: 14px; font-weight: 600; }
    .ld-bar { display: flex; height: 5px; border-radius: 99px; background: rgba(140, 220, 236, 0.08); overflow: hidden; }
    .ld-bar i { display: block; height: 100%; }
    .ld-bar .in { background: var(--sonar); } .ld-bar .out { background: var(--coral); }
    .ld-meta { font-size: 11px; color: var(--mist); }
    .star { min-height: 44px; min-width: 44px; border-radius: 12px; font-size: 18px; color: var(--mist); }
    .star[aria-pressed="true"] { color: var(--gold); text-shadow: 0 0 12px rgba(242, 182, 94, 0.6); }

    /* ---------- 实时航线图 ---------- */
    .flow-layer { position: absolute; inset: 0; }
    .flow-layer .lines { position: absolute; inset: 0; width: 100%; height: 100%; }
    .fl { fill: none; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: 0.55; }
    .fl-eth { stroke: var(--gold); } .fl-usdt { stroke: var(--usdt); } .fl-usdc { stroke: var(--usdc); }
    .fl-run { fill: none; stroke: #f2fbff; stroke-width: 1.4px; stroke-dasharray: 1 9; vector-effect: non-scaling-stroke; opacity: 0.7; animation: current-run 2.2s linear infinite; }
    .flow-tag { font: 600 9px var(--mono); padding: 3px 6px; border-radius: 6px; background: rgba(2, 10, 18, 0.88); border: 1px solid currentColor; white-space: nowrap; }
    .flow .flow-tag.tok-eth { color: var(--gold); }
    .addr-badge { width: 34px; height: 34px; font-size: 11px; border: 1px solid; }
    .addr-badge.is-out { color: var(--coral); border-color: rgba(255, 138, 120, 0.7); background: radial-gradient(circle at 40% 30%, #3a1d1d, #0a0f18 70%); box-shadow: 0 0 16px rgba(255, 138, 120, 0.25); }
    .addr-badge.is-in { color: var(--sonar); border-color: rgba(95, 227, 238, 0.7); background: radial-gradient(circle at 40% 30%, #14465c, #061623 70%); box-shadow: 0 0 16px rgba(95, 227, 238, 0.25); }
    .node small { font-family: var(--mono); font-size: 9.5px; width: 5.4rem; }
    .flow-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 20px; }
    .map { height: 28rem; }

    /* ---------- 规格表、地址头 ---------- */
    .spec { margin: 0; display: flex; flex-direction: column; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.55); overflow: hidden; }
    .spec > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding: 11px 14px; align-items: baseline; }
    .spec > div + div { border-top: 1px solid rgba(140, 220, 236, 0.07); }
    .spec dt { color: var(--mist); font-size: 12px; }
    .spec dd { margin: 0; font-family: var(--mono); font-size: 12.5px; overflow-wrap: anywhere; }
    .spec dd a { color: var(--sonar); }
    .spec-grid { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .spec-grid > div { padding: 12px; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.55); }
    .spec-grid dt { font: 600 9px var(--mono); letter-spacing: 0.16em; color: var(--mist); }
    .spec-grid dd { margin: 6px 0 0; font-size: 15px; }
    .addr-hero, .hash-hero, .amount-hero { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: var(--r-lg); background: linear-gradient(140deg, rgba(95, 227, 238, 0.10), rgba(4, 17, 28, 0.8) 55%); border: 1px solid var(--edge-hi); }
    .addr-full { font-family: var(--mono); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; color: var(--foam); letter-spacing: 0.02em; }
    .amount-hero strong { font-family: var(--mono); font-size: 2rem; color: var(--gold); line-height: 1.1; overflow-wrap: anywhere; }
    .amount-hero > span:last-child { font-family: var(--mono); color: var(--mist); font-size: 12px; }
    .btn-row { display: flex; flex-wrap: wrap; gap: 8px; }
    .btn-row > * { flex: 1 1 auto; }
    .btn-row .pill { width: auto; }
    .wide-btn { width: 100%; }
    .tool-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
    .tool-btn svg { width: 14px; height: 14px; }
    .solid-btn { background: linear-gradient(180deg, rgba(95, 227, 238, 0.28), rgba(95, 227, 238, 0.12)); border-color: rgba(95, 227, 238, 0.6); color: var(--foam); font-weight: 600; }
    .ghost { border-color: transparent; color: var(--mist); }
    .tool-btn.is-focus { border-color: var(--gold); color: var(--gold); }

    /* ---------- 名录卡片 ---------- */
    .whale-cards { display: grid; grid-template-columns: 1fr; gap: 12px; }
    .whale-card { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: var(--r-lg); border: 1px solid var(--edge); overflow: hidden; background: linear-gradient(160deg, rgba(14, 50, 70, 0.75), rgba(3, 14, 24, 0.9)); }
    .whale-card::after { content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(95, 227, 238, 0.16), transparent 70%); }
    .wc-1 { background: linear-gradient(160deg, rgba(62, 40, 96, 0.7), rgba(5, 12, 24, 0.9)); }
    .wc-1::after { background: radial-gradient(circle, rgba(167, 139, 250, 0.2), transparent 70%); }
    .wc-2 { background: linear-gradient(160deg, rgba(70, 52, 20, 0.6), rgba(5, 14, 22, 0.9)); }
    .wc-2::after { background: radial-gradient(circle, rgba(242, 182, 94, 0.18), transparent 70%); }
    .wc-link { display: flex; flex-direction: column; gap: 8px; color: inherit; position: relative; z-index: 1; }
    .wc-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
    .wc-cat { font: 600 10px var(--mono); letter-spacing: 0.14em; color: var(--sonar); }
    .wc-link strong { font-size: 20px; }
    .wc-bal { font-family: var(--mono); font-size: 22px; color: var(--gold); display: flex; align-items: baseline; gap: 8px; }
    .wc-bal em { font: 400 10px var(--sans); color: var(--mist); font-style: normal; }
    .wc-sum { color: var(--mist); font-size: 13px; line-height: 1.6; }

    /* ---------- 实验室 ---------- */
    .lab-pair { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: stretch; }
    .lab-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.6); min-width: 0; }
    .lab-card.left { border-top: 2px solid var(--sonar); } .lab-card.right { border-top: 2px solid var(--violet); }
    .lab-value { font-family: var(--mono); color: var(--gold); font-size: 17px; overflow-wrap: anywhere; }
    .vs { align-self: center; font: 700 11px var(--mono); color: var(--mist); letter-spacing: 0.1em; }
    .pair.cmp article { padding: 12px; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.5); min-width: 0; }

    /* ---------- 时间线与航迹 ---------- */
    .trail { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 1px solid rgba(95, 227, 238, 0.25); display: flex; flex-direction: column; gap: 10px; }
    .trail li { position: relative; }
    .tr-node { position: absolute; left: -19px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--sonar); box-shadow: 0 0 10px rgba(95, 227, 238, 0.8); }
    .trail li:first-child .tr-node { background: var(--live); box-shadow: 0 0 0 4px rgba(62, 224, 168, 0.18), 0 0 14px rgba(62, 224, 168, 0.8); }
    .tr-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; font-size: 12px; color: var(--mist); }
    .tr-head strong { font-family: var(--mono); color: var(--foam); font-size: 13px; }
    .trail .tx-row { padding-left: 0; padding-right: 0; min-height: 50px; }
    .timeline li { list-style: none; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.5); padding: 2px 6px; }

    /* ---------- 船长中心 ---------- */
    .tile-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .stat-tile { display: flex !important; flex-direction: column; gap: 6px; min-height: 108px; padding: 14px; border-radius: var(--r-md); border: 1px solid var(--edge); background: rgba(2, 12, 20, 0.6); color: inherit; position: relative; overflow: hidden; }
    .stat-tile strong { font-size: 15px; }
    .st-idx { font: 600 10px var(--mono); color: var(--mist); }
    .stat-tile.gold { background: linear-gradient(150deg, rgba(242, 182, 94, 0.18), rgba(2, 12, 20, 0.7) 60%); border-color: rgba(242, 182, 94, 0.3); }
    .stat-tile.violet { background: linear-gradient(150deg, rgba(167, 139, 250, 0.2), rgba(2, 12, 20, 0.7) 60%); border-color: rgba(167, 139, 250, 0.3); }
    .stat-tile.coral { background: linear-gradient(150deg, rgba(255, 138, 120, 0.18), rgba(2, 12, 20, 0.7) 60%); border-color: rgba(255, 138, 120, 0.3); }
    .hl { list-style: none; margin: 0; padding: 0; border-radius: var(--r-md); border: 1px solid var(--edge); overflow: hidden; }
    .hl-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; background: rgba(2, 12, 20, 0.5); }
    .hl-row + .hl-row { border-top: 1px solid rgba(140, 220, 236, 0.07); }
    .hl-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
    .hl-main strong { font-size: 14px; }
    .hl-main span { font: 11px var(--mono); color: var(--mist); overflow-wrap: anywhere; }
    .set-list { display: flex; flex-direction: column; border-radius: var(--r-md); border: 1px solid var(--edge); overflow: hidden; }
    .set-row { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: rgba(2, 12, 20, 0.45); }
    .set-row + .set-row { border-top: 1px solid rgba(140, 220, 236, 0.07); }
    .set-row > div:first-child { display: flex; flex-direction: column; gap: 3px; }
    .set-row strong { font-size: 14px; }
    .set-row span { font-size: 12px; color: var(--mist); line-height: 1.5; }
    .set-row .stack > .meta { display: none; }
    .render-state { font-family: var(--mono); color: var(--sonar) !important; margin: 0; }
    .assign { display: flex; flex-direction: column; gap: 6px; }
    .chip-link { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--edge); font: 12px var(--mono); color: var(--mist); white-space: nowrap; }
    .choice.wrap { flex-wrap: wrap; overflow: visible; }

    /* ---------- 折叠区、快照工具 ---------- */
    .fold { border-radius: var(--r-lg); border: 1px solid var(--edge); background: rgba(3, 14, 24, 0.7); }
    .fold > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 16px; cursor: pointer; }
    .fold > summary::-webkit-details-marker { display: none; }
    .fold > summary::after { content: "+"; font: 18px var(--mono); color: var(--sonar); }
    .fold[open] > summary::after { content: "−"; }
    .fold-title { font-weight: 600; font-size: 15px; }
    .fold-sub { flex: 1; font-size: 12px; color: var(--mist); text-align: right; }
    .fold-body { padding: 0 16px 16px; }
    .explore { display: flex; flex-direction: column; gap: 12px; }
    .snap-hero { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; padding: 16px; border-radius: var(--r-md); background: linear-gradient(150deg, rgba(242, 182, 94, 0.2), rgba(8, 36, 59, 0.6) 70%); border: 1px solid rgba(242, 182, 94, 0.35); }
    .snap-hero .tag { flex-basis: 100%; justify-content: flex-start; width: fit-content; }
    .snap-hero strong { font: 600 2.4rem/1 var(--mono); color: var(--gold); }
    .snap-hero span:last-child { font-size: 12px; color: var(--mist); }
    .seek-row { display: flex; gap: 8px; }
    .seek-row .field { flex: 1; min-width: 0; }
    .seek-row .tool-btn { flex: none; }
    .tool-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
    .rank { list-style: none; margin: 0; padding: 0; }
    .rank-row { grid-template-columns: 26px minmax(0, 1fr) auto; border-bottom-color: rgba(140, 220, 236, 0.07); padding: 10px 0; }
    .rank-row .rk { font: 600 12px var(--mono); color: var(--mist); }
    .rank-row.is-active { background: rgba(242, 182, 94, 0.1); border-radius: 10px; }
    .rank-row .amount-hot, .slim-list .amount-hot { font-family: var(--mono); font-size: 15px; }
    .rank-row > span:first-child.flow-in, .rank-row > span:first-child.flow-out { font-size: 11px; }
    .rank-row:has(.flow-in, .flow-out) { grid-template-columns: 70px minmax(0, 1fr) auto; }
    .verify { font-size: 12px; color: var(--sonar); min-height: 44px; display: inline-flex; align-items: center; padding: 0 4px; }
    .min-w-0 { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
    .addr-list { display: flex; flex-direction: column; border-radius: var(--r-md); border: 1px solid var(--edge); overflow: hidden; }
    .addr-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 50px; padding: 0 14px; color: inherit; font-family: var(--mono); font-size: 13px; }
    .addr-row + .addr-row { border-top: 1px solid rgba(140, 220, 236, 0.07); }
    .addr-row em { font: 400 10px var(--sans); color: var(--mist); font-style: normal; margin-left: 8px; }
    .addr-row .amount-hot { font-size: 14px; }
    .slim-list { margin: 0; padding: 0; }
    .slim-list li { list-style: none; }
    .slim-list li.slim a, .slim-list a { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 52px; padding: 6px 0; color: inherit; border-bottom: 1px solid rgba(140, 220, 236, 0.07); flex-direction: row; }
    .slim-list .quiet { font-family: var(--mono); text-align: right; }
    .summary { font-size: 13px; color: rgba(232, 246, 248, 0.86); }
    .intel-bars { height: 84px; gap: 3px; }
    .intel-bars > span { background: linear-gradient(0deg, rgba(31, 138, 154, 0.5), rgba(95, 227, 238, 0.85)); border-radius: 3px 3px 0 0; }
    .intel-bars > span > i { background: linear-gradient(0deg, #c88a2e, var(--gold)); }
    .idx-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
    .formal-shot { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; }
    .phone { width: min(220px, 70%); padding: 8px; border-radius: 30px; background: linear-gradient(160deg, #1d3a4c, #050d15); border: 1px solid rgba(232, 246, 248, 0.18); box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.04); }
    .phone img { border-radius: 22px !important; border: 0 !important; display: block; width: 100%; height: auto; }
    .formal-shot figcaption { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
    .note-box { border-radius: var(--r-md); }
    .demo-zone { margin: 0; padding: 4px 4px 4px; border: 0; background: none; }
    .demo-zone .row { border-radius: 12px; }

    /* ---------- 警报 ---------- */
    .alert-card { display: flex; flex-direction: column; gap: 4px; padding: 14px 14px 14px 18px; border-radius: var(--r-md); border: 1px solid var(--edge); color: inherit; }
    .alert-card strong { font-size: 15px; }
    .rule-card { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px; border-radius: var(--r-md); border: 1px dashed rgba(167, 139, 250, 0.5); background: rgba(48, 34, 96, 0.25); }
    .form-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 10px; }

    /* ---------- 页脚 ---------- */
    .sources { padding: 18px 4px 4px; border-top: 1px solid var(--edge); color: var(--mist); font-size: 12px; line-height: 1.7; }
    .src-grid { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 12px; }
    .src-grid div { display: flex; gap: 10px; }
    .src-grid em { flex: none; width: 52px; font: 600 10px var(--mono); letter-spacing: 0.14em; color: var(--sonar); font-style: normal; padding-top: 3px; }
    .src-grid span { font-family: var(--mono); font-size: 11px; overflow-wrap: anywhere; }
    .sources p { margin: 0; }
    .sources .demo, .sources .tag { margin: 0 4px; vertical-align: 1px; }

    /* ---------- 通用控件微调 ---------- */
    .choice button { min-height: 40px; font-size: 13px; padding: 0 13px; }
    .choice button[aria-pressed="true"] { font-weight: 600; }
    .field { font-family: var(--sans); }
    .glass.card { border-radius: var(--r-lg); }
    .page-body > .glass.card .lede { margin-top: 10px; }
    .note a { color: var(--sonar); }
    .note svg { width: 12px; height: 12px; vertical-align: -1px; }
    .profile-whale { min-height: 220px; }
    html.gl .profile-whale { min-height: 240px; }
    .graph-stage { height: 200px; position: relative; overflow: hidden; border-radius: var(--r-md); border: 1px solid var(--edge); padding: 10px; }
    .graph-stage .tool-btn { margin: 4px; }

    @media (min-width: 420px) { .tb-name { display: inline; } }
    @media (min-width: 640px) {
      .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .tool-grid { grid-template-columns: 1fr 1fr; }
      .whale-cards { grid-template-columns: 1fr 1fr; }
      .src-grid { grid-template-columns: repeat(3, 1fr); }
    }
    /* ---------- 桌面：两栏指挥舱 ---------- */
    @media (min-width: 960px) {
      :root { --topbar: 54px; }
      .app { width: min(1180px, calc(100% - 48px)); }
      .page-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; padding-left: 0; padding-right: 0; }
      .page-body > * { grid-column: 1 / -1; }
      .page-body > .mod:not(.wide) { grid-column: auto; }
      .page-head { padding-left: 0; padding-right: 0; }
      .page-head.has-art { padding-top: 170px; }
      .head-art { height: 300px; left: -24px; right: -24px; }
      .head-inner { max-width: 720px; }
      .title { font-size: 2.6rem; }
      .hero { min-height: calc(86dvh - var(--topbar)); }
      .hero-top, .hero-caption { padding-left: 0; padding-right: 0; }
      .hero-live { margin-left: 0; margin-right: 0; max-width: 720px; }
      .shortcuts { padding-left: 0; padding-right: 0; max-width: 560px; }
      .home-body { padding-top: 24px; }
      .kpi-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
      .kpi-grid .kpi-wide { grid-column: span 1; }
      .kpi-grid.kpi-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .idx-grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); align-items: start; }
      .radar-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
      .dial { width: min(100%, 420px); }
      .whale-cards { grid-template-columns: repeat(3, 1fr); }
      .tile-row { grid-template-columns: repeat(4, 1fr); }
      .nav { bottom: 14px; }
      .nav-inner { width: 520px; border-radius: 22px; border: 1px solid var(--edge-hi); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); }
      .page-body { padding-bottom: 7rem; }
      .map { height: 32rem; }
    }

    html[data-motion-setting="reduced"] .lv-on i, html[data-motion-setting="reduced"] .tx-row, html[data-motion-setting="reduced"] .fl-run, html[data-motion-setting="reduced"] .scanline { animation: none; }
    html[data-motion="paused"] .fl-run, html[data-motion="paused"] .lv-on i { animation-play-state: paused; }
    @media (prefers-reduced-motion: reduce) {
      html:not([data-motion-setting="full"]) .lv-on i, html:not([data-motion-setting="full"]) .tx-row, html:not([data-motion-setting="full"]) .fl-run, html:not([data-motion-setting="full"]) .scanline { animation: none; }
    }
    .node.right small { top: 50%; left: auto; right: calc(100% + 6px); transform: translateY(-50%); width: auto; text-align: right; white-space: nowrap; }
    .node:not(.right) small { white-space: nowrap; width: auto; }
    .pair.cmp a { min-height: 0; display: inline; }
    .tag, .lv, .demo { white-space: nowrap; }
    .radar-core .tag, .radar-core .lv { align-self: flex-start; font-size: 9px; letter-spacing: 0.1em; padding: 3px 7px; }

    /* ================================================================
       字体统一：中文用系统黑体，拉丁字母和数字用 Inter，标题用 Inter Display，
       只有地址和哈希用等宽字体。
       ================================================================ */
    :root {
      --sans: "Inter", "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
      --display: "Inter Display", "Inter", "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", system-ui, sans-serif;
      --mono: var(--sans);
      --code: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;
    }
    html, body { font-family: var(--sans); font-feature-settings: "tnum" 1, "cv11" 1; letter-spacing: 0.005em; }
    .title, .word, .sec-txt h2, .fold-title, .wc-link strong, .amount-hero strong, .snap-hero strong, .kpi-value, .stat-tile strong, .hero-caption { font-family: var(--display); }
    .word { font-weight: 700; letter-spacing: 0.24em; font-size: 1.5rem; }
    .tb-brand { font-family: var(--display); font-weight: 700; letter-spacing: 0.18em; }
    .title { font-weight: 700; letter-spacing: -0.015em; }
    .sec-txt h2 { font-weight: 700; font-size: 18px; letter-spacing: -0.005em; }
    .kicker, .kpi-label, .tk em, .hero-eyebrow, .sub-h, .story-tag, .wc-cat, .st-idx, .spec-grid dt, .pulse-stats em, .radar-core em, .src-grid em { font-family: var(--sans); font-weight: 600; letter-spacing: 0.14em; }
    .kpi-value { font-weight: 700; letter-spacing: -0.02em; font-size: 22px; }
    .kpi-3 .kpi-value { font-size: 17px; }
    .amt { font-weight: 700; font-size: 16px; letter-spacing: -0.01em; }
    .usd, .tk b, .hs-item, .pulse-stats b, .radar-core b { font-weight: 600; }
    .tx-route, .addr, .addr-full, .spec dd, .src-line, .hl-main span, .src-grid span, .addr-row, .chip-link, .node small, .ld-main strong, .slim-list .quiet, .tr-head strong, .graph-stage .tool-btn { font-family: var(--code); }
    .src-line { font-size: 10.5px; }
    .lede { font-size: 14.5px; line-height: 1.7; }
    .lv, .tok, .sec-idx, .flow-tag, .ring-label, .axis, .bearing text { font-family: var(--sans); font-weight: 700; }

    /* ---------- 海洋生物分级 ---------- */
    .cr { --eye: #04121d; position: relative; flex: none; display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; color: var(--c, var(--sonar)); background: radial-gradient(120% 120% at 30% 20%, color-mix(in srgb, var(--c, #5fe3ee) 26%, transparent), rgba(2, 12, 20, 0.6) 70%); border: 1px solid color-mix(in srgb, var(--c, #5fe3ee) 40%, transparent); overflow: hidden; }
    .cr svg { width: 26px; height: 26px; fill: currentColor; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--c, #5fe3ee) 60%, transparent)); }
    .cr-eth { --c: var(--gold); } .cr-usdt { --c: var(--usdt); } .cr-usdc { --c: var(--usdc); } .cr-btc { --c: var(--btc); }
    .cr.c-sm svg { width: 22px; height: 22px; opacity: 0.85; }
    .cr.c-md svg { width: 25px; height: 25px; }
    .cr.c-lg svg { width: 29px; height: 29px; }
    .cr.c-xl svg { width: 33px; height: 33px; }
    .cr.c-xl { box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 14%, transparent), 0 0 22px color-mix(in srgb, var(--c) 35%, transparent); }
    .cr.c-xl::after, .cr.c-lg::after { content: ""; position: absolute; inset: auto -20% -60% -20%; height: 70%; background: radial-gradient(closest-side, rgba(255, 255, 255, 0.16), transparent); animation: cr-glint 4.5s ease-in-out infinite; }
    .cr svg { animation: cr-swim 3.6s ease-in-out infinite; transform-origin: 50% 60%; }
    .cr.c-sm svg { animation-duration: 2.2s; }
    @keyframes cr-swim { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-2deg); } 50% { transform: translate3d(0, -1.5px, 0) rotate(2deg); } }
    @keyframes cr-glint { 0%, 100% { transform: translateY(0); opacity: 0.5; } 50% { transform: translateY(-30%); opacity: 1; } }
    .cr-kpi { width: 30px; height: 30px; border-radius: 10px; vertical-align: -8px; margin-right: 8px; }
    .cr-kpi svg { width: 22px !important; height: 22px !important; }
    .tier { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; padding: 2px 7px; border-radius: 999px; color: var(--mist); background: rgba(140, 220, 236, 0.08); }
    .tier.c-xl { color: #1b0f00; background: linear-gradient(90deg, #ffd38a, var(--gold)); }
    .tier.c-lg { color: var(--gold); background: rgba(242, 182, 94, 0.14); }
    .tier.c-md { color: var(--sonar); background: rgba(95, 227, 238, 0.12); }

    /* ---------- 地址头像 ---------- */
    .av { --s: 16px; flex: none; display: inline-block; width: var(--s); height: var(--s); border-radius: 50%; background: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.55), transparent 32%), conic-gradient(from var(--r), hsl(var(--h1) 75% 58%), hsl(var(--h2) 70% 46%), hsl(calc(var(--h1) + 30) 80% 62%), hsl(var(--h1) 75% 58%)); box-shadow: 0 0 0 1.5px rgba(2, 12, 20, 0.9), 0 0 10px hsla(var(--h1), 80%, 60%, 0.35); }
    .av-lg { --s: 30px; }
    .av-xl { --s: 52px; box-shadow: 0 0 0 2px rgba(2, 12, 20, 0.9), 0 0 0 4px hsla(var(--h1), 80%, 60%, 0.35), 0 0 30px hsla(var(--h1), 80%, 60%, 0.4); }
    .av-node { --s: 100%; position: absolute; inset: 0; opacity: 0.55; }
    .addr-badge { position: relative; overflow: hidden; }
    .addr-badge b { position: relative; z-index: 1; text-shadow: 0 1px 4px #000; }
    .addr-id { display: flex; align-items: center; gap: 14px; }
    .leader li { grid-template-columns: 26px 30px minmax(0, 1fr) 44px; }

    /* ---------- 新版交易行：生物 + 游动路线 ---------- */
    .tx-row.v2 { grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; min-height: 66px; padding: 10px 12px; }
    .tx-top { display: flex; align-items: center; gap: 7px; min-width: 0; }
    .tx-top .tok { padding: 3px 5px; font-size: 9px; }
    .swim { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 11px; color: var(--mist); }
    .swim .addr { white-space: nowrap; font-size: 10.5px; }
    .lane { flex: 1 1 18px; min-width: 14px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent 0 30%, currentColor 30% 60%, transparent 60%) 0 0 / 10px 2px repeat-x; color: rgba(95, 227, 238, 0.7); animation: lane-swim 0.9s linear infinite; position: relative; }
    .lane::after { content: ""; position: absolute; right: -2px; top: -3px; border: 4px solid transparent; border-left: 5px solid currentColor; border-right: 0; }
    .lane-eth { color: rgba(242, 182, 94, 0.8); } .lane-usdt { color: rgba(47, 199, 154, 0.8); } .lane-usdc { color: rgba(76, 155, 255, 0.85); }
    @keyframes lane-swim { to { background-position: 10px 0; } }
    @media (max-width: 380px) { .swim .addr:last-of-type { display: none; } }

    /* ---------- 海况播报 ---------- */
    .story { position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 18px; background: linear-gradient(110deg, rgba(95, 227, 238, 0.12), rgba(4, 17, 28, 0.82) 55%); border: 1px solid rgba(95, 227, 238, 0.24); overflow: hidden; min-height: 92px; }
    .story::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.05) 50%, transparent 70%) -100% 0 / 60% 100% no-repeat; animation: story-sheen 7s ease-in-out infinite; pointer-events: none; }
    @keyframes story-sheen { 0%, 60% { background-position: -100% 0; } 100% { background-position: 260% 0; } }
    .story-hero { position: relative; z-index: 2; margin: 0 16px 14px; background: linear-gradient(110deg, rgba(95, 227, 238, 0.14), rgba(2, 12, 20, 0.7) 60%); }
    .story-ico { flex: none; width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; color: var(--sonar); background: rgba(95, 227, 238, 0.1); border: 1px solid rgba(95, 227, 238, 0.3); }
    .story-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
    .story-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
    .story-tag { font-size: 10px; color: var(--sonar); }
    .story-text { margin: 0; font-size: 15px; line-height: 1.65; color: rgba(232, 246, 248, 0.94); animation: story-in 0.7s var(--ease); }
    .story-text b { color: var(--foam); font-weight: 700; }
    .story-text b.up { color: var(--live); } .story-text b.down { color: var(--coral); }
    .story-text .hl-c-xl, .story-text .hl-c-lg { color: var(--gold); }
    @keyframes story-in { from { opacity: 0; transform: translate3d(0, 8px, 0); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
    .story-dots { display: flex; gap: 4px; }
    .story-dots i { width: 14px; height: 3px; border-radius: 3px; background: rgba(140, 220, 236, 0.18); }
    .story-dots i.on { background: var(--sonar); width: 22px; }

    /* ---------- 巨鲸浮出提示 ---------- */
    .toast { position: fixed; z-index: 40; left: 50%; top: calc(var(--topbar) + env(safe-area-inset-top) + 10px); width: min(92vw, 420px); transform: translate(-50%, -16px); opacity: 0; pointer-events: none; transition: opacity 0.45s var(--ease), transform 0.6s var(--ease); }
    .toast.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
    .toast-card { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 18px; color: var(--foam); background: linear-gradient(120deg, rgba(242, 182, 94, 0.22), rgba(3, 14, 24, 0.95) 55%); border: 1px solid rgba(242, 182, 94, 0.45); box-shadow: 0 18px 50px rgba(0, 0, 0, 0.55), 0 0 30px rgba(242, 182, 94, 0.18); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
    .toast-card .cr-big { width: 52px; height: 52px; border-radius: 16px; }
    .toast-card .cr-big svg { width: 40px; height: 40px; }
    .toast-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
    .toast-body em { font-style: normal; font-size: 11px; color: var(--gold); font-weight: 600; letter-spacing: 0.06em; }
    .toast-body strong { font-family: var(--display); font-size: 18px; }
    .toast-body span { font-family: var(--code); font-size: 10.5px; color: var(--mist); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    /* ---------- KPI 表情 ---------- */
    .flash-up, .flash-down { border-radius: 6px; animation: flash 1.3s var(--ease); }
    .flash-up { --fc: rgba(62, 224, 168, 0.45); } .flash-down { --fc: rgba(255, 138, 120, 0.45); }
    @keyframes flash { 0% { background: var(--fc); box-shadow: 0 0 0 4px var(--fc); } 100% { background: transparent; box-shadow: 0 0 0 4px transparent; } }
    .tk b.flash-up { color: var(--live); } .tk b.flash-down { color: var(--coral); }
    .kpi { transition: transform 0.35s var(--ease), border-color 0.35s; }
    .kpi:hover { transform: translateY(-2px); border-color: var(--edge-hi); }
    .kpi::before { content: ""; position: absolute; inset: -40% -40% auto auto; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(closest-side, rgba(95, 227, 238, 0.12), transparent); pointer-events: none; }
    .kpi-gold::before { background: radial-gradient(closest-side, rgba(242, 182, 94, 0.2), transparent); }
    .gauge-svg { width: 100%; max-width: 132px; height: auto; margin-top: 2px; }
    .g-track, .g-fill { fill: none; stroke-width: 7; stroke-linecap: round; }
    .g-track { stroke: rgba(140, 220, 236, 0.12); }
    .g-fill { stroke: var(--sonar); filter: drop-shadow(0 0 4px rgba(95, 227, 238, 0.6)); transition: stroke-dasharray 0.8s var(--ease); }
    .g-needle { stroke: var(--foam); stroke-width: 2; stroke-linecap: round; transform-origin: 50px 50px; transition: transform 1s var(--ease); }
    .g-hub { fill: var(--foam); }
    .kpi-block { padding-right: 46px; }
    .cd { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; transform: rotate(-90deg); }
    .cd-track, .cd-fill { fill: none; stroke-width: 2.6; }
    .cd-track { stroke: rgba(140, 220, 236, 0.14); }
    .cd-fill { stroke: var(--live); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; animation: cd-fill 12s linear forwards; }
    @keyframes cd-fill { to { stroke-dashoffset: 0; } }
    .pulse-bars > span.fresh i { animation: bar-grow 0.9s var(--ease); transform-origin: bottom; }
    @keyframes bar-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }

    /* ---------- 模块质感 ---------- */
    .mod { transition: border-color 0.4s, box-shadow 0.4s; }
    .mod:hover { border-color: var(--edge-hi); }
    .mod:has([data-live]) .sec-head::after { content: ""; position: absolute; left: 16px; right: 16px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(95, 227, 238, 0.9), transparent) -60% 0 / 40% 100% no-repeat; animation: edge-sweep 5s ease-in-out infinite; }
    .sec-head { position: relative; }
    @keyframes edge-sweep { 0% { background-position: -60% 0; } 60%, 100% { background-position: 160% 0; } }
    .reveal { opacity: 0; transform: translate3d(0, 22px, 0); }
    .reveal.in { opacity: 1; transform: none; transition: opacity 0.8s var(--ease) var(--d, 0ms), transform 0.8s var(--ease) var(--d, 0ms); }
    .hero-caption { font-size: 17px; font-weight: 600; letter-spacing: 0.01em; }

    html[data-motion-setting="reduced"] .cr svg, html[data-motion-setting="reduced"] .cr::after, html[data-motion-setting="reduced"] .lane, html[data-motion-setting="reduced"] .story::after, html[data-motion-setting="reduced"] .story-text, html[data-motion-setting="reduced"] .sec-head::after, html[data-motion-setting="reduced"] .cd-fill, html[data-motion-setting="reduced"] .pulse-bars i, html[data-motion-setting="reduced"] .flash-up, html[data-motion-setting="reduced"] .flash-down { animation: none !important; }
    html[data-motion-setting="reduced"] .cd-fill { stroke-dashoffset: 0; opacity: 0.4; }
    html[data-motion="paused"] .cr svg, html[data-motion="paused"] .lane, html[data-motion="paused"] .story::after, html[data-motion="paused"] .sec-head::after { animation-play-state: paused; }
    @media (prefers-reduced-motion: reduce) {
      html:not([data-motion-setting="full"]) .cr svg, html:not([data-motion-setting="full"]) .cr::after, html:not([data-motion-setting="full"]) .lane, html:not([data-motion-setting="full"]) .story::after, html:not([data-motion-setting="full"]) .story-text, html:not([data-motion-setting="full"]) .sec-head::after, html:not([data-motion-setting="full"]) .cd-fill, html:not([data-motion-setting="full"]) .pulse-bars i, html:not([data-motion-setting="full"]) .flash-up, html:not([data-motion-setting="full"]) .flash-down { animation: none !important; }
      html:not([data-motion-setting="full"]) .toast { transition: none; }
    }
    .swim { overflow: hidden; }
    .tx-side { min-width: 58px; }
    @media (max-width: 440px) { .swim .addr:last-of-type { display: none; } .lane { flex-basis: 26px; } }
    .kpi-value { white-space: nowrap; font-size: clamp(17px, 5vw, 22px); }
    .kpi-block { padding-right: 12px; }
    .kpi-block .kpi-label { padding-right: 28px; }
    .cd { top: 9px; right: 9px; width: 24px; height: 24px; }
    .kpi-gold .kpi-value { white-space: normal; display: flex; align-items: center; flex-wrap: wrap; gap: 2px; }

    /* ---------- 币种徽章（取代小鱼图标） ---------- */
    .coin { --c: var(--sonar); position: relative; flex: none; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: var(--c); background: radial-gradient(circle at 35% 28%, color-mix(in srgb, var(--c) 38%, #0b1d2a), #06131e 72%); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--c) 70%, transparent), inset 0 2px 6px rgba(255, 255, 255, 0.12); }
    .coin b { font-family: var(--display); font-weight: 700; font-size: 19px; line-height: 1; text-shadow: 0 0 10px color-mix(in srgb, var(--c) 70%, transparent); }
    .coin-eth { --c: #a9b6ff; } .coin-usdt { --c: var(--usdt); } .coin-usdc { --c: var(--usdc); } .coin-btc { --c: var(--btc); }
    .coin::before, .coin::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
    .coin.c-md::before { inset: -4px; border: 1px solid color-mix(in srgb, var(--c) 45%, transparent); }
    .coin.c-lg::before { inset: -4px; border: 1.5px solid color-mix(in srgb, var(--c) 75%, transparent); box-shadow: 0 0 12px color-mix(in srgb, var(--c) 40%, transparent); }
    .coin.c-xl::before { inset: -4px; border: 2px solid var(--gold); box-shadow: 0 0 16px rgba(242, 182, 94, 0.6); }
    .coin.c-xl::after { inset: -4px; border: 2px solid rgba(242, 182, 94, 0.7); animation: coin-halo 2.4s ease-out infinite; }
    @keyframes coin-halo { from { transform: scale(1); opacity: 0.8; } to { transform: scale(1.45); opacity: 0; } }
    .coin.c-sm { opacity: 0.82; }
    .coin-kpi { width: 30px; height: 30px; margin-right: 8px; vertical-align: -7px; }
    .coin-kpi b { font-size: 15px; }
    .tx-row.v2 { grid-template-columns: 44px minmax(0, 1fr) auto; }
    .tier-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 10px 12px; border-radius: 12px; background: rgba(2, 12, 20, 0.45); border: 1px dashed var(--edge); font-size: 11px; color: var(--mist); }
    .tl-title { flex-basis: 100%; font-weight: 600; color: rgba(232, 246, 248, 0.8); }
    .tl-item { display: inline-flex; align-items: center; gap: 5px; }
    .tl-dot { width: 12px; height: 12px; border-radius: 50%; background: #0b1d2a; box-shadow: inset 0 0 0 1.5px rgba(95, 227, 238, 0.5); }
    .tl-dot.c-sm { opacity: 0.6; }
    .tl-dot.c-md { box-shadow: inset 0 0 0 1.5px rgba(95, 227, 238, 0.6), 0 0 0 2px rgba(95, 227, 238, 0.3); }
    .tl-dot.c-lg { box-shadow: inset 0 0 0 1.5px rgba(95, 227, 238, 0.8), 0 0 0 2px rgba(95, 227, 238, 0.7), 0 0 8px rgba(95, 227, 238, 0.5); }
    .tl-dot.c-xl { box-shadow: inset 0 0 0 1.5px rgba(95, 227, 238, 0.8), 0 0 0 2px var(--gold), 0 0 10px rgba(242, 182, 94, 0.7); }
    .lane { max-width: 90px; }
    .swim { justify-content: flex-start; }

    /* ---------- 活跃地址卡片 ---------- */
    .whale-ids { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; }
    .whale-id { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: linear-gradient(160deg, rgba(14, 46, 64, 0.6), rgba(3, 13, 22, 0.85)); border: 1px solid var(--edge); transition: transform 0.3s var(--ease), border-color 0.3s; }
    .whale-id:hover { transform: translateY(-2px); border-color: var(--edge-hi); }
    .medal-gold { border-color: rgba(242, 182, 94, 0.5); background: linear-gradient(160deg, rgba(242, 182, 94, 0.16), rgba(3, 13, 22, 0.88) 55%); }
    .medal-silver { border-color: rgba(200, 220, 235, 0.38); background: linear-gradient(160deg, rgba(200, 220, 235, 0.12), rgba(3, 13, 22, 0.88) 55%); }
    .medal-bronze { border-color: rgba(214, 144, 96, 0.42); background: linear-gradient(160deg, rgba(214, 144, 96, 0.14), rgba(3, 13, 22, 0.88) 55%); }
    .wi-link { display: grid; grid-template-columns: 30px 32px minmax(0, 1fr) auto; align-items: center; gap: 10px; color: inherit; }
    .wi-rank { font-weight: 700; font-size: 13px; color: var(--mist); text-align: center; }
    .wi-rank b { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-size: 13px; color: #1b0f00; background: linear-gradient(145deg, #ffe1a6, var(--gold)); box-shadow: 0 0 12px rgba(242, 182, 94, 0.5); }
    .medal-silver .wi-rank b { background: linear-gradient(145deg, #f4f8fb, #9fb3c2); box-shadow: 0 0 10px rgba(200, 220, 235, 0.4); }
    .medal-bronze .wi-rank b { background: linear-gradient(145deg, #f2c19b, #b46d3e); box-shadow: 0 0 10px rgba(214, 144, 96, 0.4); }
    .wi-name { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
    .wi-name strong { font-family: var(--code); font-size: 14px; font-weight: 600; }
    .role { width: fit-content; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; letter-spacing: 0.04em; }
    .role-in { color: var(--sonar); background: rgba(95, 227, 238, 0.12); }
    .role-out { color: var(--coral); background: rgba(255, 138, 120, 0.12); }
    .role-both { color: var(--violet); background: rgba(167, 139, 250, 0.14); }
    .net { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
    .net em { font-style: normal; font-size: 10px; color: var(--mist); }
    .net b { font-family: var(--display); font-size: 16px; font-weight: 700; }
    .net-in b { color: var(--sonar); } .net-out b { color: var(--coral); }
    .wi-flows { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .flowbar { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
    .fb-label { font-size: 11px; color: var(--mist); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fb-label b { color: var(--foam); font-weight: 600; }
    .fb-track { height: 8px; border-radius: 8px; background: rgba(140, 220, 236, 0.08); overflow: hidden; }
    .fb-track i { display: block; height: 100%; border-radius: inherit; min-width: 3px; transform-origin: left; animation: fb-grow 1s var(--ease); }
    .flowbar.in i { background: linear-gradient(90deg, rgba(95, 227, 238, 0.5), var(--sonar)); box-shadow: 0 0 10px rgba(95, 227, 238, 0.5); }
    .flowbar.out i { background: linear-gradient(90deg, rgba(255, 138, 120, 0.5), var(--coral)); box-shadow: 0 0 10px rgba(255, 138, 120, 0.45); }
    @keyframes fb-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
    .wi-foot { display: grid; grid-template-columns: auto minmax(0, 1fr) 44px; align-items: center; gap: 10px; }
    .beats { display: flex; align-items: flex-end; gap: 2px; height: 22px; width: 120px; }
    .beats i { flex: 1; border-radius: 2px; background: rgba(140, 220, 236, 0.14); }
    .beats i.on { background: linear-gradient(0deg, rgba(62, 224, 168, 0.5), var(--live)); box-shadow: 0 0 6px rgba(62, 224, 168, 0.5); }
    .wi-meta { font-size: 10.5px; color: var(--mist); line-height: 1.4; }
    .wi-foot .star { min-height: 40px; }
    @media (min-width: 960px) { .whale-ids { grid-template-columns: 1fr 1fr; } }
    html[data-motion-setting="reduced"] .coin::after, html[data-motion-setting="reduced"] .fb-track i { animation: none !important; }
    @media (prefers-reduced-motion: reduce) { html:not([data-motion-setting="full"]) .coin::after, html:not([data-motion-setting="full"]) .fb-track i { animation: none !important; } }

    html:not(.i18n-ready) body { visibility: hidden; }
    .lang-btn { color: var(--foam); cursor: pointer; padding: 0; font: inherit; }
    .lang-mark { font-family: var(--mono); font-size: 12px; letter-spacing: 0.04em; font-weight: 600; }
    .nav a span { display: block; max-width: 76px; text-align: center; line-height: 1.15; overflow-wrap: anywhere; }
    .lang-sheet { position: fixed; inset: 0; z-index: 80; background: rgba(2, 8, 14, 0.66); display: flex; align-items: flex-end; justify-content: center; }
    .lang-card { width: min(460px, 100%); max-height: min(78dvh, 740px); display: flex; flex-direction: column; background: rgba(6, 22, 36, 0.98); color: var(--foam); border: 1px solid rgba(150, 220, 236, 0.28); border-radius: 18px 18px 0 0; padding: 14px 14px calc(14px + env(safe-area-inset-bottom)); box-shadow: 0 -24px 60px rgba(0, 0, 0, 0.45); }
    .lang-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
    .lang-head h2 { margin: 0; font-size: 16px; font-weight: 600; }
    .lang-card .field { margin: 12px 0; }
    .lang-list { list-style: none; margin: 0; padding: 0; overflow: auto; overscroll-behavior: contain; }
    .lang-list button { width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: start; background: transparent; color: inherit; border: 0; border-bottom: 1px solid rgba(150, 220, 236, 0.12); padding: 8px 4px; cursor: pointer; font: inherit; }
    .lang-list button[aria-current="true"] { color: var(--sonar); }
    .lang-list small, .lang-list .net { color: var(--mist); font-style: normal; }
    .lang-list .net { margin-inline-start: 8px; font-size: 10px; letter-spacing: 0.08em; }
    @media (min-width: 720px) {
      .lang-sheet { align-items: center; padding: 24px; }
      .lang-card { border-radius: 18px; }
    }
    .intro { position: fixed; inset: 0; z-index: 100; display: flex; align-items: flex-end; justify-content: center; padding: 18px 18px calc(18px + env(safe-area-inset-bottom)); background: rgba(2, 8, 14, 0.72); }
    .intro-card { width: min(440px, 100%); background: rgba(6, 22, 36, 0.98); color: var(--foam); border: 1px solid rgba(150, 220, 236, 0.28); border-radius: 18px; padding: 22px 20px 18px; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45); }
    .intro-card h2 { margin: 0; font-family: var(--display); font-size: 1.45rem; font-weight: 600; letter-spacing: 0.06em; line-height: 1.35; }
    .intro-en { margin: 10px 0 0; color: var(--sonar); font-family: var(--display); font-size: 1rem; letter-spacing: 0.02em; line-height: 1.4; }
    .intro-card p:not(.intro-en) { margin: 14px 0 0; color: rgba(232, 246, 248, 0.86); font-size: 14px; line-height: 1.75; }
    .intro-close { margin-top: 18px; width: 100%; min-height: 44px; border-radius: 999px; border: 1px solid rgba(95, 227, 238, 0.6); background: linear-gradient(180deg, rgba(95, 227, 238, 0.28), rgba(95, 227, 238, 0.12)); color: var(--foam); font-weight: 600; }
    .intro-close:disabled { opacity: 0.45; cursor: default; }
    @media (min-width: 720px) { .intro { align-items: center; } }
  
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{min-width:320px}*,*::before,*::after{box-sizing:border-box}img,video{max-width:100%}input,select,textarea{font-size:16px}:focus-visible{outline:2px solid #b79b61;outline-offset:4px}[data-lang],#langs,.lang-button,.lang-btn,[aria-label="Language"],[aria-label="Choose language"],[aria-label="Select language"],[aria-label="语言"]{display:none!important}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}