/* RMCN 战术雷达 —— 视觉系统 v2 "TACTICAL HUD" (荧光青 + 玻璃面板 + 发光 + 扫描线) */
:root{
  --bg:#060a0f; --bg2:#0a1219;
  --cyan:#2de2ff; --cyan-d:#12798f; --glow:rgba(45,226,255,.45);
  --panel:linear-gradient(180deg,rgba(12,22,30,.82),rgba(6,12,17,.86));
  --line:rgba(45,226,255,.18); --line2:rgba(45,226,255,.40);
  --txt:#bcd7df; --dim:#587680;
  --enemy:#ff3860; --self:#2de2ff; --ally:#38bdf8; --ore:#ffb020; --res:#9b8cff; --danger:#ff4767; --accent:#2de2ff; --accent2:#38bdf8;
  --mono:"Consolas","SF Mono","JetBrains Mono",ui-monospace,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:"OPPOSans","Segoe UI",system-ui,sans-serif;background:var(--bg);color:var(--txt)}
/* 全局扫描线 overlay */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:9998;
  background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,rgba(0,0,0,.16) 3px,transparent 4px);
  opacity:.5;mix-blend-mode:overlay}

/* ---------- 登录 ---------- */
.login-bg{display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(1000px 500px at 50% -10%,rgba(45,226,255,.10),transparent 60%),
    repeating-linear-gradient(0deg,transparent 0,transparent 38px,rgba(45,226,255,.035) 39px,transparent 40px),
    repeating-linear-gradient(90deg,transparent 0,transparent 38px,rgba(45,226,255,.035) 39px,transparent 40px),
    #060a0f}
.login-card{position:relative;width:360px;background:var(--panel);
  border:1px solid var(--line2);border-radius:6px;padding:36px 30px;
  box-shadow:0 0 0 1px rgba(0,0,0,.5),0 24px 70px rgba(0,0,0,.6),inset 0 0 40px rgba(45,226,255,.06)}
.login-card::before{content:'';position:absolute;left:0;top:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 12px var(--glow)}
.brand{text-align:center;margin-bottom:26px}
.brand-logo{font-size:46px;color:var(--cyan);text-shadow:0 0 28px var(--glow);line-height:1}
.brand-title{font-size:21px;font-weight:700;margin-top:8px;letter-spacing:4px}
.brand-sub{font-family:var(--mono);font-size:10px;color:var(--cyan-d);letter-spacing:5px;margin-top:5px}
.field{display:block;margin-bottom:16px}
.field-label{display:block;font-size:12px;color:var(--dim);margin-bottom:6px;letter-spacing:1px}
.field input{width:100%;padding:12px 14px;background:rgba(4,9,13,.8);border:1px solid var(--line);
  border-radius:5px;color:var(--txt);font-size:16px;font-family:var(--mono);letter-spacing:3px;outline:none;transition:.15s}
.field input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(45,226,255,.14),0 0 18px rgba(45,226,255,.2) inset}
.btn-primary{width:100%;padding:12px;margin-top:6px;border:none;border-radius:5px;cursor:pointer;
  background:linear-gradient(90deg,var(--cyan),var(--ally));color:#02121a;font-size:15px;font-weight:700;letter-spacing:6px;
  box-shadow:0 0 18px rgba(45,226,255,.35);transition:.15s}
.btn-primary:hover{box-shadow:0 0 28px rgba(45,226,255,.6)}
.btn-primary:disabled{opacity:.6;cursor:default;box-shadow:none}
.btn-ghost{width:100%;padding:10px;margin-top:9px;border:1px solid var(--line2);border-radius:5px;cursor:pointer;
  background:transparent;color:var(--cyan);font-size:13px;letter-spacing:1px;font-family:var(--mono);transition:.15s}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(45,226,255,.08);box-shadow:0 0 16px rgba(45,226,255,.25)}
.login-msg{min-height:18px;margin-top:12px;color:var(--danger);font-size:13px;text-align:center;font-family:var(--mono)}
.login-foot{margin-top:16px;text-align:center;font-size:11px;color:var(--dim)}

/* ---------- 雷达主界面 ---------- */
.radar-bg{display:flex;flex-direction:column;height:100%;overflow:hidden}
.topbar{display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 18px;flex:0 0 auto;
  background:linear-gradient(180deg,rgba(10,20,28,.95),rgba(6,11,16,.92));border-bottom:1px solid var(--line2);
  box-shadow:0 2px 20px rgba(0,0,0,.5),0 1px 0 rgba(45,226,255,.15)}
.tb-left{font-weight:700;letter-spacing:3px;font-size:15px}
.tb-logo{color:var(--cyan);margin-right:8px;text-shadow:0 0 14px var(--glow)}
.tb-mid{display:flex;gap:8px}
.pill{font-family:var(--mono);font-size:12px;padding:5px 12px;border-radius:3px;background:rgba(4,9,13,.7);
  border:1px solid var(--line);color:var(--dim);letter-spacing:1px}
.pill-off{color:var(--danger);border-color:rgba(255,71,103,.4);box-shadow:0 0 10px rgba(255,71,103,.15)}
.pill-on{color:var(--cyan);border-color:var(--line2);box-shadow:0 0 10px rgba(45,226,255,.2)}
.tb-right{display:flex;gap:8px}
.tb-btn{font-family:var(--mono);font-size:13px;padding:6px 13px;border-radius:3px;background:rgba(4,9,13,.6);
  border:1px solid var(--line);color:var(--txt);cursor:pointer;letter-spacing:1px;transition:.15s}
