:root{--ring-color:blue}body{position:relative}*{box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}input::-webkit-outer-spin-button{-webkit-appearance:none}input::-webkit-inner-spin-button{-webkit-appearance:none}:focus{outline:2px solid var(--ring-color);outline-offset:2px}button{flex-shrink:0}.root{margin:24px}ul{padding-inline-start:0}[hidden]{display:none!important}.pre{background:#0000000d;border-radius:10px;margin-bottom:40px;padding:20px;font-family:monospace}.index-nav{flex:1;padding:40px;line-height:1em;overflow-y:auto}.index-nav ul{grid-gap:20px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));padding:0;list-style-type:none;display:grid}.index-nav a{text-transform:capitalize;border:1px solid #0000001a;padding:20px;text-decoration:none;display:block}.component-index-nav{flex-direction:column;display:flex}.component-search{margin-bottom:20px}.component-search input{border:1px solid #d7e0da;border-radius:8px;width:100%;max-width:420px;padding:10px 12px}.empty-state{color:#667085}.backlink{margin:16px 12px}body{margin:0;font-size:14px;overflow:hidden}.page{height:100vh;display:flex;overflow:hidden}.page main{flex-direction:column;flex:auto;align-items:flex-start;gap:10px;padding:40px;display:flex;position:relative;overflow-y:auto}.nav{border-right:1px solid #d7e0da;flex-direction:column;width:292px;display:flex;overflow-y:scroll}.nav header{padding:8px;font-size:larger;font-weight:600}.nav a{color:#000;text-transform:none;border-left:4px solid #0000;padding:6px 14px;text-decoration:none}.nav a:hover{background-color:#7c807d66}.nav a:focus{outline:none}.nav a[data-active],a[aria-current=page]{border-color:green;font-weight:500}.controls-container{flex-direction:column;order:1;gap:14px;padding:12px 22px;display:flex}.controls-container .text{flex-direction:column;gap:8px;display:flex}.controls-container .text label{font-weight:500}.controls-container .text input,.controls-container .text select{border:1px solid #000;border-radius:4px;padding:4px}.toolbar{border-left:1px solid #d7e0da;flex-direction:column;width:400px;display:flex}.toolbar nav{border-bottom:1px solid #d7e0da;gap:24px;padding:16px;display:flex}.toolbar nav button{all:unset;font-weight:500}.toolbar nav button[data-active]{color:green}.toolbar>div{max-height:100%;overflow:hidden}.toolbar [data-content]{display:none}.toolbar [data-content][data-active]{flex-direction:column;max-height:100%;display:flex}.toolbar .viz{--viz-font:SF Mono, Menlo, monospace;border-bottom:1px solid #d7e0da;flex:1;padding-left:14px;font-size:13px;overflow:auto}.toolbar .viz summary{font-family:var(--viz-font);margin-bottom:24px;font-weight:700}.toolbar .viz summary+div>*{font-family:var(--viz-font)}.output{padding-block:10px;padding-inline:40px;border:2px solid #000;padding-bottom:32px}.output p{font-weight:600}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}