/* Only the add-and-share toolbar. Existing page rules are unchanged. */

.home-screen-share {
  box-sizing: border-box;
  color: var(--ink, #17211d);
  display: grid;
  gap: 8px;
  justify-items: center;
  margin: 8px auto 12px;
  max-width: 1040px;
  min-width: 0;
  padding: 0 12px 12px;
  width: 100%;
}

.home-screen-share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  max-width: 100%;
  min-width: 0;
  width: min(100%, 28rem);
}

.home-screen-share-actions button {
  align-items: center;
  background: #eaf5f0;
  border: 1px solid #c5ddd4;
  border-radius: 8px;
  box-sizing: border-box;
  color: #17352b;
  cursor: pointer;
  display: inline-flex;
  flex: 1 1 11rem;
  font: inherit;
  font-weight: 800;
  gap: 8px;
  height: auto;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
  min-width: 0;
  overflow: visible;
  overflow-wrap: anywhere;
  padding: 8px 14px;
  text-align: center;
  white-space: normal;
}

.home-screen-share-share img {
  flex: 0 0 auto;
  height: 24px;
  object-fit: contain;
  width: 24px;
}

.home-screen-share-actions button[hidden] {
  display: none;
}

.home-screen-share-steps,
.home-screen-share-status {
  line-height: 1.45;
  margin: 0;
  max-width: min(100%, 40rem);
  min-width: 0;
  overflow-wrap: anywhere;
}

.home-screen-share-steps {
  display: grid;
  gap: 6px;
  width: min(100%, 40rem);
}

.home-screen-share-steps p,
.home-screen-share-steps li {
  margin: 0;
}

.home-screen-share-steps ol {
  margin: 0;
  padding-left: 1.4rem;
  width: 100%;
}

.home-screen-share-steps li + li {
  margin-top: 6px;
}

.home-screen-share-steps ol[hidden],
.home-screen-share-choices[hidden] {
  display: none;
}

.home-screen-share-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  width: 100%;
}

.home-screen-share-choices button {
  align-items: center;
  background: #eaf5f0;
  border: 1px solid #c5ddd4;
  border-radius: 8px;
  box-sizing: border-box;
  color: #17352b;
  cursor: pointer;
  display: inline-flex;
  flex: 1 1 9rem;
  font: inherit;
  font-weight: 800;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 8px 14px;
  text-align: center;
  white-space: normal;
}

.home-screen-share-choices button[hidden] {
  display: none;
}

.home-screen-share-steps[hidden] {
  display: none;
}

.home-screen-share-steps ol {
  margin: 0;
  padding-left: 1.25rem;
}

.home-screen-share-steps li,
.home-screen-share-steps p {
  margin: 0;
  overflow-wrap: anywhere;
}

.home-screen-share-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.home-screen-share-steps button {
  align-items: center;
  background: #eaf5f0;
  border: 1px solid #c5ddd4;
  border-radius: 8px;
  box-sizing: border-box;
  color: #17352b;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 800;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 8px 14px;
  text-align: center;
  white-space: normal;
}

.home-screen-share-status:empty {
  display: none;
}

.home-screen-share-link {
  box-sizing: border-box;
  font: inherit;
  max-width: 100%;
  min-height: 44px;
  min-width: 0;
  width: min(100%, 40rem);
}

.home-screen-share-link[hidden] {
  display: none;
}