/* Nút kiểm tra mạng bên trái Máy chủ; bảng mở dưới cùng một cụm neo. */
#minimap-tools:has(#performance-hud:not([hidden]) #performance-panel:not([hidden])){z-index:45}
@layer rp-theme{#minimap-tools #performance-panel{background:#101114f7!important}}

.performance-hud{position:static;width:var(--utility-size);height:var(--utility-size);flex:none;box-sizing:border-box;pointer-events:none;color:#fff;font-family:Arial,Helvetica,sans-serif}
.performance-hud[hidden],.performance-hud [hidden]{display:none!important}
body:not(.in-game) .performance-hud{display:none!important}
.performance-hud button{pointer-events:auto;touch-action:manipulation;cursor:pointer;color:#fff;border:0;border-radius:0;background:transparent;box-shadow:none;padding:0;display:grid;place-items:center}
.performance-hud button:focus-visible{outline:2px solid #8de6ff;outline-offset:2px}
.performance-hud .performance-collapse:hover{background:#ffffff20}
.performance-hud .performance-open{width:var(--utility-size);height:var(--utility-size)}
.performance-open svg{width:23px;height:20px}
.performance-panel{position:absolute;right:0;top:calc(100% + 6px);box-sizing:border-box;width:196px;max-width:calc(100vw - var(--mini-right) - var(--minimap-width, var(--mini-width)) - 24px);max-height:calc(var(--visual-height,100dvh) - var(--mini-top) - 64px);overflow-y:auto;overscroll-behavior:contain;container-type:inline-size;border:1px solid #eee;background:linear-gradient(120deg,#12151af2,#080a0ded);box-shadow:0 2px 5px #0006;pointer-events:auto;font-variant-numeric:tabular-nums}
.performance-heading{display:flex;align-items:center;justify-content:space-between;gap:2px;padding-left:8px;border-bottom:1px solid #ffffff29}
.performance-heading strong{font-size:11px;letter-spacing:.6px}
.performance-hud .performance-collapse{width:34px;height:32px;flex:0 0 34px}
.performance-collapse svg{width:18px;height:18px}
.performance-role{padding:5px 8px 2px;font-size:8px;letter-spacing:1px;color:#aab2bc}
.performance-metrics{margin:0;padding:2px 8px 5px}
.performance-metrics>div{display:flex;align-items:baseline;justify-content:space-between;gap:3px;min-height:21px;font-size:11px;line-height:21px;white-space:nowrap}
.performance-metrics dt{color:#c1c8d0;min-width:0;overflow:hidden;text-overflow:ellipsis}
.performance-metrics dd{margin:0;flex-shrink:0;font-weight:700;color:#d7dce3}
.performance-metrics dd[data-level="good"]{color:#68f7a6}
.performance-metrics dd[data-level="warn"]{color:#ffd27c}
.performance-metrics dd[data-level="bad"]{color:#ff9393}
.performance-status{display:flex;align-items:center;gap:5px;margin:0;padding:6px 8px;border-top:1px solid #ffffff20;font-size:10px;line-height:1.25;color:#c4cbd3}
.performance-status::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:0 0 5px}
.performance-status[data-level="good"]{color:#68f7a6}
.performance-status[data-level="warn"]{color:#ffd27c}
.performance-status[data-level="bad"]{color:#ff9393}
@container(max-width:125px){
 .performance-heading{padding-left:5px}.performance-heading strong{font-size:9px;letter-spacing:0}
 .performance-hud .performance-collapse{width:28px;flex-basis:28px}
 .performance-role{padding-left:5px;letter-spacing:.3px;font-size:7px}
 .performance-metrics{padding-left:5px;padding-right:5px}
 .performance-metrics>div{font-size:9px;line-height:19px;min-height:19px}
 .performance-status{padding:5px;font-size:9px}
}
@media(max-height:360px){.performance-metrics>div{line-height:16px;min-height:16px}.performance-role{display:none}.performance-status{padding-top:4px;padding-bottom:4px}}

@media(max-width:800px),(pointer:coarse){
 .performance-panel{max-height:calc(var(--visual-height,100dvh) - var(--utility-top) - var(--utility-size) * 2 - 24px)}
}