.cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 34px; padding: 16px 22px; background: var(--fg); color: var(--bg); border: 1px solid var(--fg); border-radius: var(--r-chip); font: var(--type-chip); letter-spacing: normal; text-transform: none; text-decoration: none; white-space: nowrap; cursor: pointer; }
    .cta:hover { background: var(--bg); color: var(--fg); }
    .requirements { font-size: 12px; margin: 0 0 14px; }
    html:has(.install-dialog[open]) { overflow: hidden; }
    .install-dialog { width: min(640px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: clamp(24px, 4vw, 40px); overflow-y: auto; background: var(--bg); color: var(--fg); border: 1px solid var(--rule); border-radius: var(--r-card); box-shadow: var(--shadow-device); }
    .install-dialog::backdrop { background: #0009; }
    .dialog-close { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; padding: 0; border: 1px solid var(--rule); border-radius: var(--r-sm); background: var(--bg); color: var(--fg); font-size: 24px; cursor: pointer; }
    .dialog-close:hover { border-color: var(--fg); }
    .install-dialog .eyebrow { margin-right: 36px; }
    .install-dialog h2 { max-width: 440px; }
    .install-warning { margin: 24px 0; padding: 16px 18px; border-left: 1px solid var(--activity); background: var(--surface); }
    .install-warning h3 { margin: 0 0 8px; font-size: 16px; font-weight: 600; }
    .install-warning p { margin: 0; color: var(--text-note); font-size: 14px; line-height: 1.6; }
    .terminal { display: flex; align-items: center; gap: 12px; padding: 18px 16px; background: var(--surface); border: 1px solid var(--rule); border-radius: var(--r-sm); }
    .terminal-prompt { color: var(--activity); font: 16px var(--font-mono); }
    .terminal code { min-width: 0; flex: 1; overflow-wrap: anywhere; white-space: normal; font: 12px/1.7 var(--font-mono); }
    .copy { flex: none; padding: 8px 10px; border: 1px solid var(--rule); border-radius: var(--r-sm); background: var(--bg); color: var(--fg); font: 12px var(--font-app); cursor: pointer; }
    .copy:hover { border-color: var(--fg); }
    .install-status { margin: 10px 0 18px; font-size: 12px; }
    .install-links { display: flex; flex-wrap: wrap; gap: 20px; font-size: 12px; color: var(--text-muted); }
    .feedback-dialog { width: min(520px, calc(100vw - 32px)); }
    .feedback-dialog h2 { margin-right: 32px; }
    .feedback-prompt { margin: 20px 0 10px; color: var(--text-note); font: var(--type-prose); }
    .feedback-note { margin: 0 0 20px; color: var(--text-muted); font-size: 13px; }
    .feedback-form textarea { display: block; width: 100%; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--r-sm); background: var(--surface); color: var(--fg); font: 16px/1.5 var(--font-app); resize: vertical; }
    .feedback-submit { width: 100%; margin-top: 14px; }
    .feedback-submit kbd { padding: 2px 6px; border: 1px solid currentColor; border-radius: 3px; font: 11px/1.5 var(--font-mono); opacity: .7; }
    .feedback-submit:disabled { opacity: .55; cursor: wait; }
    .feedback-status { margin: 12px 0 0; color: var(--text-note); font-size: 13px; line-height: 1.5; }
    .feedback-status:empty { display: none; }

/* Shared install buttons; feedback submission keeps its existing behavior. */
.cta[data-open-install] { transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease; }
.cta[data-open-install] > span { display: inline-block; transition: transform 220ms ease; }
.cta[data-open-install]:focus-visible { transform: translateY(-2px); }
@media (hover: hover) {
  .cta[data-open-install]:hover { transform: translateY(-3px); box-shadow: 0 6px 0 color-mix(in srgb, var(--activity) 35%, transparent); }
  .cta[data-open-install]:hover > span { transform: translate(3px, -3px); }
}
.cta[data-open-install]:active { transform: translateY(1px) scale(.97); box-shadow: none; transition-duration: 70ms; }
.cta[data-open-install]:active > span { transform: translate(1px, -1px); }
@media (prefers-reduced-motion: reduce) {
  .cta[data-open-install], .cta[data-open-install] > span { transition: none; }
  .cta[data-open-install]:hover, .cta[data-open-install]:focus-visible, .cta[data-open-install]:active,
  .cta[data-open-install]:hover > span, .cta[data-open-install]:active > span { transform: none; }
}

#share-feedback { padding: 0; border: 0; background: none; color: inherit; text-decoration: underline; text-underline-offset: 3px; font: inherit; cursor: pointer; }
#share-feedback:focus-visible { outline: 2px solid var(--activity); outline-offset: 4px; }