.demo:not(#_){display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--s-48);align-items:start}.demo__screen:not(#_){display:flex;flex-direction:column;gap:var(--s-12);padding:var(--s-16);border:1px solid var(--line);border-radius:var(--r-media);overflow:hidden}.demo__top:not(#_){display:flex;align-items:center;justify-content:space-between;gap:var(--s-12)}.demo__toggle:not(#_){min-width:84px;min-height:44px;padding:0 16px;border:1px solid var(--line-strong);border-radius:var(--r-pill);background:none;font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase}.demo__toggle:hover:not(#_){border-color:var(--fg)}.demo__stage:not(#_){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-12);align-content:start;min-height:330px;font-size:var(--fs-micro);line-height:1.4;letter-spacing:0}.demo__steps:not(#_){display:flex;flex-direction:column;margin:0;padding:0;list-style:none;border-bottom:1px solid var(--line)}.demo__steps:not(#_) button{display:flex;gap:var(--s-12);width:100%;min-height:56px;padding:14px 0;border:0;border-top:1px solid var(--line);background:none;text-align:left;font-size:var(--fs-body);color:var(--muted)}.demo__steps:not(#_) button:hover,.demo__steps:not(#_) .is-active,.demo__steps:not(#_) .is-done,.demo:not(.is-live):not(#_) .demo__steps button{color:var(--fg)}.demo__steps:not(#_) .label{padding-top:5px;color:var(--muted)}.demo__steps:not(#_) .is-active{border-top-color:var(--ember);font-weight:700}.demo__steps:not(#_) .is-active .label{color:var(--fg)}.demo__dots:not(#_){display:none}.is-live:not(#_) .d{opacity:0;transform:translateY(10px);transition:opacity .4s var(--ease),transform .4s var(--ease)}.is-live:not(#_) .d.is-on{opacity:1;transform:none}.d-col:not(#_){display:flex;flex-direction:column;gap:var(--s-8)}.d-col:not(#_)>.d-chip{align-self:flex-start}.d-row:not(#_){display:flex;flex-wrap:wrap;align-items:center;gap:6px}.d-label:not(#_){display:block;margin-bottom:4px;font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--bone-70)}.d-row:not(#_) .d-label{margin:0}.d-chip:not(#_){display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border:1px solid var(--bone-30);border-radius:var(--r-pill);font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase;white-space:nowrap}.d-chip--key:not(#_){background:var(--ember);border-color:var(--ember);color:var(--ink)}.d-card:not(#_){padding:10px 12px;border:1px solid var(--bone-12);border-radius:12px;background:var(--bone-06)}.d-card--key:not(#_){border-color:var(--ember)}.d-bubble:not(#_){align-self:flex-start;max-width:88%;padding:8px 12px;border-radius:14px 14px 14px 4px;background:var(--bone-12)}.d-bubble--out:not(#_){align-self:flex-end;border-radius:14px 14px 4px;background:var(--ember);color:var(--ink)}.d-line:not(#_){display:block;height:8px;border-radius:4px;background:var(--bone-12)}.d-swap:not(#_){display:grid}.d-swap:not(#_)>*{grid-area:1 / 1;justify-self:start}.d-swap:not(#_)>.d-bubble--out{justify-self:end}.d-ticks:not(#_){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;margin-top:8px}.d-tick:not(#_){display:flex;align-items:center;gap:8px}.d-tick:not(#_):before{content:"";width:10px;height:10px;flex-shrink:0;border-radius:50%;background:var(--ember)}.is-live:not(#_) .d-stag>:nth-child(2){transition-delay:.3s}.is-live:not(#_) .d-stag>:nth-child(3){transition-delay:.6s}.is-live:not(#_) .d-stag>:nth-child(4){transition-delay:.9s}.is-live:not(#_) .d-stag>:nth-child(5){transition-delay:1.2s}.is-live:not(#_) .d-stag>:nth-child(6){transition-delay:1.5s}.is-live:not(#_) .d-late{transition-delay:1.1s}.is-live:not(#_) .d-temp.is-done{opacity:0}.is-live:not(#_) .d-temp.is-active{animation:d-temp 1.1s forwards}@keyframes d-temp{0%,80%{opacity:1}to{opacity:0}}.d-dots:not(#_){display:flex;gap:4px;padding:12px;border-radius:14px;background:var(--bone-12)}.d-dots:not(#_) i{width:6px;height:6px;border-radius:50%;background:var(--bone);animation:d-blink .9s infinite}.d-dots:not(#_) i:nth-child(2){animation-delay:.15s}.d-dots:not(#_) i:nth-child(3){animation-delay:.3s}@keyframes d-blink{50%{opacity:.25}}.is-live:not(#_) .d-type{display:inline-block;clip-path:inset(0 100% 0 0);transition:clip-path 1.5s steps(28)}.is-live:not(#_) .d-type.is-on{clip-path:inset(0)}.is-live:not(#_) .d-pulse.is-active{animation:pulse .9s var(--ease) infinite}.is-live:not(#_) .d-flip{transform:perspective(600px) rotateX(-70deg);transform-origin:top}.d-slots:not(#_){display:flex;gap:4px;margin-bottom:8px}.d-slots:not(#_) i{flex:1;height:22px;border:1px solid var(--bone-30);border-radius:6px}.d-slots:not(#_) .is-key{background:var(--ember);border-color:var(--ember)}.d-phone:not(#_){display:flex;flex-direction:column;gap:var(--s-8);padding:12px;border:1px solid var(--bone-30);border-radius:22px}.demo--chatbot:not(#_) .demo__stage{grid-template-columns:minmax(0,1fr)}.demo--chatbot:not(#_) .d-phone{width:100%;max-width:380px;margin-inline:auto}.demo--chatbot:not(#_) .d-phone>.d-row{justify-content:space-between}.d-map:not(#_){position:relative;min-height:240px;border:1px solid var(--bone-12);border-radius:12px;overflow:hidden;color:var(--bone-12)}.d-map:not(#_) svg{position:absolute;inset:0;width:100%;height:100%}.d-pin:not(#_){position:absolute;width:10px;height:10px;border-radius:50%;background:var(--bone-70)}.d-pin--you:not(#_){width:14px;height:14px;background:var(--ember);box-shadow:0 0 0 7px var(--ember-15)}.d-top:not(#_){position:absolute;left:8px;right:8px;bottom:8px;background:var(--ink-88);color:var(--bone)}.d-rank:not(#_){display:block;padding:4px 0;border-top:1px solid var(--bone-12);color:var(--bone-70)}.d-rank--you:not(#_){color:var(--ember);font-weight:700}.is-live:not(#_) .d-rank--you{transform:translateY(54px);transition-delay:.5s;transition-duration:.9s}.d-node:not(#_){text-align:center}.d-node--top:not(#_){align-self:center;min-width:96px}.d-nodes:not(#_){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.d-nodes:not(#_) .d-swap{margin-top:6px}.d-nodes:not(#_) .d-swap>*{justify-self:center}.is-live:not(#_) .d-nodes>:nth-child(2) .d-chip{transition-delay:.4s}.is-live:not(#_) .d-nodes>:nth-child(3) .d-chip{transition-delay:.8s}.d-treelines:not(#_){width:100%;height:28px;margin-block:-4px}.d-draw:not(#_){stroke:var(--ember);stroke-width:2;vector-effect:non-scaling-stroke}.is-live:not(#_) .d-draw{stroke-dasharray:520;stroke-dashoffset:520;transition:stroke-dashoffset 1.4s var(--ease)}.is-live:not(#_) .d-draw.is-on{stroke-dashoffset:0}.d-speed:not(#_){position:relative;display:block;height:8px;margin:10px 7px;border-radius:4px;background:var(--bone-12)}.d-run:not(#_){position:absolute;inset:0;transform:translate(96%)}.d-run:not(#_):before{content:"";position:absolute;left:-7px;top:-3px;width:14px;height:14px;border-radius:50%;background:var(--ember)}.is-live:not(#_) .d-run{transform:translate(4%);transition:transform 1.5s var(--ease)}.is-live:not(#_) .d-run.is-on{transform:translate(96%)}.d-ends:not(#_){display:flex;justify-content:space-between;color:var(--bone-70)}.d-flow:not(#_){grid-column:1 / -1;display:flex;flex-direction:column;width:100%;max-width:420px;margin-inline:auto}.d-link:not(#_){width:2px;height:14px;margin-left:24px;background:var(--ember);transform-origin:top}.is-live:not(#_) .d-link{transform:scaleY(0);transition:transform .4s var(--ease)}.is-live:not(#_) .d-link.is-on{transform:none}.d-flow:not(#_) .d-row{margin-top:6px}.d-board:not(#_){grid-column:1 / -1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.d-lane:not(#_){display:flex;flex-direction:column;min-height:150px;padding:8px;border:1px solid var(--bone-12);border-radius:12px}.d-lane__cards:not(#_){display:flex;flex-direction:column;gap:6px}.d-slot:not(#_){display:flex;align-items:center;justify-content:center;height:28px;border-radius:8px;background:var(--bone-12);font-family:var(--font-label);font-size:var(--fs-label);font-style:normal;letter-spacing:.06em;text-transform:uppercase}.d-slot--key:not(#_){background:var(--bone-06);border:1px solid var(--ember)}.d-slot--key:not(#_):before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ember)}.d-lane:not(#_) .d-chip{white-space:normal;padding-block:4px;text-align:center}.demo--b2b-lead-generation:not(#_) .d-card--key{grid-column:1 / -1}.d-frames:not(#_){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-content:start}.d-frame:not(#_){position:relative;display:flex;align-items:flex-end;aspect-ratio:3 / 4;padding:4px;border:1px solid var(--bone-30);border-radius:8px;background:var(--bone-06)}.d-tag:not(#_){font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:.04em;text-transform:uppercase;color:var(--bone-70)}.d-ring:not(#_){position:absolute;inset:-1px;border:2px solid var(--ember);border-radius:8px}.is-live:not(#_) .d-ring{opacity:0;transition:opacity .4s}.is-live:not(#_) .d-ring.is-on{opacity:1}.d-bar:not(#_){min-height:56px}.step-phone:not(#_){display:flex;flex-direction:column;gap:6px;width:190px;min-height:330px;flex-shrink:0;padding:12px;border:1px solid var(--bone-30);border-radius:22px;font-size:var(--fs-micro);line-height:1.35}.step-phone:not(#_) .d-chip{padding:0 8px}@media(max-width:1024px){.demo:not(#_){grid-template-columns:minmax(0,1fr);gap:var(--s-24)}}@media(max-width:767px){.demo__screen:not(#_){padding:var(--s-12)}.demo__stage:not(#_){grid-template-columns:minmax(0,1fr);min-height:0;max-height:70vh;gap:var(--s-8);font-size:var(--fs-micro);overflow:hidden}.is-live:not(#_) .d{transform:translateY(8px)}.demo__steps:not(#_){flex-direction:row;gap:var(--s-8);overflow-x:auto;scroll-snap-type:x mandatory;border:0;scrollbar-width:none}.demo__steps:not(#_)::-webkit-scrollbar{display:none}.demo__steps:not(#_) :is(li,.t-li){flex:0 0 82%;scroll-snap-align:start}.demo__steps:not(#_) button{height:100%;min-height:72px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-card);font-size:var(--fs-body)}.demo__steps:not(#_) .is-active{border-color:var(--ember)}.demo__dots:not(#_){display:flex;justify-content:center;gap:6px;margin-top:var(--s-12)}.demo__dots:not(#_) :is(span,.t-span){width:8px;height:8px;border-radius:50%;background:var(--line-strong)}.demo__dots:not(#_) .is-active{background:var(--ember)}.d-map:not(#_){min-height:220px}.d-ticks:not(#_){margin-top:6px}.d-board:not(#_){grid-template-columns:minmax(0,1fr)}.d-lane:not(#_){flex-direction:row;align-items:center;gap:8px;min-height:44px;padding:6px 8px}.d-lane:not(#_) .d-label{width:72px;flex-shrink:0;margin:0}.d-lane__cards:not(#_){flex:1;flex-direction:row}.d-lane:not(#_) .d-slot{flex:1;height:24px}.d-lane:not(#_) .d-chip{flex:none;font-size:var(--fs-label);padding-block:0}.d-frame:not(#_){aspect-ratio:4 / 3}}.is-static:not(#_) .d[data-until]{visibility:hidden}.d-nodes:not(#_) .d-chip{padding:2px 6px;white-space:normal;text-align:center;line-height:1.2;letter-spacing:.02em}
