:root{--bg: #10151d;--panel: rgba(21, 28, 39, .92);--line: #2a3648;--text: #dfe7f1;--text-dim: #8494aa;--accent: #3fa4ff;font-family:PingFang SC,Microsoft YaHei,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root,.app{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text)}.app{position:relative}.app>canvas{position:absolute;top:0;right:0;bottom:0;left:0}.hud{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:14px 20px;background:linear-gradient(to bottom,rgba(13,18,26,.95),rgba(13,18,26,.55) 80%,transparent);pointer-events:none}.hud>*{pointer-events:auto}.hud-title{display:flex;align-items:center;gap:12px}.hud-title h1{font-size:17px;font-weight:600;letter-spacing:1px}.hud-title p{font-size:12px;color:var(--text-dim);margin-top:3px}.hud-dot{width:10px;height:10px;border-radius:50%;background:#46617e;flex-shrink:0}.hud-dot[data-on=true]{background:#35d07f;box-shadow:0 0 8px #35d07f;animation:pulse 1.2s infinite}@keyframes pulse{50%{opacity:.45}}.hud-legend{display:flex;gap:8px;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:12.5px;cursor:pointer;transition:border-color .15s,transform .1s}.chip:hover{border-color:var(--accent)}.chip[data-active=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.chip b{color:var(--text-dim);font-weight:600}.chip-color{width:10px;height:10px;border-radius:3px;display:inline-block;flex-shrink:0}.hud-actions{display:flex;gap:8px;margin-left:auto}.btn{padding:7px 14px;border-radius:8px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:13px;cursor:pointer;transition:border-color .15s}.btn:hover{border-color:var(--accent)}.btn[data-primary=true]{background:var(--accent);border-color:var(--accent);color:#0b1523;font-weight:600}.hud-slices{flex-basis:100%;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.slice-label{font-size:12px;color:var(--text-dim);margin-right:2px}.chip.slice{padding:4px 10px;font-size:12px}.slice-divider{width:1px;height:16px;background:var(--line);margin:0 8px}.panel{position:absolute;right:18px;top:92px;width:272px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 10px 30px #00000073}.panel-head{display:flex;justify-content:space-between;align-items:center}.panel-head h2{font-size:16px;letter-spacing:.5px}.panel-close{border:none;background:none;color:var(--text-dim);font-size:14px;cursor:pointer;padding:4px}.panel-close:hover{color:var(--text)}.panel-rows{margin-top:12px;display:grid;gap:9px}.panel-rows>div{display:flex;justify-content:space-between;font-size:13px}.panel-rows dt{color:var(--text-dim)}.panel-rows dd{display:flex;align-items:center;gap:6px}.panel-hint{margin-top:16px;font-size:12px;color:var(--text-dim)}.panel-status-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.crosshair{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none}.crosshair:before,.crosshair:after{content:"";position:absolute;background:#dfe7f1e6}.crosshair:before{left:50%;top:0;width:2px;height:100%;transform:translate(-50%)}.crosshair:after{top:50%;left:0;height:2px;width:100%;transform:translateY(-50%)}.crosshair[data-aimed=true]:before,.crosshair[data-aimed=true]:after{background:var(--accent)}.aim-tip{position:absolute;left:calc(50% + 20px);top:calc(50% + 16px);display:flex;align-items:center;gap:7px;padding:6px 12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;font-size:13px;pointer-events:none;white-space:nowrap}.aim-tip i{font-style:normal;color:var(--text-dim);font-size:11px;margin-left:4px}.tips{position:absolute;bottom:12px;left:50%;transform:translate(-50%);font-size:12px;color:var(--text-dim);background:#0d121a99;padding:5px 14px;border-radius:999px;pointer-events:none;white-space:nowrap}@media (max-width: 720px){.hud-actions{margin-left:0}.panel{right:10px;left:10px;width:auto}.tips{display:none}}