.demo-app{--demo-bar-h:3.5rem}.demo-badge{font-family:var(--font-mono);letter-spacing:.06em;border:1px solid var(--color-border-strong);color:var(--color-muted);white-space:nowrap;background:0 0;border-radius:4px;align-items:center;padding:3px 7px;font-size:11px;line-height:1;display:inline-flex}.demo-badge--angebot{color:var(--color-accent);border-color:color-mix(in oklch, var(--color-accent) 28%, var(--color-border-strong))}.demo-badge--rueckfrage,.demo-badge--service,.demo-badge--bewerbung{color:var(--color-muted);border-color:var(--color-border-strong)}.demo-badge--aussortiert{color:var(--color-dim);border-color:var(--color-border)}.demo-dot{border-radius:50%;flex:none;width:6px;height:6px}.demo-dot--accent{background:var(--color-accent)}.demo-dot--warn{background:var(--color-accent-warn)}.demo-dot--muted{background:#555;background:lab(36.2% 0 .00000596046)}.demo-score{font-variant-numeric:tabular-nums;font-weight:700}.demo-score--high{color:var(--color-accent)}.demo-score--mid{color:var(--color-text)}.demo-score--low{color:var(--color-muted)}.demo-row{transition:background-color .2s;position:relative}.demo-row:before{content:"";background:var(--color-accent);transform-origin:top;width:2px;transition:transform .25s var(--ease-out-expo);position:absolute;top:0;bottom:0;left:0;transform:scaleY(0)}.demo-row:hover,.demo-row[data-selected=true]{background:var(--color-bg2)}.demo-row[data-selected=true]:before{transform:scaleY(1)}.demo-filter{transition:color .2s,background-color .2s,border-color .2s}@keyframes demoSentFlash{0%{background-color:color-mix(in oklch, var(--color-accent) 22%, transparent)}to{background-color:#0000}}.demo-sent-flash{animation:demoSentFlash 1.1s var(--ease-out-expo)}@media (prefers-reduced-motion:reduce){.demo-row:before{transition:none}.demo-sent-flash{animation:none}}.demo-scroll-x{scrollbar-width:thin;scrollbar-color:oklch(30% 0 0) transparent}.demo-scroll-x::-webkit-scrollbar{height:4px}.demo-scroll-x::-webkit-scrollbar-track{background:0 0}.demo-scroll-x::-webkit-scrollbar-thumb{background:#2e2e2e;background:lab(18.8% 0 0);border-radius:2px}.demo-scroll-x::-webkit-scrollbar-thumb:hover{background:#484848;background:lab(30.4% -.0000149012 0)}.demo-app button:focus-visible,.demo-app a:focus-visible,.demo-app input:focus-visible,.demo-app textarea:focus-visible,.demo-app [tabindex]:focus-visible{outline:2px solid var(--color-white);outline-offset:2px;border-radius:4px}.demo-embed .demo-app{--demo-bar-h:0rem}.walkthrough-field{opacity:0;transition:opacity .3s var(--ease-out-expo), transform .3s var(--ease-out-expo);transform:translateY(4px)}.walkthrough-field[data-revealed=true]{opacity:1;transform:translateY(0)}@keyframes walkthroughFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.walkthrough-fade-in{animation:walkthroughFadeIn .35s var(--ease-out-expo) both}.walkthrough-leaving{opacity:0;transition:opacity .25s var(--ease-out-expo), transform .25s var(--ease-out-expo);pointer-events:none;transform:translateY(-6px)}.walkthrough-next-btn:disabled{opacity:.55;cursor:default;pointer-events:none}@keyframes walkthroughCursorBlink{0%,49%{opacity:1}50%,to{opacity:0}}.walkthrough-cursor{color:var(--color-accent);margin-left:1px;animation:1s step-end infinite walkthroughCursorBlink;display:inline-block}@media (prefers-reduced-motion:reduce){.walkthrough-cursor{display:none}}.mail-quelle{background:color-mix(in oklab, var(--color-accent) 12%, transparent);box-shadow:0 1px 0 var(--color-accent-dim);color:var(--color-white);border-radius:2px;transition:background-color .35s,color .35s}.mail-quelle--active{background:color-mix(in oklab, var(--color-accent) 26%, transparent)}.walkthrough-phase-label{font-family:var(--font-sans);letter-spacing:.14em;text-transform:uppercase;transition:color .3s var(--ease-out-expo), opacity .3s var(--ease-out-expo);font-size:11px;font-weight:700}.walkthrough-phase-underline{background:var(--color-accent);transform-origin:0;height:2px;transition:transform .3s var(--ease-out-expo);margin-top:5px;display:block;transform:scaleX(0)}.walkthrough-phase-underline--active{transform:scaleX(1)}