/* =========================================================
   MUSICBOXFRANK ACCOUNT ENTRY v4.0.1
   ========================================================= */

.frank-account-entry {
  position: fixed;

  top: 18px;
  right: 20px;

  z-index: 9000;

  display: flex;
  flex-direction: column;
  align-items: flex-end;

  gap: 6px;

  font-family:
    Inter,
    "Helvetica Neue",
    Arial,
    sans-serif;
}

.frank-account-entry-label {
  padding-right: 3px;

  font-size: 7px;
  font-weight: 650;

  letter-spacing: .16em;

  opacity: .34;
}

.frank-account-entry-actions {
  display: flex;

  align-items: center;

  gap: 7px;

  padding: 5px;

  border:
    1px solid rgba(255,255,255,.09);

  border-radius: 14px;

  background:
    rgba(10,14,20,.72);

  backdrop-filter:
    blur(15px);

  box-shadow:
    0 12px 34px rgba(0,0,0,.22);
}

.frank-account-register,
.frank-account-login {
  min-height: 34px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  padding:
    0 13px;

  border-radius: 9px;

  font-size: 8px;
  font-weight: 750;

  letter-spacing: .11em;

  text-decoration: none;

  transition:
    transform .15s ease,
    opacity .15s ease,
    background .15s ease;
}

.frank-account-register {
  border:
    1px solid rgba(255,255,255,.10);

  color: inherit;

  opacity: .62;
}

.frank-account-login {
  background:
    rgba(255,255,255,.92);

  color:
    rgba(8,11,16,.96);
}

.frank-account-register:hover,
.frank-account-login:hover {
  transform:
    translateY(-1px);

  opacity: 1;
}

@media (max-width: 720px) {
  .frank-account-entry {
    top: 10px;
    right: 10px;
  }

  .frank-account-entry-label {
    display: none;
  }

  .frank-account-register,
  .frank-account-login {
    padding:
      0 9px;

    font-size: 7px;
  }
}