html body .wp .gym-ui-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.wp .gym-checkin { margin-top: 18px; padding-top: 16px; }
.wp .gym-checkin h2 { margin-bottom: 2px; }
.wp .gym-checkin-name { font-size: 15px; color: var(--fg); }
.gym-ui-button {
  min-width: 44px;
  min-height: 44px;
  padding: 7px 10px;
  border: 1px solid var(--good);
  border-radius: 8px;
  color: var(--good);
  background: var(--good-fill);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.gym-ui-button:hover { color: var(--fg); background: var(--cell); }
.gym-ui-button:focus-visible { outline: 2px solid var(--good); outline-offset: 2px; }
.gym-ui-button:disabled { color: var(--good); background: var(--good-fill); cursor: default; }
.gym-ui-button.is-idle {
  min-width: 64px;
  padding: 0 12px;
  white-space: nowrap;
}
.gym-ui-status {
  min-height: 1.55em;
  margin-top: 4px;
  color: var(--faint);
  font-size: 12px;
  line-height: 1.55;
}
.gym-ui-status:empty { display: none; }
.gym-ui-status.is-pending { color: var(--muted); }
.gym-ui-status.is-done { color: var(--good); }
.gym-ui-status.is-error { color: var(--warn); }
.gym-ui-status .gym-ui-button { margin-left: 8px; }
.gym-ui-install {
  display: inline-block;
  margin-left: 8px;
  color: var(--muted);
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.gym-ui-install:focus-visible { outline: 2px solid var(--good); outline-offset: 2px; }
@media (max-width: 480px) {
  html body .wp .gym-ui-label { align-items: center; }
  .gym-ui-button { font-size: 12px; }
}