body{display:flex;flex-direction:column}main:where(.astro-LVRV64M3){flex:1 auto}.wiggle:where(.astro-LVRV64M3){position:absolute;top:0;left:0;height:100%;width:100%;background-image:url(/assets/images/wiggle-left.svg),url(/assets/images/wiggle-right.svg);background-repeat:repeat-y,repeat-y;background-position:-40vw top,-30vw top;background-size:150vw 1224vw,150vw 1224vw;opacity:.15;mix-blend-mode:difference;pointer-events:none}.fauxtoshop,.bar-button,.artboard{border-style:solid;border-width:3px;border-color:#000}.white-ui .fauxtoshop,.white-ui .bar-button,.white-ui .artboard{border-color:#666;border-width:2.25px}@media (max-width: 575px){.fauxtoshop,.bar-button,.artboard{border-width:1.5px}}.fauxtoshop{position:relative;width:100%;max-width:200px;margin:auto}@media (min-width: 577px){.fauxtoshop{max-width:300px}}.fauxtoshop.white-ui,.fauxtoshop.white-ui .bar{border-color:#666;border-width:2.25px}.fauxtoshop .bar{border-bottom-style:solid;border-bottom-width:3px;border-bottom-color:#000;height:2rem;display:flex;align-items:center;padding-left:1rem}@media (max-width: 575px){.fauxtoshop .bar{border-bottom-width:1.5px}}.fauxtoshop .bar-button{display:inline-block;border-radius:.8rem;height:1rem;width:1rem}.fauxtoshop .bar-button+.bar-button{margin-left:.3rem}.fauxtoshop .document{display:flex;flex:1;padding:.5rem}.fauxtoshop .artboard{flex:1;margin:.5rem;position:relative;width:100%;padding-top:75%}.guide{display:block;position:absolute;border-radius:2px;transition:transform .2s ease-out,width .2s ease-in,height .2s ease-in;z-index:1}.guide:before,.guide:after{content:"";display:block;position:absolute;height:6px;width:6px;border-radius:6px;opacity:0;transition:transform .5s ease-out .2s,opacity .5s linear .2s}.guide:before{top:0;left:0}.guide:after{bottom:0;right:0}.guide.preanimate:before,.guide.preanimate:after{height:2px;width:2px;opacity:1;transform:translate(0)}@media (max-width: 575px){.guide.preanimate:before,.guide.preanimate:after{height:1.5px;width:1.5px}}.guide-h{height:2px;transform:translateY(-1px) scale(1);left:-.6rem;right:-.6rem;background:#3fde76 linear-gradient(to bottom right,#3fde76,#34a6f0)}@media (max-width: 575px){.guide-h{height:1.5px}}.guide-h.preanimate{height:6px;transform:translateY(-3px) scaleX(0)}.guide-h:before{background-color:#3fde76;transform:translate(-2rem)}.guide-h:after{background-color:#34a6f0;transform:translate(2rem)}.guide-h:before,.guide-h:after{width:20px;height:2px}@media (max-width: 575px){.guide-h:before,.guide-h:after{height:1px}}.guide-v{width:2px;transform:translate(-1px) scale(1);top:-.6rem;bottom:-.6rem;background:#ff3062 linear-gradient(to bottom right,#ff3062,#7d4ffe)}@media (max-width: 575px){.guide-v{width:1px}}.guide-v.preanimate{width:6px;transform:translate(-3px) scaleY(0)}.guide-v:before{background-color:#ff3062;transform:translateY(-2rem)}.guide-v:after{background-color:#7d4ffe;transform:translateY(2rem)}.guide-v:before,.guide-v:after{height:20px;width:2px}@media (max-width: 575px){.guide-v:before,.guide-v:after{width:1.5px}}.white-guides .guide{background:#fff}.white-guides .guide:before,.white-guides .guide:after{background:#fff}.selection{position:absolute;border:3px solid #000;transition:border-width .2s,transform .2s;animation:boing .5s 1 .2s;transform:translateZ(0);backface-visibility:hidden;perspective:1000}.selection-ai,.selection-sketch{border-style:solid}.selection-ai .handle,.selection-sketch .handle{display:inline-block}.selection-xd{border-style:solid}.selection-xd .handle{border-radius:20px;display:inline-block}.selection-ps{border-style:dotted}.selection.preanimate{border-width:0;transform:scale3d(1.1,1.1,1)}.selection.preanimate .handle{display:none}.white-ui .selection{border-color:#fff}@media (max-width: 575px){.selection{border-width:1.5px}}.graphic{position:absolute;margin:-1px;animation:boing .5s 1 .2s;transform:translateZ(0);backface-visibility:hidden;perspective:1000}.graphic.preanimate .graphic-line-thin,.graphic.preanimate .graphic-line-thick{stroke-width:0}.graphic-line-thin{fill:transparent;stroke:#000;stroke-width:2px;vector-effect:non-scaling-stroke;transition:stroke-width .2s}.white-ui .graphic-line-thin{stroke:#fff}@media (max-width: 575px){.graphic-line-thin{stroke-width:1px}}.graphic-line-thick{fill:transparent;stroke:#000;stroke-width:3px;vector-effect:non-scaling-stroke;transition:stroke-width .2s}.white-ui .graphic-line-thick{stroke:#fff;stroke-width:2.25px}@media (max-width: 575px){.graphic-line-thick{stroke-width:1.5px}}.rect{position:absolute;border:3px solid #000;transition:border-width .2s;animation:boing .5s 1 .2s;transform:translateZ(0);backface-visibility:hidden;perspective:1000}.white-ui .rect{border-color:#fff;border-width:2.25px}.rect.preanimate{border-width:0}@media (max-width: 575px){.rect{border-width:1.5px}}@keyframes flash{0%{border-color:inherit}5%{border-color:#000}to{border-color:inherit}}.flash{animation:flash .5s 1}@keyframes boing{0%,10%{transform:scaleZ(1)}20%{transform:scale3d(1.1,1.1,1)}35%{transform:scale3d(.95,.95,1)}80%,to{transform:scaleZ(1)}}.handle{background-color:#fff;height:6px;width:6px;position:absolute;top:-3px;left:-3px;box-sizing:border-box;display:none;box-shadow:0 0 0 2px #000}@media (max-width: 575px){.handle{height:3px;width:3px;top:-1.5px;left:-1.5px}}.white-ui .handle{background-color:#000;box-shadow:0 0 0 2px #fff}.handle:nth-child(1){left:50%;margin-left:-3px}@media (max-width: 575px){.handle:nth-child(1){margin-left:-1.5px}}.handle:nth-child(2){left:auto;right:-3px}@media (max-width: 575px){.handle:nth-child(2){right:-1.5px}}.handle:nth-child(3){top:50%;margin-top:-3px;left:auto;right:-3px}@media (max-width: 575px){.handle:nth-child(3){margin-top:-1.5px;right:-1.5px}}.handle:nth-child(4){inset:auto -3px -3px auto}@media (max-width: 575px){.handle:nth-child(4){right:-1.5px;bottom:-1.5px}}.handle:nth-child(5){left:50%;margin-left:-3px;top:auto;bottom:-3px}@media (max-width: 575px){.handle:nth-child(5){margin-left:-1.5px;bottom:-1.5px}}.handle:nth-child(6){top:auto;bottom:-3px}@media (max-width: 575px){.handle:nth-child(6){bottom:-1.5px}}.handle:nth-child(7){top:50%;margin-top:-3px}@media (max-width: 575px){.handle:nth-child(7){margin-top:-1.5px}}@font-face{font-family:Kievit;src:url(/assets/fonts/KievitExtraLight.eot?#iefix) format("embedded-opentype"),url(/assets/fonts/KievitExtraLight.woff2) format("woff2"),url(KievitExtraLight.woff) format("woff"),url(/assets/fonts/KievitExtraLight.ttf) format("truetype");font-weight:200;font-style:normal}@font-face{font-family:Kievit;src:url(/assets/fonts/KievitRegular.eot?#iefix) format("embedded-opentype"),url(/assets/fonts/KievitRegular.woff2) format("woff2"),url(KievitRegular.woff) format("woff"),url(/assets/fonts/KievitRegular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Kievit;src:url(/assets/fonts/KievitBold.eot?#iefix) format("embedded-opentype"),url(/assets/fonts/KievitBold.woff2) format("woff2"),url(KievitBold.woff) format("woff"),url(/assets/fonts/KievitBold.ttf) format("truetype");font-weight:600;font-style:normal}:root{font-family:Kievit,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;font-size:62.5%;height:100%}body{position:relative;width:100%;min-height:100vh;background-color:#fff;margin:0;line-height:1.6;font-size:2.2rem}html{min-height:100vh}*{box-sizing:border-box}h1,.h1{font-size:5rem;font-weight:lighter}h2,.h2{font-size:4rem;font-weight:lighter}h3,.h3,h4,.h4{font-size:2.2rem;font-weight:700}h1,.h1,h2,.h2 h3,.h3,h4,h5,h6,p,hr,ol,ul,pre,summary{margin-top:0;margin-bottom:3.3rem}a{font-weight:600;color:#7d4ffe;text-decoration:none}a:hover{text-decoration:none;color:#5c3ecc}h1,h2,h3,h4,h5,h6{line-height:1}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{font-weight:inherit}hr{height:10px;border:0;margin-top:3.3rem;margin-bottom:3.3rem;width:100%}hr.bauhaus{padding-top:0;position:relative;overflow:visible}hr:after{position:absolute;top:10px;color:currentColor;font-size:5rem;line-height:0;font-weight:200;text-transform:uppercase;content:attr(data-content)}hr.bauhaus-green{color:#3fde76}hr.bauhaus-purple{color:#7d4ffe}hr.bauhaus-magenta{color:#ff3062}code{color:#ff3062;font-size:1.76rem;word-break:break-word;font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.bauhaus{position:relative}.bauhaus:before{position:absolute;top:0;transform:translate(calc(-100% - 1rem));display:block;content:"";width:100%;border-bottom:10px solid currentColor}.btn{font-size:16px;text-transform:uppercase;font-family:Kievit,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;font-weight:700;background-color:#000;color:#fff;padding:13.5px 1.75rem 10.5px;border:5px solid transparent;line-height:1;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;text-decoration:none;text-align:center;display:inline-block;cursor:pointer}.btn:disabled{background-color:#f3f3f3!important;border-color:#f3f3f3!important;color:#666!important;cursor:default}.btn:hover{border-color:#fff;color:#fff}.btn.primary{background-color:#7d4ffe;color:#fff}.btn.primary:hover{background-color:#5c3ecc;border-color:#5c3ecc}.btn.outline{background-color:transparent;border-color:#fff;color:#fff}.btn.outline:hover{background-color:#fff;color:#000}.btn.link{font-weight:700;font-size:inherit;line-height:inherit;padding:0;display:inline-block;margin:0;text-transform:inherit;background-color:transparent;border:0;color:#7d4ffe}.btn.link:hover{border:0;color:#5c3ecc}.trim-bottom{margin-bottom:0}.prose img{max-width:100%}.prose>*{margin-bottom:3.3rem}.prose>*:last-child{margin-bottom:0}.guideguide-logo-fill{fill:#000}.guideguide-logo-text{fill:#fff}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;-webkit-clip-path:inset(50%);clip-path:inset(50%);border:0}.underlined-links a,.underlined-links .link{text-decoration:none}.underlined-links a span,.underlined-links .link span{display:inline-block;position:relative}.underlined-links a span:after,.underlined-links .link span:after{position:absolute;width:0%;bottom:0;left:50%;transform:translate(-50%);transition:width .2s ease,radius .2s ease;display:block;content:"";border-radius:5px;border-bottom:5px solid currentColor}@media (min-width: 769px){.underlined-links a span:after,.underlined-links .link span:after{border-bottom-color:#beb3ff}}.underlined-links a:hover span:after,.underlined-links .link:hover span:after{width:100%;border-radius:0}.error-block{padding:2rem;background-color:#ff3062;color:#fff;border:10px solid #c11f4d}.error-block a{color:#fff;text-decoration:underline}.error-block p{margin-bottom:0}@media (min-width: 769px){.error-block{padding:4rem}}.screenshot-carousel{max-width:260px;display:grid;row-gap:2rem}.screenshot-carousel nav{text-align:center}.screenshot-carousel img{width:100%}.screenshot-carousel button.btn{display:inline-block;margin-left:1rem;margin-right:1rem}body.show-global-menu{overflow-y:hidden}@media (max-width: 767px){body.show-global-menu .navbar-layer:where(.astro-5JFCWBTQ){background-color:#3fde76}}.navbar:where(.astro-5JFCWBTQ){position:relative;z-index:10;width:100%;display:grid;grid-template-columns:50px auto;grid-template-rows:50px}@media (min-width: 769px){.navbar:where(.astro-5JFCWBTQ){grid-template-columns:8rem auto;grid-template-rows:8rem}}.global-navigation-target:where(.astro-5JFCWBTQ){display:flex;flex-direction:column;align-items:flex-end;justify-content:center}@media (min-width: 769px){.global-navigation-target:where(.astro-5JFCWBTQ){display:none}}nav:where(.astro-5JFCWBTQ){display:flex;align-items:flex-start;grid-column:1/-1}@media (max-width: 767px){nav:where(.astro-5JFCWBTQ){display:none;margin-top:2rem}body.show-global-menu nav:where(.astro-5JFCWBTQ){display:flex}}@media (min-width: 769px){nav:where(.astro-5JFCWBTQ){margin-left:auto;align-items:center;grid-column:2/-1}}nav:where(.astro-5JFCWBTQ) ul:where(.astro-5JFCWBTQ){list-style-type:none;margin:0;padding:0;display:flex;flex-direction:column}@media (min-width: 769px){nav:where(.astro-5JFCWBTQ) ul:where(.astro-5JFCWBTQ){flex-direction:row}}@media (min-width: 769px){nav:where(.astro-5JFCWBTQ) ul:where(.astro-5JFCWBTQ) li:where(.astro-5JFCWBTQ)+li:where(.astro-5JFCWBTQ){margin-left:2rem}}nav:where(.astro-5JFCWBTQ) a:where(.astro-5JFCWBTQ){color:currentColor;text-decoration:none;text-transform:uppercase;font-size:5rem;font-weight:200;display:block;position:relative}nav:where(.astro-5JFCWBTQ) a:where(.astro-5JFCWBTQ):hover{color:currentColor}@media (min-width: 769px){nav:where(.astro-5JFCWBTQ) a:where(.astro-5JFCWBTQ){display:inline-block;font-weight:700;padding-left:0;padding-right:0;position:relative;font-size:1.6rem;line-height:2}}.layer{display:grid;grid-template-columns:0px auto 0px;column-gap:2rem;padding-top:2rem;padding-bottom:2rem}.layer.layer-purple{background-color:#7d4ffe;color:#fff}.layer.layer-white{background-color:#fff;color:#000}.layer.layer-black{background-color:#000;color:#fff}.layer.layer-magentaLight{background-color:#ff3062;color:#fff}.layer.layer-disable-top-padding{padding-top:0}.layer.layer-disable-bottom-padding{padding-bottom:0}@media (min-width: 577px){.layer{grid-template-columns:auto 540px auto}}@media (min-width: 769px){.layer{column-gap:4rem;padding-top:4rem;padding-bottom:4rem;grid-template-columns:auto 720px auto}}@media (min-width: 993px){.layer{grid-template-columns:auto 960px auto}}@media (min-width: 1201px){.layer{grid-template-columns:auto 1140px auto}}.layer.prose-width{--lg-width: calc((960px - (4rem * 2)) / 3);--xl-width: calc((1140px - (4rem * 2)) / 3)}@media (min-width: 993px){.layer.prose-width{grid-template-columns:auto var(--lg-width) var(--lg-width) var(--lg-width) auto}}@media (min-width: 1201px){.layer.prose-width{grid-template-columns:auto var(--xl-width) var(--xl-width) var(--xl-width) auto}}@media (min-width: 993px){.layer.prose-width>*{grid-column:2/4}}@media (min-width: 993px){.layer.prose-width>*.full-width{grid-column:2/-2}}.layer>*{z-index:1;grid-column:2/2}.layer>*.jumbo{grid-column:1/-1}.white:where(.astro-JHDRHFJH){background-color:#fff;z-index:5;position:relative}footer:where(.astro-JHDRHFJH){text-align:center;font-size:1.8rem}@media (min-width: 769px){footer:where(.astro-JHDRHFJH){display:grid;gap:2rem;grid-template-columns:min-content auto}}.copyright:where(.astro-JHDRHFJH){white-space:nowrap;margin-bottom:0}ul:where(.astro-JHDRHFJH){list-style-type:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}@media (min-width: 769px){ul:where(.astro-JHDRHFJH){flex-direction:row;justify-content:flex-end}}ul:where(.astro-JHDRHFJH) li:where(.astro-JHDRHFJH){margin-left:1rem;margin-right:1rem}@media (min-width: 769px){ul:where(.astro-JHDRHFJH) li:where(.astro-JHDRHFJH)+li:where(.astro-JHDRHFJH){margin-left:2rem;margin-right:0}}ul:where(.astro-JHDRHFJH) a:where(.astro-JHDRHFJH){display:inline-block}.download-modal{position:fixed;inset:0;background-color:#00000080;z-index:10;align-items:center;justify-content:center;display:none}body.show-download-modal .download-modal{display:flex}.download-modal .logo{height:200px;width:200px;display:block;margin:5rem;z-index:1;position:relative}.download-modal .download-close{position:absolute;top:1rem;right:1rem;border:0;-webkit-appearance:none;background-color:transparent;font-size:2rem;z-index:1;cursor:pointer}.download-modal .download-box{position:relative;background-color:#fff;padding:2rem;border:1px solid rgba(0,0,0,.75);overflow:hidden;display:grid;gap:2rem;grid-template-rows:auto auto;grid-template-columns:1fr;max-width:100%}@media (min-width: 769px){.download-modal .download-box{padding:4rem;gap:4rem;grid-template-columns:auto auto;grid-template-rows:1fr}}.download-modal .wiggle-small{position:absolute;top:0}.download-modal .wiggle-small path{fill:#3fde76}.download-modal .wiggle-small.left{left:0;width:74px;height:110px}.download-modal .wiggle-small.right{right:-1px;width:129px;height:176px}.download-modal .downloads{z-index:1}.download-modal .downloads a{width:100%;display:block}.mq-helper:where(.astro-K6INMX63){font-size:12px;border:1px solid #ff3062;border-radius:3px;display:inline-block;position:fixed;bottom:20px;right:20px;z-index:1000;padding:0 5px;margin:0;background-color:#fff;color:#ff3062}.mq-helper:where(.astro-K6INMX63):before{content:"xs"}@media (min-width: 577px){.mq-helper:where(.astro-K6INMX63):before{content:"sm"}}@media (min-width: 769px){.mq-helper:where(.astro-K6INMX63):before{content:"md"}}@media (min-width: 993px){.mq-helper:where(.astro-K6INMX63):before{content:"lg"}}@media (min-width: 1201px){.mq-helper:where(.astro-K6INMX63):before{content:"xl"}}
