/* Demo-Clip im Fold. Reines CSS, 23 Sekunden, läuft in Schleife. Innen ist alles in em
   gesetzt, der Clip skaliert also wie ein Video. Auf dem Handy stehen Claude und Browser übereinander.
   Bei reduzierter Bewegung zeigt der Clip nur das Schlussbild: Kartenstapel mit Systemen.
   Orange gehört zu Claude, Grün und Bernstein zum Status in der App. */
.fc { --dur: 23s; }
.fc { --or: #d97757; --or-ink: #c15f3c; --c-bg: #faf9f5; --c-fg: #1f1e1d; --c-mut: #73726c; --c-line: #e6e2d8; --c-bub: #efece3; --c-bar: #f2efe7; --b-strip: #d9dfee; --b-nav: #ffffff; --b-bg: #ffffff; --b-fg: #0b1640; --b-mut: #56608a; --b-line: #e1e4ee; --b-panel: #f4f6fb; --b-url: #edf0f7; --ok: #0f6a47; --ok-soft: #dcf2e8; --wait: #9a6a10; --wait-soft: #fbefd6; --blue: #2747a8; --blue-2: #5b7be0; --blue-soft: #dfe6fa; --scrim: rgba(11, 22, 64, .34); --late: #c0392b; --win-shadow: 0 .06em .1em rgba(6, 12, 40, .18), 0 .7em 1.5em rgba(6, 12, 40, .24), 0 2em 4em rgba(6, 12, 40, .3); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .fc { --c-bg: #262624; --c-fg: #faf9f5; --c-mut: #a8a69e; --c-line: #3e3d39; --c-bub: #3a3935; --c-bar: #1e1d1b; --b-strip: #070e2c; --b-nav: #15245f; --b-bg: #0f1b4d; --b-fg: #f6f4ee; --b-mut: #a9b6e0; --b-line: #26357a; --b-panel: #15245f; --b-url: #0b1640; --ok: #6fd3a8; --ok-soft: rgba(111, 211, 168, .16); --wait: #f0c674; --wait-soft: rgba(240, 198, 116, .16); --blue: #7f9bf0; --blue-2: #a9b6e0; --blue-soft: rgba(127, 155, 240, .18); --scrim: rgba(3, 7, 24, .6); --late: #ff9d8f; }
}
:root[data-theme="dark"] .fc { --c-bg: #262624; --c-fg: #faf9f5; --c-mut: #a8a69e; --c-line: #3e3d39; --c-bub: #3a3935; --c-bar: #1e1d1b; --b-strip: #070e2c; --b-nav: #15245f; --b-bg: #0f1b4d; --b-fg: #f6f4ee; --b-mut: #a9b6e0; --b-line: #26357a; --b-panel: #15245f; --b-url: #0b1640; --ok: #6fd3a8; --ok-soft: rgba(111, 211, 168, .16); --wait: #f0c674; --wait-soft: rgba(240, 198, 116, .16); --blue: #7f9bf0; --blue-2: #a9b6e0; --blue-soft: rgba(127, 155, 240, .18); --scrim: rgba(3, 7, 24, .6); --late: #ff9d8f; }
.fold-clip { --after: clamp(3.5rem, 8vw, 6rem); margin-top: -1px; padding: 1px 16px var(--after); overflow-x: clip; background: linear-gradient(var(--flaeche) calc((100% - var(--after)) * .5), var(--bg) 0); }
@media (min-width: 40rem) {
  .fold-clip { padding-inline: 2.5rem; }
}
.fold-clip__frame { max-width: 60rem; margin-inline: auto; }
.fc { container-type: inline-size; width: 100%; margin: 0; aspect-ratio: 16 / 9; }
.fc-stage { position: relative; height: 100%; font-size: 2cqw; font-family: var(--text); line-height: 1.3; color: var(--b-fg); }
.fc-body { position: absolute; inset: 0; }
.fc-stack { display: grid; min-width: 0; }
.fc-stack > * { grid-area: 1 / 1; }
.fc-win { position: absolute; display: grid; min-width: 0; min-height: 0; overflow: hidden; border-radius: .7em; box-shadow: var(--win-shadow); }
.fc .d { width: .5em; height: .5em; flex: none; border-radius: 50%; }
.fc .d1 { background: #ff5f57; }
.fc .d2 { background: #febc2e; }
.fc .d3 { background: #28c840; }
.fc .spark { display: block; width: 1em; height: 1em; color: var(--or); }
.fc .w-claude { grid-template-rows: 1.9em minmax(0, 1fr); background: var(--c-bg); color: var(--c-fg); outline: .05em solid rgba(255, 255, 255, .14); outline-offset: -.05em; }
.fc .c-bar { display: flex; align-items: center; gap: .26em; padding-inline: .7em; background: var(--c-bar); border-bottom: .05em solid var(--c-line); }
.fc .c-brand { display: flex; align-items: center; gap: .32em; margin-left: .55em; font-size: .78em; font-weight: 600; }
.fc .c-brand .spark { width: 1.15em; height: 1.15em; }
.fc .c-view { position: relative; min-height: 0; }
.fc .c-scene { position: absolute; inset: 0; padding: .85em 1em; display: flex; flex-direction: column; min-width: 0; background: var(--c-bg); }
.fc .serif { font-family: Georgia, "Times New Roman", serif; }
.fc-you { align-self: flex-end; max-width: 92%; padding: .38em .7em; border-radius: .75em; background: var(--c-bub); }
.fc-composer { flex: none; display: flex; flex-direction: column; gap: .3em; padding: .55em .55em .45em .75em; border: .06em solid var(--c-line); border-radius: .9em; background: var(--c-bg); box-shadow: 0 .15em .5em rgba(60, 40, 20, .08); }
.fc .c-text { min-height: 2.5em; font-size: .74em; line-height: 1.32; }
.fc .c-ph { color: var(--c-mut); }
.fc .c-line { display: block; white-space: nowrap; }
.fc .c-tools { display: flex; align-items: center; gap: .4em; }
.fc .c-chip { display: inline-flex; align-items: center; gap: .3em; padding: .12em .55em .12em .3em; border-radius: 1em; background: var(--c-bub); font-size: .66em; font-weight: 500; }
.fc .c-chip i { display: grid; place-items: center; width: 1.25em; height: 1.25em; border-radius: .3em; background: #2747a8; color: #fff; font-style: normal; font-size: .8em; font-weight: 700; }
.fc-send { display: grid; place-items: center; width: 1.45em; height: 1.45em; margin-left: auto; flex: none; border-radius: .45em; background: var(--or); color: #fff; }
.fc-send svg { width: .85em; height: .85em; }
.fc .ticks { display: flex; flex-wrap: wrap; gap: .1em .8em; font-size: .94em; color: var(--c-mut); }
.fc .ticks b { font-weight: 600; color: var(--or-ink); }
.fc .work { display: flex; align-items: center; gap: .4em; color: var(--or-ink); font-weight: 500; }
.fc .work .spark { width: 1.05em; height: 1.05em; }
.fc .w-br { grid-template-rows: 1.75em 1.7em minmax(0, 1fr); background: var(--b-bg); color: var(--b-fg); outline: .05em solid rgba(255, 255, 255, .22); outline-offset: -.05em; }
.fc .b-tabs { display: flex; align-items: flex-end; gap: .26em; padding: 0 .7em; background: var(--b-strip); }
.fc .b-tabs .d { align-self: center; }
.fc .b-tab { display: flex; align-items: center; gap: .35em; width: 11.5em; height: 1.45em; margin-left: .7em; padding-inline: .55em; border-radius: .45em .45em 0 0; background: var(--b-nav); font-size: 1em; }
.fc .b-tab > .fc-stack { font-size: .66em; font-weight: 500; white-space: nowrap; overflow: hidden; }
.fc .b-fav { width: .75em; height: .75em; flex: none; border-radius: .18em; background: #2747a8; }
.fc .b-nav { display: flex; align-items: center; gap: .3em; padding-inline: .6em; background: var(--b-nav); border-bottom: .05em solid var(--b-line); color: var(--b-mut); }
.fc .nav { width: .85em; height: .85em; flex: none; }
.fc .nav--off { opacity: .4; }
.fc-url { flex: 1; display: flex; align-items: center; gap: .4em; min-width: 0; height: 1.26em; margin-left: .3em; padding-inline: .6em; border-radius: 1em; background: var(--b-url); font-size: 1em; }
.fc-url > .fc-stack:not(.u-envs) { flex: 0 1 auto; font-size: .68em; white-space: nowrap; color: var(--b-fg); overflow: hidden; }
.fc .lock { width: .72em; height: .72em; flex: none; color: var(--b-mut); }
.fc .u-env { flex: none; padding: .05em .6em; border-radius: 1em; font-size: .62em; font-weight: 600; justify-self: end; }
.fc .u-env--test { background: var(--wait-soft); color: var(--wait); }
.fc .u-env--live { background: var(--ok-soft); color: var(--ok); }
.fc .b-view { position: relative; min-height: 0; background: var(--b-bg); }
.fc .b-scene { position: absolute; inset: 0; padding: .9em 1.1em; display: flex; flex-direction: column; min-width: 0; background: var(--b-bg); }
.fc .app { isolation: isolate; }
.fc .app-top { display: flex; align-items: center; justify-content: space-between; gap: .6em; }
.fc .app-title { font-size: 1.12em; font-weight: 600; letter-spacing: -.01em; color: var(--b-fg); }
.fc .avs { display: flex; flex: none; }
.fc .av { display: grid; place-items: center; width: 2.1em; height: 2.1em; margin-left: -.35em; border-radius: 50%; color: #fff; font-style: normal; font-size: .6em; font-weight: 600; box-shadow: 0 0 0 .14em var(--b-bg); }
.fc .av1 { background: #2747a8; }
.fc .av2 { background: #17835a; }
.fc .av3 { background: #8b5cf6; }
.fc-body, .fc-body *, .fc-body *::after { animation-duration: var(--dur); animation-iteration-count: infinite; animation-timing-function: linear; }
.fc-body { animation-name: fc-loop; }
.fc { --win-shadow: 0 .05em .1em rgba(15, 27, 77, .08), 0 .5em 1.3em rgba(15, 27, 77, .12), 0 1.2em 2.6em rgba(15, 27, 77, .1); --au: #1b2858; }
.fc-stage { overflow: hidden; background: var(--panel); border: .06em solid var(--line); border-radius: .8em; box-shadow: 0 1px 2px rgba(15, 27, 77, .06), 0 10px 28px rgba(15, 27, 77, .08); }
.fc .w-claude { top: 1.2em; height: 25.6em; left: 1.2em; width: 20.4em; z-index: 1; outline: .05em solid var(--c-line); }
.fc .w-br { outline: .05em solid var(--b-line); z-index: 2; }
.fc .c-home { align-items: center; justify-content: center; gap: 1.2em; padding: 1em 2.4em; }
.fc .c-greet { display: flex; align-items: center; gap: .45em; font-size: 1.75em; color: var(--c-fg); }
.fc .c-greet .spark { width: 1.05em; height: 1.05em; }
.fc .c-home .fc-composer { width: 100%; max-width: 26em; padding: .75em .7em .6em .95em; }
.fc .c-home .c-text { font-size: .86em; }
.fc .c-chat { padding: .8em .9em; align-items: center; }
.fc .c-col { width: 18.6em; max-width: 100%; flex: 1; min-height: 0; display: flex; flex-direction: column; gap: .5em; }
.fc .c-msgs { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: .5em; font-size: .76em; line-height: 1.34; }
.fc .c-text--one { min-height: 1.4em; }
.fc-ai { margin: 0; }
.fc-ai b { font-family: var(--text); font-weight: 600; overflow-wrap: anywhere; }
.fc .c-ask { padding: .55em .7em; border-radius: .7em; border: .07em solid var(--c-line); background: var(--c-bar); }
.fc .c-ask-h { display: flex; align-items: center; gap: .35em; font-size: .86em; color: var(--c-mut); }
.fc .c-ask-h i { display: grid; place-items: center; width: 1.25em; height: 1.25em; border-radius: .3em; background: #2747a8; color: #fff; font-style: normal; font-size: .8em; font-weight: 700; }
.fc .c-ask p { margin: .15em 0 .4em; font-weight: 500; }
.fc .c-ask-b { display: flex; gap: .35em; }
.fc .c-yes, .fc .c-no { padding: .12em .9em; border-radius: .4em; font-weight: 600; font-size: .92em; border: .07em solid var(--c-line); background: var(--c-bg); }
.fc .c-yes { background: var(--or); border-color: var(--or); color: #fff; }
.fc .b-nav { position: relative; }
.fc .b-load { position: absolute; left: 0; right: 0; bottom: -.05em; height: .13em; background: #2747a8; transform-origin: 0 50%; opacity: 0; }
.fc .kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45em; margin-top: .5em; }
.fc .kpis > div { padding: .35em .6em; border-radius: .5em; background: var(--b-panel); border: .05em solid var(--b-line); }
.fc .kpis small { display: block; font-size: .62em; color: var(--b-mut); }
.fc .kpis b { font-size: 1.05em; font-weight: 600; letter-spacing: -.01em; }
.fc .chart { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: .55em; margin-top: .6em; }
.fc .col { display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; align-items: end; min-height: 0; height: 100%; }
.fc .col i { width: 100%; border-radius: .25em .25em 0 0; background: linear-gradient(#5b7be0, #2747a8); transform-origin: 50% 100%; }
.fc .col:last-child i { background: linear-gradient(#17a673, #17835a); }
.fc .col span { margin-top: .2em; font-size: .6em; color: var(--b-mut); }
.fc .chart { grid-template-columns: repeat(9, minmax(0, 1fr)); gap: .45em; }
.fc .col:last-child i { background: none; }
.fc .col.fcst i, .fc .col.fcst:last-child i { background: repeating-linear-gradient(135deg, rgba(91, 123, 224, .34) 0 .22em, rgba(91, 123, 224, .14) .22em .44em); box-shadow: inset 0 0 0 .07em rgba(39, 71, 168, .55); }
.fc .app-top { justify-content: flex-start; }
.fc .app-top .avs { margin-left: auto; }
.fc .src { display: inline-flex; align-items: center; gap: .35em; padding: .08em .55em; border-radius: 1em; background: var(--blue-soft); color: var(--blue); font-size: .62em; font-weight: 600; white-space: nowrap; }
.fc .src-dot { width: .55em; height: .55em; border-radius: 50%; background: var(--blue); }
.fc .k-cl { position: absolute; inset: 0; }
.fc { --step: 2.25em; --sc: .035; --dl: 6em; --dw: 38em; --dt: 13.7em; --dh: 13.5em; }
.fc .app-top .avs { margin-left: auto; }
.fc .src { order: 3; margin-left: .55em; }
.fc .w-br { left: var(--dl); top: var(--dt); width: var(--dw); height: var(--dh); z-index: 7; }
.fc .cd { position: absolute; left: var(--dl); top: var(--dt); width: var(--dw); height: var(--dh); display: flex; align-items: flex-start; gap: .7em; padding: .44em 1em; border-radius: .7em; transform-origin: 50% 0; box-shadow: 0 -.1em .5em rgba(15, 27, 77, .14); overflow: hidden; }
.fc .cd b { position: relative; flex: none; width: 6.9em; font-size: .88em; font-weight: 600; white-space: nowrap; }
.fc .cd small { position: relative; font-size: .76em; line-height: 1.55; opacity: .86; white-space: nowrap; }
.fc { --navy: #1b2858; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .fc { --navy: #2f4296; }
}
:root[data-theme="dark"] .fc { --navy: #2f4296; }
.fc .sr { display: flex; align-items: center; gap: .5em; min-width: 0; }
.fc .sri { display: grid; place-items: center; flex: none; width: 1.7em; height: 1.7em; border-radius: .42em; background: var(--blue-soft); color: var(--blue); }
.fc .sri svg { width: 1.05em; height: 1.05em; }
.fc .srt { min-width: 0; display: grid; }
.fc .srt b { font-size: .8em; font-weight: 600; line-height: 1.15; color: var(--fg); }
.fc .srt small { font-size: .6em; line-height: 1.2; color: var(--muted); white-space: nowrap; }
.fc .srd { flex: none; width: .5em; height: .5em; margin-left: auto; border-radius: 50%; background: var(--ok); }
.fc { --dl: 6em; --dw: 38em; --dt: 14.9em; --dh: 12.3em; --step: 2.12em; --sc: 0.03; }
.fc { --open: 3.05em; }
.fc .k-cd4 { display: block; }
.fc .k-cd4 b { display: inline-block; }
.fc .sys-tiles { position: absolute; left: .8em; right: .8em; top: 2.1em; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5em; }
.fc .sys-tile { padding: .4em .55em; border-radius: .5em; background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 .05em rgba(255, 255, 255, .16); }
.fc .sys-tile .sri { background: rgba(255, 255, 255, .14); color: #fff; }
.fc .sys-tile .srt b { color: #fff; }
.fc .sys-tile .srt small { color: #c3cdf0; }
.fc .sys-tile .srd { background: #7fe0b5; }
.fc .mb { display: none; }
.fc .k-home { opacity: 0; animation-name: fc-k-home; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-ph { opacity: 0; animation-name: fc-k-ph; animation-timing-function: step-end; }
.fc .k-c1 { opacity: 0; animation-name: fc-k-c1; animation-timing-function: step-end; }
.fc .k-ty1 { animation-name: fc-k-ty1; animation-timing-function: steps(var(--c), end); }
.fc .k-ty2 { animation-name: fc-k-ty2; animation-timing-function: steps(var(--c), end); }
.fc .k-b1 { animation-name: fc-k-b1; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-tk1 { animation-name: fc-k-tk1; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-tk2 { animation-name: fc-k-tk2; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-tk3 { animation-name: fc-k-tk3; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-work { opacity: 0; animation-name: fc-k-work; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-spin { animation-name: fc-k-spin; animation-timing-function: linear; }
.fc .k-a1 { animation-name: fc-k-a1; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-ph2 { animation-name: fc-k-ph2; animation-timing-function: step-end; }
.fc .k-c2 { opacity: 0; animation-name: fc-k-c2; animation-timing-function: step-end; }
.fc .k-ty3 { animation-name: fc-k-ty3; animation-timing-function: steps(var(--c), end); }
.fc .k-b2 { animation-name: fc-k-b2; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-ask { animation-name: fc-k-ask; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-yes { animation-name: fc-k-yes; animation-timing-function: ease-out; }
.fc .k-work2 { opacity: 0; animation-name: fc-k-work2; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-spin2 { animation-name: fc-k-spin2; animation-timing-function: linear; }
.fc .k-a2 { animation-name: fc-k-a2; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
.fc .k-us { opacity: 0; animation-name: fc-k-us; animation-timing-function: step-end; }
.fc .k-ul { animation-name: fc-k-ul; animation-timing-function: step-end; }
.fc .k-et { opacity: 0; animation-name: fc-k-et; animation-timing-function: step-end; }
.fc .k-el { animation-name: fc-k-el; animation-timing-function: step-end; }
.fc .k-load { opacity: 0; animation-name: fc-k-load; animation-timing-function: ease-out; }
.fc .k-n1 { opacity: 0; animation-name: fc-k-n1; animation-timing-function: step-end; }
.fc .k-n2 { animation-name: fc-k-n2; animation-timing-function: step-end; }
.fc .k-mon0 { animation-name: fc-k-mon0; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon1 { animation-name: fc-k-mon1; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon2 { animation-name: fc-k-mon2; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon3 { animation-name: fc-k-mon3; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon4 { animation-name: fc-k-mon4; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon5 { animation-name: fc-k-mon5; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon6 { animation-name: fc-k-mon6; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-mon7 { animation-name: fc-k-mon7; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-av2 { animation-name: fc-k-av2; animation-timing-function: cubic-bezier(.3,1.5,.5,1); }
.fc .k-av3 { animation-name: fc-k-av3; animation-timing-function: cubic-bezier(.3,1.5,.5,1); }
.fc .k-mon8 { animation-name: fc-k-mon8; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
.fc .k-cl { opacity: 0; animation-name: fc-k-cl; animation-timing-function: linear; }
.fc .k-kp { height: 0; opacity: 0; margin-top: 0; overflow: hidden; animation-name: fc-k-kp; animation-timing-function: ease-out; }
.fc .w-claude { animation-name: fc-w-claude; animation-timing-function: linear; }
.fc .k-br { animation-name: fc-k-br; animation-timing-function: cubic-bezier(.22,.9,.3,1.02); }
.fc .k-cd0 { transform: translateY(calc(var(--step) * -1)) scale(calc(1 - var(--sc) * 1)); animation-name: fc-k-cd0; animation-timing-function: cubic-bezier(.2,.9,.25,1); }
.fc .k-cd1 { transform: translateY(calc(var(--step) * -2)) scale(calc(1 - var(--sc) * 2)); animation-name: fc-k-cd1; animation-timing-function: cubic-bezier(.2,.9,.25,1); }
.fc .k-cd2 { transform: translateY(calc(var(--step) * -3)) scale(calc(1 - var(--sc) * 3)); animation-name: fc-k-cd2; animation-timing-function: cubic-bezier(.2,.9,.25,1); }
.fc .k-cd3 { transform: translateY(calc(var(--step) * -4)) scale(calc(1 - var(--sc) * 4)); animation-name: fc-k-cd3; animation-timing-function: cubic-bezier(.2,.9,.25,1); }
.fc .k-cd4 { transform: translateY(calc(var(--step) * -5 - var(--open))) scale(calc(1 - var(--sc) * 5)); animation-name: fc-k-cd4; animation-timing-function: cubic-bezier(.2,.9,.25,1); }
.fc .k-srcdot { animation-name: fc-k-srcdot; animation-timing-function: ease-out; }
.fc .k-x0 { animation-name: fc-k-x0; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
@media (prefers-reduced-motion: reduce) {
  .fc-body, .fc-body *, .fc-body *::after { animation: none !important; }
}
@media (max-width: 39.99rem) {
  .fold-clip { background: linear-gradient(var(--flaeche) 42%, var(--bg) 0); }
  .fc { aspect-ratio: auto; }
  .fc-stage { font-size: min(4cqw, 17px); }
  .fc .c-home { padding: 1em; }
  .fc .c-home .c-text { font-size: .72em; }
  .fc .c-greet { font-size: 1.45em; }
  .fc .c-col { width: 100%; }
  .fc { --step: 2.55em; --sc: .03; --dl: .7em; --dw: 23.6em; --dt: 16.6em; --dh: 14.7em; }
  .fc-stage { height: 32em; }
  .fc .w-claude { left: .7em; width: 23.6em; top: .7em; height: 30.6em; }
  .fc .cd { display: block; padding: .3em .8em; }
  .fc .cd b, .fc .cd small { display: block; width: auto; }
  .fc .cd b { font-size: .78em; line-height: 1.2; }
  .fc .cd small { font-size: .64em; line-height: 1.25; white-space: normal; }
  .fc .k-cd4 small { padding-right: 0; }
  .fc { --dl: .7em; --dw: 23.6em; --dt: 18em; --dh: 14.3em; --step: 2.75em; --sc: .016; --open: 3.4em; }
  .fc-stage { height: 33em; }
  .fc-body { left: 50%; right: auto; width: 25em; margin-left: -12.5em; }
  .fc .w-claude { left: .7em; width: 23.6em; top: .7em; height: 16.6em; }
  .fc .c-home .c-text { font-size: .78em; }
  .fc .c-msgs { font-size: .8em; overflow: hidden; }
  .fc .c-msgs > * { flex-shrink: 0; }
  .fc .c-chat { padding: .6em .8em; }
  .fc .c-chat .fc-composer { flex-direction: row; align-items: center; padding: .35em .4em .35em .75em; }
  .fc .c-chat .c-text { flex: 1; min-width: 0; min-height: 0; font-size: .8em; }
  .fc .c-chat .c-tools { flex: none; }
  .fc-you, .fc .k-tkrow, .fc .k-s1 { overflow: hidden; }
  .fc .src { font-size: .68em; }
  .fc .dk { display: none; }
  .fc .mb { display: inline; }
  .fc .cd { padding: .34em .8em; }
  .fc .cd b { font-size: .9em; line-height: 1.2; }
  .fc .cd small { font-size: .82em; line-height: 1.25; opacity: .92; }
  .fc .k-cd4 { display: block; }
  .fc .k-cd4 b, .fc .k-cd4 small { display: block; }
  .fc .sys-tiles { left: .6em; right: .6em; top: 2.8em; gap: .3em; }
  .fc .sys-tile { padding: .32em .4em; }
  .fc .sys-tile .sri { width: 1.5em; height: 1.5em; }
  .fc .sys-tile .srt small { display: none; }
  .fc .sys-tile .srt b { font-size: .84em; }
  .fc .sys-tile .sr { gap: .3em; }
  .fc .k-br { animation-name: fc-k-br-ph; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
  .fc .w-claude { animation-name: fc-w-claude-ph; animation-timing-function: linear; }
  .fc .w-claude { animation-name: fc-w-claude-ph; animation-timing-function: linear; }
  .fc .k-br { animation-name: fc-k-br-ph; animation-timing-function: cubic-bezier(.22,.9,.3,1.02); }
  .fc .k-cl { opacity: 0; animation-name: fc-k-cl-ph; animation-timing-function: linear; }
  .fc .k-b1 { animation-name: fc-k-b1-ph; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
  .fc .k-tkrow { animation-name: fc-k-tkrow-ph; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
  .fc .k-s1 { animation-name: fc-k-s1-ph; animation-timing-function: cubic-bezier(.2,.7,.2,1); }
}
@keyframes fc-loop { 0% { opacity: 0; } 2.174%, 97.391% { opacity: 1; } 100% { opacity: 0; } }
@keyframes fc-k-home { 0% { opacity: 0; } 0.043% { opacity: 1; transform: none; } 16.522% { opacity: 1; transform: none; } 17.391% { opacity: 0; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes fc-k-ph { 0% { opacity: 0; } 0% { opacity: 1; } 4.348% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-c1 { 0% { opacity: 0; } 4.348% { opacity: 1; } 17.391% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-ty1 { 0% { clip-path: inset(0 100% 0 0); } 4.565% { clip-path: inset(0 100% 0 0); } 11.957% { clip-path: inset(0); } 100% { clip-path: inset(0); } }
@keyframes fc-k-ty2 { 0% { clip-path: inset(0 100% 0 0); } 12.391% { clip-path: inset(0 100% 0 0); } 16.304% { clip-path: inset(0); } 100% { clip-path: inset(0); } }
@keyframes fc-k-b1 { 0% { opacity: 0; transform: translateY(0.3em); } 17.609% { opacity: 0; transform: translateY(0.3em); } 18.913% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-tk1 { 0% { opacity: 0; transform: translateY(0.15em); } 21.304% { opacity: 0; transform: translateY(0.15em); } 22.609% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-tk2 { 0% { opacity: 0; transform: translateY(0.15em); } 24.783% { opacity: 0; transform: translateY(0.15em); } 26.087% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-tk3 { 0% { opacity: 0; transform: translateY(0.15em); } 29.13% { opacity: 0; transform: translateY(0.15em); } 30.435% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-work { 0% { opacity: 0; transform: translateY(0.15em); } 18.696% { opacity: 0; transform: translateY(0.15em); } 20% { opacity: 1; transform: none; } 30.435% { opacity: 1; transform: none; } 31.304% { opacity: 0; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes fc-k-spin { 0% { transform: rotate(0deg); } 18.696% { transform: rotate(0deg); } 31.304% { transform: rotate(435deg); } 100% { transform: rotate(435deg); } }
@keyframes fc-k-a1 { 0% { opacity: 0; transform: translateY(0.3em); } 31.304% { opacity: 0; transform: translateY(0.3em); } 32.609% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-ph2 { 0% { opacity: 0; } 0% { opacity: 1; } 41.739% { opacity: 0; } 46.522% { opacity: 1; } 100% { opacity: 1; } }
@keyframes fc-k-c2 { 0% { opacity: 0; } 41.739% { opacity: 1; } 46.522% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-ty3 { 0% { clip-path: inset(0 100% 0 0); } 41.957% { clip-path: inset(0 100% 0 0); } 45.652% { clip-path: inset(0); } 100% { clip-path: inset(0); } }
@keyframes fc-k-b2 { 0% { opacity: 0; transform: translateY(0.3em); } 46.522% { opacity: 0; transform: translateY(0.3em); } 47.826% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-ask { 0% { opacity: 0; transform: translateY(0.3em); } 47.826% { opacity: 0; transform: translateY(0.3em); } 49.13% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-yes { 0% { transform: none; box-shadow: 0 0 0 0 rgba(217,119,87,.5); } 51.304% { transform: none; box-shadow: 0 0 0 0 rgba(217,119,87,.5); } 51.826% { transform: scale(.92); box-shadow: 0 0 0 0 rgba(217,119,87,.5); } 52.391% { transform: none; box-shadow: 0 0 0 .22em rgba(217,119,87,.35); } 53.913% { transform: none; box-shadow: 0 0 0 .5em rgba(217,119,87,0); } 100% { transform: none; box-shadow: 0 0 0 .5em rgba(217,119,87,0); } }
@keyframes fc-k-work2 { 0% { opacity: 0; transform: translateY(0.15em); } 52.826% { opacity: 0; transform: translateY(0.15em); } 54.13% { opacity: 1; transform: none; } 55.652% { opacity: 1; transform: none; } 56.522% { opacity: 0; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes fc-k-spin2 { 0% { transform: rotate(0deg); } 52.826% { transform: rotate(0deg); } 56.522% { transform: rotate(127deg); } 100% { transform: rotate(127deg); } }
@keyframes fc-k-a2 { 0% { opacity: 0; transform: translateY(0.3em); } 56.522% { opacity: 0; transform: translateY(0.3em); } 57.826% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-us { 0% { opacity: 0; } 0% { opacity: 1; } 56.522% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-ul { 0% { opacity: 0; } 56.522% { opacity: 1; } 100% { opacity: 1; } }
@keyframes fc-k-et { 0% { opacity: 0; } 0% { opacity: 1; } 56.522% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-el { 0% { opacity: 0; } 56.522% { opacity: 1; } 100% { opacity: 1; } }
@keyframes fc-k-load { 0% { opacity: 0; transform: scaleX(0); } 53.913% { opacity: 0; transform: scaleX(0); } 54.13% { opacity: 1; transform: scaleX(.05); } 56.522% { opacity: 1; transform: scaleX(1); } 57.391% { opacity: 0; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1); } }
@keyframes fc-k-n1 { 0% { opacity: 0; } 0% { opacity: 1; } 65.217% { opacity: 0; } 100% { opacity: 0; } }
@keyframes fc-k-n2 { 0% { opacity: 0; } 65.217% { opacity: 1; } 100% { opacity: 1; } }
@keyframes fc-k-mon0 { 0% { transform: scaleY(0); } 35.435% { transform: scaleY(0); } 38.043% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon1 { 0% { transform: scaleY(0); } 35.826% { transform: scaleY(0); } 38.435% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon2 { 0% { transform: scaleY(0); } 36.217% { transform: scaleY(0); } 38.826% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon3 { 0% { transform: scaleY(0); } 36.609% { transform: scaleY(0); } 39.217% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon4 { 0% { transform: scaleY(0); } 37% { transform: scaleY(0); } 39.609% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon5 { 0% { transform: scaleY(0); } 37.391% { transform: scaleY(0); } 40% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon6 { 0% { transform: scaleY(0); } 37.783% { transform: scaleY(0); } 40.391% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-mon7 { 0% { transform: scaleY(0); } 38.174% { transform: scaleY(0); } 40.783% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-av2 { 0% { opacity: 0; transform: scale(.4); } 60% { opacity: 0; transform: scale(.4); } 61.304% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-av3 { 0% { opacity: 0; transform: scale(.4); } 61.304% { opacity: 0; transform: scale(.4); } 62.609% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-mon8 { 0% { transform: scaleY(0); } 38.565% { transform: scaleY(0); } 41.174% { transform: scaleY(1); } 100% { transform: scaleY(1); } }
@keyframes fc-k-cl { 0% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,0,.15,1); } 60.87% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,0,.15,1); } 63.913% { opacity: 0; transform: translateX(-5em) scale(.96); } 100% { opacity: 0; transform: translateX(-5em) scale(.96); } }
@keyframes fc-k-kp { 0% { height: 3em; opacity: 1; margin-top: .5em; overflow: hidden; } 61.304% { height: 3em; opacity: 1; margin-top: .5em; overflow: hidden; } 63.478% { height: 0; opacity: 0; margin-top: 0; overflow: hidden; } 100% { height: 0; opacity: 0; margin-top: 0; overflow: hidden; } }
@keyframes fc-w-claude { 0% { left: 9em; width: 32em; } 31.304% { left: 9em; width: 32em; animation-timing-function: cubic-bezier(.55,0,.15,1); } 34.783% { left: 1.2em; width: 20.4em; } 100% { left: 1.2em; width: 20.4em; } }
@keyframes fc-k-br { 0% { opacity: 0; transform: translateX(3em) scale(.95); left: 22.4em; top: 1.2em; width: 26.4em; height: 25.6em; } 31.739% { opacity: 0; transform: translateX(3em) scale(.95); left: 22.4em; top: 1.2em; width: 26.4em; height: 25.6em; } 35% { opacity: 1; transform: none; left: 22.4em; top: 1.2em; width: 26.4em; height: 25.6em; } 61.304% { opacity: 1; transform: none; left: 22.4em; top: 1.2em; width: 26.4em; height: 25.6em; animation-timing-function: cubic-bezier(.55,0,.15,1); } 65.217% { opacity: 1; transform: none; left: 6em; top: 14.9em; width: 38em; height: 12.3em; } 100% { opacity: 1; transform: none; left: 6em; top: 14.9em; width: 38em; height: 12.3em; } }
@keyframes fc-k-cd0 { 0% { opacity: 0; transform: translateY(.4em) scale(.97); } 64.783% { opacity: 0; transform: translateY(.4em) scale(.97); } 65.435% { opacity: 1; transform: translateY(.2em) scale(.97); } 67.826% { opacity: 1; transform: translateY(calc(var(--step) * -1)) scale(calc(1 - var(--sc) * 1)); } 100% { opacity: 1; transform: translateY(calc(var(--step) * -1)) scale(calc(1 - var(--sc) * 1)); } }
@keyframes fc-k-cd1 { 0% { opacity: 0; transform: translateY(.4em) scale(.97); } 66.087% { opacity: 0; transform: translateY(.4em) scale(.97); } 66.739% { opacity: 1; transform: translateY(.2em) scale(.97); } 69.13% { opacity: 1; transform: translateY(calc(var(--step) * -2)) scale(calc(1 - var(--sc) * 2)); } 100% { opacity: 1; transform: translateY(calc(var(--step) * -2)) scale(calc(1 - var(--sc) * 2)); } }
@keyframes fc-k-cd2 { 0% { opacity: 0; transform: translateY(.4em) scale(.97); } 67.391% { opacity: 0; transform: translateY(.4em) scale(.97); } 68.043% { opacity: 1; transform: translateY(.2em) scale(.97); } 70.435% { opacity: 1; transform: translateY(calc(var(--step) * -3)) scale(calc(1 - var(--sc) * 3)); } 100% { opacity: 1; transform: translateY(calc(var(--step) * -3)) scale(calc(1 - var(--sc) * 3)); } }
@keyframes fc-k-cd3 { 0% { opacity: 0; transform: translateY(.4em) scale(.97); } 68.696% { opacity: 0; transform: translateY(.4em) scale(.97); } 69.348% { opacity: 1; transform: translateY(.2em) scale(.97); } 71.739% { opacity: 1; transform: translateY(calc(var(--step) * -4)) scale(calc(1 - var(--sc) * 4)); } 100% { opacity: 1; transform: translateY(calc(var(--step) * -4)) scale(calc(1 - var(--sc) * 4)); } }
@keyframes fc-k-cd4 { 0% { opacity: 0; transform: translateY(.4em) scale(.97); } 70% { opacity: 0; transform: translateY(.4em) scale(.97); } 70.652% { opacity: 1; transform: translateY(.2em) scale(.97); } 73.043% { opacity: 1; transform: translateY(calc(var(--step) * -5 - var(--open))) scale(calc(1 - var(--sc) * 5)); } 100% { opacity: 1; transform: translateY(calc(var(--step) * -5 - var(--open))) scale(calc(1 - var(--sc) * 5)); } }
@keyframes fc-k-srcdot { 0% { transform: none; box-shadow: 0 0 0 0 rgba(39,71,168,.5); } 78.261% { transform: none; box-shadow: 0 0 0 0 rgba(39,71,168,.5); } 78.913% { transform: scale(1.5); box-shadow: 0 0 0 .1em rgba(39,71,168,.4); } 80.435% { transform: none; box-shadow: 0 0 0 .5em rgba(39,71,168,0); } 84.783% { transform: none; box-shadow: 0 0 0 0 rgba(39,71,168,.5); } 85.435% { transform: scale(1.5); box-shadow: 0 0 0 .1em rgba(39,71,168,.4); } 86.957% { transform: none; box-shadow: 0 0 0 .5em rgba(39,71,168,0); } 91.304% { transform: none; box-shadow: 0 0 0 0 rgba(39,71,168,.5); } 91.957% { transform: scale(1.5); box-shadow: 0 0 0 .1em rgba(39,71,168,.4); } 93.478% { transform: none; box-shadow: 0 0 0 .5em rgba(39,71,168,0); } 97.826% { transform: none; box-shadow: 0 0 0 0 rgba(39,71,168,.5); } 98.478% { transform: scale(1.5); box-shadow: 0 0 0 .1em rgba(39,71,168,.4); } 100% { transform: none; box-shadow: 0 0 0 .5em rgba(39,71,168,0); } }
@keyframes fc-k-x0 { 0% { opacity: 0; transform: translateY(0.3em); } 73.043% { opacity: 0; transform: translateY(0.3em); } 74.783% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-k-br-ph { 0% { opacity: 0; transform: translateY(5em); } 32.609% { opacity: 0; transform: translateY(5em); } 35.652% { opacity: 1; transform: none; } 100% { opacity: 1; transform: none; } }
@keyframes fc-w-claude-ph { 0% { height: 31.6em; } 32.391% { height: 31.6em; animation-timing-function: cubic-bezier(.55,0,.15,1); } 35.435% { height: 16.6em; } 100% { height: 16.6em; } }
@keyframes fc-k-cl-ph { 0% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,0,.15,1); } 60.87% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,0,.15,1); } 63.913% { opacity: 0; transform: translateY(-1.6em) scale(.97); } 100% { opacity: 0; transform: translateY(-1.6em) scale(.97); } }
@keyframes fc-k-b1-ph { 0% { max-height: 7em; margin-bottom: 0; opacity: 0; transform: translateY(.3em); padding-block: .38em; } 17.609% { max-height: 7em; margin-bottom: 0; opacity: 0; transform: translateY(.3em); padding-block: .38em; } 18.913% { max-height: 7em; margin-bottom: 0; opacity: 1; transform: none; padding-block: .38em; } 46.304% { max-height: 7em; margin-bottom: 0; opacity: 1; transform: none; padding-block: .38em; } 47.609% { max-height: 0; margin-bottom: -.5em; opacity: 0; transform: none; padding-block: 0; } 100% { max-height: 0; margin-bottom: -.5em; opacity: 0; transform: none; padding-block: 0; } }
@keyframes fc-k-tkrow-ph { 0% { max-height: 7em; margin-bottom: 0; opacity: 1; } 47.609% { max-height: 7em; margin-bottom: 0; opacity: 1; } 48.913% { max-height: 0; margin-bottom: -.5em; opacity: 0; } 100% { max-height: 0; margin-bottom: -.5em; opacity: 0; } }
@keyframes fc-k-s1-ph { 0% { max-height: 7em; margin-bottom: 0; opacity: 1; } 47.609% { max-height: 7em; margin-bottom: 0; opacity: 1; } 48.913% { max-height: 0; margin-bottom: -.5em; opacity: 0; } 100% { max-height: 0; margin-bottom: -.5em; opacity: 0; } }