.platform{--platform-snap:cubic-bezier(.16, 1, .3, 1);--platform-ease:cubic-bezier(.9, .1, .1, .9);--platform-radius:6px;--product-radius:4px;--product-radius-s:2px;margin:0}.platform__window{isolation:isolate;height:calc(var(--rows) * var(--cell));position:relative}.platform__mat{z-index:-1;border:1px solid color-mix(in srgb, var(--color-text-primary) 10%, transparent);border-radius:var(--platform-radius);background:var(--platform-mat) center bottom / cover no-repeat;--color-hills-warm:color-mix(in oklab, var(--color-iris-400), var(--color-blue-400));--color-hills-mid:var(--color-iris-500);--color-hills-cool:var(--color-red-300);--color-hills-near:var(--color-iris-800);--color-hills-sun:var(--color-yellow-100);position:absolute;inset:0;overflow:hidden}.platform__mat .hills{--hills-sky:color-mix(in oklab, var(--color-hills-near) 16%, var(--color-background));background:0 0}:root.dark .platform__mat{--color-hills-warm:#7199ff;--color-hills-mid:#8056ff;--color-hills-cool:#fa9199;--color-hills-near:#4400a2}.platform__plane{position:absolute;inset:0}.platform__at{top:calc(var(--y) * var(--cell));left:calc(var(--x) * var(--cell));width:calc(var(--w) * var(--cell));height:calc(var(--h) * var(--cell));position:absolute}.platform__strip{z-index:2;top:0;right:var(--cell);left:var(--cell);height:calc(var(--strip) * var(--cell));justify-content:space-between;align-items:center;display:flex;position:absolute}.platform__crumbs{color:var(--color-text-secondary);white-space:nowrap;align-items:center;gap:6px;font-size:13px;line-height:20px;display:inline-flex}.platform__crumbs svg{width:16px;height:16px}.platform__crumbs .platform__sep{width:12px;height:12px;color:var(--color-text-faint);margin-inline:2px}.platform__crumbs b{color:var(--color-text-primary);font-weight:400}.platform__links{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.platform__link,.platform__pulse{fill:none;stroke-width:1px}.platform__link{stroke:color-mix(in srgb, var(--color-text-primary) 22%, transparent);stroke-dasharray:3 4;transition:stroke .4s var(--platform-snap)}[data-on]>.platform__link{stroke:color-mix(in srgb, var(--color-text-primary) 55%, transparent);stroke-dasharray:none}.platform__pulse{stroke:var(--product-accent);stroke-width:2px;stroke-dasharray:.25 1.25;stroke-linecap:round;opacity:0}.platform__fence{border:1px dashed color-mix(in srgb, var(--product-accent) 70%, transparent);border-radius:var(--product-radius);opacity:0;transition:opacity .5s var(--platform-snap), scale .7s var(--platform-snap);scale:1.02}.platform__fence[data-on]{opacity:1;scale:1}.platform__fence>span{border-radius:var(--product-radius-s);background:var(--product-accent);height:20px;color:var(--color-background);font-family:var(--font-neue-montreal-mono), monospace;white-space:nowrap;align-items:center;gap:5px;padding:0 7px 0 5px;font-size:11px;line-height:16px;display:inline-flex;position:absolute;top:-10px;left:14px}.platform__fence svg{width:12px;height:12px}.platform__node{--node-pad:12px;--node-gap:10px;-moz-column-gap:var(--node-gap);align-content:center;column-gap:var(--node-gap);padding:0 var(--node-pad);border:1px solid var(--product-line-strong);border-radius:var(--product-radius);background:var(--product-surface);box-shadow:0 1px 1px color-mix(in srgb, var(--color-black) 5%, transparent), 0 10px 12px color-mix(in srgb, var(--color-black) 22%, transparent);grid-template-rows:auto auto;grid-template-columns:auto minmax(0,1fr) auto;row-gap:3px;display:grid}:root.dark .platform__node{border-color:color-mix(in srgb, var(--color-text-primary) 12%, var(--color-background));box-shadow:0 1px 1px color-mix(in srgb, var(--color-black) 30%, transparent), 0 10px 12px color-mix(in srgb, var(--color-black) 70%, transparent)}.platform__icon{width:16px;height:16px;color:var(--product-text-2);grid-row:1/span 2;align-self:center}.platform__name{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:500;line-height:18px;overflow:hidden}.platform__type{color:var(--product-text-2);text-overflow:ellipsis;white-space:nowrap;grid-column:2/-1;font-size:12px;line-height:16px;overflow:hidden}.platform__node .product-badge{border-radius:var(--product-radius-s);transition:opacity .3s var(--platform-snap)}.platform .platform__node:not([data-on]){background:color-mix(in srgb, var(--product-surface) 78%, transparent);box-shadow:none;color:var(--product-faint);border-style:dashed}.platform__node:not([data-on]) :is(.platform__icon,.platform__type){color:var(--product-faint)}.platform__node:not([data-on]) .product-badge{opacity:0}.platform__node[data-target]{border-color:var(--product-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--product-accent) 14%, transparent), 0 10px 24px -14px color-mix(in srgb, var(--color-black) 22%, transparent)}:root.dark .platform__node[data-target]{border-color:var(--product-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--product-accent) 14%, transparent), 0 10px 24px -14px color-mix(in srgb, var(--color-black) 70%, transparent)}.platform__node[data-target] .platform__icon{color:var(--product-accent)}.platform__new{top:-8px;left:calc(var(--node-pad) + 16px + var(--node-gap) - 2px);border-radius:var(--product-radius-s);background:color-mix(in srgb, var(--product-accent) 12%, var(--product-surface));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--product-accent) 34%, transparent);color:var(--product-accent);padding:0 5px;font-size:11px;font-weight:500;line-height:16px;position:absolute}:root.dark .platform__new{color:color-mix(in srgb, var(--product-accent) 70%, var(--color-white))}.platform__node:not([data-on]) .platform__new{background:var(--product-surface);box-shadow:inset 0 0 0 1px var(--product-line);color:var(--product-faint)}.platform__log{border:1px solid var(--color-code-border);border-radius:var(--product-radius);background:var(--color-code-bg);box-shadow:0 10px 30px -16px color-mix(in srgb, var(--color-black) 30%, transparent);color:var(--color-code-text);flex-direction:column;display:flex;overflow:hidden}:root.dark .platform__log{box-shadow:0 10px 30px -16px color-mix(in srgb, var(--color-black) 80%, transparent)}.platform__bar{border-bottom:1px solid var(--color-code-border);height:40px;font-family:var(--font-neue-montreal-mono), monospace;white-space:nowrap;flex:none;align-items:center;gap:12px;padding:0 14px 0 16px;font-size:11px;line-height:16px;display:flex}.platform__title{color:var(--color-code-muted);text-overflow:ellipsis;overflow:hidden}.platform__status{color:var(--color-code-text);align-items:center;gap:6px;margin-left:auto;display:inline-flex}.platform__status[data-tone=ok]{color:var(--color-code-success)}.platform__status .product-icon{stroke-width:1.5px;width:12px;height:12px}.platform__lines{min-height:0;font-family:var(--font-neue-montreal-mono), monospace;flex:1;margin:0;padding:12px 0;font-size:12px;line-height:20px;list-style:none;overflow:hidden}.platform__lines li{text-indent:-4ch;overflow-wrap:anywhere;padding:1px 16px 1px calc(16px + 4ch)}.platform__lines li[data-active]{background:color-mix(in srgb, var(--color-code-text) 7%, transparent);box-shadow:inset 2px 0 var(--product-accent)}.platform__lines li:last-child:not([data-active]){color:var(--color-code-success)}.platform__tada{font:inherit;line-height:inherit;text-indent:0;cursor:pointer;background:0 0;border:0;padding:0;display:inline-block;position:relative}.platform__tada-glyph{transition:scale .16s var(--platform-snap);display:inline-block}.platform__tada:hover .platform__tada-glyph{scale:1.15}.platform__burst{pointer-events:none;position:absolute;top:50%;left:50%}.platform__burst i{background:var(--c);opacity:0;border-radius:1px;width:5px;height:3px;margin:-1.5px -2.5px;position:absolute}@media (prefers-reduced-motion:no-preference){.platform__tada[data-pop="0"] .platform__tada-glyph{animation:.56s cubic-bezier(.2,1.6,.4,1) platform-pop-left}.platform__tada[data-pop="1"] .platform__tada-glyph{animation:.56s cubic-bezier(.2,1.6,.4,1) platform-pop-right}.platform__burst i{animation:.9s cubic-bezier(.15,.7,.3,1) forwards platform-confetti}}@keyframes platform-pop-left{40%{rotate:-14deg;scale:1.45}}@keyframes platform-pop-right{40%{rotate:14deg;scale:1.45}}@keyframes platform-confetti{0%{opacity:1;transform:rotate(var(--a)) translateX(4px) rotate(0deg)}70%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translateX(var(--d)) translateY(10px) rotate(var(--r))}}.platform:not([data-still]) .platform__log{padding-bottom:30px}.platform:not([data-still]) .platform__lines{padding-bottom:4px}.platform__steps{z-index:2;pointer-events:none}.platform__timeline{pointer-events:auto;align-items:center;gap:10px;height:30px;padding:0 8px;display:flex;position:absolute;inset:auto 0 0}.platform__track{flex:1;gap:4px;margin:0;padding:0;list-style:none;display:flex}.platform__track li{flex:1;display:flex}.platform__mark{cursor:pointer;background:0 0;border:0;flex:1;height:24px;padding:0;position:relative}.platform__mark:before,.platform__mark:after{content:"";background:color-mix(in srgb, var(--color-code-text) 12%, transparent);transition:background-color .16s var(--platform-snap);border-radius:1px;position:absolute;inset:11px 0}.platform__mark:after{background:color-mix(in srgb, var(--color-code-text) 34%, transparent);transform:scaleX(var(--p,0));transform-origin:0;transition:transform .36s var(--platform-snap)}.platform__mark[data-at]:after{background:color-mix(in srgb, var(--color-code-text) 64%, transparent)}.platform__mark:hover:before{background:color-mix(in srgb, var(--color-code-text) 24%, transparent)}.platform__button{border-radius:var(--product-radius-s);width:22px;height:22px;color:var(--color-code-muted);cursor:pointer;transition:color .16s var(--platform-snap), background-color .16s var(--platform-snap);background:0 0;border:0;flex:none;place-items:center;padding:0;display:grid;position:relative}.platform__button:hover:not([aria-disabled]){background:color-mix(in srgb, var(--color-code-text) 8%, transparent);color:var(--color-code-text)}.platform__button[aria-disabled]{opacity:.4;cursor:default}.platform__button:after{content:"";position:absolute;inset:-1px}.platform__button .product-icon{width:12px;height:12px}.platform :is(.platform__button,.platform__mark):focus-visible{outline:1px solid var(--color-focus);outline-offset:1px}.platform__strip .platform__button{color:var(--color-text-secondary)}.platform__strip .platform__button:hover{background:color-mix(in srgb, var(--color-text-primary) 8%, transparent);color:var(--color-text-primary)}.platform__strip .platform__button:after{inset:-11px}.platform__lines[data-crop]{-webkit-mask-image:linear-gradient(#0000,#000 18px);mask-image:linear-gradient(#0000,#000 18px)}@media (prefers-reduced-motion:no-preference){.platform:not([data-built]) .platform__window{animation:platform-window-in 1.2s var(--platform-snap) .2s both}.platform:not([data-built]) .platform__node{animation:platform-rise .7s var(--platform-snap) calc(.6s + var(--n) * 70ms) both}.platform:not([data-built]) :is(.platform__links,.platform__strip){animation:platform-fade .9s var(--platform-ease) 1.2s both}.platform:not([data-built]) :is(.platform__log,.platform__steps){animation:platform-rise .8s var(--platform-snap) 1s both}.platform__lines li{animation:platform-line-in .36s var(--platform-snap)}.platform__status,.platform__strip .platform__button{animation:platform-fade .3s var(--platform-snap)}}@keyframes platform-line-in{0%{opacity:0;translate:0 4px}}.platform[data-misfit] .platform__plane{display:none}@keyframes platform-window-in{0%{clip-path:inset(100% 0 0 0 round var(--platform-radius))}to{clip-path:inset(0 0 0 0 round var(--platform-radius))}}@keyframes platform-rise{0%{opacity:0;translate:0 10px}}@keyframes platform-fade{0%{opacity:0}}.platform[data-layout=narrow] .platform__strip{right:calc(var(--cell) * .25);left:calc(var(--cell) * .25)}.platform[data-layout=narrow] .platform__node{--node-pad:8px;--node-gap:8px}.platform[data-layout=narrow] .platform__node .product-badge{gap:0;padding:3px;font-size:0}.platform[data-layout=narrow] .platform__type{font-size:11px}.platform[data-layout=narrow] .platform__fence>span{gap:4px;height:14px;padding:0 5px 0 4px;font-size:10px;line-height:14px;inset:0 auto auto 50%;translate:-50% calc(-50% - 1px)}.platform[data-layout=narrow] .platform__fence svg{width:10px;height:10px}.platform[data-layout=wide]{--platform-mat:url(/homepage/hero-mat-desktop-light.webp)}.platform[data-layout=mid]{--platform-mat:url(/homepage/hero-mat-tablet-light.webp)}.platform[data-layout=narrow]{--platform-mat:url(/homepage/hero-mat-phone-light.webp)}:root.dark .platform[data-layout=wide]{--platform-mat:url(/homepage/hero-mat-desktop-dark.webp)}:root.dark .platform[data-layout=mid]{--platform-mat:url(/homepage/hero-mat-tablet-dark.webp)}:root.dark .platform[data-layout=narrow]{--platform-mat:url(/homepage/hero-mat-phone-dark.webp)}
.hero-grid{--grid-ink:var(--color-diagram-text);--grid-minor:color-mix(in srgb, var(--grid-ink) 2.5%, transparent);--grid-major:color-mix(in srgb, var(--grid-ink) 5.5%, transparent);--grid-fine:calc(var(--cell) / 8);z-index:-1;pointer-events:none;opacity:.85;-webkit-mask-image:linear-gradient(transparent, #000 14%, #000 calc(var(--hero-window-bottom) - 2 * var(--cell)), transparent var(--hero-window-bottom)), linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);-webkit-mask-image:linear-gradient(transparent, #000 14%, #000 calc(var(--hero-window-bottom) - 2 * var(--cell)), transparent var(--hero-window-bottom)), linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);mask-image:linear-gradient(transparent, #000 14%, #000 calc(var(--hero-window-bottom) - 2 * var(--cell)), transparent var(--hero-window-bottom)), linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);-webkit-mask-composite:source-in, xor;position:absolute;inset:0;overflow:hidden;-webkit-mask-composite:source-in;mask-composite:intersect}:root.dark .hero-grid{--grid-minor:color-mix(in srgb, var(--grid-ink) 3.5%, transparent);--grid-major:color-mix(in srgb, var(--grid-ink) 8%, transparent)}.hero-grid,.hero-grid:after{background:linear-gradient(to right, var(--grid-major) 1px, transparent 1px) var(--hero-grid-x) var(--hero-grid-y) / var(--cell) var(--cell), linear-gradient(var(--grid-major) 1px, transparent 1px) var(--hero-grid-x) var(--hero-grid-y) / var(--cell) var(--cell), linear-gradient(to right, var(--grid-minor) 1px, transparent 1px) var(--hero-grid-x) var(--hero-grid-y) / var(--grid-fine) var(--grid-fine), linear-gradient(var(--grid-minor) 1px, transparent 1px) var(--hero-grid-x) var(--hero-grid-y) / var(--grid-fine) var(--grid-fine)}.hero-grid:after{--grid-minor:color-mix(in srgb, var(--grid-ink) 5%, transparent);--grid-major:color-mix(in srgb, var(--grid-ink) 11%, transparent);content:"";position:absolute;inset:0;-webkit-mask-image:radial-gradient(closest-side,#000,#0000);mask-image:radial-gradient(closest-side,#000,#0000);-webkit-mask-position:80% 30%;mask-position:80% 30%;-webkit-mask-size:44% 72%;mask-size:44% 72%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}:root.dark .hero-grid:after{--grid-minor:color-mix(in srgb, var(--grid-ink) 8%, transparent);--grid-major:color-mix(in srgb, var(--grid-ink) 17%, transparent)}@media (prefers-reduced-motion:no-preference){.hero-grid:after{animation:26s ease-in-out infinite alternate hero-grid-light}}.hero-grid[data-paused]:after{animation-play-state:paused}@keyframes hero-grid-light{0%{-webkit-mask-position:92% 18%;mask-position:92% 18%}50%{-webkit-mask-position:58% 64%;mask-position:58% 64%}to{-webkit-mask-position:8% 30%;mask-position:8% 30%}}@media (min-width:1200px){.hero-grid{-webkit-mask-image:radial-gradient(calc(.6 * (100cqi - 2 * var(--hero-left))) calc(3.5 * var(--cell)) at calc(var(--hero-left) + .62 * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + 2.75 * var(--cell)), #000, #0000009e 38%, #00000038 72%, transparent), radial-gradient(calc(5 * var(--cell)) calc(4 * var(--cell)) at calc(var(--hero-left) - .5 * var(--cell)) calc(var(--hero-window-bottom) - .5 * var(--cell)), #00000080, #0003 55%, transparent);-webkit-mask-image:radial-gradient(calc(.6 * (100cqi - 2 * var(--hero-left))) calc(3.5 * var(--cell)) at calc(var(--hero-left) + .62 * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + 2.75 * var(--cell)), #000, #0000009e 38%, #00000038 72%, transparent), radial-gradient(calc(5 * var(--cell)) calc(4 * var(--cell)) at calc(var(--hero-left) - .5 * var(--cell)) calc(var(--hero-window-bottom) - .5 * var(--cell)), #00000080, #0003 55%, transparent);mask-image:radial-gradient(calc(.6 * (100cqi - 2 * var(--hero-left))) calc(3.5 * var(--cell)) at calc(var(--hero-left) + .62 * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + 2.75 * var(--cell)), #000, #0000009e 38%, #00000038 72%, transparent), radial-gradient(calc(5 * var(--cell)) calc(4 * var(--cell)) at calc(var(--hero-left) - .5 * var(--cell)) calc(var(--hero-window-bottom) - .5 * var(--cell)), #00000080, #0003 55%, transparent);-webkit-mask-composite:source-over;-webkit-mask-composite:source-over;mask-composite:add}.hero-grid:after{-webkit-mask-image:radial-gradient(calc(.24 * (100cqi - 2 * var(--hero-left))) calc(2.75 * var(--cell)) at calc(var(--hero-left) + var(--hero-light-x) * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + var(--hero-light-y) * var(--cell)), #000000bf, transparent);-webkit-mask-image:radial-gradient(calc(.24 * (100cqi - 2 * var(--hero-left))) calc(2.75 * var(--cell)) at calc(var(--hero-left) + var(--hero-light-x) * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + var(--hero-light-y) * var(--cell)), #000000bf, transparent);mask-image:radial-gradient(calc(.24 * (100cqi - 2 * var(--hero-left))) calc(2.75 * var(--cell)) at calc(var(--hero-left) + var(--hero-light-x) * (100% - 2 * var(--hero-left))) calc(var(--hero-top) + var(--hero-light-y) * var(--cell)), #000000bf, transparent);animation:none;-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% 100%;mask-size:100% 100%}}@property --hero-light-x{syntax:"<number>";inherits:false;initial-value:.62}@property --hero-light-y{syntax:"<number>";inherits:false;initial-value:2.75}@media (min-width:1200px) and (prefers-reduced-motion:no-preference){.hero-grid:after{animation:24s ease-in-out infinite alternate hero-grid-light-fill}}@keyframes hero-grid-light-fill{0%{--hero-light-x:.7;--hero-light-y:2.25}50%{--hero-light-x:.56;--hero-light-y:3}to{--hero-light-x:.64;--hero-light-y:2.5}}