#svb-online-container{display:block;margin:16px 0}
.svb-online-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.svb-pill{font-size:13px;padding:6px 10px;border-radius:4px;border:1px solid rgba(0,0,0,.12);display:inline-flex;gap:6px;align-items:center;background:#fff;color:#111}
.svb-pill .lbl{opacity:.85}
.svb-pill .val{font-weight:700}
.svb-sep{opacity:.4;margin:0 6px}
.svb-user-ico{display:inline-block}
.svb-top{margin-top:10px}
.svb-top .list{margin:6px 0 0 18px}
.svb-top .list li a{text-decoration:none}
/* Floating */
.svb-floating{position:fixed;right:16px;bottom:16px;z-index:9999;max-width:92vw;box-shadow:0 6px 24px rgba(0,0,0,.12);border-radius:8px;padding:8px;background:#fff}

/* Dark mode (auto) */
@media (prefers-color-scheme: dark){
  #svb-online-container:not(.svb-light) .svb-pill{background:#111;color:#eee;border-color:rgba(255,255,255,.15)}
  #svb-online-container:not(.svb-light).svb-floating{background:#111;color:#eee;box-shadow:0 6px 24px rgba(0,0,0,.5)}
}
/* Force dark */
#svb-online-container.svb-dark .svb-pill{background:#111;color:#eee;border-color:rgba(255,255,255,.15)}
#svb-online-container.svb-dark.svb-floating{background:#111;color:#eee;box-shadow:0 6px 24px rgba(0,0,0,.5)}
/* Force light */
#svb-online-container.svb-light .svb-pill{background:#fff;color:#111;border-color:rgba(0,0,0,.12)}

/* Mobile compact (<=600px) */
@media (max-width: 600px){
  #svb-online-container.svb-compact-enabled .svb-online-bar{gap:6px}
  #svb-online-container.svb-compact-enabled .svb-pill{padding:4px 8px;font-size:12px}
  #svb-online-container.svb-compact-enabled .svb-sep{display:none}
  #svb-online-container.svb-compact-enabled .svb-pill .lbl{display:none} /* sadece sayıları bırak */
  #svb-online-container.svb-compact-enabled .svb-top{display:none} /* uzun listeleri gizle */
  #svb-online-container.svb-compact-enabled.svb-floating{right:10px;bottom:10px;padding:6px;border-radius:6px}
}

/* Alignment helpers */
#svb-online-container.svb-align-center .svb-online-bar{justify-content:center}
#svb-online-container.svb-align-right .svb-online-bar{justify-content:flex-end}
#svb-online-container.svb-align-left .svb-online-bar{justify-content:flex-start}
