#s-how{--tfb-how-accent:#a294cf}.tfb-how-band{padding-bottom:0}.tfb-how-desktop{display:none}@media (min-width:1080px){.tfb-how-desktop{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1.25fr;align-items:stretch;gap:0;max-width:var(--tfb-panel-w);width:100%;margin:0 auto;border:var(--tfb-hairline) solid var(--tfb-border)}}.tfb-how-steps{display:flex;flex-direction:column;justify-content:center;padding:24px;border-right:var(--tfb-hairline) solid var(--tfb-border)}.tfb-how-row{position:relative;display:flex;align-items:flex-start;gap:16px;width:100%;border:none;border-radius:6px;padding:16px 20px 18px;margin:2px 0;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit;overflow:hidden;transition:background-color .22s ease}.tfb-how-row:hover:not(.tfb-how-row--active){background:#0d0d0d}.tfb-how-row--active{background:#121212;box-shadow:inset 0 0 0 var(--tfb-hairline) #1f1f1f}.tfb-how-row:focus-visible{outline:var(--tfb-hairline) solid var(--tfb-how-accent);outline-offset:-1px}.tfb-how-num{flex:none;font-family:var(--font-geist-mono),ui-monospace,"SFMono-Regular",Menlo,monospace;font-size:14px;letter-spacing:.015em;color:var(--tfb-muted);padding-top:2px;transition:color .22s ease}.tfb-how-row--active .tfb-how-num{color:var(--tfb-how-accent)}.tfb-how-rowbody{display:flex;flex-direction:column;min-width:0}.tfb-how-title{font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.005em;color:var(--tfb-muted);transition:color .22s ease}.tfb-how-row:hover .tfb-how-title{color:var(--tfb-gray-900)}.tfb-how-row--active .tfb-how-title{color:var(--tfb-fg)}.tfb-how-descwrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.3,.7,.3,1),opacity .24s ease;opacity:0}.tfb-how-row--active .tfb-how-descwrap{grid-template-rows:1fr;opacity:1}.tfb-how-desc{overflow:hidden;min-height:0;font-size:15px;line-height:24px;color:var(--tfb-gray-600);max-width:44ch;text-wrap:pretty}.tfb-how-row--active .tfb-how-desc{padding-top:8px}.tfb-how-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#1c1c1c}.tfb-how-progress-fill{display:block;height:100%;width:100%;background:var(--tfb-how-accent);opacity:.85;transform-origin:left;transform:scaleX(0);animation:tfb-how-dwell var(--dwell) linear forwards}@keyframes tfb-how-dwell{to{transform:scaleX(1)}}.tfb-how-steps:focus-within .tfb-how-progress-fill,.tfb-how-steps:hover .tfb-how-progress-fill{animation-play-state:paused}.tfb-how-well{position:relative;min-height:500px;background:#060606;display:flex;align-items:center;justify-content:center;padding:36px 32px;overflow:visible}.tfb-how-stage{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 50% 46%,#16161608 0,#ffffff08 0,transparent 72%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='1' cy='1' r='0.5' fill='%23ffffff'/%3E%3C/svg%3E");background-size:auto,24px 24px;opacity:.16}.tfb-how-stage:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 78% 74% at 50% 50%,transparent 40%,#060606 100%)}.tfb-how-visual{position:relative;z-index:1;width:100%;max-width:520px}.tfb-how-mobile{position:relative;z-index:3;display:flex;flex-direction:column;gap:24px;max-width:var(--tfb-panel-w);margin:0 auto;padding:0 24px}@media (min-width:1080px){.tfb-how-mobile{display:none}}.tfb-how-mcell{display:flex;flex-direction:column;border:var(--tfb-hairline) solid var(--tfb-border);border-radius:20px;overflow:hidden;background:#0a0a0a}.tfb-how-well--m{min-height:0;aspect-ratio:520/420;border-radius:0;border-bottom:var(--tfb-hairline) solid var(--tfb-border);padding:14px 12px}.tfb-how-visual--m{max-width:100%}.tfb-how-mcopy{padding:22px 22px 26px}.tfb-how-mnum{display:block;margin-bottom:8px;font-family:var(--font-geist-mono),ui-monospace,"SFMono-Regular",Menlo,monospace;font-size:12px;letter-spacing:.06em;color:var(--tfb-how-accent)}.tfb-how-mcopy h3{margin:0 0 10px;font-size:19px;line-height:27px;font-weight:550;letter-spacing:-.005em;color:var(--tfb-fg)}.tfb-how-mcopy p{margin:0;font-size:15px;line-height:24px;color:var(--tfb-gray-600);max-width:46ch;text-wrap:pretty}@media (prefers-reduced-motion:reduce){.tfb-how-progress{display:none}.tfb-how-row--active .tfb-how-descwrap{grid-template-rows:1fr;opacity:1}}.tfb-hv{--hv-ink:#efefe4;--hv-dim:#93938c;--hv-faint:#6d6d66;--hv-line:#2e2e2e;--hv-line-soft:#1f1f1f;--hv-fill:#0f0f0f;--hv-fill-2:#131313;--hv-accent:#a294cf;--hv-accent-dim:#6a5f96;--hv-ok:#79c39a;--hv-warn:#d9a06a;--hv-mono:var(--font-geist-mono),ui-monospace,"SFMono-Regular",Menlo,monospace;display:block;width:100%;height:auto;overflow:visible}.tfb-hv text{fill:var(--hv-ink)}.hv-mono{font-family:var(--hv-mono);font-size:8.5px;letter-spacing:.06em}.hv-mono--cap{text-transform:uppercase;letter-spacing:.13em;font-size:8px}.hv-mono--sm{font-size:7.5px;letter-spacing:.05em}.hv-mono--lg{font-size:11px;letter-spacing:.02em}.hv-sans{font-family:var(--font-inter),system-ui,sans-serif;font-size:11.5px;letter-spacing:-.002em}.hv-sans--lg{font-size:13px}.hv-dim{fill:var(--hv-dim)}.hv-faint{fill:var(--hv-faint)}.hv-accent{fill:var(--hv-accent)}.hv-ok{fill:var(--hv-ok)}.hv-warn{fill:var(--hv-warn)}.hv-rule{stroke:var(--hv-line);stroke-width:1}.hv-rule--soft{stroke:var(--hv-line-soft);stroke-width:1}.hv-box{fill:var(--hv-fill)}.hv-box,.hv-wire{stroke:var(--hv-line);stroke-width:1}.hv-wire{fill:none}.hv-in{opacity:0;animation:hv-rise .45s cubic-bezier(.2,.7,.3,1) var(--d,0s) forwards}@keyframes hv-rise{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.hv-fade{opacity:0;animation:hv-fadeIn .4s ease var(--d,0s) forwards}.hv-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:hv-dash var(--dur,.5s) cubic-bezier(.4,0,.2,1) var(--d,0s) forwards}@keyframes hv-dash{to{stroke-dashoffset:0}}.hv-swap{opacity:0;animation:hv-fadeIn .2s ease var(--in) forwards,hv-fadeOut .16s ease var(--out,999s) forwards}@keyframes hv-fadeIn{to{opacity:1}}@keyframes hv-fadeOut{to{opacity:0}}.hv-grow{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0);animation:hv-growY .5s cubic-bezier(.2,.8,.3,1) var(--d,0s) forwards}@keyframes hv-growY{to{transform:scaleY(1)}}.hv-pulse{opacity:0;animation:hv-pulseK 1.1s ease-out var(--d,0s) 1}@keyframes hv-pulseK{0%{opacity:0;transform:scale(.55)}55%{opacity:.5}to{opacity:0;transform:scale(1.9)}}.tfb-hv--exit{animation:hv-out .42s ease calc(var(--cyc) - .42s) forwards}@keyframes hv-out{to{opacity:0}}.hv-c-pulse{fill:var(--hv-accent);opacity:0;animation:hv-cPulse .62s cubic-bezier(.5,0,.5,1) var(--d) forwards}@keyframes hv-cPulse{0%{opacity:0;transform:translateX(0)}12%,78%{opacity:1}to{opacity:0;transform:translateX(var(--dx))}}.hv-c-live{stroke:var(--hv-accent-dim);fill:none;opacity:0;animation:hv-cLive 1s cubic-bezier(.2,.7,.3,1) var(--d) forwards}@keyframes hv-cLive{0%{opacity:0}22%{opacity:.85}to{opacity:.4}}.hv-c-dot{fill:var(--hv-faint)}.hv-c-dot--live{fill:var(--hv-accent);opacity:0;animation:hv-fadeIn .3s ease var(--d) forwards}.hv-c-scan{stroke:var(--hv-accent);fill:none;opacity:0;animation:hv-cScan 2.6s ease-in-out .5s 2}@keyframes hv-cScan{0%,to{opacity:0}50%{opacity:.34}}.hv-type-clip{animation:hv-type var(--dur) steps(var(--n)) .35s forwards;width:0}@keyframes hv-type{to{width:calc(var(--n) * var(--ch))}}.hv-caret{fill:var(--hv-ink);animation:hv-caretRun var(--dur) steps(var(--n)) .35s forwards,hv-caretBlink .9s steps(1) 0s infinite,hv-fadeOut .2s ease var(--gone) forwards}@keyframes hv-caretRun{to{transform:translateX(calc(var(--n) * var(--ch)))}}@keyframes hv-caretBlink{50%{opacity:0}}.hv-send{fill:var(--hv-fill-2);animation:hv-sendK .4s ease var(--d) forwards}@keyframes hv-sendK{to{fill:var(--hv-ink)}}.hv-send-glyph{fill:var(--hv-dim);animation:hv-sendG .4s ease var(--d) forwards}@keyframes hv-sendG{to{fill:#0a0a0a}}.hv-node-fill{opacity:0;animation:hv-fadeIn .4s ease var(--d) forwards}.hv-code-line{opacity:0;animation:hv-codeIn .34s cubic-bezier(.2,.7,.3,1) var(--d) forwards}@keyframes hv-codeIn{0%{opacity:0;transform:translateX(-5px)}to{opacity:1;transform:none}}.hv-kw{fill:var(--hv-accent)}.hv-num{fill:#c9b189}.hv-fn{fill:var(--hv-ink)}.hv-op{fill:var(--hv-dim)}.hv-cursor{stroke:var(--hv-accent);stroke-width:1;opacity:.42;animation:hv-cursorK var(--dur) cubic-bezier(.4,0,.2,1) var(--d) forwards}@keyframes hv-cursorK{0%{transform:translateX(0);opacity:0}8%{opacity:.42}92%{opacity:.42}to{transform:translateX(var(--dx));opacity:0}}.hv-progress{transform-box:fill-box;transform-origin:left;transform:scaleX(0);animation:hv-progK var(--dur) linear var(--d) forwards}@keyframes hv-progK{to{transform:scaleX(1)}}.hv-bar{fill:#242424}.hv-bar--hi{fill:var(--hv-accent-dim)}.hv-bar--bad{fill:var(--hv-warn);opacity:.45}.hv-chip{fill:none;stroke-width:1}.hv-chip--ok{stroke:color-mix(in srgb,var(--hv-ok) 55%,transparent)}.hv-chip--warn{stroke:color-mix(in srgb,var(--hv-warn) 55%,transparent)}@media (prefers-reduced-motion:reduce){.tfb-hv .hv-c-dot--live,.tfb-hv .hv-c-live,.tfb-hv .hv-code-line,.tfb-hv .hv-fade,.tfb-hv .hv-in,.tfb-hv .hv-node-fill{opacity:1;transform:none}.tfb-hv .hv-draw{stroke-dashoffset:0}.tfb-hv .hv-grow{transform:none}.tfb-hv .hv-progress{transform:scaleX(1)}.tfb-hv .hv-type-clip{width:calc(var(--n) * var(--ch))}.tfb-hv .hv-c-pulse,.tfb-hv .hv-c-scan,.tfb-hv .hv-caret,.tfb-hv .hv-cursor,.tfb-hv .hv-pulse{display:none}.tfb-hv .hv-swap{opacity:0}.tfb-hv .hv-swap--last{opacity:1}.tfb-hv .hv-send{fill:var(--hv-ink)}.tfb-hv .hv-send-glyph{fill:#0a0a0a}.tfb-hv--exit{animation:none}}