/* /meta/css/kmv_login_pill.css  (safe) */

#kmvLoginPillSlot{
  position: fixed;
  top: 66px;            /* ヘッダー直下に出す */
  right: 65px;
  z-index: 2147483647;  /* 何より前に出す */
  pointer-events: none; /* クリック邪魔しない */
}

.kmv-login-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:700;
  font-size:12px;
  line-height:1;
  user-select:none;
  white-space:nowrap;

  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(6px);
  color: #e8eef7;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.kmv-login-pill .dot{
  width:10px; height:10px;
  border-radius:999px;
  background: #777;
  box-shadow: 0 0 0 2px rgba(255,255,255,.15) inset;
}

.kmv-login-pill.is-in{
  border-color: rgba(111,179,255,.45);
}
.kmv-login-pill.is-in .dot{
  background:#6fb3ff;
}

.kmv-login-pill.is-out{
  opacity:.9;
}
.kmv-login-pill.is-out .dot{
  background:#9aa3b2;
}

.kmv-login-pill.is-err{
  border-color: rgba(255,120,120,.5);
}
.kmv-login-pill.is-err .dot{
  background:#ff6b6b;
}
/* pill自体はクリック不要なので保険 */
.kmv-login-pill { pointer-events: none; }

/* もし文字が見づらい時用（好み） */
.kmv-login-pill { color: #e8eef7; }
