.sm-suchdemo{position:relative;margin:0;display:flex;flex-direction:column;gap:var(--sm-s-3)}.sm-suchdemo-karte{background:var(--sm-surface);color:var(--sm-ink);border-radius:var(--sm-r-lg);overflow:hidden;box-shadow:var(--sm-shadow-float)}.sm-suchdemo-leiste{display:flex;align-items:center;gap:var(--sm-s-2);padding:var(--sm-s-3) var(--sm-s-4);padding-right:calc(44px + var(--sm-s-5));border-bottom:1px solid var(--sm-line);background:var(--sm-bg)}.sm-suchdemo-tab{display:inline-flex;align-items:center;gap:var(--sm-s-2);padding:6px 12px;border-radius:var(--sm-r-sm);font-size:14px;font-weight:500;color:var(--sm-ink-2);transition:background var(--sm-d-2) var(--sm-ease-in-out),color var(--sm-d-2) var(--sm-ease-in-out)}.sm-suchdemo-tab svg{width:16px;height:16px}.sm-suchdemo-phase{margin-left:auto;font-size:12px;font-weight:500;padding:4px 10px;border-radius:var(--sm-r-sm);background:var(--sm-accent-tint-2);color:var(--sm-accent);white-space:nowrap}.sm-suchdemo-ansichten{display:grid;padding:var(--sm-s-4)}@media(min-width:720px){.sm-suchdemo-ansichten{padding:var(--sm-s-5)}}.sm-suchdemo-ansicht,.sm-suchdemo-liste{grid-area:1 / 1;transition:opacity var(--sm-d-3) var(--sm-ease-out)}.sm-suchdemo-ansicht{display:flex;flex-direction:column;gap:var(--sm-s-4);min-width:0}.sm-suchdemo-suche{margin:0;display:flex;align-items:center;gap:var(--sm-s-3);min-height:44px;padding:0 var(--sm-s-4);border:1px solid var(--sm-line);border-radius:var(--sm-r-pill);font-size:15px;color:var(--sm-ink)}.sm-suchdemo-suche svg{width:18px;height:18px;flex-shrink:0;color:var(--sm-ink-2)}.sm-suchdemo-suche [data-tippen]{min-width:0;white-space:nowrap;overflow:hidden}.sm-suchdemo-cursor{width:2px;height:1.1em;margin-left:-10px;background:var(--sm-accent)}.sm-suchdemo-listen{display:grid}.sm-suchdemo-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sm-s-2)}.sm-suchdemo-treffer{position:relative;display:flex;flex-direction:column;gap:2px;padding:var(--sm-s-3);border:1px solid transparent;border-radius:var(--sm-r-md);transition:opacity var(--sm-d-3) var(--sm-ease-out),transform var(--sm-d-3) var(--sm-ease-out)}.sm-suchdemo-treffer.is-gewonnen{border:2px solid var(--sm-accent);background:var(--sm-accent-tint)}.sm-suchdemo-url{display:inline-flex;align-items:center;gap:var(--sm-s-2);font-size:13px;color:var(--sm-ink-2)}.sm-suchdemo-url b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--sm-surface-2-deckend);font-size:11px;font-weight:600;color:var(--sm-ink)}.sm-suchdemo-treffer.is-gewonnen .sm-suchdemo-url b{background:var(--sm-accent);color:var(--sm-on-accent)}.sm-suchdemo-titel{font-family:var(--sm-font-display);font-size:17px;font-weight:500;line-height:1.25;color:var(--sm-accent-tief)}.sm-suchdemo-text{font-size:14px;line-height:1.45;color:var(--sm-ink-2)}.sm-suchdemo-abzeichen{position:absolute;top:-12px;right:12px;padding:4px 10px;border-radius:var(--sm-r-sm);font-size:12px;font-weight:600;white-space:nowrap;transition:transform .45s cubic-bezier(.34,1.56,.64,1)}.sm-suchdemo-abzeichen.is-gut{background:var(--sm-ink);color:var(--sm-on-accent)}.sm-suchdemo-abzeichen.is-schlecht{background:var(--sm-surface-2-deckend);color:var(--sm-ink)}.sm-suchdemo-frage{align-self:flex-end;max-width:85%;margin:0;padding:var(--sm-s-3) var(--sm-s-4);border-radius:var(--sm-r-lg);background:var(--sm-bg);font-size:15px;line-height:1.4}.sm-suchdemo-antwort{display:flex;gap:var(--sm-s-3);align-items:flex-start}.sm-suchdemo-antwort p{margin:0;font-size:15px;line-height:1.6;color:var(--sm-ink)}.sm-suchdemo-ki-logo{flex-shrink:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sm-ink);color:var(--sm-on-accent)}.sm-suchdemo-ki-logo svg{width:18px;height:18px}.sm-suchdemo-wort{transition:opacity .12s linear calc(var(--i, 0) * 60ms)}.sm-suchdemo-wort.is-marke{padding:0 6px;border-radius:6px;background:var(--sm-accent-tint-2);color:var(--sm-accent-tief);font-weight:600}.sm-suchdemo-empfohlen{position:static;align-self:flex-start;margin-left:calc(32px + var(--sm-s-3))}.sm-suchdemo-pause{position:absolute;top:6px;right:8px;z-index:1;width:44px;height:44px;padding:0;display:grid;place-items:center;border-radius:var(--sm-r-pill);border:1px solid var(--sm-line-strong);background:var(--sm-surface);color:var(--sm-ink);cursor:pointer}.sm-suchdemo-pause[hidden]{display:none}.sm-suchdemo-pause:hover{border-color:var(--sm-accent);color:var(--sm-accent)}.sm-suchdemo-weiter-zeichen,.sm-suchdemo-pause[aria-pressed=true] .sm-suchdemo-pause-zeichen{display:none}.sm-suchdemo-pause[aria-pressed=true] .sm-suchdemo-weiter-zeichen{display:block}.sm-suchdemo-caption{max-width:60ch}.sm-suchdemo-tab[data-tab=google],.sm-suchdemo[data-schritt^=ki] .sm-suchdemo-tab[data-tab=ki]{background:var(--sm-ink);color:var(--sm-on-accent)}.sm-suchdemo[data-schritt^=ki] .sm-suchdemo-tab[data-tab=google]{background:none;color:var(--sm-ink-2)}.sm-suchdemo-ansicht[data-ansicht=ki],.sm-suchdemo[data-schritt^=ki] .sm-suchdemo-ansicht[data-ansicht=google],.sm-suchdemo-liste[data-liste=vorher],.sm-suchdemo:is([data-schritt=tippen],[data-schritt=vorher],[data-schritt=verloren]) .sm-suchdemo-liste[data-liste=nachher]{opacity:0}.sm-suchdemo[data-schritt^=ki] .sm-suchdemo-ansicht[data-ansicht=ki],.sm-suchdemo:is([data-schritt=tippen],[data-schritt=vorher],[data-schritt=verloren]) .sm-suchdemo-liste[data-liste=vorher]{opacity:1}.sm-suchdemo-cursor{opacity:0}.sm-suchdemo[data-schritt] .sm-suchdemo-cursor{animation:smSuchCursor 1s steps(1) infinite}@keyframes smSuchCursor{0%{opacity:1}50%{opacity:0}}.sm-suchdemo[data-schritt=tippen] .sm-suchdemo-liste[data-liste=vorher] .sm-suchdemo-treffer{opacity:0;transform:translateY(6px)}.sm-suchdemo:is([data-schritt=vorher],[data-schritt=verloren]) .sm-suchdemo-liste[data-liste=vorher] .sm-suchdemo-treffer{transition-delay:calc(var(--i, 0) * .15s)}.sm-suchdemo[data-schritt=verloren] .sm-suchdemo-treffer.is-verloren{opacity:.75;transition-delay:0ms}.sm-suchdemo:is([data-schritt=tippen],[data-schritt=vorher]) .sm-suchdemo-abzeichen.is-schlecht,.sm-suchdemo[data-schritt=nachher] .sm-suchdemo-abzeichen.is-gut,.sm-suchdemo:is([data-schritt=ki],[data-schritt=ki-antwort]) .sm-suchdemo-empfohlen{transform:scale(0)}.sm-suchdemo[data-schritt=ki] .sm-suchdemo-wort{opacity:0;transition:none}.sm-suchdemo:is([data-schritt=tippen],[data-schritt=vorher],[data-schritt=verloren]) .sm-suchdemo-phase{background:var(--sm-surface-2-deckend);color:var(--sm-ink-2)}@media(prefers-reduced-motion:reduce){.sm-suchdemo *,.sm-suchdemo *:before{transition:none!important;animation:none!important}}
