/* Install control: a small utility row (short line + button) at the bottom-right inside the tool card. The host is a
   zero-height, self-positioned anchor (it makes no shared container a positioning context, so it cannot move the title,
   description, tool UI or the share rail); the row is absolutely placed inside it. */
.sc-install { position: relative; height: 0; margin: 0; padding: 0; }
.sc-install[hidden] { display: none; }
/* Tools whose card is a grid (.pv-tool, gap 1.75rem) would turn the anchor into an extra grid row, so there the anchor is
   taken out of the grid flow and pinned to the same spot (the end of the card's content, above its bottom padding). */
.pub-site .pv-tool { position: relative; }
.pub-site .pv-tool > .sc-install {
  position: absolute; height: 0; margin: 0;
  left: clamp(1rem, 3vw, 1.75rem); right: clamp(1rem, 3vw, 1.75rem);
  bottom: calc(clamp(1rem, 3vw, 1.75rem) + .875rem);
}
.sc-install-btn {
  position: relative; z-index: 4; flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: .35rem;
  appearance: none; cursor: pointer; font: inherit; font-size: .8125rem; font-weight: 650; line-height: 1;
  letter-spacing: .01em; padding: 0 .75rem 0 .65rem; height: 26px; white-space: nowrap; border-radius: 999px;
  color: #0B1020;
  background: linear-gradient(135deg, #C9BCFF 0%, #A78BFA 55%, #8F7CF7 100%);
  border: 1px solid rgba(109, 91, 242, .65);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 1px 2px rgba(15, 23, 42, .14), 0 6px 14px -6px rgba(109, 91, 242, .55);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
/* One line, right-aligned in the card's bottom strip: a short reason to install, then the button. */
.sc-install-row { position: absolute; right: 0; top: 8px; z-index: 4; display: flex; align-items: center; justify-content: flex-end; gap: .6rem; max-width: 100%; }
.sc-install-label {
  display: inline-flex; align-items: center; height: 26px; padding: 0 .7rem; box-sizing: border-box; min-width: 0;
  font-size: .8125rem; font-weight: 550; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: #5B4BC4; background: linear-gradient(135deg, #FAF8FF, #F1ECFF);
  border: 1px solid rgba(109, 91, 242, .45); border-radius: 999px;
  box-shadow: 0 1px 2px rgba(109, 91, 242, .12);
}
.sc-install-btn svg { width: 14px; height: 14px; flex: 0 0 auto; stroke-width: 2.2; }
.sc-install-btn:hover { filter: brightness(1.06) saturate(1.05); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), 0 2px 4px rgba(15, 23, 42, .16), 0 10px 18px -6px rgba(109, 91, 242, .6); }
.sc-install-btn:active { transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { .sc-install-btn { transition: none; } .sc-install-btn:hover { transform: none; } }
.sc-install-btn:focus-visible { outline: 2px solid #000; outline-offset: 2px; }
/* iPhone/iPad Safari instructions: a small popover under the button, never part of the page flow. */
.sc-install-help {
  position: absolute; bottom: 34px; right: 0; z-index: 6; width: max-content; max-width: min(18rem, calc(100vw - 32px));
  margin: 0; padding: .6rem .75rem; text-align: left; font-size: .8125rem; line-height: 1.4;
  color: var(--pub-text-secondary, #3D4760); background: var(--pub-surface, #fff);
  border: 1px solid var(--pub-border-strong, #C3CADB); border-radius: 12px;
  box-shadow: 0 8px 24px -8px rgba(15, 23, 42, .25);
}
.sc-install-help strong { display: block; margin-bottom: .15rem; color: var(--pub-text, #0B1020); }
.sc-install-help[hidden] { display: none; }
/* The control sits in a small strip of the card's own bottom padding, so it never covers a line of content. The strip is
   added only while the control is shown; nothing inside the card moves. */
.pub-site .ic-tool.sc-has-install { padding-bottom: calc(clamp(1rem, 3vw, 1.75rem) + .875rem); }
@media (max-width: 640px) {
  .pub-site .ic-tool.sc-has-install { padding-bottom: calc(clamp(1rem, 3vw, 1.75rem) + 1rem); }
  .pub-site .pv-tool > .sc-install { bottom: calc(clamp(1rem, 3vw, 1.75rem) + 1rem); }
  .sc-install-row { top: 4px; gap: .5rem; }
  .sc-install-label { font-size: .75rem; height: 24px; padding: 0 .55rem; }
  .sc-install-btn { height: 24px; padding: 0 .6rem 0 .5rem; font-size: .75rem; }
  .sc-install-help { bottom: 28px; }
}
.sc-install-short { display: none; }
@media (max-width: 520px) { .sc-install-long { display: none; } .sc-install-short { display: inline; } }
@media (max-width: 340px) { .sc-install-label { display: none; } }
