.demo[data-astro-cid-zzkqsl3z]{position:relative;min-height:100svh}.demo__header[data-astro-cid-zzkqsl3z]{padding-block:96px 32px}.demo__crumb[data-astro-cid-zzkqsl3z]{display:inline-block;font-family:var(--font-mono);font-size:12px;color:var(--cyan);letter-spacing:.06em}.demo__crumb[data-astro-cid-zzkqsl3z]:hover{text-decoration:underline}.demo__tech[data-astro-cid-zzkqsl3z]{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-wrap:wrap;gap:8px}.demo__tech[data-astro-cid-zzkqsl3z] li[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:12px;font-weight:500;padding:5px 12px;border:1px solid var(--border);border-radius:999px;color:var(--muted);background:#0d0a1e8c;backdrop-filter:blur(8px)}.vt-stage[data-astro-cid-zzkqsl3z]{padding-block:8px 56px}.vt-screen[data-astro-cid-zzkqsl3z]{position:relative;width:100%;max-width:1080px;margin-inline:auto;aspect-ratio:16 / 9;border:1px solid var(--border-soft);border-radius:18px;overflow:hidden;background:var(--void);isolation:isolate}@media(max-width:720px){.vt-screen[data-astro-cid-zzkqsl3z]{aspect-ratio:4 / 3}}.vt-scene[data-astro-cid-zzkqsl3z]{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;backface-visibility:hidden;overflow:hidden}.vt-scene--a[data-astro-cid-zzkqsl3z]{background:radial-gradient(ellipse at 30% 30%,rgba(255,0,110,.45),transparent 55%),radial-gradient(ellipse at 70% 80%,rgba(255,95,160,.3),transparent 55%),linear-gradient(135deg,#2a0a30,#4a0a3a 60%,#1a0820)}.vt-scene--b[data-astro-cid-zzkqsl3z]{background:radial-gradient(ellipse at 70% 30%,rgba(0,217,255,.45),transparent 55%),radial-gradient(ellipse at 30% 80%,rgba(80,240,255,.25),transparent 55%),linear-gradient(135deg,#0a2a3a,#0a3a4a 60%,#061a26)}.vt-scene__eyebrow[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:14px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#ffffffb3;margin-bottom:4px}.vt-scene__num[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:clamp(110px,22vw,240px);font-weight:700;line-height:.9;letter-spacing:-.04em;color:var(--ghost);text-shadow:0 0 60px currentColor}.vt-scene--a[data-astro-cid-zzkqsl3z] .vt-scene__num[data-astro-cid-zzkqsl3z]{color:var(--hot)}.vt-scene--b[data-astro-cid-zzkqsl3z] .vt-scene__num[data-astro-cid-zzkqsl3z]{color:var(--cyan)}.vt-scene__caption[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:13px;letter-spacing:.08em;color:#fff9;margin-top:10px}.vt-buttons[data-astro-cid-zzkqsl3z]{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:10px;grid-template-columns:repeat(2,1fr)}@media(min-width:560px){.vt-buttons[data-astro-cid-zzkqsl3z]{grid-template-columns:repeat(3,1fr)}}@media(min-width:900px){.vt-buttons[data-astro-cid-zzkqsl3z]{grid-template-columns:repeat(4,1fr)}}@media(min-width:1180px){.vt-buttons[data-astro-cid-zzkqsl3z]{grid-template-columns:repeat(6,1fr)}}.vt-btn[data-astro-cid-zzkqsl3z]{--t-accent: var(--hot);display:flex;align-items:center;gap:10px;width:100%;padding:11px 14px;border:1px solid var(--border-soft);border-radius:10px;background:#ffffff06;color:var(--fg);font:inherit;cursor:pointer;transition:border-color .2s,transform .2s,background .2s;text-align:left}.vt-btn--hot[data-astro-cid-zzkqsl3z]{--t-accent: var(--hot)}.vt-btn--cyan[data-astro-cid-zzkqsl3z]{--t-accent: var(--cyan)}.vt-btn--acid[data-astro-cid-zzkqsl3z]{--t-accent: var(--acid)}.vt-btn[data-astro-cid-zzkqsl3z]:hover,.vt-btn[data-astro-cid-zzkqsl3z]:focus-visible{border-color:var(--t-accent);transform:translateY(-1px);background:#ffffff0a}.vt-btn__num[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--t-accent);letter-spacing:.06em}.vt-btn__title[data-astro-cid-zzkqsl3z]{font-size:13px;font-weight:500}.vt-readout[data-astro-cid-zzkqsl3z]{margin-top:28px;padding:16px 18px;border:1px solid var(--border-soft);border-radius:12px;background:#0d0a1e80}.vt-readout__label[data-astro-cid-zzkqsl3z]{font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:0}.vt-readout__blurb[data-astro-cid-zzkqsl3z]{margin:8px 0 0;font-family:var(--font-mono);font-size:13px;line-height:1.55;color:var(--muted)}.vt-status[data-astro-cid-zzkqsl3z]{margin:12px 0 0;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--dim)}::view-transition-group(vt-morph){animation-duration:.52s;animation-timing-function:cubic-bezier(.22,1,.36,1)}html.vt-style-morph::view-transition-old(vt-morph){animation:vt-morph-out .52s cubic-bezier(.22,1,.36,1) forwards}html.vt-style-morph::view-transition-new(vt-morph){animation:vt-morph-in .52s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-morph-out{to{opacity:0;transform:scale(.96)}}@keyframes vt-morph-in{0%{opacity:0;transform:scale(1.04)}}html.vt-style-flip-y::view-transition-old(vt-morph){animation:vt-flip-y-out .6s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-flip-y::view-transition-new(vt-morph){animation:vt-flip-y-in .6s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-flip-y-out{to{transform:perspective(1000px) rotateY(-90deg);opacity:0}}@keyframes vt-flip-y-in{0%{transform:perspective(1000px) rotateY(90deg);opacity:0}}html.vt-style-slide-left::view-transition-old(vt-morph){animation:vt-sl-out .5s cubic-bezier(.22,1,.36,1) forwards}html.vt-style-slide-left::view-transition-new(vt-morph){animation:vt-sl-in .5s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-sl-out{to{transform:translate(-100%)}}@keyframes vt-sl-in{0%{transform:translate(100%)}}html.vt-style-slide-up::view-transition-old(vt-morph){animation:vt-su-out .5s cubic-bezier(.22,1,.36,1) forwards}html.vt-style-slide-up::view-transition-new(vt-morph){animation:vt-su-in .5s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-su-out{to{transform:translateY(-100%)}}@keyframes vt-su-in{0%{transform:translateY(100%)}}html.vt-style-iris::view-transition-old(vt-morph){animation:vt-fade .28s ease-out forwards}html.vt-style-iris::view-transition-new(vt-morph){animation:vt-iris .7s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-iris{0%{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}@keyframes vt-fade{to{opacity:0}}html.vt-style-wipe::view-transition-old(vt-morph){animation:vt-fade .28s ease-out forwards}html.vt-style-wipe::view-transition-new(vt-morph){animation:vt-wipe .7s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-wipe{0%{clip-path:polygon(0 0,0 0,0 0,0 0)}40%{clip-path:polygon(0 0,100% 0,100% 0,0 0)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}html.vt-style-glitch::view-transition-old(vt-morph){animation:vt-glitch-out .42s steps(8,end) forwards}html.vt-style-glitch::view-transition-new(vt-morph){animation:vt-glitch-in .42s steps(8,end) forwards}@keyframes vt-glitch-out{0%{transform:none}20%{transform:translate(-4%,2%) skew(3deg)}40%{transform:translate(3%,-2%) skew(-4deg);filter:hue-rotate(40deg) contrast(1.3)}60%{transform:translate(-2%) skew(2deg);filter:hue-rotate(-30deg)}80%{transform:translate(1%,1%);opacity:.4}to{transform:translate(0);opacity:0;filter:none}}@keyframes vt-glitch-in{0%{transform:translate(5%,-2%) skew(-3deg);opacity:0;filter:hue-rotate(-40deg) contrast(1.3)}30%{transform:translate(-3%,2%) skew(3deg);opacity:.6;filter:hue-rotate(20deg)}60%{transform:translate(2%,-1%) skew(-1deg);opacity:.85}to{transform:none;opacity:1;filter:none}}html.vt-style-zoom-blur::view-transition-old(vt-morph){animation:vt-zb-out .6s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-zoom-blur::view-transition-new(vt-morph){animation:vt-zb-in .6s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-zb-out{to{transform:scale(1.6);opacity:0;filter:blur(24px)}}@keyframes vt-zb-in{0%{transform:scale(.6);opacity:0;filter:blur(24px)}}html.vt-style-stretch::view-transition-old(vt-morph){animation:vt-stretch-out .5s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center top}html.vt-style-stretch::view-transition-new(vt-morph){animation:vt-stretch-in .5s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center bottom}@keyframes vt-stretch-out{to{transform:scaleY(0)}}@keyframes vt-stretch-in{0%{transform:scaleY(0)}}html.vt-style-skew::view-transition-old(vt-morph){animation:vt-skew-out .54s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-skew::view-transition-new(vt-morph){animation:vt-skew-in .54s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-skew-out{to{transform:translate(-50%) skew(-15deg);opacity:0}}@keyframes vt-skew-in{0%{transform:translate(50%) skew(15deg);opacity:0}}html.vt-style-cube::view-transition-old(vt-morph){animation:vt-cube-out .72s cubic-bezier(.65,0,.35,1) forwards;transform-origin:right center}html.vt-style-cube::view-transition-new(vt-morph){animation:vt-cube-in .72s cubic-bezier(.65,0,.35,1) forwards;transform-origin:left center}@keyframes vt-cube-out{to{transform:perspective(1000px) rotateY(-90deg);opacity:.6}}@keyframes vt-cube-in{0%{transform:perspective(1000px) rotateY(90deg);opacity:.6}}html.vt-style-shatter::view-transition-old(vt-morph){animation:vt-pout .38s cubic-bezier(.55,.06,.68,.19) forwards}html.vt-style-shatter::view-transition-new(vt-morph){animation:vt-pin .44s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-pout{to{transform:scale(1.7);opacity:0}}@keyframes vt-pin{0%{transform:scale(.35);opacity:0}}html.vt-style-bounce::view-transition-old(vt-morph){animation:vt-fade .2s ease-out forwards}html.vt-style-bounce::view-transition-new(vt-morph){animation:vt-bounce-in .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes vt-bounce-in{0%{transform:scale(.3) translateY(40%);opacity:0}60%{transform:scale(1.08) translateY(-3%);opacity:1}80%{transform:scale(.97) translateY(1%)}to{transform:scale(1) translateY(0)}}html.vt-style-hue-shift::view-transition-old(vt-morph){animation:vt-hue-out .7s ease-in-out forwards}html.vt-style-hue-shift::view-transition-new(vt-morph){animation:vt-hue-in .7s ease-in-out forwards}@keyframes vt-hue-out{0%{filter:hue-rotate(0deg) saturate(1.2)}50%{filter:hue-rotate(360deg) saturate(2);opacity:.5}to{filter:hue-rotate(720deg) saturate(1);opacity:0}}@keyframes vt-hue-in{0%{filter:hue-rotate(-720deg) saturate(1);opacity:0}50%{filter:hue-rotate(-360deg) saturate(2);opacity:.5}to{filter:hue-rotate(0deg) saturate(1.2);opacity:1}}html.vt-style-spiral::view-transition-old(vt-morph){animation:vt-spiral-out .7s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-spiral::view-transition-new(vt-morph){animation:vt-spiral-in .7s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-spiral-out{to{transform:rotate(540deg) scale(0);opacity:0}}@keyframes vt-spiral-in{0%{transform:rotate(-540deg) scale(0);opacity:0}}html.vt-style-flash::view-transition-old(vt-morph){animation:vt-flash-out .35s ease-in forwards}html.vt-style-flash::view-transition-new(vt-morph){animation:vt-flash-in .35s ease-out .25s backwards}@keyframes vt-flash-out{0%{filter:brightness(1)}80%{filter:brightness(8);opacity:1}to{filter:brightness(8);opacity:0}}@keyframes vt-flash-in{0%{filter:brightness(8);opacity:0}20%{filter:brightness(8);opacity:1}to{filter:brightness(1);opacity:1}}html.vt-style-smear::view-transition-old(vt-morph){animation:vt-smear-out .56s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-smear::view-transition-new(vt-morph){animation:vt-smear-in .56s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-smear-out{0%{transform:translate(0) scaleX(1);filter:blur(0)}50%{transform:translate(-40%) scaleX(1.6);filter:blur(18px)}to{transform:translate(-100%) scaleX(.4);filter:blur(0);opacity:0}}@keyframes vt-smear-in{0%{transform:translate(100%) scaleX(.4);filter:blur(0);opacity:0}50%{transform:translate(40%) scaleX(1.6);filter:blur(18px);opacity:1}to{transform:translate(0) scaleX(1);filter:blur(0)}}html.vt-style-pixelate::view-transition-old(vt-morph){animation:vt-pix-out .6s steps(20,end) forwards}html.vt-style-pixelate::view-transition-new(vt-morph){animation:vt-pix-in .6s steps(20,end) forwards}@keyframes vt-pix-out{to{clip-path:inset(0 100% 0 0)}}@keyframes vt-pix-in{0%{clip-path:inset(0 0 0 100%)}}html.vt-style-pinch::view-transition-old(vt-morph){animation:vt-pinch-out .46s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-pinch::view-transition-new(vt-morph){animation:vt-pinch-in .46s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-pinch-out{to{transform:scaleY(.005) scaleX(1.2)}}@keyframes vt-pinch-in{0%{transform:scaleY(.005) scaleX(1.2)}}html.vt-style-tear::view-transition-old(vt-morph){animation:vt-tear-out .6s cubic-bezier(.65,0,.35,1) forwards}html.vt-style-tear::view-transition-new(vt-morph){animation:vt-tear-in .6s cubic-bezier(.65,0,.35,1) forwards}@keyframes vt-tear-out{0%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 0,0 100%);transform:translate(-30%,-10%) rotate(-3deg);opacity:0}}@keyframes vt-tear-in{0%{clip-path:polygon(100% 100%,0 100%,0 100%,100% 100%);transform:translate(30%,10%) rotate(3deg);opacity:0}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translate(0) rotate(0);opacity:1}}html.vt-style-shake::view-transition-old(vt-morph){animation:vt-shake-out .48s steps(12) forwards}html.vt-style-shake::view-transition-new(vt-morph){animation:vt-shake-in .48s steps(12) forwards}@keyframes vt-shake-out{0%{transform:translate(0)}10%{transform:translate(-3%,2%) rotate(-1deg)}20%{transform:translate(3%,-2%) rotate(1deg)}30%{transform:translate(-4%,1%) rotate(-2deg)}40%{transform:translate(4%,-1%) rotate(2deg)}50%{transform:translate(-3%,3%) rotate(-1deg);opacity:.7}70%{transform:translate(2%,-3%) rotate(1deg);opacity:.4}to{transform:translate(0);opacity:0}}@keyframes vt-shake-in{0%{transform:translate(0);opacity:0}30%{transform:translate(4%,-2%) rotate(2deg);opacity:.5}50%{transform:translate(-3%,3%) rotate(-1deg);opacity:.7}70%{transform:translate(2%,-1%) rotate(1deg);opacity:.85}90%{transform:translate(-1%,1%) rotate(-.5deg)}to{transform:translate(0);opacity:1}}html.vt-style-origami::view-transition-old(vt-morph){animation:vt-origami-out .7s cubic-bezier(.65,0,.35,1) forwards;transform-origin:center top}html.vt-style-origami::view-transition-new(vt-morph){animation:vt-origami-in .7s cubic-bezier(.65,0,.35,1) forwards;transform-origin:center bottom}@keyframes vt-origami-out{0%{transform:perspective(900px) rotateX(0)}33%{transform:perspective(900px) rotateX(-30deg)}66%{transform:perspective(900px) rotateX(-60deg)}to{transform:perspective(900px) rotateX(-90deg);opacity:0}}@keyframes vt-origami-in{0%{transform:perspective(900px) rotateX(90deg);opacity:0}33%{transform:perspective(900px) rotateX(60deg)}66%{transform:perspective(900px) rotateX(30deg)}to{transform:perspective(900px) rotateX(0);opacity:1}}html.vt-style-iris-tl::view-transition-old(vt-morph){animation:vt-fade .28s ease-out forwards}html.vt-style-iris-tl::view-transition-new(vt-morph){animation:vt-iris-tl .72s cubic-bezier(.22,1,.36,1) forwards}@keyframes vt-iris-tl{0%{clip-path:circle(0% at 0 0)}to{clip-path:circle(141% at 0 0)}}html.vt-style-invert::view-transition-old(vt-morph){animation:vt-invert-out .52s ease-in-out forwards}html.vt-style-invert::view-transition-new(vt-morph){animation:vt-invert-in .52s ease-in-out forwards}@keyframes vt-invert-out{0%{filter:invert(0)}50%{filter:invert(1) hue-rotate(180deg);opacity:1}to{filter:invert(1) hue-rotate(180deg);opacity:0}}@keyframes vt-invert-in{0%{filter:invert(1) hue-rotate(180deg);opacity:0}50%{filter:invert(1) hue-rotate(180deg);opacity:1}to{filter:invert(0);opacity:1}}@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation-duration:.001ms!important}}
