.visitor-directory{display:grid;gap:18px}.visitor-directory-head{align-items:center;background:linear-gradient(125deg,#17182b,#302a67 68%,#0f5960);border-radius:19px;color:#fff;display:flex;justify-content:space-between;overflow:hidden;padding:26px 28px;position:relative}.visitor-directory-head:after{border:1px solid #ffffff24;border-radius:50%;content:"";height:190px;position:absolute;right:-45px;top:-105px;width:190px}.visitor-directory-head h3{font-size:24px;letter-spacing:-.035em;margin:5px 0}.visitor-directory-head p{color:#ffffffb9;margin:0;max-width:620px}.visitor-directory-head .eyebrow{color:#a7f3d0}.visitor-directory-total{align-items:center;background:#ffffff12;border:1px solid #ffffff24;border-radius:14px;display:flex;flex-direction:column;min-width:120px;padding:14px;position:relative;z-index:1}.visitor-directory-total strong{font-size:28px;line-height:1}.visitor-directory-total span{color:#ffffffb7;font-size:9px;font-weight:800;letter-spacing:.08em;margin-top:6px;text-transform:uppercase}.visitor-card-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}.visitor-card{border:1px solid color-mix(in srgb,var(--border) 78%,transparent);border-radius:17px!important;box-shadow:0 10px 32px #0f172a0b;overflow:hidden;padding:18px!important;position:relative;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.visitor-card:before{background:linear-gradient(90deg,#6756d8,#14b8a6);content:"";height:3px;left:0;position:absolute;right:0;top:0}.visitor-card:hover{border-color:color-mix(in srgb,var(--primary) 45%,var(--border));box-shadow:0 18px 42px #0f172a16;transform:translateY(-3px)}.visitor-card>header{align-items:center;display:grid;gap:10px;grid-template-columns:auto minmax(0,1fr) auto}.visitor-card-avatar{background:linear-gradient(135deg,#6756d8,#8b5cf6 55%,#14b8a6);border:2px solid #ffffffaa;border-radius:13px;box-shadow:0 6px 16px #6756d833;color:#fff;display:grid;font-size:12px;font-weight:900;height:42px;letter-spacing:.02em;place-items:center;width:42px}.visitor-card>header>div{display:grid;min-width:0}.visitor-card>header strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visitor-card>header small{color:var(--text-muted);font-size:10px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visitor-presence{align-items:center;background:#f1f5f9;border-radius:999px;color:#64748b;display:flex;font-size:8px;gap:4px;padding:5px 7px;text-transform:uppercase}.visitor-presence i{background:#94a3b8;border-radius:50%;height:6px;width:6px}.visitor-presence.online{background:#dcfce7;color:#15803d}.visitor-presence.online i{background:#22c55e;box-shadow:0 0 0 3px #22c55e1f}.visitor-card-metrics{background:color-mix(in srgb,var(--surface) 94%,var(--primary) 6%);border:1px solid color-mix(in srgb,var(--border) 70%,transparent);border-radius:12px;display:grid;gap:2px;grid-template-columns:repeat(3,1fr);margin:16px 0;padding:10px 4px}.visitor-card-metrics>div{border-right:1px solid var(--border);display:grid;min-width:0;padding:1px 8px}.visitor-card-metrics>div:last-child{border:0}.visitor-card-metrics span,.visitor-card-detail span,.visitor-card-page span,.visitor-card footer>span{color:var(--text-muted);font-size:8px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.visitor-card-metrics strong{font-size:11px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visitor-card-detail,.visitor-card-page{display:grid;margin-top:12px}.visitor-card-detail strong,.visitor-card-page strong{font-size:11px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visitor-card-detail small{color:var(--text-muted);font-size:9px;margin-top:2px}.visitor-card footer{align-items:center;border-top:1px solid var(--border);display:flex;justify-content:space-between;margin-top:15px;padding-top:12px}.visitor-card footer time{color:var(--text-secondary);font-size:9px}.visitor-directory-empty{padding:70px 24px!important;text-align:center}.visitor-directory-empty>span{color:#8b5cf6;font-size:42px}.visitor-directory-empty h4{font-size:18px;margin:10px 0 5px}.visitor-directory-empty p{color:var(--text-muted);margin:0}@media(max-width:1200px){.visitor-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.visitor-directory-head{align-items:flex-start;gap:18px;padding:22px;flex-direction:column}.visitor-directory-total{align-items:flex-start;min-width:0}.visitor-card-grid{grid-template-columns:1fr}.visitor-card{padding:16px!important}}
