.table-of-contents{width:100%;padding:var(--space-01)var(--space-03)var(--space-02)var(--space-02);margin:.25em 0 1em}.table-of-contents .title{margin:0 0 .5em}.table-of-contents ul{width:100%;margin:0;padding:0}.table-of-contents ul li{margin:0 0 0 1.25em}
.bezier-visualizer{aspect-ratio:1;border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);corner-shape:squircle;background-color:var(--neutral-02);width:100%;height:100%;transition:border-color .24s var(--fluid);display:flex;position:relative;overflow:hidden}.bezier-visualizer svg{aspect-ratio:1;max-width:100%;height:100%;transform:translate(-.5rem,.5rem)}.bezier-visualizer svg .main-axes line{stroke:currentColor;stroke-linecap:round;stroke-width:1px}.bezier-visualizer svg .bezier-curve{fill:none;stroke:var(--neutral-06);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.25px}.bezier-visualizer svg .control-handles{stroke:var(--neutral-05);stroke-linecap:round;stroke-width:1px}.bezier-visualizer svg .control-handles line{stroke-dasharray:2 2}.bezier-visualizer svg .control-points circle{fill:var(--neutral-05)}.bezier-visualizer svg .animated-dot{fill:var(--neutral-07)}.bezier-visualizer:before{background:radial-gradient(var(--neutral-12).0625rem,var(--neutral-02).0625rem)0 0/.75rem .75rem;content:"";opacity:.08;pointer-events:none;position:absolute;inset:0}.bezier-visualizer:hover{border-color:var(--neutral-05)}
.illustration{border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);width:100%;transition:border-color .24s var(--fluid);justify-content:center;align-items:center;margin-bottom:.5em;padding:1em;display:flex;position:relative}.illustration span{padding-left:.375rem;font-size:.625rem}.illustration code{width:fit-content}.illustration:hover{border-color:var(--neutral-05)}
.columns{flex-direction:column;align-items:flex-start;gap:1em}.columns .row{gap:1em}.columns .col{border:.0625rem dashed var(--neutral-05);border-radius:var(--rounded-sm);background-color:var(--neutral-02);transition:border-color .24s var(--fluid);padding:1em}.columns span{text-transform:uppercase}.columns:hover .col{border-color:var(--neutral-06)}
.containers .container-80{border:.0625rem dashed var(--neutral-05);border-radius:var(--rounded-sm);background-color:var(--neutral-02);transition:border-color .24s var(--fluid);padding:1em}.containers .container-80 .info{gap:.5em}.containers .container-80 span{text-transform:uppercase}.containers:hover .container-80{border-color:var(--neutral-06)}
.rows .container-75{border:.0625rem dashed var(--neutral-05);border-radius:var(--rounded-sm);transition:border-color .24s var(--fluid);flex-direction:column;gap:1em;padding:1em;display:flex}.rows .container-75 .wrapper{border:.0625rem dashed var(--neutral-05);border-radius:var(--rounded-sm);background-color:var(--neutral-02);transition:border-color .24s var(--fluid);flex-direction:column;gap:1em;padding:1em;display:flex}.rows .container-75 .col{border:.0625rem dashed var(--neutral-06);border-radius:var(--rounded-sm);background-color:var(--neutral-03);transition:border-color .24s var(--fluid);padding:1em}.rows .container-75 span{text-transform:uppercase}.rows:hover .wrapper{border-color:var(--neutral-06)}.rows:hover .col{border-color:var(--neutral-08)}
.typography .info{border:.0625rem dashed var(--neutral-05);border-radius:var(--rounded-sm);background-color:var(--neutral-02);width:100%;transition:border-color .24s var(--fluid);padding:.5em}.typography .info code{margin-bottom:.5em;display:block}.typography .info.text-01 span{width:100%;color:var(--neutral-08);font-size:var(--text-01);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info.text-02 span{width:100%;color:var(--neutral-08);font-size:var(--text-02);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info.text-03 span{width:100%;color:var(--neutral-08);font-size:var(--text-03);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info.text-04 span{width:100%;color:var(--neutral-08);font-size:var(--text-04);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info.text-05 span{width:100%;color:var(--neutral-08);font-size:var(--text-05);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info.text-06 span{width:100%;color:var(--neutral-08);font-size:var(--text-06);text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:block;overflow:hidden}.typography .info:hover{border-color:var(--neutral-06)}
.badge{border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);background-color:var(--neutral-02);color:var(--neutral-10);transition:border-color .24s var(--fluid);align-items:center;gap:.5em;padding:.5em .75em;font-size:1em;font-weight:500;line-height:1;display:inline-flex}.badge .status{background-color:var(--neutral-06);border-radius:100%;width:.75em;height:.75em}.badge.success .status{background-color:var(--green)}.badge:hover{border-color:var(--neutral-05)}
.switch{--slider-width:3rem;--slider-height:1.5rem;--slider-padding:.125rem;--circle-size:calc(var(--slider-height) - var(--slider-padding)*4);--circle-translate:calc(var(--slider-width) - var(--circle-size) - var(--slider-padding)*4);color:var(--neutral-10);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.75em;font-size:1em;font-weight:600;display:flex}.switch input{display:none}.switch input:checked+.slider{border-color:var(--neutral-05);background:var(--neutral-04)}.switch input:checked+.slider:before{transform:translateY(-50%)translateX(var(--circle-translate));border-color:var(--neutral-05)}.switch input:checked+.slider:hover{background:var(--neutral-03)}.switch .slider{width:var(--slider-width);height:var(--slider-height);border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-lg);background:var(--neutral-02);transition:background-color .24s var(--fluid),border-color .24s var(--fluid);position:relative}.switch .slider:before{top:50%;left:var(--slider-padding);width:var(--circle-size);height:var(--circle-size);border:.0625rem solid var(--neutral-04);background:var(--neutral-01);content:"";transition:transform .24s var(--sharp),border-color .24s var(--fluid);border-radius:100%;display:block;position:absolute;transform:translateY(-50%)}.switch .slider:hover{background:var(--neutral-03)}
.table{border:.0625rem solid var(--neutral-05);border-radius:var(--rounded-sm);corner-shape:squircle;width:100%;margin:.5em 0;position:relative;overflow:auto hidden}.table table{border-collapse:collapse;text-align:left;width:max-content;min-width:100%;margin:0;padding:0}.table table tr{transition:background-color .12s var(--fluid)}.table table tr:first-child th{padding-top:1em}.table table tr:last-child td{border-bottom:none;padding-bottom:1em}.table table tr:hover,.table table tr:focus-within{background-color:var(--neutral-02);outline:none}.table table th,.table table td{border-right:.0625rem solid var(--neutral-05);border-bottom:.0625rem solid var(--neutral-05);padding:.5em 1em}.table table th:last-child,.table table td:last-child{border-right:none}.table table th{background-color:var(--neutral-02);font-weight:600}
.blockquote{width:100%;margin:var(--space-01)0 0 0;padding:var(--space-01)var(--space-02);border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);corner-shape:squircle;background-color:var(--neutral-02);transition:border-color .24s var(--fluid);position:relative}.blockquote .icon{border:.0625rem solid var(--neutral-04);background-color:var(--neutral-02);width:1.625rem;height:1.625rem;transition:border-color .24s var(--fluid);border-radius:100%;justify-content:center;align-items:center;font-size:1em;display:flex;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.blockquote blockquote{flex-direction:column;gap:.5em;width:100%;margin:0;display:flex}.blockquote:hover,.blockquote:hover .icon{border-color:var(--neutral-05)}
.code-block{width:100%;position:relative}.code-block pre{border:.0625rem solid var(--neutral-04);background-color:var(--neutral-02);width:100%;transition:border-color .24s var(--fluid);margin:0;padding:2em;position:relative;overflow:auto hidden}.code-block pre code .token.comment{color:var(--neutral-07);text-transform:uppercase;font-size:.625rem;font-style:italic}.code-block pre code .token.property,.code-block pre code .token.tag .punctuation,.code-block pre code .token.tag .tag,.code-block pre code .token.tag .attr-name{color:var(--neutral-11)}.code-block pre code .token.function{color:var(--neutral-10)}.code-block:focus-within pre,.code-block:hover pre{border-color:var(--neutral-05)}
.copy-button{corner-shape:squircle;transition:border-color .24s var(--fluid),background-color .24s var(--fluid);background-color:#0000;border:.0625rem solid #0000;border-radius:.1875rem;padding:.5em;font-weight:500;position:absolute;top:.5em;right:.5em}.copy-button .icon{color:inherit;margin:0;font-size:1em;position:relative}.copy-button .icon-copy{transition:opacity .24s var(--elastic)}.copy-button .icon-check{opacity:0;transition:opacity .24s var(--fluid),transform .24s var(--elastic);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.copy-button:hover{border-color:var(--neutral-05)}.copy-button[data-state=copied] .icon-copy{opacity:0}.copy-button[data-state=copied] .icon-check{opacity:1;transform:translate(-50%,-50%)scale(1)rotate(-6deg)}
.example{width:100%}.example .preview{height:18rem;padding:var(--space-01);border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);corner-shape:squircle;transition:border-color .24s var(--fluid);justify-content:center;align-items:center;display:flex}.example .preview:hover{border-color:var(--neutral-05)}.example .code-block{min-width:0}.example .code-block pre{height:18rem;overflow:auto}
.tabs{width:100%;height:100%;margin-top:1em;position:relative}.tabs .list{justify-content:flex-end;gap:.5em;margin-bottom:1em;display:flex}.tabs .list .tab{appearance:none;color:var(--neutral-08);font-size:.625rem;font-weight:600;font-family:var(--font-commit-mono);text-transform:uppercase;cursor:pointer;background-color:#0000;border:none;padding:.5em 1.5em;position:relative}.tabs .list .tab .indicator{z-index:1;border:.0625rem solid var(--neutral-04);border-radius:var(--rounded-sm);corner-shape:squircle;background-color:var(--neutral-02);position:absolute;inset:0}.tabs .list .tab .label{z-index:2;position:relative}.tabs .panels{scroll-snap-type:x mandatory;width:100%;display:flex;overflow:auto}.tabs .panels .panel{scroll-snap-align:start;flex-shrink:0;width:100%}
