*{box-sizing:border-box}:root{--bg-color: #effdfa;--main-color: #9553df;--main-code-color: rgb(246, 117, 220);--main-code-header-color: rgb(26, 0, 54);--main-code-bg-color: rgb(46, 9, 86);--main-color-light: #e49ff0;--main-color-alert: #05a598;--main-color-accent: #2037b9;--text-color: #474747;--success-color: var(--main-code-color);--border-color: #ccc;--sidebar-width: 400px;--border-radius: 16px}html,body,#root{height:100%}body{margin:0 auto;font-family:-apple-system,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-color);background-color:var(--bg-color);background-repeat:no-repeat;background-image:radial-gradient(at 80% 50%,hsla(340,0%,100%,1) 0px,transparent 50%),radial-gradient(at 0% 100%,hsla(20,0%,100%,1) 0px,transparent 50%),radial-gradient(at 80% 100%,hsla(240,0%,100%,1) 0px,transparent 50%),radial-gradient(at 0% 0%,hsla(343,0%,100%,1) 0px,transparent 50%);min-height:100vh;padding:57px 0 0}h1{font-weight:700;line-height:1;margin:0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(80deg,var(--main-color),var(--main-code-color))}.relative{position:relative}.guide{left:calc(var(--sidebar-width) + 1rem);position:absolute;bottom:0;display:none;opacity:.5;height:120px}.guide p{margin:0}.guide svg{max-width:100px;height:80px;animation-name:bounce-left-right;animation-duration:1s;animation-iteration-count:infinite;animation-delay:1s;animation-timing-function:ease;animation-fill-mode:both}@media (min-width: 768px){.guide{display:block}}@keyframes bounce-left-right{0%,20%,50%,80%,to{transform:translate(0)}40%{transform:translate(-10px)}60%{transform:translate(-5px)}}.controls{display:flex;justify-content:end;padding:1rem 0}@media (min-width: 768px){.controls{display:none}}body:has(aside[aria-expanded=true]):after{content:"";position:absolute;top:0;left:0;width:100vw;height:100vh;background-color:#0009;display:block}@media (min-width: 768px){body:has(aside[aria-expanded=true]):after{display:none}}.controls button{border:1px solid #ccc}label{line-height:2}textarea,input[type=text]{font-family:inherit;font-size:inherit;display:block;width:100%;padding:.6rem 1rem;margin-bottom:1rem;background-color:#f7f7f7;border-radius:var(--border-radius);border:none}textarea{line-height:1.5}input:focus{outline:2px solid var(--main-color-light);outline-offset:4px;border:none}input::focus-visible{outline:2px solid var(--main-color-light);outline-offset:4px;border:none}body.dark input[type=text]{color:#ccc;background-color:#0003}select{width:100%;padding:.5rem 16px .5rem .5rem;border:2px solid var(--main-color-light);height:36px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--border-radius);background-color:#fff;background-size:12px;background-position:calc(100% - 8px) 50%;background-repeat:no-repeat;margin-bottom:1rem}summary{font-weight:600;line-height:2;cursor:pointer;-webkit-user-select:none;user-select:none;margin:-.5em -.5em 0;padding:.5em 1rem;box-shadow:none;outline:none}details{border:none;border-radius:var(--border-radius);padding:.5em .5em 0;margin-bottom:.5rem;transition:border .3s}details:focus,details:active{outline:none;outline:2px solid var(--main-color-light)}details[open]{background-color:#fff;outline:2px solid var(--main-color-light)}body.dark details[open]{background-color:var(--bg-color-dark)}label{font-size:1.2rem;font-weight:600;line-height:2}.chevron{position:absolute;top:10px;right:10px}p{line-height:1.8}ul{list-style:none;margin:0;padding:0}.aside{overflow:hidden;width:90%;position:fixed;z-index:1;left:0;top:57px;display:none;background-color:#fff;overflow-y:auto;height:100vh;border-right:1px solid var(--border-color);padding:1rem 2rem 4rem}@media (min-width: 768px){.aside{display:block;display:unset;top:unset;width:var(--sidebar-width)}}[aria-expanded=true]{display:block}.aside code{color:var(--main-color);background-color:var(--bg-color)}.aside header{display:flex;justify-content:flex-end;border-bottom:1px solid rgba(0,0,0,.09);padding:.5rem;position:sticky;top:0;width:100%;background-color:#fff}@media (min-width: 768px){.aside header{display:none}}.count{color:#fff;border-radius:50%;background-color:var(--main-color);width:24px;height:24px;align-items:baseline;display:inline-block;line-height:24px;text-align:center}a{color:var(--main-color);text-decoration-line:none}.switch-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.switch-label{position:relative;display:inline-block;-webkit-user-select:none;user-select:none;cursor:pointer;font-weight:500;text-align:left;padding:0 0 0 54px}.switch-label+input[type=text]{margin-top:1rem}.switch-label:before,.switch-label:after{content:"";position:absolute;margin:0;outline:0;top:50%;transform:translateY(-50%);transition:all .15s ease}.switch-label:before{left:1px;width:34px;height:14px;background-color:var(--main-color-light);border-radius:8px}.switch-label:after{left:0;width:20px;height:20px;background-color:#fafafa;border-radius:50%;border:2px solid transparent;box-shadow:0 3px 1px -2px #00000024,0 2px 2px #00000019,0 1px 5px #00000015}.switch-input:checked+.switch-label:before{background-color:var(--main-color-light)}.switch-input:checked+.switch-label:after{background-color:var(--main-color);transform:translate(80%,-50%)}.switch-label:focus{box-shadow:none;outline:none}.switch-input:focus-visible:after{outline:2px solid var(--main-color)}.switch-input:focus+.switch-label:after{border:2px solid var(--main-color)}.switch-label:focus:after{background-color:#fff}section{padding:2vmin;max-width:80em;margin:0 auto}@media (min-width: 768px){main{padding-left:var(--sidebar-width)}}code,pre{font-family:Menlo,monospace}code[class*=language-],pre[class*=language-]{word-wrap:normal}pre[class*=language-]{margin:0;overflow-x:auto;white-space:pre-line;-webkit-hyphens:auto;hyphens:auto;border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);padding:1.5rem;position:relative}.code-header{background-color:var(--main-code-header-color);border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius);display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;margin-top:1rem}.code-header-control{gap:.5rem;display:flex;justify-content:space-between;align-items:center;color:#fff}.code-header .button{padding:.15rem .5rem;background-color:transparent;color:#fff;border-radius:1rem}.code-header span.copy-label{display:inline-block;margin-left:.25rem}.code-header span:not(.copy-label){width:12px;height:12px;border-radius:50%}.code-header span:not(.copy-label):first-child{background-color:#ff5f57}.code-header span:not(.copy-label):nth-child(2){background-color:#febc2e}.code-header span:not(.copy-label):nth-child(3){background-color:#28c840}pre[class*=language-]{background-color:var(--main-code-bg-color)}code{padding:.5rem;border-radius:.4rem;line-height:2;font-size:initial}pre .token.tag,pre .token.attr-name,pre .token.namespace,pre .token.deleted{color:#fcdfaa}pre .token.string,pre .token.char,pre .token.attr-value,pre .token.regex,pre .token.variable{color:var(--main-code-color)}code[class*=language-],pre[class*=language-]{font-family:Menlo,monospace;line-height:1.5;color:#fff;text-shadow:none;white-space:pre-wrap;overflow-x:auto;white-space:normal;-webkit-hyphens:auto;hyphens:auto;word-break:break-word;overflow-wrap:break-word;-moz-tab-size:4;tab-size:4;letter-spacing:-.02em}.button{border:none;outline:none;background-color:#fff;border-radius:8px;padding:.5rem 1rem;display:inline-flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background-color .3s ease,transform .2s;position:relative;color:unset;gap:.5rem}.button:hover{background-color:var(--main-color);color:#fff}.button:hover *{stroke:#fff;color:#fff}.button-success *{stroke:#fff}.button-success:hover{background-color:var(-color)}.alertbox{border-radius:var(--border-radius);padding:2rem;background-color:#fff;font-weight:500;margin-bottom:1rem;line-height:1.75;position:relative;overflow-x:clip}body:not(.dark) .alertbox{background:#fff;border-radius:var(--border-radius);box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(3.6px);-webkit-backdrop-filter:blur(3.6px);border:1px solid rgba(255,255,255,.65)}.alertbox:before{content:"";width:20px;height:20px;position:absolute;top:-10px;left:-10px;z-index:1}.alertbox span{text-transform:uppercase;font-weight:700;letter-spacing:.01em;display:block;margin-bottom:1rem;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(80deg,var(--main-color),var(--main-color-accent))}.alertbox code{color:var(--main-color);background-color:var(--bg-color)}kbd{border:1px solid #aaa;border-radius:.2em;box-shadow:.1em .1em .2em #0000001a;background-color:#f9f9f9;color:#000;padding:.1em .3em;font-family:inherit}#root>header{padding:1rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;gap:1rem;align-items:center;position:fixed;width:100%;z-index:2;height:57px;top:0;left:0;background-color:#fff}#root>header div{display:none}@media (max-width: 768px){#root>header div{display:flex}}.button-primary{background-color:var(--main-color);color:#fff}
