html:has(body.knn-visitor-screen){margin:0!important;background:#101722}
body.knn-visitor-screen{margin:0!important;background:#101722;color:#e9edf7;font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color-scheme:dark}
.knn-visitor-screen *{box-sizing:border-box}
.knn-visitor-screen #wpadminbar,.knn-visitor-screen .knn-mobile-tabbar,.knn-visitor-screen .knn-tabbar-placeholder{display:none!important}
.vs-shell{height:100dvh;min-height:680px;padding:0 22px 16px;display:flex;flex-direction:column;gap:22px;max-width:2560px;margin:auto}
.vs-header{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #354154}
.vs-brand,.vs-tools{display:flex;align-items:center;gap:24px;min-width:0}
.vs-brand>.vs-icon{color:#9caaff;font-size:27px}
.vs-brand h1{font-size:26px;letter-spacing:1px;margin:0;font-weight:650;white-space:nowrap}
.vs-brand p{border-left:1px solid #526076;padding-left:28px;color:#bcc6d7;margin:0;font-size:17px}
.vs-tools{gap:20px;flex-shrink:0;font-variant-numeric:tabular-nums}
.vs-tools button{background:none;border:0;color:#dce3f3;cursor:pointer;padding:8px;font-size:18px}
.vs-tools button:focus-visible{outline:2px solid #9caaff;outline-offset:2px}
.vs-connection{display:flex;align-items:center;gap:8px;color:#a8b3c5;font-size:14px;white-space:nowrap}
.vs-connection:before,.vs-updated:before{content:"";width:9px;height:9px;display:inline-block;border-radius:50%;background:#8994a6}
.vs-connection.is-live{color:#5bdf9c}.vs-connection.is-live:before{background:#4bdc93}
.vs-connection.is-error{color:#f0b66b}.vs-connection.is-error:before{background:#edb060}
#vs-clock{font-size:16px;border-left:1px solid #526076;padding-left:20px;white-space:nowrap}
.vs-stats{display:grid;grid-template-columns:repeat(4,1fr);padding:0 30px;gap:30px}
.vs-stat{border-right:1px solid #48556c;display:flex;flex-direction:column;gap:0;padding:0 30px}
.vs-stat:last-child{border:0}.vs-stat>span{font-size:15px;color:#bfc8d7}.vs-stat strong{font-size:35px;font-weight:650;line-height:1.35;font-variant-numeric:tabular-nums;letter-spacing:1px}
.vs-main{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(340px,1fr);gap:20px;flex:1;min-height:0}
.vs-map-panel,.vs-visitors{border:1px solid #43516a;border-radius:16px;background:#161e2b;overflow:hidden;min-height:0;position:relative}
.vs-panel-heading{position:relative;z-index:2;display:flex;align-items:center;gap:18px;padding:20px 22px;flex-shrink:0;min-height:76px}
.vs-panel-heading h2{font-size:22px;font-weight:650;margin:0;white-space:nowrap;line-height:1.3;display:flex;align-items:center;gap:12px}
.vs-panel-heading h2:before{content:"";height:23px;width:5px;border-radius:2px;background:#9ba7ff}
.vs-panel-heading>span{color:#c7cfdd;font-size:14px}.vs-panel-heading>span:not(.vs-count):not(.vs-recent){border-left:1px solid #455169;padding-left:18px}
.vs-scale{margin-left:auto;display:flex;align-items:center;gap:3px;font-size:12px;color:#c5cede}.vs-scale span{margin:0 6px}
.vs-scale b{height:12px;width:20px;background:#35465f;border-radius:2px}.vs-scale b:nth-of-type(2){background:#4e6492}.vs-scale b:nth-of-type(3){background:#6d83c7}.vs-scale b:nth-of-type(4){background:#91a0f5}
#vs-map{position:absolute;inset:64px 12px 38px}
.vs-map-status{position:absolute;left:20px;right:20px;bottom:62px;text-align:center;color:#bfc9dd;font-size:13px;pointer-events:none;margin:0}
.vs-legend{position:absolute;bottom:18px;left:28px;right:20px;display:flex;flex-wrap:wrap;gap:16px;font-size:12px;color:#dce3f1;z-index:2;pointer-events:none}
.vs-legend span{display:flex;align-items:center;gap:7px}.vs-legend .vs-icon{color:#9aaaff;font-size:13px}
.vs-visitors{display:flex;flex-direction:column}.vs-visitors .vs-panel-heading{gap:14px}
.vs-count{background:#9ca9ff;color:#11182b!important;padding:0 11px;border-radius:9px;font-size:16px!important;font-weight:650;font-variant-numeric:tabular-nums}
.vs-recent{margin-left:auto;font-size:12px!important;color:#9ca8ba!important}
.vs-list{list-style:none!important;padding:0 16px!important;margin:0!important;flex:1;overflow:auto;scrollbar-width:thin}
.vs-row{display:grid;grid-template-columns:40px minmax(65px,1fr) minmax(86px,auto) 55px;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid #334158;min-height:58px;font-size:13px}
.vs-row:first-child{background:#252d47;border-radius:9px;padding-left:8px;padding-right:8px;border-color:transparent}
.vs-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#354259;display:flex;align-items:center;justify-content:center;color:#c4cddd;flex-shrink:0}
.vs-person{min-width:0;display:flex;flex-direction:column;line-height:1.5}.vs-person strong{font-weight:550;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vs-person small{font-size:12px;color:#aebbd0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vs-ip,.vs-age{font-variant-numeric:tabular-nums;white-space:nowrap}.vs-age{font-size:12px;text-align:right;color:#bbc6d8}
.vs-updated{margin:14px 22px;padding-top:14px;border-top:1px solid #334158;font-size:12px;display:flex;gap:8px;align-items:center;color:#b9c5d8}.vs-updated:before{background:#4bdc93;width:7px;height:7px;flex-shrink:0}
.vs-empty{padding:50px 20px;text-align:center;color:#aab6ca;list-style:none;font-size:14px}
.vs-footer{border-top:1px solid #3a475d;padding:12px 10px 0;display:flex;justify-content:space-between;gap:15px;color:#aab8ce;font-size:12px}
@media(min-width:1800px){.vs-header{min-height:82px}.vs-brand h1{font-size:30px}.vs-panel-heading h2{font-size:26px}.vs-stat strong{font-size:40px}.vs-row{padding-top:16px;padding-bottom:16px;min-height:65px}.vs-person strong{font-size:16px}.vs-shell{gap:26px}}
@media(max-width:1250px){.vs-brand p{display:none}.vs-main{grid-template-columns:minmax(0,2fr) minmax(320px,1fr)}.vs-panel-heading{padding:16px;gap:12px}.vs-panel-heading h2{font-size:19px}.vs-scale{display:none}.vs-panel-heading>span{font-size:12px}.vs-row{gap:8px;font-size:12px;grid-template-columns:32px minmax(50px,1fr) auto 45px}.vs-avatar{width:30px;height:30px}.vs-brand h1{font-size:23px}}
@media(max-width:800px){.vs-shell{height:auto;min-height:100dvh;padding:0 12px 16px;gap:16px}.vs-header{flex-wrap:wrap;gap:8px;padding:18px 4px 12px}.vs-brand h1{font-size:21px}.vs-brand{gap:12px}.vs-tools{width:100%;justify-content:space-between;gap:10px}.vs-tools time{font-size:13px!important}.vs-stats{padding:0;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.vs-stat{padding:0 16px}.vs-stat:nth-child(2){border:0}.vs-stat strong{font-size:28px}.vs-stat>span{font-size:12px}.vs-main{display:flex;flex-direction:column;gap:16px}.vs-map-panel{height:66vw;min-height:370px}.vs-panel-heading{flex-wrap:wrap;gap:8px;min-height:64px}.vs-panel-heading h2{font-size:18px}.vs-panel-heading>span:not(.vs-count):not(.vs-recent){padding-left:10px;font-size:11px}#vs-map{inset:60px 0 45px}.vs-legend{left:16px;gap:10px;font-size:10px;bottom:14px}.vs-visitors{min-height:360px;max-height:700px}.vs-row{grid-template-columns:36px minmax(70px,1fr) auto 60px;gap:12px}.vs-footer{font-size:10px;flex-wrap:wrap;padding:10px 2px 0}}

/* 默认同时展示地图与实时访客；可手动收起列表进入地图专注视图。 */
.vs-shell{gap:14px;padding-left:14px;padding-right:14px;max-width:none}
.vs-header{min-height:62px}.vs-stats{padding:0 16px}.vs-stat strong{font-size:32px}
.vs-main{grid-template-columns:minmax(0,1fr) clamp(320px,25vw,420px)}
.vs-main.vs-map-focus{grid-template-columns:minmax(0,1fr)}
.vs-main.vs-map-focus .vs-visitors{display:none}
.vs-map-panel .vs-panel-heading{min-height:58px;padding:14px 20px}
#vs-map{inset:50px 8px 30px;touch-action:none}
.vs-legend{bottom:12px}
.vs-tools button[aria-expanded="true"]{color:#a7b4ff}
@media(min-width:1800px){.vs-shell{gap:16px}.vs-header{min-height:70px}}
@media(max-width:800px){.vs-shell{padding-left:8px;padding-right:8px;gap:12px}.vs-main.vs-map-focus .vs-map-panel{height:calc(100dvh - 290px);min-height:400px}.vs-main:not(.vs-map-focus) .vs-map-panel{min-height:370px}.vs-tools{justify-content:flex-start;gap:10px}.vs-tools time{margin-right:auto}.vs-tools button{padding:6px}.vs-map-panel .vs-panel-heading{padding:12px;gap:6px}.vs-panel-heading h2{font-size:17px}#vs-map{inset:56px 0 42px}.vs-legend{bottom:10px}.vs-footer{padding-top:8px}}

.vs-svg-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.vs-icon{display:inline-block;width:20px;height:20px;flex-shrink:0;vertical-align:middle}
.vs-brand>.vs-icon{width:29px;height:29px}
.vs-tools button{display:inline-flex;align-items:center;justify-content:center}
.vs-legend .vs-icon{width:15px;height:15px}
.vs-avatar>.vs-icon{width:19px;height:19px}