.tb-btn:hover{border-color:var(--cyan);box-shadow:0 0 14px rgba(45,226,255,.25)}
.tb-btn.active{border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 14px rgba(45,226,255,.3)}
.tb-btn.danger{border-color:rgba(255,71,103,.4);color:var(--danger)}
.tb-btn.danger:hover{box-shadow:0 0 14px rgba(255,71,103,.3);border-color:var(--danger)}
.stage{position:relative;flex:1 1 auto;overflow:hidden;background:
  radial-gradient(1200px 1200px at 60% 45%,#0a141d 0%,#05090d 100%)}
#radar{display:block;width:100%;height:100%}

/* 通用玻璃 HUD 面板(图层/附近/状态共用装饰) */
.layers,.nearby,.stats{position:absolute;background:var(--panel);border:1px solid var(--line2);border-radius:5px;
  box-shadow:0 0 0 1px rgba(0,0,0,.45),0 10px 34px rgba(0,0,0,.6),inset 0 0 30px rgba(45,226,255,.045);
  backdrop-filter:blur(6px)}
.layers::before,.nearby::before{content:'';position:absolute;left:8px;right:8px;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 10px var(--glow);opacity:.9}

/* 图层面板 */
.layers{left:14px;bottom:14px;font-size:12px;width:198px;min-width:150px;max-height:82%;
  resize:both;overflow:hidden;display:flex;flex-direction:column}
.layers-h{display:flex;align-items:center;gap:6px;padding:8px 10px;cursor:move;user-select:none;flex:0 0 auto;border-bottom:1px solid var(--line)}
.lh-title{color:var(--cyan);font-weight:700;font-family:var(--mono);letter-spacing:2px;text-shadow:0 0 10px var(--glow)}
.offln{font-weight:400;color:var(--dim);display:flex;align-items:center;gap:4px;cursor:pointer;font-size:11px;margin-left:auto}
.lh-btn{cursor:pointer;color:var(--dim);padding:0 3px;font-size:13px;transition:.15s}
.lh-btn:hover{color:var(--cyan);text-shadow:0 0 8px var(--glow)}
.layers-body{overflow-y:auto;overflow-x:hidden;padding:6px 10px 8px;flex:1 1 auto}
.lrow{display:flex;align-items:center;gap:7px;padding:2px 0}
.lsub{padding-left:15px}
.lgroup-h{display:flex;align-items:center;gap:6px;padding:5px 0 3px;margin-top:4px;border-top:1px solid rgba(45,226,255,.10)}
.larw{cursor:pointer;color:var(--cyan-d);font-size:9px;width:10px;flex:0 0 10px;text-align:center}
.lgname{flex:1;color:var(--cyan);font-weight:600;cursor:pointer;font-size:11px;letter-spacing:1px}
.lck{cursor:pointer;accent-color:var(--cyan);flex:0 0 auto}
.lcolor{width:12px;height:12px;border-radius:2px;flex:0 0 12px;cursor:pointer;border:1px solid rgba(255,255,255,.3);box-shadow:0 0 5px rgba(0,0,0,.6)}
.lcin{width:0;height:0;padding:0;margin:0;border:0;opacity:0;position:absolute;pointer-events:none}
.lname{flex:1;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lcnt{color:var(--cyan);min-width:22px;text-align:right;font-size:11px;font-family:var(--mono);flex:0 0 auto}

/* 附近玩家面板 */
.nearby{right:14px;top:132px;font-size:12px;width:230px;min-width:180px;max-height:62%;
  resize:both;overflow:hidden;display:flex;flex-direction:column}
.nearby-h{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:8px 10px;cursor:move;user-select:none;flex:0 0 auto;border-bottom:1px solid var(--line);color:var(--cyan);font-weight:700;font-family:var(--mono);letter-spacing:2px;text-shadow:0 0 10px var(--glow)}
.nearby-body{overflow-y:auto;overflow-x:hidden;padding:4px 8px 8px;flex:1 1 auto}
.nbrow{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px solid rgba(45,226,255,.06)}
.nbhid{opacity:.4}
.nbdot{width:8px;height:8px;border-radius:50%;flex:0 0 8px;box-shadow:0 0 6px currentColor}
.nbname{flex:1;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nbdist{color:var(--cyan);font-size:11px;min-width:38px;text-align:right;font-family:var(--mono);flex:0 0 auto}
.nbhp{color:var(--enemy);font-size:11px;min-width:26px;text-align:right;font-family:var(--mono);flex:0 0 auto}
.nbbtn{background:rgba(4,9,13,.7);color:var(--cyan);border:1px solid var(--line);border-radius:3px;padding:2px 8px;cursor:pointer;font-size:11px;font-family:var(--mono);flex:0 0 auto;transition:.15s}
.nbbtn:hover{border-color:var(--cyan);box-shadow:0 0 10px rgba(45,226,255,.25)}
.nbbtn.on{border-color:var(--warn,#ffcc33);color:#ffcc33}

/* 状态 HUD(右上) */
.stats{right:14px;top:14px;padding:10px 13px;font-size:12px;font-family:var(--mono);color:var(--dim);min-width:150px;line-height:1.85;letter-spacing:.5px}
.stats b{color:var(--txt)}

/* 滚动条科技化 */
.layers-body::-webkit-scrollbar,.nearby-body::-webkit-scrollbar{width:6px}
.layers-body::-webkit-scrollbar-thumb,.nearby-body::-webkit-scrollbar-thumb{background:rgba(45,226,255,.25);border-radius:3px}
.layers-body::-webkit-scrollbar-track,.nearby-body::-webkit-scrollbar-track{background:transparent}