@charset "UTF-8";.sidebar{display:flex;flex-shrink:0;flex-direction:column}.sidebar-nav{position:absolute;top:0;left:0;overflow-y:auto;width:100%;height:100%;padding-top:0;padding-right:0;padding-bottom:var(--margin-m);padding-left:var(--margin-s)}@media(min-width:900px){.sidebar-nav{padding-top:var(--margin-s);padding-right:var(--margin-m);padding-bottom:var(--margin-m);padding-left:var(--margin-m)}}.sidebar-nav ul,.sidebar-nav li{overflow-y:hidden}.sidebar-nav ul>li>ul{position:relative}.sidebar-nav ul>li>ul li:last-child{margin-bottom:var(--margin-xxxs)}.sidebar-nav ul li{position:relative;width:100%;list-style:none}.sidebar-nav ul>li:not(.is-active){color:var(--hex-fg-4)}.sidebar-nav ul>li.is-active:has(li.is-active){color:var(--hex-fg-4)}.sidebar-nav li.is-active:not(:has(li.is-active)){color:var(--hex-current-1)}.sidebar-nav ul>li:not(.is-active):hover,.sidebar-nav li.is-active:has(li.is-active)>a:hover,.sidebar-nav ul.is-active ul:not(:has(li.is-active ul))>li:not(.is-active):hover{color:var(--hex-fg-1)}.sidebar-nav ul.is-active ul:not(:has(li.is-active ul))>li:not(.is-active){color:var(--hex-fg-2)}.sidebar-nav li:not(.is-active)>ul{height:0px}.sidebar-nav ul li a{display:block;position:relative;z-index:1;text-decoration:none;min-height:1.5rem;line-height:1.5rem}.sidebar-nav ul>li>ul:before{content:"";position:absolute;top:0;bottom:.25em;left:0;width:1px;background-color:var(--hex-fg-2);opacity:.35}.sidebar-nav ul>li>ul>li>ul:before,.sidebar-nav ul ul li ul li:before,.sidebar-nav ul ul li ul li:has(ul):after{left:var(--margin-xs)}.sidebar-nav ul>li>ul>li>ul>li>ul:before,.sidebar-nav ul ul li ul li ul li:before,.sidebar-nav ul ul li ul li ul li:has(ul):after{left:calc(var(--margin-xs) * 2)}.sidebar-nav ul ul li a{padding-left:var(--margin-xs);text-transform:none}.sidebar-nav ul ul li ul li a{padding-left:calc(var(--margin-xs) * 2)}.sidebar-nav ul ul li ul li ul li a{padding-left:calc(var(--margin-xs) * 3)}.sidebar-nav ul ul li:before{content:"";opacity:0;display:block;position:absolute;top:0;bottom:0;left:0;width:1px;background-color:currentColor;transform-origin:0px}.sidebar-nav ul ul li:has(ul):after{content:"";opacity:1;display:block;position:absolute;z-index:10;top:.75rem;bottom:0;left:0;width:4px;height:1px;margin-left:1px;margin-top:1px;background-color:currentColor;transform-origin:0px;opacity:.4}.sidebar-nav ul ul li:has(ul):hover:after,.sidebar-nav ul ul li:has(ul).is-active:after{opacity:1}.sidebar-nav ul ul li:hover,.sidebar-nav ul ul li:hover:before,.sidebar-nav ul ul li.is-active,.sidebar-nav ul ul li.is-active:before{opacity:1}.sidebar-nav ul ul li.is-active:has(li.is-active):before{opacity:0}.code-preview{overflow:hidden;position:relative;z-index:1;width:100%;margin-bottom:var(--margin-m);background-color:var(--hex-current-8);border-radius:var(--br-s)}@media(min-width:900px){.code-preview{margin-top:calc(var(--margin-xxxl) - var(--margin-s));margin-bottom:var(--margin-xxxl)}}.code-preview-content{position:relative;z-index:1}.code-preview-content header{position:relative;display:flex;justify-content:space-between;flex-wrap:nowrap;align-items:center;width:100%;height:calc(3rem + 2px);padding-left:var(--margin-s);padding-right:var(--margin-s);background-color:var(--hex-current-7)}.code-preview-title{flex-shrink:1;flex-grow:0;width:100%;overflow:hidden}.code-preview-content header nav{display:flex;flex-shrink:0;flex-grow:1;height:100%}.code-preview-title h2{overflow:hidden;display:block;width:100%;margin:0;white-space:nowrap;text-overflow:ellipsis;color:inherit}.code-preview-content header button{display:flex;align-items:center;cursor:pointer;position:relative;color:var(--hex-current-2);margin-left:var(--margin-m);border-bottom:1px solid transparent;background-color:transparent}.code-preview-content header button:has(.icon){margin-left:var(--margin-xs);margin-right:-.5rem}.code-preview-content button:hover{color:var(--hex-current-1)}.code-preview-content button.is-active{color:var(--hex-current-1);border-color:var(--hex-current-1)}@media(max-width:899px){.code-preview-content button span{display:none}}.code-editor pre:not(:last-child){margin-bottom:0}.code-editor pre{display:none;margin:0}.code-editor pre.is-active{display:block}.code-editor pre code{display:block;border-radius:0;background-color:transparent;padding:var(--margin-m)}body[data-template*=docs] #docs-versions{display:block}@media(max-width:899px){body[data-template*=docs] #site-header{position:relative}}.docs-info .heading-anchor:target{scroll-margin-top:calc(var(--site-header-height) + var(--margin-m))}.heading-anchor a{display:inline;color:inherit;text-decoration:none;position:relative}@media(pointer:fine)and (min-width:900px){.heading-anchor a:before{content:"#";position:absolute;left:-1em;color:transparent}.heading-anchor a:hover:before{color:var(--hex-current-2)}.notice .heading-anchor a:before{display:none}}.docs-info a.heading-anchor{scroll-margin-top:100px}.docs-info a::selection{background-color:var(--hex-current-1);color:var(--hex-current-6)}.docs-info .code-preview *::selection{background-color:var(--hex-current-1);color:var(--hex-current-6)}#docs{position:relative;justify-content:space-between;scrollbar-gutter:stable}#docs-nav{position:sticky;z-index:102;top:0;width:100%;background-color:var(--hex-bg-1)}#docs-nav-menu{height:var(--site-header-height)}@media(min-width:900px){#docs{padding-top:var(--site-header-height)}#docs-nav{z-index:105;max-width:1500px;height:0px;margin-top:calc(var(--site-header-height) * -1);background-color:transparent}#docs-nav-menu{position:relative;justify-content:space-between;left:calc(var(--docs-sidebar-width) + var(--margin-xxxl));width:calc(100% - (var(--docs-sidebar-width) + var(--margin-xxxl) + var(--site-header-height)));padding-left:0;padding-right:0}#search-nav{width:100%}#toggle-search{width:6rem;padding-left:0}#toggle-sidebar{display:none}#docs-sidebar .sidebar-nav{padding-right:0}#docs-sidebar .sidebar-nav>ul{padding-bottom:calc(var(--docs-demo-height) * .6)}}@media(min-width:1200px){#docs-nav-menu{left:var(--docs-sidebar-width);width:var(--docs-demos-width);height:calc(var(--site-header-height) - var(--docs-demo-gap) * 2 - 1px);margin-top:var(--docs-demo-gap);background-color:color-mix(in srgb,var(--hex-bg-2) 65%,transparent);backdrop-filter:blur(1rem);-webkit-backdrop-filter:blur(1rem);border-radius:var(--docs-demo-br);box-shadow:0 1px 0 0 var(--hex-fg-7)}#docs-nav-menu:after{content:"";position:absolute;display:block;bottom:calc(100% - var(--docs-demo-br));left:0;width:100%;height:496px;background-color:var(--hex-bg-1);mask-image:linear-gradient(#000,#000),radial-gradient(circle at bottom right,transparent calc(var(--docs-demo-br) - 1px),#000 var(--docs-demo-br)),radial-gradient(circle at bottom left,transparent calc(var(--docs-demo-br) - 1px),#000 var(--docs-demo-br));mask-size:100% calc(100% - var(--docs-demo-br)),var(--docs-demo-br) var(--docs-demo-br),var(--docs-demo-br) var(--docs-demo-br);mask-position:top left,bottom left,bottom right;mask-repeat:no-repeat}#search-nav{padding-left:var(--margin-s);padding-right:var(--margin-xs)}#toggle-search{flex-direction:row-reverse;width:100%}}#docs-sidebar{overscroll-behavior:contain;left:0;width:var(--docs-sidebar-width);position:sticky;top:var(--site-header-height);height:calc(100dvh - var(--site-header-height))}@media(max-width:899px){#toggle-search span{display:none}#toggle-sidebar{padding-left:var(--margin-xxxs)}#docs-sidebar{overscroll-behavior:contain;position:sticky;z-index:2;top:var(--site-header-height);left:0;bottom:0;height:calc(100dvh - var(--site-header-height));padding-bottom:0;transform:translate(-100%);background-color:var(--hex-bg-1)}#docs-sidebar .sidebar-nav>ul{padding-bottom:calc(var(--site-header-height) + var(--margin-m))}}#docs-info{opacity:.001;position:relative;width:100%}#docs-info #site-footer{padding-left:0;padding-right:0;padding-bottom:0;margin-top:3.5rem}#docs-info #site-footer-content{padding-top:var(--margin-xl)}@media(max-width:899px){#docs-info{flex-shrink:0;margin-left:calc(-1 * var(--docs-sidebar-width))}}@media(min-width:900px){#docs-info{left:0;width:calc(100% - var(--docs-sidebar-width))}}@media(min-width:1200px){#docs-info{width:calc(100% - var(--docs-sidebar-width) - var(--docs-demos-width))}}#docs-info pre{position:relative}.docs-info{padding-top:var(--margin-s);padding-left:var(--margin-s);padding-right:var(--margin-s);padding-bottom:calc(var(--margin-m) + var(--docs-demo-height))}@media(min-width:900px){.docs-info{padding-top:calc(var(--margin-xxxl) - var(--margin-xxs));padding-right:var(--margin-xxxl);padding-left:var(--margin-xxxl);padding-bottom:calc(var(--margin-xxxl))}}@media(min-width:1200px){.docs-info{padding-top:calc(var(--margin-xxxl) - var(--margin-xxs))}}.docs-info-content{position:relative;padding-top:0;margin-bottom:var(--margin-xxl)}.docs-info-content .docs-breadcrumb{display:flex;justify-content:space-between;margin-bottom:var(--margin-m);margin-left:-.125em}.docs-info-content .docs-breadcrumb p{margin-bottom:0;font-weight:500;font-size:inherit;color:var(--hex-current-2)}.docs-breadcrumb p a{text-decoration:none;margin-right:0;margin-left:0;padding:.25em;border-radius:var(--br-s);background-color:transparent;line-height:1}.docs-breadcrumb-arrow{position:relative;top:-.25em;display:inline-block;opacity:1;margin-left:.5em;margin-right:.5em;font-size:.5em;font-size:.425rem;line-height:0;text-transform:uppercase}#docs-demos-container{z-index:105}@media(min-width:1200px){#docs-demos-container{position:fixed;z-index:104;left:50%;transform:translate(-50%)}}#docs-demos{z-index:1;overscroll-behavior:contain;overflow-y:scroll;user-select:none;-webkit-user-select:none;transition:opacity .125s ease-out}.demos-placeholder{position:sticky;overflow:visible;pointer-events:none;z-index:10;left:var(--margin-m);right:var(--margin-m);top:0;height:0px}#docs-demos.is-loading{pointer-events:none;overflow-y:hidden}#docs-demos.is-scrolling{transition:none}#docs-demos.is-scrolling .docs-demo{pointer-events:none}#docs-demos::-webkit-scrollbar{display:none}@media(max-width:1199px){#docs-demos{overflow:hidden;position:fixed;bottom:0;left:0;transform-origin:100% 100% 0px;z-index:999;width:var(--docs-demos-width);height:var(--docs-demo-height);border-radius:var(--br-l)}#docs-demos.is-small .docs-demo{pointer-events:none}.is-small .animejs-onscroll-debug,.is-small .animejs-onscroll-debug+div{opacity:0}}@media(min-width:1200px){#docs-demos-scroll-container{position:absolute;left:var(--docs-sidebar-width);top:0;width:var(--docs-demos-width);height:100dvh;background-color:var(--hex-bg-2)}#docs-demos{overflow-x:hidden;overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;overscroll-behavior:contain;position:absolute;left:var(--docs-sidebar-width);top:0;width:var(--docs-demos-width);height:100dvh;padding-top:var(--site-header-height)}}.notif{opacity:.65}.badge{position:relative;display:inline-block;top:0;left:0;height:1.25rem;padding:var(--margin-xxxs);font-family:var(--font-code);font-size:var(--text-xxs);font-weight:700;line-height:1;text-transform:uppercase;color:var(--hex-current-1);background-color:var(--hex-current-6);border-radius:var(--br-xs)}.docs-demo .badge{background-color:var(--hex-current-4)}.docs-nav-item:not(.is-active) .badge,.docs-demo:not(.is-active) .badge{color:var(--hex-fg-4);background-color:var(--hex-bg-4);border-radius:var(--br-xs)}.docs-nav-item:not(.is-active) a:hover>.badge{color:var(--hex-fg-2);background-color:var(--hex-bg-6)}.badge+.badge{margin-left:0;margin-right:0}h1 .badge{top:-1.5rem}#docs-search-container{pointer-events:none;position:fixed;z-index:106;display:flex;justify-content:center;align-items:center;top:0;left:0;right:0;height:var(--visual-viewport-height);transition:height .25s ease-out}#docs-search-modal{pointer-events:none;opacity:0;position:relative;z-index:2;width:calc(100% - var(--margin-s) * 2);max-width:30rem;height:calc(var(--visual-viewport-height) - var(--site-header-height) * 2);max-height:calc((var(--site-header-height) + 1px) * 7 + var(--margin-s) - 1px)}@media(max-width:899px){#docs-search-modal{max-height:calc((4rem + 1px) * 4 + var(--site-header-height) + var(--margin-xxs))}.docs-search-result{height:4rem}}#docs-search{overflow:hidden;display:flex;flex-direction:column;position:relative;width:100%;max-height:100%;padding-left:var(--margin-xs);padding-right:var(--margin-xs);border-radius:var(--br-l);box-shadow:0 0 0 1px var(--hex-bg-4);background-color:var(--hex-bg-2)}#docs-search-bar{position:sticky;z-index:2;top:0;padding-left:0;padding-right:0;background-color:var(--hex-bg-2)}#docs-search-bar:after{content:"";display:block;position:absolute;bottom:-1px;left:0;right:0;border-bottom:1px solid var(--hex-bg-1)}#docs-search-input{width:100%;height:var(--site-header-height);padding-left:var(--margin-xs);padding-right:var(--margin-xl);font-size:var(--text-l);cursor:text}#docs-close-search{position:absolute;right:0;top:0}#docs-close-search .icon:first-child{display:none}#docs-close-search:disabled .icon:first-child{display:block;color:var(--hex-fg-3)}#docs-close-search:disabled .icon:last-child{display:none}#docs-search-results-container{overflow-y:scroll;overscroll-behavior:contain;max-height:100%;background-color:var(--hex-bg-2);border-radius:var(--br-s)}#docs-search-results-container:has(.is-active){margin-bottom:var(--margin-xs)}#docs-search-results{max-height:100%}.docs-search-result{position:relative;display:block;padding:var(--margin-xs) var(--margin-xs);border-bottom:1px solid var(--hex-bg-1);cursor:pointer;text-decoration:none}.docs-search-result h2{font-weight:500;color:var(--hex-fg-3)}.docs-search-result p{font-weight:400;margin-bottom:0;width:100%;color:var(--hex-fg-4);overflow:hidden;white-space:nowrap}.docs-search-result:before{content:"";display:block;position:absolute;top:0;left:0;width:2px;height:100%;background-color:var(--hex-current-2)}.docs-search-result.is-active:before{background-color:var(--hex-current-1)}.docs-search-result.is-active{background-color:var(--hex-current-7)}.docs-search-result.is-active>h2{color:var(--hex-current-1)}.docs-search-result.is-active>p{color:var(--hex-current-2)}.draggable{display:flex;position:relative;z-index:100}.draggable:first-child:not(:last-child){margin-right:var(--margin-s)}.draggable:after{content:"";pointer-events:none;position:relative;align-self:center;margin:auto;display:block;width:20px;height:20px;background-image:radial-gradient(circle at center,#000 1px,transparent 0),radial-gradient(circle at center,#000 1px,transparent 0);background-size:5px 5px}.draggable.is-disabled{color:var(--hex-red-1);opacity:.5}.clock{position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden}.tick{opacity:.5;position:absolute;top:50%;left:50%;width:1px;height:10px;color:var(--hex-red-1);background-color:currentColor;backface-visibility:hidden;transform-origin:100% 0%;will-change:transform,opacity}.shape{position:absolute;top:50%;left:50%;border:4px solid currentColor;width:100px;height:100px;margin-left:-50px;margin-top:-50px;will-change:transform}.circle{border-radius:50%}.shape.fill{background-color:currentColor}.square{border-radius:10px}.docs-demo{display:flex;flex-direction:column;overflow:hidden;position:relative;width:100%;height:var(--docs-demo-height);touch-action:manipulation;background-color:var(--hex-current-6)}.docs-demo.is-active{z-index:2}.docs-demo.is-hidden{pointer-events:none}.docs-demo-header{position:relative;z-index:3;height:var(--docs-demo-header-height);line-height:var(--docs-demo-header-height);padding-left:var(--margin-m);padding-right:var(--margin-m)}.docs-nav-menu{opacity:0;position:absolute;z-index:3;top:0;right:.75rem;height:var(--docs-demo-header-height);padding:0rem}#docs-demos:not(.is-small) .docs-demo.is-active .docs-nav-menu{opacity:1}.docs-nav-menu button{pointer-events:none;display:flex;justify-content:center;align-items:center;height:var(--docs-demo-header-height);border:none;background-color:transparent;cursor:pointer}.docs-demo.is-active .docs-nav-menu button{pointer-events:auto}.docs-demo:not(.is-active){content-visibility:auto;contain-intrinsic-size:auto var(--docs-demo-height)}@media(min-width:1200px){.docs-demo{border-radius:var(--docs-demo-br);border-bottom:1px solid var(--hex-bg-1)}.docs-demo:not(.is-active){--demo-marks: var(--hex-fg-4);--demo-grid: var(--hex-fg-6);--demo-fill: var(--hex-fg-7);--hex-current-1: var(--demo-marks);--hex-current-2: var(--demo-marks);--hex-current-3: var(--demo-marks);--hex-current-4: var(--demo-marks);--hex-current-5: var(--demo-grid);--hex-current-6: var(--demo-grid);--hex-current-8: var(--demo-fill);color:var(--hex-fg-3);background-color:var(--hex-bg-2);cursor:pointer}.docs-demo:not(.is-active):hover,.docs-demo:not(.is-active):active{--demo-marks: var(--hex-fg-3);--demo-grid: var(--hex-fg-5);--demo-fill: var(--hex-fg-6);color:var(--hex-fg-2);background-color:var(--hex-bg-3)}.docs-demo-header,.docs-demo-content{opacity:.33}.docs-demo.is-active .docs-demo-header,.docs-demo.is-active .docs-demo-content{opacity:1}}@media(min-width:1200px){.docs-demo.is-active .docs-nav-menu .minimise-demo-button{display:none}}.docs-demo-html:has(iframe){overflow:hidden;display:flex;resize:horizontal}.docs-demo-html.docs-demo-live iframe{overflow:auto;flex:1}.docs-demo-live.demo canvas{box-shadow:0 0 0 1px var(--hex-current-3)}.full-container{position:absolute;top:calc(var(--docs-demo-header-height) * -1);left:calc(var(--margin-m) * -1);width:calc(100% + var(--margin-m) * 2);height:calc(100% + var(--docs-demo-header-height) + var(--margin-m));border-radius:var(--docs-demo-br);mask-image:linear-gradient(#00000040,#000 4rem)}.iframe-content{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden}body.docs-demo-html{left:0;width:100%;margin-left:0}.docs-demo-html.docs-demo-live iframe,.iframe-content{width:100%;height:calc(7rem - 1px);border:1px dotted;border-radius:var(--docs-demo-br)}.docs-demo-html.docs-demo-live iframe,.docs-demo-html.docs-demo-template .iframe-content{border:none;border-radius:var(--docs-demo-br)}.docs-demo-html:has(iframe)::-webkit-resizer{display:block;width:20px;height:20px}.docs-demo-html:has(iframe):after{content:"";pointer-events:none;display:block;position:absolute;bottom:0;right:0;width:20px;height:20px;background-image:radial-gradient(circle at center,#000 1px,transparent 0),radial-gradient(circle at center,#000 1px,transparent 0);background-size:4px 4px;background-color:currentColor;border:4px solid currentcolor;border-radius:var(--br-xs) 0 var(--docs-demo-br) 0;box-shadow:-1px -1px 4px #00000040}.docs-demo-html:has(iframe):before{pointer-events:none;content:"resize iframe \bb";display:block;position:absolute;bottom:0;right:28px;height:20px;font-family:var(--font-code);opacity:.6;font-size:var(--text-xxs);letter-spacing:-.025em;white-space:pre}.docs-demo-js{display:none}.docs-demo-content{pointer-events:none;position:relative;z-index:2;flex-grow:1;margin-left:var(--margin-m);margin-right:var(--margin-m);margin-bottom:var(--margin-m)}.docs-demo-content.dotted-grid{margin-top:-2px;margin-bottom:calc(var(--margin-m) - 2px)}.docs-demo.is-active .docs-demo-content{pointer-events:auto}.dotted-grid:before,.square-grid:after,.square-grid:before{opacity:.5;pointer-events:none;content:"";position:absolute;z-index:0}.dotted-grid:before{top:.5px;left:1px;width:calc(100% - 1px);height:calc(100% - 1px)}.docs-demo-live .square-grid:before{top:0;left:0;width:calc(100% + 1px);height:calc(100% + 1px);background-image:linear-gradient(var(--hex-current-4) 1px,transparent 1px),linear-gradient(90deg,var(--hex-current-4) 1px,transparent 1px);background-size:1rem 1rem,1rem 1rem;box-shadow:inset 0 0 0 1px var(--hex-current-1)}.scroll-content .square-grid:before,.square-grid.scroll-content:before{box-shadow:none;opacity:.25}.docs-demo-live .scroll-container .square-grid:before{background-image:linear-gradient(var(--hex-current-4) 1px,transparent 1px),linear-gradient(90deg,var(--hex-current-4) 1px,transparent 1px),linear-gradient(var(--hex-current-5) 1px,transparent 1px),linear-gradient(90deg,var(--hex-current-5) 1px,transparent 1px);background-size:1rem 1rem,1rem 1rem,3rem 3rem,3rem 3rem;background-position:2rem 2rem}.docs-demo-template .scroll-container{display:none}.grid{display:flex}.grid:before{pointer-events:none;opacity:.5;content:"";display:block;position:absolute;inset:0 -1px -1px 0}.grid.medium{position:relative;width:100%;height:4rem}.grid.large{width:100%;height:7rem}.grid.medium.padded{padding:var(--margin-s)}.grid.large.padded{padding:var(--margin-l)}.scroll-container .grid.large{height:12rem}.scroll-container .padded{padding:5rem var(--margin-l) var(--margin-xxxl)}.docs-demo-html .grid.padded .row.log{top:1px;left:calc(7rem + 1px);width:calc(100% - 9rem - 1px);height:calc(3rem - 1px)}.docs-demo-html .scroll-section.padded .row.log{top:1px;left:calc(9rem + 1px);width:9rem;height:calc(3rem - 1px)}.docs-demo-html .scroll-section.padded .row.log .label,.docs-demo-html .grid.padded .row.log .label{opacity:.75;top:.25rem;left:.25rem}.scroll-container{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:currentColor transparent}.scroll-container.scroll-x{overflow-x:auto}.scroll-container.scroll-y{overflow-y:auto}.scroll-content{position:relative;display:flex;flex-direction:column}.scroll-container.scroll-x>.scroll-content{width:46rem}.scroll-container.scroll-x.scroll-y>.scroll-content{width:46rem;height:36rem}.scroll-container.scroll-y:not(.scroll-x)>.scroll-content{width:calc(100% - 1px)}.scroll-container.scroll-x:not(.scroll-y)>.scroll-content{flex-direction:row;justify-content:space-between;height:calc(100% - 1px)}.scroll-section{display:flex;align-items:center;width:22rem;height:12rem}.scroll-section.sticky{position:sticky;z-index:1;top:0;left:0}.perspective{perspective:400px}.perspective .square,.perspective .circle{transform-style:preserve-3d}.dotted-grid:before{background-image:radial-gradient(currentColor 1px,transparent 1px);background-size:calc(.5rem - 1px) calc(.5rem - 1px);background-position:-3px -3px}.docs-demo-html{display:flex;justify-content:center;align-items:flex-start;flex-direction:column;position:absolute;z-index:1;top:0;left:50%;bottom:0;width:19rem;margin-left:-9.5rem}.docs-demo-template{pointer-events:none;z-index:0;opacity:.3}.docs-demo-template.has-snapshot:after{content:"";position:absolute;top:calc(var(--docs-demo-header-height) * -1);left:calc(var(--margin-m) * -1);width:calc(100% + var(--margin-m) * 2);height:calc(100% + var(--docs-demo-header-height) + var(--margin-m));border-radius:var(--br-l);mask-image:linear-gradient(#00000040,#000 4rem);background:var(--snapshot) center/cover no-repeat;filter:grayscale(1)}.docs-demo.is-active .docs-demo-template.has-snapshot:after{display:none}.docs-demo:not(.is-active) .docs-demo-live canvas{filter:grayscale(1);opacity:.3}.docs-demo-content[id*=scrambletext] .docs-demo-template{opacity:0}.docs-demo-html .row{position:relative;z-index:2;display:flex;flex-shrink:0;align-items:center;width:100%;height:1.5rem;padding:1px 0}.docs-demo-html .col .row{flex-direction:column;align-items:flex-start}.docs-demo-html .centered,.docs-demo-html .col .row.centered{justify-content:center;align-items:center;text-align:center}.docs-demo-html .justified.row{justify-content:space-between}.docs-demo-html .spaced-evenly.row{justify-content:space-evenly}.docs-demo-html .medium.row:not(:last-child){margin-bottom:var(--margin-xxs)}.docs-demo-html .large.row:not(:last-child):first-child{margin-top:var(--margin-s);margin-bottom:var(--margin-s)}.docs-demo-html .grid .large.row:not(:last-child):first-child{margin-top:var(--margin-l)}.docs-demo-html .x-large.row:not(:last-child){margin-top:-.5rem;margin-bottom:var(--margin-xxs)}.docs-demo-html .col{position:relative;z-index:2;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center}.docs-demo-html .half.col{flex:.5}.docs-demo-html .particle,.docs-demo-html [class*=square]:not([class*=grid]),.docs-demo-html [class*=circle],.docs-demo-html [class*=triangle]{z-index:2;flex-shrink:0;position:relative;width:calc(1.5rem - 2px);height:calc(1.5rem - 2px);margin-top:1px;margin-left:1px;background-color:currentColor}.docs-demo-html [class*=square]:not([class*=grid]){border-radius:var(--br-s)}.docs-demo-html [class*=circle]{border-radius:50%}.docs-demo-html [class*=triangle]{margin-left:-.125rem;transform-origin:50% 70%;-webkit-mask:url(../images/icons/triangle.svg) no-repeat 50% 50%;mask:url(../images/icons/triangle.svg) no-repeat 50% 50%;-webkit-mask-size:cover;mask-size:cover}.docs-demo.is-active .docs-demo-html .particle{position:absolute;left:50%;top:50%;width:.75rem;height:.75rem;margin-left:-.375rem;margin-top:-.375rem;mix-blend-mode:plus-lighter;box-shadow:0 0 1em 0 currentColor,0 0 5em 0 currentColor}.docs-demo-html .clock{z-index:2;position:relative;width:4rem;height:4rem;margin-left:1px;border-radius:50%;border:.25rem solid currentColor}.docs-demo-html .clock:not(:last-child){margin-bottom:var(--margin-s)}.docs-demo-html .clock:after{content:"";position:absolute;top:.25rem;left:1.625rem;width:.25rem;height:1rem;border-radius:.125rem;background-color:currentColor}.docs-demo-html button,.docs-demo-html input[type=range]{height:1.5rem;border-radius:var(--br-s)}.docs-demo-html .small.row{height:1.5rem;margin-top:.125rem;margin-bottom:.125rem}.docs-demo-html .small .square,.docs-demo-html .small .circle{width:1.5rem;height:1.5rem}.docs-demo-html .medium.row{height:2rem}.docs-demo-html .medium .square,.docs-demo-html .medium .circle,.docs-demo-html .medium.pyramid .square,.docs-demo-html .medium.pyramid .circle{width:calc(2rem - 1px);height:calc(2rem - 1px);margin-top:1px;margin-left:1px}.docs-demo-html .pyramid .triangle{width:calc(2.5rem - 1px);height:calc(2.5rem - 1px);margin-top:-.4rem;margin-left:calc(var(--margin-s) - 3px);margin-right:var(--margin-s);margin-bottom:-1px}.docs-demo-html .large.row{height:3rem}.docs-demo-html .x-large.row{height:4rem}.docs-demo-html .large .square,.docs-demo-html .large .circle,.docs-demo-html .x-large .square,.docs-demo-html .x-large .circle{width:3rem;height:3rem}.docs-demo-html .pyramid{display:flex;flex-wrap:wrap;width:4rem;margin-top:-1rem}.docs-demo-html .align-left{justify-content:flex-start}.docs-demo-html .align-right,.docs-demo-html .align-center{justify-content:flex-end}.docs-demo-html pre{background-color:var(--hex-current-5)}.docs-demo-html pre.row{pointer-events:none;position:relative;width:100%;padding:var(--margin-s);border-radius:var(--br-s)}.docs-demo-html pre code{position:relative;z-index:1;font-size:13px;overflow:visible}.docs-demo-html pre input{position:relative;background-color:transparent;border-radius:0;flex-shrink:1;flex-grow:0;color:inherit;font-family:inherit}.docs-demo-html .centered.row input{text-align:center}.docs-demo-html .caret{position:absolute;z-index:1;top:1rem;bottom:1rem;left:var(--margin-s);width:1ch;height:1rem;font-size:13px;background-color:currentColor}.docs-demo-html .row .label,.docs-demo-html .row .value{position:relative;font-family:var(--font-code);font-size:.9125em;font-weight:400;line-height:1}.docs-demo-html .row .value{padding-left:var(--margin-xxs);padding-right:var(--margin-xxs);align-self:flex-end;white-space:nowrap;text-align:right;font-size:1.5rem;letter-spacing:-.04em}.docs-demo-html .row .value.lcd{font-family:Digital-7,monospace;font-size:2.75rem;line-height:2rem;letter-spacing:0}.docs-demo-html .row .label{opacity:.6;font-size:var(--text-xxs);letter-spacing:-.025em;white-space:pre;line-height:1.3}.docs-demo-html .row .label.padded{padding-left:var(--margin-xxs);padding-right:var(--margin-xxs)}.docs-demo-html .row.log{position:absolute;top:0;left:5rem;display:flex;flex-direction:row;justify-content:flex-end;align-items:stretch;z-index:1;width:calc(100% - 10rem);padding:.375rem 0}.docs-demo-html .col .row.log{position:relative;top:auto;left:auto;margin:auto;width:calc(100% - .5rem)}.iframe-content .scroll-content .row.log{top:1rem}.docs-demo-html .row.log .label{position:absolute;top:-1.25rem;left:0rem}.docs-demo-html .text-l,.docs-demo-html .text-xl{display:block;color:currentColor;width:100%;padding-left:.125rem;padding-right:.125rem;will-change:transform;font-kerning:none;font-variant-ligatures:none;text-rendering:optimizeSpeed}.docs-demo-html .text-xl{font-size:1.5rem;letter-spacing:.06em;line-height:1.35}.docs-demo-html .large.layout.row{height:7rem;margin:0;gap:var(--margin-xxs)}.docs-demo-html .large.layout.row:not(:last-child):first-child{height:5rem;margin-left:0;margin-right:0;margin-top:-.25rem;margin-bottom:var(--margin-xxxs)}.docs-demo-html .layout-container{flex-direction:column;flex-wrap:wrap;padding:var(--margin-xxxs);gap:var(--margin-xxxs);height:100%;border:1px dashed var(--hex-current-2);border-radius:var(--br-l)}.docs-demo-html .layout-container.row{flex-direction:row}.docs-demo-html .layout-container .item{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:var(--br-m);color:var(--hex-current-8);font-size:var(--text-xs);background-color:var(--hex-current-1);border:1px solid var(--hex-current-8)}.docs-demo-html .layout-container .item p{line-height:1.25rem}.docs-demo-html .viewer{width:100%}.docs-demo-html .tween-viewer{align-items:flex-start;padding:0}.docs-demo-html .tl-viewer{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding-left:0;padding-right:0;padding-bottom:0;margin-top:9px;width:calc(100% - 1px);height:1.75rem!important;background-size:33.33% calc(100% - 1.25rem);background-repeat:no-repeat;border-left:1px solid;border-right:1px solid;border-color:var(--hex-current-5)}.docs-demo-html .tween-viewer.medium.row:not(:last-child){margin-top:var(--margin-xxxs);margin-bottom:0}.docs-demo-template .tl-viewer,.docs-demo-template .tween-viewer{opacity:0}.docs-demo-html .tl-viewer:after,.docs-demo-html .tween-viewer:after{content:"";opacity:0;position:absolute;z-index:2;left:0;flex-shrink:0;transform:translate(var(--x));background-color:var(--hex-current-1);box-shadow:0 0 0 2px var(--hex-current-6)}.docs-demo.is-active .docs-demo-html .tl-viewer:after,.docs-demo.is-active .docs-demo-html .tween-viewer:after{opacity:1}.docs-demo-html .tl-viewer:after{top:0;width:2px;height:100%;border-radius:1px}.docs-demo-html .tween-viewer:after{top:calc(1.625rem - 1px);width:.5rem;height:.5rem;border-radius:.5rem}.docs-demo-html .tween-viewer.row span{position:relative;top:.5rem;z-index:1;display:block;padding:0}.docs-demo-html .tl-viewer .tl-child,.docs-demo-html .tween-viewer span:after{flex-shrink:0;display:block;background-color:currentColor;width:100%;height:.5rem;width:calc(100% - 2px)}.docs-demo-html .tl-viewer .tl-child{position:relative;opacity:.5}.docs-demo-html .tl-viewer .tl-child:not(:last-child){margin-bottom:1px}.docs-demo-html .tl-viewer .tl-child[data-label]:before{content:attr(data-label);display:block;position:absolute;left:4px;font-size:.5rem;font-weight:700;letter-spacing:.075em;text-transform:uppercase;white-space:pre}.docs-demo-html .tl-viewer .tl-child[data-label]:after{content:"";display:block;position:absolute;left:-1px;width:1px;height:calc(2.5rem - 2px);border-radius:1px;background-color:currentColor}.docs-demo-html .tl-viewer .tl-child:nth-child(1):before{top:calc(-1rem + 4px)}.docs-demo-html .tl-viewer .tl-child:nth-child(2):before{top:calc(-1.5rem + 3px)}.docs-demo-html .tl-viewer .tl-child:nth-child(3):before{top:calc(-2rem + 2px)}.docs-demo-html .tl-viewer .tl-child:nth-child(1):after{top:calc(-1rem + 4px)}.docs-demo-html .tl-viewer .tl-child:nth-child(2):after{top:calc(-1.5rem + 3px)}.docs-demo-html .tl-viewer .tl-child:nth-child(3):after{top:calc(-2rem + 2px)}.docs-demo-html .viewer span:after{content:"";position:absolute;left:0;top:calc(1rem + 1px)}.docs-demo-html .viewer span:first-child:after{border-radius:var(--br-s) 0 0 var(--br-s)}.docs-demo-html .viewer span:last-child:after{border-radius:0 var(--br-s) var(--br-s) 0}.docs-demo-html .tl-viewer .tl-child,.docs-demo-html .viewer span:first-child:last-child:after{border-radius:var(--br-s)}.docs-demo-html .tl-viewer .tl-child span{opacity:.5;display:flex;align-items:center;justify-content:center;position:absolute;top:-1px;left:-11px;width:8px;height:8px;border-radius:0;transform:none!important}.docs-demo.is-active .tl-viewer .tl-child span{color:var(--hex-current-1)}.docs-demo-html .tl-viewer .tl-child [class*=square]:not([class*=grid]){border-radius:1px}.docs-demo-html .tl-viewer .tl-child [class*=circle]{border-radius:4px}.docs-demo-html .tl-viewer .tl-child [class*=triangle]{top:-1px;left:-8px;width:9px;height:8px}.ui-controls,.docs-demo-html .controls{position:relative;display:flex;justify-content:center}.ui-controls{gap:var(--margin-xxs)}.docs-demo-html .controls{width:calc(100% + 2rem);margin-left:-1rem;margin-right:-1rem;margin-bottom:-1.5rem}.absolute.controls{position:absolute;width:50%;margin-left:50%;margin-bottom:0;bottom:0;transform:translate(-50%)}.docs-demo-template .controls,.docs-demo-template .label,.docs-demo-template .log,.docs-demo-template .viewer{pointer-events:none;opacity:0}.ui-controls button,.docs-demo-html .controls button,.docs-demo-html input[type=range]{flex:1;position:relative;min-width:5rem;height:2rem;padding-left:var(--margin-xxxs);padding-right:var(--margin-xxxs);color:var(--hex-current-1);background-color:var(--hex-current-5)}.docs-demo-html .controls button,.docs-demo-html input[type=range]{margin-left:var(--margin-xxxs);margin-right:var(--margin-xxxs)}.ui-controls button,.docs-demo-html .controls button{border-radius:var(--br-s);font-family:var(--font-code);font-size:var(--text-xxs);font-weight:700;text-transform:uppercase;max-width:50%;cursor:pointer}.absolute.controls button{max-width:100%}.docs-demo.is-active .docs-demo-html .controls button{color:var(--hex-current-1);background-color:var(--hex-current-4)}.docs-demo.is-active .docs-demo-html .controls button:hover{color:var(--hex-current-1);background-color:var(--hex-current-3)}.docs-demo.is-active .docs-demo-html .controls button:active{color:var(--hex-current-1);background-color:var(--hex-current-4);transform:scaleX(.99) scaleY(.98)}.docs-demo-html input[type=range]:hover,.docs-demo-html input[type=range]:active{color:var(--hex-current-1)}.ui-controls button{color:var(--hex-current-2);background-color:var(--hex-current-8)}.ui-controls button:hover{color:var(--hex-current-1);background-color:var(--hex-current-5)}.ui-controls button:active{color:var(--hex-current-2);background-color:var(--hex-current-8);transform:scaleX(.99) scaleY(.98)}
