html:has(.intro){--bg:#fff;--surface:#f3f5f6;--border:#0000000f;--nav-bg:#fffc;--text:#000;--body:#3b4247;--muted:#535b60;--faint:#8c9499;--line:#e3e6e8;--panel:#000;--panel-text:#fff;--panel-muted:#a3abb0;--panel-line:#ffffff1a;--btn-bg:#000;--btn-text:#fff;--win:#fff;--win-bar:#f3f5f6;--win-line:#e3e6e8;--code:#f3f5f6;--sel:#2f6bff;--pill-dev-bg:#000;--pill-soon-bg:#f3f5f6;background:var(--bg);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html[data-theme=dark]:has(.intro){--bg:#000;--surface:#101314;--border:#ffffff14;--nav-bg:#101314cc;--text:#fff;--body:#c7cdd1;--muted:#8f979c;--faint:#5e666b;--line:#23282b;--panel:#101314;--panel-text:#fff;--panel-muted:#8f979c;--panel-line:#ffffff17;--btn-bg:#9bddfe;--btn-text:#000;--win:#15191b;--win-bar:#1d2224;--win-line:#2a3033;--code:#1d2224;--pill-dev-bg:#ffffff14;--pill-soon-bg:#ffffff0d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.intro{--font-display:var(--font-unbounded), var(--font-inter), sans-serif;--font-text:var(--font-inter), "Helvetica Neue", Helvetica, sans-serif;background:var(--bg);color:var(--text);font-family:var(--font-text);overflow-x:clip}@layer base{.intro a,.intro a:hover{color:inherit;border-bottom:0}.intro .doc a{text-underline-offset:4px;-webkit-text-decoration:underline #9bddfe;text-decoration:underline #9bddfe;text-decoration-thickness:2px}.intro .doc a:hover{text-decoration-color:currentColor}.intro strong{color:var(--text);font-weight:600}.intro code{color:var(--text);overflow-wrap:anywhere;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.86em}}.intro ::selection{color:#000;background:#9bddfe99}.intro :focus-visible{outline-offset:3px;border-radius:6px;outline:2px solid #9bddfe}.display{font-family:var(--font-display);letter-spacing:-.02em;font-weight:700}.label{letter-spacing:.06em;text-transform:uppercase;font-size:11.5px;font-weight:700}.code{font-family:ui-monospace,SF Mono,Menlo,monospace}.ic{border-radius:23%;flex:none;justify-content:center;align-items:center;transition:scale .6s cubic-bezier(.34,1.56,.64,1),rotate .6s cubic-bezier(.34,1.56,.64,1),filter .6s;display:inline-flex;position:relative;box-shadow:inset 0 1.5px #ffffff8c,inset 0 -10px 18px #00000029,0 1px 2px #0000002e,0 24px 48px -20px #00000080}.ic:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(#ffffff52,#fff0 46%);position:absolute;inset:0}.ic>svg{z-index:1;width:58%;height:58%;position:relative}a:hover>.ic,.ic.hoverable:hover{rotate:-5deg;scale:1.08}.ic-image{background:#8fb4ec;overflow:hidden}.ic-image>img{z-index:0;position:relative}.ic-mark{background:linear-gradient(160deg,#fff,#e6e2dc)}.ic-blue{background:linear-gradient(160deg,#77a0ff,#2343d4)}.ic-green{background:linear-gradient(160deg,#52e09f,#0b8652)}.ic-amber{background:linear-gradient(160deg,#ffc67d,#ec661c)}.ic-violet{background:linear-gradient(160deg,#b9a2ff,#5b2bd6)}.loader{z-index:60;background:var(--bg);color:var(--text);pointer-events:none;justify-content:center;align-items:center;animation:.9s cubic-bezier(.76,0,.24,1) 1.7s both loader-wipe;display:flex;position:fixed;inset:0}.loader-part{animation:.45s ease-in both loader-in,.4s ease-out both loader-out;animation-delay:calc(.2s + var(--i) * .18s), calc(1.25s + var(--i) * 60ms)}@keyframes loader-wipe{to{clip-path:inset(0 0 100%);visibility:hidden}}@keyframes loader-in{0%{opacity:0;filter:blur(6px)}}@keyframes loader-out{to{opacity:0;filter:blur(6px)}}.drop{animation:2s cubic-bezier(.16,1,.3,1) both drop}@keyframes drop{0%{opacity:0;transform:translateY(-340px)rotate(15deg)}25%{opacity:1}to{opacity:1;transform:none}}.float{animation:6s ease-in-out infinite float}@keyframes float{50%{translate:0 -12px}}.rise{animation:1.1s cubic-bezier(.2,.8,.2,1) both rise}@keyframes rise{0%{translate:0 110%}}.fade{animation:1s both fade}@keyframes fade{0%{opacity:0;translate:0 14px}}.inflate{cursor:default;display:inline-block}.inflate .ch{transition:scale .7s cubic-bezier(.34,1.56,.64,1),rotate .7s cubic-bezier(.34,1.56,.64,1),translate .7s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(var(--i) * 22ms);display:inline-block}.inflate:hover .ch{scale:1.14;rotate:var(--r);translate:0 -.04em}.roll{flex-direction:column;height:1.3em;line-height:1.3;display:inline-flex;overflow:hidden}.roll>span{transition:translate .45s cubic-bezier(.65,0,.35,1)}a:hover .roll>span,button:hover .roll>span{translate:0 -100%}.slot{vertical-align:-.1em;border-radius:24%;width:.92em;height:.92em;margin:0 .06em;transition:box-shadow .6s;display:inline-block;position:relative}.slot.is-empty{box-shadow:inset 0 0 0 2px var(--line)}.slot>.ic{z-index:5;border-radius:24%;width:100%;height:100%;transition:transform 1.5s cubic-bezier(.65,0,.35,1),filter .6s;position:absolute;inset:0}.wob-a{animation:1.5s ease-in-out both wob-a}.wob-b{animation:1.5s ease-in-out both wob-b}@keyframes wob-a{50%{rotate:12deg}}@keyframes wob-b{50%{rotate:-12deg}}.gcard{transition:box-shadow .5s}.gcard:hover{box-shadow:0 30px 60px -30px #00000059}.card-well{border-radius:23%;transition:box-shadow .6s}.card-well.is-empty{box-shadow:inset 0 0 0 2px var(--line)}.feature-card,.more-card{transition:translate .5s cubic-bezier(.34,1.56,.64,1),box-shadow .5s}.feature-card:hover{translate:0 -6px;box-shadow:0 30px 60px -30px #0000004d}.more-card:hover{translate:0 -4px}.screen{opacity:0;transition:opacity .5s,translate .6s cubic-bezier(.2,.8,.2,1);position:absolute;inset:0;translate:0 18px}.screen.is-active{opacity:1;translate:0}.step-body{transition:opacity .4s}.mark-story.is-live [data-step]:not(.is-current) .step-body{opacity:.25}.type{animation:9s cubic-bezier(.5,0,.2,1) infinite both type}@keyframes type{0%{clip-path:inset(0 100% 0 0)}12%,88%{clip-path:inset(0)}to{clip-path:inset(0);opacity:0}}.dash{stroke-dasharray:6 6;animation:1.2s linear infinite dash}@keyframes dash{to{stroke-dashoffset:-24px}}.key{animation:6s infinite key}@keyframes key{0%,8%{box-shadow:0 3px 0 var(--win-line);translate:0}11%{box-shadow:0 0 0 var(--win-line);translate:0 3px}15%,to{box-shadow:0 3px 0 var(--win-line);translate:0}}.ql{animation:6s cubic-bezier(.34,1.56,.64,1) infinite both ql}@keyframes ql{0%,12%{opacity:0;scale:.7}22%,86%{opacity:1;scale:1}96%,to{opacity:0;scale:.92}}.hl{animation:6s step-end infinite hl}@keyframes hl{0%{background:var(--sel);color:#fff}33.3%,to{color:inherit;background:0 0}}.chip{animation:6s cubic-bezier(.34,1.56,.64,1) infinite both chip}@keyframes chip{0%,8%{opacity:0;translate:0 10px}16%,90%{opacity:1;translate:0}to{opacity:0}}.tabbar{transform-origin:0;animation:7s linear both tabbar}@keyframes tabbar{0%{scale:0 1}}@media (prefers-reduced-motion:reduce){.loader{display:none}.drop,.float,.rise,.fade,.type,.dash,.key,.ql,.hl,.chip,.wob-a,.wob-b,.loader-part{animation:none}.slot>.ic,.screen{transition:none}.tabbar{animation:none}}.pop{left:calc(var(--cx,480px) + var(--x) * var(--spread,1) * 1px);top:calc(var(--cy,300px) + var(--y) * var(--spread,1) * 1px);z-index:3;pointer-events:none;position:absolute;translate:-50% -50%}.pop-in{opacity:0;transform:translate(calc(var(--x) * -.7px), calc(var(--y) * -.7px)) scale(.4);transition:transform 1s cubic-bezier(.2,.9,.25,1.12),opacity .45s;transition-delay:calc(var(--dd,0) * 1s)}.is-active .pop-in{opacity:1;transform:rotate(var(--r,0deg))}.pop-float{animation:6s ease-in-out infinite float;animation-delay:calc(var(--dd,0) * -3s)}@media (max-width:767px){.pop{--spread:.78}}@media (prefers-reduced-motion:reduce){.pop-in{transition:none}.pop-float{animation:none}}.b-ghost{opacity:.4}:is(.is-active,.xp-play) .b-ghost{animation:5s ease-in-out infinite both b-ghost}@keyframes b-ghost{0%,to{opacity:.15}40%,70%{opacity:.45}}:is(.is-active,.xp-play) .b-aligned{animation:5s cubic-bezier(.34,1.56,.64,1) infinite both b-aligned}@keyframes b-aligned{0%,30%{opacity:0;scale:.7}40%,85%{opacity:1;scale:1}to{opacity:0;scale:1}}.b-wipe{width:50%}.b-wipe-line{left:50%}:is(.is-active,.xp-play) .b-wipe{animation:6s ease-in-out infinite b-wipe}:is(.is-active,.xp-play) .b-wipe-line{animation:6s ease-in-out infinite b-wipe-line}@keyframes b-wipe{0%,to{width:22%}50%{width:78%}}@keyframes b-wipe-line{0%,to{left:22%}50%{left:78%}}.b-line{stroke-dasharray:1 1;stroke-dashoffset:0}:is(.is-active,.xp-play) .b-line{animation:1.6s cubic-bezier(.5,0,.2,1) .3s both b-line}@keyframes b-line{0%{stroke-dashoffset:1px}}:is(.is-active,.xp-play) .b-bar{transform-origin:0;animation:1.4s cubic-bezier(.2,.8,.2,1) .2s both b-bar}@keyframes b-bar{0%{scale:0 1}}@media (prefers-reduced-motion:reduce){:is(.is-active,.xp-play) :is(.b-ghost,.b-aligned,.b-wipe,.b-wipe-line,.b-line,.b-bar,.b-frame){animation:none}}.b-frame{opacity:0}.b-frame:last-child{opacity:1}:is(.is-active,.xp-play) .b-frame{animation:6s step-end infinite b-frame;animation-delay:calc(var(--i) * .6s - 6s)}@keyframes b-frame{0%{opacity:1}10%,to{opacity:0}}:is(.is-active,.xp-play) .b-scrub{animation:6s linear infinite b-scrub}@keyframes b-scrub{0%{width:5%}to{width:100%}}.b-halo{background:radial-gradient(closest-side,#ffe60052,#ffe60000);animation:7s ease-in-out infinite xp-breathe}
