.demo{--demo-accent:#0a0a0a}.demo-step{border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);border-radius:9999px;align-items:center;gap:.5rem;padding:.4rem .9rem .4rem .45rem;font-size:14px;transition:color .2s,border-color .2s;display:inline-flex;position:relative;overflow:hidden}.demo-step:hover,.demo-step[aria-pressed=true]{color:var(--foreground);border-color:color-mix(in oklch, var(--foreground) 30%, transparent)}.demo-step-num{background:var(--muted);border-radius:9999px;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;font-size:12px;font-weight:600;display:flex}.demo-step[aria-pressed=true] .demo-step-num{background:var(--foreground);color:var(--background)}.demo-step-bar{height:2px;position:absolute;inset:auto 0 0}.demo-step-bar>span{height:100%;width:calc(var(--progress,0) * 100%);background:var(--foreground);display:block}.demo-toggle{border:1px solid var(--border);background:var(--card);border-radius:9999px;justify-content:center;align-items:center;width:2.25rem;height:2.25rem;display:flex}.demo-toggle[hidden],.demo-toggle .demo-icon-play,.demo[data-paused] .demo-toggle .demo-icon-pause{display:none}.demo[data-paused] .demo-toggle .demo-icon-play{display:block}.demo-caption{opacity:.55;transition:opacity .3s}.demo[data-scene=describe] [data-caption=describe],.demo[data-scene=build] [data-caption=build],.demo[data-scene=edit] [data-caption=edit],.demo[data-scene=publish] [data-caption=publish]{opacity:1}.demo-stage{aspect-ratio:16/10;border:1px solid var(--border);background:var(--background);box-shadow:0 1px 2px hsl(var(--shadow-color) / .08), 0 8px 24px -6px hsl(var(--shadow-color) / .18), 0 40px 80px -30px hsl(var(--shadow-color) / .35);--s:.27;border-radius:1.25rem;position:relative;overflow:hidden}@media (width>=640px){.demo-stage{--s:.47}}@media (width>=768px){.demo-stage{--s:.57}}@media (width>=1024px){.demo-stage{--s:.77}}@media (width>=1192px){.demo-stage{--s:.869}}.demo-canvas{width:1280px;height:800px;transform:scale(var(--s));transform-origin:0 0;font-size:15px;line-height:1.45;position:absolute;top:0;left:0}.demo-zoom{transform-origin:0 0;transition:transform 1s cubic-bezier(.65,0,.35,1);position:absolute;inset:0}.scene{background:var(--background);transition:opacity .5s;position:absolute;inset:0}.demo[data-scene=describe] .scene-builder,.demo:not([data-scene=describe]) .scene-describe{opacity:0;visibility:hidden}.demo .field{border:1px solid var(--border);background:var(--card);border-radius:.85rem;align-items:center;min-height:48px;padding:0 1rem;font-size:16px;display:flex}.demo .chip{background:var(--muted);border-radius:.5rem;align-items:center;gap:.35rem;padding:.2rem .6rem;font-size:14px;transition:opacity .25s,transform .25s;display:inline-flex}.demo .caret{background:var(--foreground);width:1.5px;height:1.1em;margin-left:1px;animation:1s step-end infinite demo-blink;display:none}.demo [data-typing]>.caret{display:inline-block}@keyframes demo-blink{50%{opacity:0}}.demo .publish{background:var(--foreground);height:34px;color:var(--background);border-radius:9999px;align-items:center;padding:0 1rem;font-size:14px;font-weight:500;display:inline-flex}.demo .publish-busy,.demo[data-publishing] .publish-label{display:none}.demo[data-publishing] .publish-busy{display:inline}.demo .rail-item{width:52px;color:var(--muted-foreground);border-radius:.6rem;flex-direction:column;align-items:center;gap:3px;padding:7px 0 6px;font-size:10.5px;display:flex}.demo .preview{background:var(--card);height:100%;box-shadow:0 1px 3px hsl(var(--shadow-color) / .12);border-radius:.6rem;position:relative;overflow:hidden}.demo .preview-scroll{transition:transform 3.2s cubic-bezier(.45,0,.25,1);position:absolute;inset:0 0 auto}.demo .shot{object-fit:cover;object-position:top;opacity:0;width:100%;height:100%;transition:opacity .7s,filter .9s;position:absolute;inset:0}.demo[data-site=v1] .shot-v1,.demo[data-site=v2] .shot-v2,.demo[data-site=v3] .shot-v3{opacity:1}.demo[data-site=scroll] .shot{opacity:0}.demo .skeleton{background:var(--card);flex-direction:column;padding:28px 48px;transition:opacity .7s;display:flex;position:absolute;inset:0}.demo .skeleton span{background:linear-gradient(90deg, var(--muted), color-mix(in oklch, var(--muted) 40%, var(--card)), var(--muted));background-size:200% 100%;border-radius:.5rem;animation:1.4s linear infinite demo-shimmer;display:block}@keyframes demo-shimmer{to{background-position:-200% 0}}.demo:not([data-site=none]) .skeleton{opacity:0}.demo[data-site=blur] .shot-v1{opacity:1;filter:blur(14px)saturate(.6)}.demo[data-site=blur] .skeleton{opacity:0}.demo .build-card{border:1px solid var(--border);background:color-mix(in oklch, var(--popover) 94%, transparent);width:400px;box-shadow:0 30px 80px -30px hsl(var(--shadow-color) / .5);backdrop-filter:blur(10px);opacity:0;border-radius:1.25rem;padding:26px 28px;transition:opacity .45s,scale .45s;position:absolute;top:50%;left:50%;translate:-50% -50%;scale:.96}.demo[data-scene=build]:not([data-built]) .build-card{opacity:1;scale:1}.demo .build-step{color:var(--muted-foreground);align-items:center;gap:.7rem;font-size:15px;display:flex}.demo .build-dot{border:1.5px solid var(--border);color:#0000;border-radius:9999px;justify-content:center;align-items:center;width:20px;height:20px;transition:all .25s;display:flex}.demo .build-step[data-state=active]{color:var(--foreground);font-weight:500}.demo .build-step[data-state=active] .build-dot{border-color:var(--foreground);border-right-color:#0000;animation:.8s linear infinite demo-spin}.demo .build-step[data-state=done]{color:var(--foreground)}.demo .build-step[data-state=done] .build-dot{border-color:var(--success);background:var(--success);color:#fff}@keyframes demo-spin{to{rotate:360deg}}.demo .chat{border:1px solid var(--border);background:var(--popover);width:640px;box-shadow:0 2px 4px hsl(var(--shadow-color) / .08), 0 30px 70px -20px hsl(var(--shadow-color) / .45);border-radius:1.4rem;transition:opacity .4s,translate .4s;position:absolute;bottom:22px;left:50%;overflow:hidden;translate:-50%}.demo[data-scene=describe] .chat,.demo[data-scene=build] .chat{opacity:0;translate:-50% 30px}.demo[data-chat-min] :is(.chat-head,.chat-log){display:none}.demo .chat-head{border-bottom:1px solid var(--border);align-items:center;gap:.6rem;padding:12px 16px;font-size:15px;display:flex}.demo .chat-logo{background:var(--foreground);width:26px;height:26px;color:var(--background);border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.demo .chat-log{flex-direction:column;justify-content:flex-end;gap:14px;max-height:330px;padding:16px;display:flex;overflow:hidden}.demo .turn{flex-direction:column;gap:12px;display:flex}.demo .turn:not([data-shown]){display:none}.demo .bubble{background:var(--foreground);max-width:82%;color:var(--background);border-radius:1.1rem;align-self:flex-end;padding:8px 14px;font-size:15px;animation:.3s both demo-pop}.demo .thinking,.demo .answer{gap:10px;font-size:15px;display:flex}.demo .thinking{align-items:center}.demo .thinking i{background:var(--muted-foreground);border-radius:9999px;width:7px;height:7px;animation:1s infinite demo-dot}.demo .thinking i:nth-of-type(2){animation-delay:.15s}.demo .thinking i:nth-of-type(3){animation-delay:.3s}@keyframes demo-dot{0%,80%,to{opacity:.25}40%{opacity:1}}.demo .turn:not([data-phase=thinking]) .thinking,.demo .turn:not([data-phase=done]) .answer{display:none}.demo .answer{animation:.35s both demo-pop}.demo .change{border:1px solid var(--border);background:color-mix(in oklch, var(--muted) 45%, var(--card));border-radius:1rem;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;font-size:14px;display:flex}.demo .change-check{background:color-mix(in oklch, var(--success) 18%, transparent);width:22px;height:22px;color:var(--success);border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;display:flex}@keyframes demo-pop{0%{opacity:0;translate:0 6px}}.demo .chat-input{border:1px solid var(--border);background:var(--background);border-radius:9999px;align-items:center;gap:10px;margin:0 12px 12px;padding:7px 7px 7px 8px;font-size:15px;display:flex}.demo .chat-placeholder{color:var(--muted-foreground)}.demo [data-chat-typed]:not(:empty)+.chat-placeholder{display:none}.demo .chat-send{background:color-mix(in oklch, var(--foreground) 35%, transparent);width:32px;height:32px;color:var(--background);border-radius:9999px;justify-content:center;align-items:center;transition:background .2s;display:flex}.demo [data-chat-typed]:not(:empty)~.chat-send,.demo .chat-input:has([data-chat-typed]:not(:empty)) .chat-send{background:var(--foreground)}.demo .live{background:hsl(var(--shadow-color) / .35);opacity:0;visibility:hidden;justify-content:center;align-items:center;transition:opacity .4s;display:flex;position:absolute;inset:0}.demo[data-live] .live{opacity:1;visibility:visible}.demo .live-card{background:var(--popover);text-align:center;width:440px;box-shadow:0 40px 100px -30px hsl(var(--shadow-color) / .6);border-radius:1.5rem;padding:32px;transition:scale .4s cubic-bezier(.2,.9,.3,1.3);scale:.94}.demo[data-live] .live-card{scale:1}.demo .live-check{background:var(--success);color:#fff;border-radius:9999px;justify-content:center;align-items:center;width:52px;height:52px;display:inline-flex}.demo .cursor{z-index:5;opacity:0;filter:drop-shadow(0 2px 3px #00000040);transition:translate .75s cubic-bezier(.65,0,.35,1),opacity .3s;position:absolute;top:0;left:0}.demo[data-cursor] .cursor{opacity:1}.demo .cursor.is-clicking svg{animation:.3s demo-click}@keyframes demo-click{50%{scale:.82}}.demo [data-pressed]{animation:.3s demo-press}@keyframes demo-press{50%{scale:.95}}.demo[data-state=static] .turn{display:flex}.demo[data-state=static] .turn .thinking{display:none}.demo[data-state=static] .turn .answer{display:flex}@media (prefers-color-scheme:dark){.demo .cursor path{fill:#f4ebda;stroke:#0a0a0a}}@media (prefers-reduced-motion:reduce){.demo-zoom,.demo .preview-scroll{transition:none}}.gx-tabs{display:none}.gx-panels{gap:2.5rem;display:grid}@media (width>=1024px){.gallery:not([data-enhanced]) .gx-panels{grid-template-columns:1fr 1fr}}.gx-panel{position:relative}.gx-frame{border:1px solid var(--border);background:var(--card);box-shadow:0 1px 2px hsl(var(--shadow-color) / .08), 0 8px 24px -6px hsl(var(--shadow-color) / .18), 0 24px 60px -24px hsl(var(--shadow-color) / .28);border-radius:1rem;overflow:hidden}.gx-viewport{aspect-ratio:16/10;background:var(--muted);position:relative;overflow:hidden;container-type:inline-size}.gx-page{width:100%;height:auto;display:block}.gx-phone{display:none}.gallery[data-enhanced] .gx-tabs{scrollbar-width:none;gap:.5rem;margin:0 -1.25rem 1.5rem;padding:.25rem 1.25rem;display:flex;overflow-x:auto}.gx-tab{border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);border-radius:9999px;flex-shrink:0;align-items:center;gap:.5rem;padding:.45rem .95rem .45rem .7rem;font-size:14px;transition:color .2s,border-color .2s;display:inline-flex;position:relative;overflow:hidden}.gx-tab:hover,.gx-tab[aria-selected=true]{color:var(--foreground);border-color:color-mix(in oklch, var(--foreground) 30%, transparent)}.gx-swatch{background:var(--accent);border-radius:9999px;width:.65rem;height:.65rem}.gx-tab-bar{height:2px;position:absolute;inset:auto 0 0}.gx-tab-bar>span{width:calc(var(--progress,0) * 100%);background:var(--foreground);height:100%;display:block}.gallery[data-enhanced] .gx-panels{display:block}.gallery[data-enhanced] .gx-panel{display:none}.gallery[data-enhanced] .gx-panel[data-active]{animation:.5s both gx-in;display:block}@keyframes gx-in{0%{opacity:0;translate:0 10px}}@media (width<=639px){.gallery[data-enhanced] .gx-frame{display:none}.gallery[data-enhanced] .gx-phone{aspect-ratio:390/844;width:min(260px,72%);box-shadow:0 30px 60px -20px hsl(var(--shadow-color) / .55);background:#1b1a17;border:7px solid #1b1a17;border-radius:2.2rem;margin:0 auto;display:block;overflow:hidden}.gallery[data-enhanced] figcaption{justify-content:center}}@media (width>=640px){.gallery[data-enhanced] .gx-panel{padding-right:9%}.gallery[data-enhanced] .gx-phone{aspect-ratio:390/844;width:21%;box-shadow:0 30px 60px -20px hsl(var(--shadow-color) / .55);background:#1b1a17;border:6px solid #1b1a17;border-radius:1.6rem;display:block;position:absolute;bottom:2.5rem;right:0;overflow:hidden}}.gallery[data-enhanced][data-motion] .gx-panel[data-active] .gx-page{animation:11s ease-in-out 1.2s infinite alternate gx-scroll}.gallery[data-enhanced][data-motion] .gx-panel[data-active]:hover .gx-page{animation-play-state:paused}@keyframes gx-scroll{0%,6%{translate:0}94%,to{translate:0 calc(62.5cqw - 100%)}}.leadflow{grid-template-columns:minmax(0,1fr);place-items:center;gap:1.5rem;display:grid;position:relative}@media (width>=640px){.leadflow{grid-template-columns:minmax(0,1fr) 40px 300px;justify-items:stretch;gap:0}}.lf-form{background:#fbf8f2;border-radius:1rem;width:100%;max-width:380px;transition:opacity .4s;overflow:hidden;box-shadow:0 30px 80px -30px #000000b3}.lf-input{background:#fff;border:1px solid #e5ded0;border-radius:.6rem;flex-direction:column;justify-content:center;min-height:44px;padding:6px 10px;display:flex}.lf-label{color:#8a8477;font-size:11px}.lf-input [data-typing]:after{content:"";background:#141210;width:1.5px;height:1em;margin-left:1px;animation:1s step-end infinite lf-blink;display:inline-block;translate:0 2px}@keyframes lf-blink{50%{opacity:0}}.lf-send{background:var(--site-accent);color:#fff;border-radius:9999px;justify-content:center;align-items:center;height:44px;margin-top:14px;font-size:15px;font-weight:600;transition:background .3s;display:flex;position:relative}.lf-send-done{align-items:center;gap:.4rem;font-size:14px;display:none}.leadflow:not([data-step=form]) .lf-send{background:#2f7d4f}.leadflow:not([data-step=form]) .lf-send-idle{display:none}.leadflow:not([data-step=form]) .lf-send-done{display:flex}.lf-send[data-pressed]{animation:.28s lf-press}@keyframes lf-press{50%{scale:.96}}.lf-wire{background:repeating-linear-gradient(90deg,#f4ebda59 0 6px,#0000 6px 12px);height:2px;display:none;position:relative}@media (width>=640px){.lf-wire{display:block}}.lf-wire span{opacity:0;background:#f4ebda;border-radius:9999px;width:10px;height:10px;position:absolute;top:50%;left:0;translate:-50% -50%;box-shadow:0 0 14px 4px #f4ebda99}.leadflow[data-step=sending] .lf-wire span{animation:.7s ease-in forwards lf-travel}@keyframes lf-travel{0%{opacity:1;left:0}to{opacity:1;left:100%}}.lf-phone{background:#1b1a17;border-radius:52px;width:300px;height:620px;padding:11px;position:relative;box-shadow:inset 0 0 0 1.5px #3a3833,0 40px 90px -30px #000c}.leadflow[data-step=alerts] .lf-phone:not([data-still]){animation:.42s lf-buzz}@keyframes lf-buzz{20%,60%{translate:-3px}40%,80%{translate:3px}}.lf-screen{border-radius:42px;height:100%;position:relative;overflow:hidden}.lf-island{z-index:3;background:#000;border-radius:9999px;width:92px;height:26px;position:absolute;top:10px;left:50%;translate:-50%}.lf-lock{background:radial-gradient(120% 70% at 20% 0,#c96a3a 0%,#0000 60%),radial-gradient(120% 80% at 100% 100%,#3b2a5a 0%,#0000 60%),linear-gradient(160deg,#7a3b2a,#1f1a2e);position:absolute;inset:0}.lf-note{backdrop-filter:blur(18px);opacity:0;background:#faf8f4db;border-radius:18px;gap:9px;padding:10px 11px;transition:opacity .4s,translate .45s cubic-bezier(.2,.9,.3,1.2),scale .45s;display:flex;translate:0 -14px;scale:.96}.leadflow[data-step=alerts] [data-note=push],.leadflow[data-step=alerts][data-text] [data-note=text],.leadflow[data-step=open] .lf-note{opacity:1;translate:0;scale:1}.lf-app{border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.lf-app-screen{background:#fbf8f2;transition:translate .55s cubic-bezier(.3,.8,.3,1);position:absolute;inset:0;translate:0 100%}.leadflow[data-step=open] .lf-app-screen,.leadflow[data-step=call] .lf-app-screen{translate:0}.lf-action{background:#fff;border:1px solid #e5ded0;border-radius:9999px;justify-content:center;align-items:center;gap:.3rem;height:32px;display:flex}.lf-action.is-primary{color:#f4ebda;background:#0a0a0a;border-color:#0a0a0a}.lf-take,.lf-draft{opacity:0;background:#fff;border:1px solid #e5ded0;border-radius:14px;margin-top:10px;padding:10px;transition:opacity .45s,translate .45s;translate:0 8px}.lf-draft{background:#f6f2ea;transition-delay:.35s}.leadflow[data-step=open] :is(.lf-take,.lf-draft),.leadflow[data-step=call] :is(.lf-take,.lf-draft){opacity:1;translate:0}.lf-fact{color:#0a0a0a;background:#f1ece2;border-radius:8px;flex-direction:column;padding:5px 7px;font-size:11.5px;font-weight:500;display:flex}.lf-fact span{color:#5e594f;font-size:10px;font-weight:400}.lf-calling{opacity:0;visibility:hidden;background:linear-gradient(#2b2a26,#121110);flex-direction:column;align-items:center;padding-top:90px;transition:opacity .4s;display:flex;position:absolute;inset:0}.leadflow[data-step=call] .lf-calling{opacity:1;visibility:visible}.lf-tap{z-index:4;opacity:0;pointer-events:none;background:#ffffff8c;border-radius:9999px;width:44px;height:44px;position:absolute;translate:-50% -50%;box-shadow:0 0 0 2px #00000026}.lf-tap.is-tapping{animation:.6s ease-out lf-tap}@keyframes lf-tap{0%{opacity:.9;scale:.5}to{opacity:0;scale:1.4}}.lf-clock{z-index:5;white-space:nowrap;color:#0a0a0a;opacity:0;background:#f4ebda;border-radius:9999px;align-items:center;gap:.35rem;padding:.35rem .75rem;font-size:13px;font-weight:500;transition:opacity .4s,translate .4s;display:flex;position:absolute;top:-16px;left:50%;translate:-50% 6px;box-shadow:0 10px 30px -10px #0009}.leadflow:is([data-step=alerts],[data-step=open]) .lf-clock{opacity:1;translate:-50%}.leadflow[data-static][data-step=alerts] [data-note=text]{opacity:1;translate:0;scale:1}