.hosted-access {
  width: min(36rem, calc(100% - 3rem));
  margin: 12vh auto;
  padding: 2rem;
  border: 1px solid var(--line, #d9dcd6);
  border-radius: 12px;
  background: var(--paper, #fff);
}
.hosted-access h1 {
  font-size: clamp(1.8rem, 5vw, 2.5rem);
}
.hosted-access p {
  line-height: 1.6;
}
.remote-recovery {
  margin: 1rem 2rem;
}
.remote-recovery > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.workbench-user {
  overflow-wrap: anywhere;
}
.top-actions {
  flex-wrap: wrap;
}
.top-actions .save-dot {
  white-space: normal;
}
.mobile-signout {
  display: none;
}
.editor-dialog td small {
  display: block;
  max-width: 18rem;
  overflow-wrap: anywhere;
}
@media (max-width: 720px) {
  .studio-topbar {
    flex-wrap: wrap;
    gap: 0.75rem;
    height: auto;
    min-height: 72px;
    padding-block: 1rem;
  }
  .top-actions {
    justify-content: flex-start;
    gap: 0.5rem;
  }
  .top-actions .save-dot {
    display: inline-block;
    flex-basis: 100%;
  }
  .mobile-signout {
    display: inline-flex;
  }
  .remote-recovery {
    margin: 0.75rem;
  }
  .hosted-access {
    padding: 1.25rem;
  }
}
