/* Quick analysis: floating call to action and its four-step dialog (quickAnalysis.js).
   A site themes it with the --qa-* variables on .qa-dock and .qa-dialog. */
.qa-dock, .qa-dialog {
  --qa-a: #7c3aed; --qa-b: #ec4899; --qa-c: #fbbf24; --qa-on: #fff;
  --qa-bg: #fff; --qa-fg: #14161f; --qa-muted: #5b6472; --qa-line: #dfe3ea;
  --qa-brand: linear-gradient(120deg, var(--qa-a), var(--qa-b));
  --qa-soft: color-mix(in srgb, var(--qa-a) 11%, var(--qa-bg));
  font-family: inherit; line-height: 1.4; color: var(--qa-fg); box-sizing: border-box;
}
.qa-dock *, .qa-dialog * { box-sizing: border-box; }
/* Element styles of the host site (form cards, label margins, button looks) must not reach the widget. */
.qa-dock button, .qa-dialog button { font: inherit; color: inherit; background: none; border: 0; border-radius: 0; padding: 0; margin: 0; min-height: 0; box-shadow: none; text-transform: none; letter-spacing: normal; cursor: pointer; }
.qa-dialog form { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.qa-dialog label { margin-bottom: 0; }
.qa-dock :focus-visible, .qa-dialog :focus-visible { outline: 2px solid var(--qa-a); outline-offset: 2px; }
.qa-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.qa-dock { position: fixed; right: var(--qa-right, 1.5rem); bottom: var(--qa-bottom, 1.5rem); z-index: var(--qa-z, 45); display: flex; flex-direction: column; align-items: flex-end; gap: 0.75rem; transition: opacity 0.2s; }
.qa-dock[data-open] { opacity: 0; pointer-events: none; }
@media (max-width: 640px) { .qa-dock { right: var(--qa-right, 1rem); bottom: var(--qa-bottom-mobile, var(--qa-bottom, 1rem)); } }
@media print { .qa-dock { display: none; } }

@property --qa-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes qa-spin { to { --qa-angle: 360deg; } }
@keyframes qa-halo { from { box-shadow: 0 0 0 0 color-mix(in srgb, var(--qa-b) 55%, transparent); } to { box-shadow: 0 0 0 22px transparent; } }
@keyframes qa-nudge { 0%, 84%, 100% { transform: none; } 87% { transform: rotate(-4deg) scale(1.07); } 90% { transform: rotate(4deg) scale(1.07); } 93% { transform: rotate(-2deg) scale(1.03); } 96% { transform: rotate(1deg); } }
@keyframes qa-twinkle { 0%, 100% { transform: none; } 50% { transform: rotate(18deg) scale(1.25); } }
.qa-dock .qa-fab { position: relative; border-radius: 999px; padding: 3px; background: conic-gradient(from var(--qa-angle), var(--qa-a), var(--qa-b), var(--qa-c), var(--qa-b), var(--qa-a)); animation: qa-spin 3s linear infinite, qa-halo 2.2s ease-out infinite, qa-nudge 8s ease-in-out 4s infinite; }
.qa-dock .qa-fab:hover { animation-play-state: running, running, paused; transform: scale(1.05); }
.qa-fab-in { display: flex; align-items: center; gap: 0.6rem; height: 3.5rem; padding: 0 1.25rem 0 1rem; border-radius: 999px; background: var(--qa-brand); color: var(--qa-on); font-size: 15px; font-weight: 650; white-space: nowrap; }
.qa-fab-in svg { width: 1.5rem; height: 1.5rem; animation: qa-twinkle 2.4s ease-in-out infinite; }
.qa-badge { border-radius: 999px; background: rgb(255 255 255 / 0.22); padding: 0.1rem 0.5rem; font-size: 12px; font-weight: 700; letter-spacing: 0.02em; }

@keyframes qa-teaser { from { opacity: 0; transform: translateY(14px) scale(0.85); } to { opacity: 1; transform: none; } }
@keyframes qa-float { 50% { translate: 0 -5px; } }
.qa-teaser { position: relative; max-width: 19rem; border-radius: 1.1rem 1.1rem 0.4rem 1.1rem; border: 1px solid color-mix(in srgb, var(--qa-a) 35%, var(--qa-line)); background: var(--qa-bg); box-shadow: 0 22px 60px -22px color-mix(in srgb, var(--qa-a) 60%, transparent), 0 6px 18px -8px rgb(0 0 0 / 0.25); transform-origin: bottom right; animation: qa-teaser 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.3) both, qa-float 4s ease-in-out 0.6s infinite; }
.qa-teaser[hidden] { display: none; }
.qa-dock .qa-teaser-open { display: block; width: 100%; padding: 0.95rem 2.3rem 0.95rem 1rem; text-align: left; }
.qa-teaser-open strong { display: block; font-size: 15.5px; line-height: 1.3; font-weight: 700; color: var(--qa-fg); }
.qa-teaser-open span { display: block; margin-top: 0.4rem; font-size: 13.5px; line-height: 1.35; color: var(--qa-muted); }
.qa-teaser-open em { display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.6rem; font-style: normal; font-size: 13.5px; font-weight: 700; background: var(--qa-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qa-teaser-open em::after { content: "→"; color: var(--qa-b); transition: translate 0.2s; }
.qa-teaser-open:hover em::after { translate: 4px 0; }
.qa-dock .qa-teaser-x { position: absolute; top: 0.4rem; right: 0.4rem; display: flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 999px; color: var(--qa-muted); font-size: 18px; line-height: 1; }
.qa-dock .qa-teaser-x:hover { background: color-mix(in srgb, var(--qa-fg) 8%, transparent); color: var(--qa-fg); }

.qa-dialog { position: fixed; inset: auto 0 0 0; margin: 0; padding: 0; width: 100%; max-width: none; max-height: none; border: 0; overflow: hidden; border-radius: 1.75rem 1.75rem 0 0; background: var(--qa-bg); box-shadow: 0 40px 120px -30px color-mix(in srgb, var(--qa-a) 55%, transparent), 0 10px 40px -10px rgb(0 0 0 / 0.35); }
@media (min-width: 640px) { .qa-dialog { inset: auto 1.5rem 1.5rem auto; width: 30rem; border-radius: 1.75rem; } }
.qa-dialog::backdrop { background: rgb(14 14 18 / 0.45); backdrop-filter: blur(6px); }
@keyframes qa-open { from { opacity: 0; transform: translateY(28px) scale(0.85); } }
.qa-dialog[open] { transform-origin: bottom right; animation: qa-open 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.15) both; }
.qa-shell { display: flex; flex-direction: column; max-height: min(52rem, 94dvh); }

.qa-head { position: relative; overflow: hidden; padding: 1rem 1.25rem 1.25rem; background: var(--qa-brand); color: var(--qa-on); }
.qa-gears { position: absolute; top: -0.5rem; right: 2.5rem; width: 9rem; height: 6rem; opacity: 0.3; pointer-events: none; }
@keyframes qa-turn { to { transform: rotate(360deg); } }
.qa-gear { transform-box: fill-box; transform-origin: center; animation: qa-turn var(--qa-speed, 9s) linear infinite; }
.qa-gear[data-rev] { animation-direction: reverse; }
.qa-head-row { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.qa-title { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; color: inherit; }
.qa-title svg { width: 1.25rem; height: 1.25rem; }
.qa-dialog .qa-close { display: flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 999px; background: rgb(255 255 255 / 0.16); color: var(--qa-on); font-size: 20px; line-height: 1; }
.qa-dialog .qa-close:hover { background: rgb(255 255 255 / 0.28); }
.qa-progress { position: relative; display: flex; align-items: center; gap: 0.75rem; margin-top: 0.75rem; font-size: 12.5px; font-weight: 600; }
.qa-bar { flex: 1; height: 0.375rem; border-radius: 999px; background: rgb(255 255 255 / 0.26); overflow: hidden; }
.qa-bar i { display: block; height: 100%; border-radius: 999px; background: var(--qa-on); transition: width 0.7s cubic-bezier(0.2, 0.9, 0.3, 1); }

.qa-scene { flex: 1; overflow: hidden auto; padding: 1.25rem; perspective: 1400px; }
@keyframes qa-flip-out { to { transform: rotateY(calc(var(--qa-dir, 1) * 90deg)) scale(0.94); opacity: 0.15; } }
@keyframes qa-flip-in { from { transform: rotateY(calc(var(--qa-dir, 1) * -90deg)) scale(0.94); opacity: 0.15; } }
.qa-card[data-flip="out"] { animation: qa-flip-out 0.24s cubic-bezier(0.5, 0, 0.9, 0.5) both; }
.qa-card[data-flip="in"] { animation: qa-flip-in 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.2) both; }
.qa-card h2 { margin: 0; font-size: 1.35rem; line-height: 1.2; font-weight: 700; letter-spacing: -0.015em; text-wrap: balance; color: var(--qa-fg); }
.qa-card h3 { margin: 1.5rem 0 0; font-size: 15px; font-weight: 700; color: var(--qa-fg); }
.qa-lead { margin: 0.3rem 0 0; font-size: 13.5px; color: var(--qa-muted); }
.qa-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; }
.qa-sizes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; margin-top: 0.65rem; }
@keyframes qa-pop { 0% { scale: 0.9; } 60% { scale: 1.08; } }
.qa-dialog .qa-chip { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; border-radius: 999px; border: 1px solid var(--qa-line); padding: 0.5rem 0.9rem; font-size: 14px; font-weight: 550; color: var(--qa-muted); text-align: left; transition: border-color 0.15s, background 0.15s, color 0.15s; }
.qa-dialog .qa-chip:hover { border-color: color-mix(in srgb, var(--qa-a) 60%, var(--qa-line)); }
.qa-dialog .qa-chip[aria-pressed="true"] { border-color: var(--qa-a); background: var(--qa-soft); color: var(--qa-fg); animation: qa-pop 0.35s cubic-bezier(0.2, 0.9, 0.3, 1.6); }
.qa-chip[aria-pressed="true"]::before { content: "✓"; font-weight: 800; color: var(--qa-a); }

