/* the way in: your company's website → Pip reads it on app.premonition.sh (/start?site=…). One field, one button. */
.try { width: 100%; max-width: 560px; margin: 6px auto 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.try-row { position: relative; width: 100%; display: flex; align-items: center; gap: 6px; padding: 6px 6px 6px 18px; border-radius: 999px; background: #fff;
  box-shadow: 0 0 0 1.5px var(--line-2), 0 24px 50px -30px rgba(58, 36, 130, .55); transition: box-shadow .25s; }
.try-row:focus-within { box-shadow: 0 0 0 2px var(--ai), 0 0 0 7px var(--ai-soft), 0 24px 50px -30px rgba(58, 36, 130, .55); }
.try-globe { width: 19px; height: 19px; flex: 0 0 auto; fill: none; stroke: var(--ink-3); stroke-width: 1.8; stroke-linecap: round; }
.try-in { flex: 1 1 auto; min-width: 0; height: 50px; border: 0; outline: 0; background: transparent; font: 400 17px/1 var(--body); color: var(--ink); }
.try-in::placeholder { color: var(--ink-3); }
.try-go { height: 50px; padding: 0 22px; font-size: 16px; }
.try-go svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s; }
.try-go:hover svg { transform: translateX(3px); }
.try-say { margin: 0; font: 400 14px/1.5 var(--body); color: var(--ink-3); text-align: center; text-wrap: balance; }
.try-say a { color: var(--ai-ink); font-weight: 500; text-decoration: none; white-space: nowrap; }
.try-say a:hover { text-decoration: underline; text-underline-offset: 3px; }
.try-bad .try-row { animation: try-shake .4s; box-shadow: 0 0 0 2px #ff6b4a, 0 0 0 7px #fff1ed; }
.try-bad .try-say { color: #c2401f; }
@keyframes try-shake { 20%, 60% { transform: translateX(-6px) } 40%, 80% { transform: translateX(6px) } }
.go .try { margin-top: 26px; }
.wl-more { margin: 18px auto 0; max-width: 560px; text-align: center; }
.wl-more summary { display: inline-block; cursor: pointer; list-style: none; font: 500 14px/1.4 var(--body); color: var(--ink-3); }
.wl-more summary::-webkit-details-marker { display: none; }
.wl-more summary:hover { color: var(--ai-ink); }
.wl-more[open] summary { margin-bottom: 14px; }
@media (max-width: 520px) {
  .try-row { flex-wrap: wrap; border-radius: 22px; padding: 6px 6px 6px 16px; }
  .try-in { flex-basis: calc(100% - 40px); }
  .try-go { flex: 1 1 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .try-bad .try-row { animation: none; } }
.h-copy .try { margin-top: 22px; }
.h-copy .try-say { font-size: 14.5px; }
