*{box-sizing:border-box;margin:0;padding:0}
html, body {height:100%}
body{
  background:#060b1a;color:#e6f0ff;
  font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;
  overflow:hidden; /* ✅ 大屏禁止滚动 */
}

a{color:#7fb3ff;text-decoration:none}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace}
.small{font-size:12px;opacity:.8}

.header{
  height:64px;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(10,18,40,.65);backdrop-filter:blur(6px);
}
.header .title{font-size:20px;font-weight:800;letter-spacing:.4px}
.header .sub{opacity:.8;font-size:12px;margin-top:4px}

.badge{
  display:inline-block;padding:2px 8px;border-radius:999px;
  background:rgba(127,179,255,.12);border:1px solid rgba(127,179,255,.25);
  font-size:11px
}

.card{
  background:rgba(13,24,52,.55);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  box-shadow:0 6px 22px rgba(0,0,0,.35);
  overflow:hidden;
}
.card .card-hd{
  padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:space-between
}
.card .card-hd h3{font-size:14px;font-weight:800}
.card .card-bd{padding:12px 14px}

/* ✅ 两栏：左 80% 右 20%（比 90/10 更不挤） */
.main{
  height:calc(100vh - 64px);
  display:grid;
  grid-template-columns: 8fr 2fr;
  gap:14px;
  padding:14px;
}

/* 左侧地图撑满 */
.left{height:100%}
.map-wrap{
  height:calc(100vh - 64px - 14px - 14px - 48px);
  position:relative;
}
#map{width:100%;height:100%}
.map-footer{
  position:absolute;left:12px;bottom:10px;
  font-size:12px;opacity:.65;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.08);
  padding:6px 10px;border-radius:10px;
}

/* 右侧滚动栏：紧凑、像 SOC */
.right{height:100%}
.side{
  height:calc(100vh - 64px - 14px - 14px - 48px);
  display:flex;
  flex-direction:column;
  gap:10px;
}

.side-block{flex:1;min-height:0}
.side-title{
  font-size:12px;font-weight:800;opacity:.9;
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:8px;
}
.side-divider{
  height:1px;background:rgba(255,255,255,.08);
  margin:4px 0;
}

.scroll-box{height:100%;overflow:hidden;position:relative}
.scroll-list{position:absolute;left:0;right:0;top:0}

.scroll-row{
  display:flex;justify-content:space-between;gap:8px;
  padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.10);
  font-size:12px
}
.scroll-row .l{display:flex;gap:8px;align-items:center;min-width:0}
.rank{
  width:24px;height:18px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(127,179,255,.12);border:1px solid rgba(127,179,255,.25);
  font-size:11px;flex:0 0 auto
}

/* ✅ 放宽 label 宽度，IP 更容易完整展示 */
.label{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:280px;
}
.val{opacity:.9;flex:0 0 auto}

.side-tip{
  font-size:11px;opacity:.55;
  padding-top:6px;border-top:1px solid rgba(255,255,255,.08);
}