.qa-gauge { position: relative; width: 14rem; margin: 0.75rem auto 0; }
.qa-gauge svg { display: block; width: 100%; }
.qa-gauge-arc { transition: stroke-dashoffset 0.5s ease-out; }
.qa-gauge-track { stroke: var(--qa-line); }
.qa-stop-a { stop-color: var(--qa-a); }
.qa-stop-b { stop-color: var(--qa-b); }
.qa-done-disc { fill: var(--qa-soft); }
.qa-gauge p { position: absolute; inset: auto 0 0 0; margin: 0; text-align: center; font-size: 13px; font-weight: 550; color: var(--qa-muted); }
.qa-big { display: block; font-size: 2.6rem; line-height: 1; font-weight: 750; letter-spacing: -0.03em; background: var(--qa-brand); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.qa-range { margin-top: 1.25rem; }
.qa-range label { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; font-size: 14.5px; font-weight: 650; color: var(--qa-fg); }
.qa-range output { font-size: 1.25rem; font-weight: 750; color: var(--qa-a); font-variant-numeric: tabular-nums; }
.qa-range input { display: block; width: 100%; margin: 0.5rem 0 0; accent-color: var(--qa-a); }

.qa-voice { display: flex; align-items: center; gap: 1.25rem; margin-top: 1.25rem; }
.qa-dialog .qa-rec { position: relative; flex: none; display: flex; align-items: center; justify-content: center; width: 5rem; height: 5rem; border-radius: 999px; background: var(--qa-brand); color: var(--qa-on); box-shadow: 0 14px 36px -12px color-mix(in srgb, var(--qa-b) 80%, transparent); transition: transform 0.15s; }
.qa-dialog .qa-rec:hover { transform: scale(1.05); }
.qa-rec svg { width: 2.2rem; height: 2.2rem; }
.qa-rec[aria-pressed="true"] { animation: qa-halo 1.4s ease-out infinite; }
.qa-voice b { display: block; font-weight: 700; }
@keyframes qa-eq { 0%, 100% { transform: scaleY(0.25); } 50% { transform: scaleY(1); } }
.qa-eq { display: flex; align-items: flex-end; gap: 0.25rem; height: 1.75rem; margin-top: 0.5rem; }
.qa-eq i { width: 0.375rem; border-radius: 999px; background: var(--qa-brand); transform-origin: bottom; transform: scaleY(0.18); opacity: 0.35; }
.qa-eq[data-on] i { opacity: 1; animation: qa-eq 0.9s ease-in-out infinite; }
.qa-field { display: block; width: 100%; margin-top: 0.4rem; border-radius: 0.75rem; border: 1px solid var(--qa-line); background: var(--qa-bg); padding: 0.6rem 0.85rem; font: inherit; font-size: 15px; color: var(--qa-fg); }
.qa-field::placeholder { color: color-mix(in srgb, var(--qa-muted) 65%, transparent); }
.qa-field:focus { outline: none; border-color: var(--qa-a); box-shadow: 0 0 0 3px color-mix(in srgb, var(--qa-a) 18%, transparent); }
textarea.qa-field { margin-top: 1.25rem; resize: none; }
.qa-interim { margin: 0.5rem 0 0; font-size: 13.5px; font-style: italic; color: var(--qa-muted); }
.qa-alert { margin: 0.75rem 0 0; font-size: 13.5px; color: #dc2626; }

.qa-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin: 1rem 0 0; }
.qa-stats p { margin: 0; }
@keyframes qa-rise { from { opacity: 0; transform: translateY(18px) rotateX(-40deg); } }
.qa-stat { border-radius: 1rem; padding: 0.75rem; background: var(--qa-soft); animation: qa-rise 0.6s cubic-bezier(0.2, 0.9, 0.3, 1.2) both; }
.qa-stat:nth-child(2) { background: color-mix(in srgb, var(--qa-b) 13%, var(--qa-bg)); animation-delay: 0.12s; }
.qa-stat:nth-child(3) { background: color-mix(in srgb, var(--qa-c) 16%, var(--qa-bg)); animation-delay: 0.24s; }
.qa-stat b { display: block; font-size: 1.7rem; }
.qa-stat span { display: block; margin-top: 0.4rem; font-size: 12px; line-height: 1.25; font-weight: 550; color: color-mix(in srgb, var(--qa-fg) 80%, transparent); }
.qa-picks-title { margin: 1rem 0 0; font-size: 12.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--qa-muted); }
.qa-picks { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0.5rem 0 0; padding: 0; list-style: none; }
.qa-picks li { border-radius: 999px; background: var(--qa-soft); padding: 0.25rem 0.75rem; font-size: 13px; font-weight: 650; }
.qa-note { margin: 0.75rem 0 0; font-size: 12.5px; line-height: 1.35; color: var(--qa-muted); }
.qa-send { margin: 1.1rem 0 0; border-radius: 1rem; background: var(--qa-soft); padding: 0.75rem 1rem; font-size: 15px; line-height: 1.35; font-weight: 700; }
.qa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.75rem; }
.qa-grid label { font-size: 13px; font-weight: 650; }
.qa-grid label abbr, .qa-consent abbr { color: var(--qa-b); text-decoration: none; }
.qa-hp { display: none; }
.qa-consent { display: flex; align-items: flex-start; gap: 0.6rem; margin-top: 0.75rem; font-size: 12.5px; line-height: 1.35; color: var(--qa-muted); }
.qa-consent input { flex: none; width: 1rem; height: 1rem; margin: 0.1rem 0 0; accent-color: var(--qa-a); }
.qa-consent a { font-weight: 650; color: var(--qa-fg); text-underline-offset: 3px; }

