.demo-strip{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}
.demo-strip>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.demo-strip strong{font-size:14px;color:#93e2ca;white-space:nowrap}
.demo-strip span{font-size:14px;color:#acbeb9;line-height:1.6}
.demo-strip button{font-size:14px;flex-shrink:0}
.demo-id{display:block;color:#809f96;font-family:monospace;font-size:12px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px}
.demo-full-id{display:block;font-size:14px;overflow-wrap:anywhere;color:#a9cfbf}
.demo-sub{display:block;font-size:12px;color:#9bb5ac;margin-top:5px}
.demo-detail-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:20px 0;border-top:1px solid #30413d;border-bottom:1px solid #30413d;margin:22px 0}
.demo-detail-stats>div{font-size:14px;color:#9bb5ac}
.demo-detail-stats strong{display:block;font-size:24px;color:#e0f2ea;font-variant-numeric:tabular-nums;margin-top:8px;overflow-wrap:anywhere}
.demo-detail p{line-height:1.8}
.demo-detail .usage-chart{margin:20px 0}
.demo-detail .tbl{min-width:650px}
.live-user{--bg:#07111b;--card:#0d1e2c;--line:#244052;--accent:#73e9d6;--text:#e6f7ff;background:radial-gradient(ellipse at 80% 0,#16415950,transparent 55%),#07111b}
.live-user .content{max-width:1900px}.live-user .home-greet h2{font-size:34px}.live-user .home-greet p{font-size:16px}.live-user .stat-card{background:linear-gradient(135deg,#142d40,#0d1d2d);border-color:#315568;padding:26px}.live-user .stat-card .s-label{font-size:15px}.live-user .stat-card .s-value{font:600 clamp(22px,2.1vw,38px)/1.5 Consolas,monospace;letter-spacing:-1px;color:#d3fff5}.live-user .stat-card .s-sub{font-size:13px}.live-user .card-title h3{font-size:17px}.live-user .tbl th,.live-user .tbl td{font-size:14px}.live-user .card{background:#0d1d2b;border-color:#2a465b}.live-user .badge{font-size:12px}.live-user .demo-strip{background:#102c36}.live-user .sidebar{background:#091723}.live-user .topbar{background:#0b1c2bec}
@media(max-width:700px){.live-user .home-greet h2{font-size:26px}.live-user .stat-card{padding:18px}.live-user .stat-card .s-value{font-size:22px}}
.demo-strip button:focus-visible,.demo-detail button:focus-visible{outline:2px solid #93e2ca;outline-offset:4px}
@media(max-width:640px){.demo-strip{gap:10px}.demo-strip>div{gap:6px}.demo-strip span{font-size:13px}.demo-detail-stats{grid-template-columns:1fr;gap:14px}.demo-detail-stats strong{font-size:22px}.demo-id{max-width:170px}}
.network-monitor{display:inline-flex;flex-direction:column;gap:4px;padding:3px 12px;border-left:2px solid #375c6b;font-size:12px;line-height:1.4;color:#a9c3d2;white-space:nowrap}.network-monitor b{font:500 12px Consolas,monospace;color:#99b6c7}.network-monitor b[data-state=online]{color:#87e8c6}.network-monitor b[data-state=slow]{color:#eed18a}.network-monitor b[data-state=offline]{color:#f59d9d}.topbar{height:auto!important;min-height:76px;padding-top:12px!important;padding-bottom:12px!important;gap:14px}.topbar .tb-right{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}.topbar .tb-title{flex-shrink:0}@media(max-width:1100px){.topbar{align-items:flex-start;flex-wrap:wrap}.topbar .tb-right{justify-content:flex-start}.network-monitor{padding-left:8px}.topbar .btn-sm{font-size:12px}}@media(max-width:600px){.topbar .tb-title{width:100%}.topbar .tb-right{gap:8px}.network-monitor{font-size:11px}.network-monitor b{font-size:11px}}