.qa-done { padding: 1.5rem 0; text-align: center; }
.qa-done svg { width: 6rem; height: 6rem; }
@keyframes qa-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.qa-done [pathLength] { stroke-dasharray: 1; animation: qa-draw 0.7s 0.3s ease-out both; }
.qa-done h2 { margin-top: 1.25rem; font-size: 1.5rem; }
.qa-done p { max-width: 20rem; margin: 0.5rem auto 0; font-size: 15px; line-height: 1.55; color: var(--qa-muted); }
.qa-done code { border-radius: 0.3rem; background: var(--qa-soft); padding: 0.1rem 0.4rem; font-size: 14px; }

.qa-foot { display: flex; align-items: center; gap: 0.75rem; border-top: 1px solid var(--qa-line); padding: 1rem; }
.qa-foot[hidden] { display: none; }
.qa-dialog .qa-back { flex: none; display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 999px; border: 1px solid var(--qa-line); font-size: 18px; }
.qa-dialog .qa-back:hover { border-color: var(--qa-a); }
.qa-back[hidden] { display: none; }
.qa-dialog .qa-next { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; height: 3rem; border-radius: 999px; padding: 0 1.5rem; background: var(--qa-brand); color: var(--qa-on); font-size: 15px; font-weight: 650; box-shadow: 0 10px 32px -10px color-mix(in srgb, var(--qa-b) 70%, transparent); transition: filter 0.15s, opacity 0.15s; }
.qa-dialog .qa-next:hover { filter: brightness(1.1); }
.qa-dialog .qa-next:disabled { opacity: 0.4; box-shadow: none; cursor: not-allowed; }

@media (prefers-reduced-motion: reduce) {
  .qa-dock *, .qa-dock, .qa-dialog, .qa-dialog * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}