.examples-section{padding:0 0 48px}.examples-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.example{min-width:0;padding:22px 24px 0;border:1px solid var(--line);border-radius:6px;color:#171717;background:#fff}.example h3{margin:0;font-size:13px;font-weight:500}.example-display,.example-playback{display:flex;align-items:center;justify-content:center;height:172px;width:100%}.example-playback{padding:0;background:none;border:0;color:inherit}.example-playback>span{width:100%}.example-controls{display:flex;justify-content:center;align-items:center;gap:8px;min-height:40px;margin:0 0 22px}.example-controls button{min-width:40px;min-height:36px;padding:6px 14px;font-size:12px;border:1px solid #d4d4d4;border-radius:4px;background:transparent;color:inherit}.example-controls button:hover{background:#f5f5f5}.example-controls button[aria-pressed=true]{background:#171717;color:#fff;border-color:#171717}.example-hint{font-size:11px;color:#737373}.example-code{border-top:1px solid var(--line);font-size:11px}.example-code summary{cursor:pointer;padding:14px 0;color:#737373;width:fit-content}.example-code pre{overflow-x:auto;margin:0;padding:4px 0 20px;font:11px/1.8 ui-monospace,monospace}.example-dark{background:#171717;color:#fff;border-color:#171717;--line: #383838}.example-dark .example-controls button{border-color:#666}.example-dark .example-controls button:hover{background:#333}.example-dark .example-code summary{color:#b3b3b3}.example-dark button:focus-visible,.example-dark summary:focus-visible{outline-color:#fff}@media(max-width:640px){.examples-grid{grid-template-columns:1fr}.example{padding:20px 18px 0}}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#171717;background:#fff;font-synthesis:none;color-scheme:light;--line: #e5e5e5;--muted: #737373}*{box-sizing:border-box}body{margin:0}html{scroll-padding-top:24px}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.4}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #171717;outline-offset:4px}input:focus-visible,select:focus-visible{outline:2px solid #171717;outline-offset:2px}svg{flex-shrink:0}.nav,main,footer{max-width:1120px;margin:0 auto}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:19px;font-weight:600;letter-spacing:-.5px;display:flex;align-items:center;gap:10px}.version{font-size:11px;font-weight:400;letter-spacing:0;color:var(--muted)}.nav nav{display:flex;align-items:center;gap:28px;font-size:13px;color:var(--muted)}.nav nav .active{color:#171717}.nav .github{display:flex;align-items:center;gap:6px}h1{font-size:24px;font-weight:500;letter-spacing:-.6px;margin:32px 0 22px}h2{font-size:17px;font-weight:500;margin:0 0 18px}.workbench{border:1px solid var(--line);border-radius:7px;display:grid;grid-template-columns:260px minmax(0,1fr);overflow:hidden}.settings{padding:22px;border-right:1px solid var(--line);background:#fafafa}.field{display:flex;flex-direction:column;gap:8px;font-size:12px;color:#525252}.field input{width:100%;border:1px solid #d4d4d4;border-radius:4px;background:#fff;color:#171717;padding:10px;font-size:17px}.between{height:25px;display:flex;justify-content:flex-end;align-items:center;color:#a3a3a3;padding-right:9px}.between svg{transform:rotate(90deg);width:12px}.font-field{margin-top:20px}.field-label{font-size:12px;color:#525252}.font-button{margin-top:8px;background:#fff;border:1px solid #d4d4d4;border-radius:4px;display:flex;align-items:center;gap:8px;width:100%;padding:9px;text-align:left;font-size:10px}.font-button>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.font-sample{font-size:18px}.font-button:hover{border-color:#737373}.text-button{border:0;background:none;font-size:11px;padding:8px 0;text-decoration:underline}.section-rule{height:1px;background:var(--line);margin:22px -22px}.range-field{display:block;margin:0 0 23px;font-size:12px;color:#525252}.range-field>span{display:flex;justify-content:space-between;margin-bottom:14px}.range-field output{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:#404040}.range-field output span{color:#737373}input[type=range]{appearance:none;width:100%;height:3px;background:#d4d4d4;border-radius:2px;cursor:pointer;display:block;margin:0}input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#262626}input[type=range]::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:#262626}.select-field{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#525252;gap:8px}.select-field select{max-width:140px;background:#fff;color:#262626;border:1px solid #d4d4d4;border-radius:4px;padding:7px 15px 7px 8px;font-size:11px}.advanced{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}.advanced summary{font-size:12px;color:#525252;cursor:pointer;list-style:none;display:flex;justify-content:space-between}.advanced[open] summary{margin-bottom:22px}.advanced summary::-webkit-details-marker{display:none}.canvas-panel{display:flex;flex-direction:column;min-width:0}.canvas-toolbar{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line)}.panel-title{font-size:12px;color:#737373}.switches{display:flex;gap:20px}.switches label{display:flex;gap:6px;align-items:center;font-size:11px;color:#737373;cursor:pointer}.switches input{accent-color:#171717;width:12px;height:12px;margin:0}.stage{position:relative;min-height:330px;flex:1;display:flex;align-items:center;justify-content:center;padding:45px 40px;overflow:hidden}.stage-center{width:100%;display:flex;align-items:center;justify-content:center;min-width:0}.stage-center [data-morphglyph]{max-width:100%}.stage-center svg{height:auto}.stage-caption{position:absolute;bottom:22px;font-size:11px;color:#737373}.outlines [data-morphglyph-svg] path{fill:none;stroke:currentColor;stroke-width:.65}.morph-label,.morph-label [data-morphglyph]{display:inline-flex;align-items:center;user-select:none}.transport{height:65px;display:flex;align-items:center;gap:12px;padding:0 20px;border-top:1px solid var(--line)}.play-button{background:#171717;color:#fff;border:0;border-radius:4px;padding:9px 12px;display:flex;gap:7px;align-items:center;font-size:12px;min-width:82px;justify-content:center}.play-button:hover{background:#404040}.icon-button{display:flex;align-items:center;justify-content:center;background:none;border:0;color:#737373;padding:6px}.icon-button:hover{color:#171717}.transport input{margin-left:7px;flex:1;min-width:20px}.progress-value{font:11px ui-monospace,monospace;color:#737373;min-width:35px;text-align:right}.presets{display:flex;align-items:center;gap:7px;padding:16px 20px;flex-wrap:wrap;border-top:1px solid var(--line)}.presets>span{font-size:11px;color:#737373;margin-right:6px}.presets button{border:1px solid var(--line);border-radius:4px;background:#fff;color:#737373;font-size:10px;padding:6px 9px}.presets button.selected{border-color:#a3a3a3;background:#f5f5f5;color:#171717}.presets button:hover{border-color:#737373}.error{font-size:12px;color:#171717;background:#f5f5f5;padding:12px 20px;margin:0;border-top:1px solid var(--line)}.code-section{padding:32px 0}.install-command{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 20px;margin-bottom:12px;border:1px solid var(--line);border-radius:6px;font-size:12px}.install-command code{user-select:all}.install-command a{color:#525252;padding:4px 0}.code-window{border:1px solid var(--line);border-radius:6px;background:#fafafa;overflow:hidden}.code-heading{height:42px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font:11px ui-monospace,monospace;color:#737373}.code-heading button{min-height:36px;padding:0 10px;display:flex;align-items:center;gap:6px;border:0;background:none;color:#525252;font-size:11px}.code-heading button>svg{width:16px;height:16px;flex-shrink:0}.code-window pre{margin:0;padding:20px;color:#262626;font:12px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.code-import{color:#737373}.api-section{padding:0 0 36px}.table-scroll{overflow-x:auto}table{border-collapse:collapse;text-align:left;font-size:12px;width:100%}th{font-weight:500;color:#525252}th,td{padding:12px 12px 12px 0;border-bottom:1px solid var(--line)}td{color:#737373}td code{color:#262626;font-size:11px;white-space:nowrap}.docs-link{display:inline-block;margin-top:18px;font-size:12px;text-decoration:underline;text-underline-offset:3px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:24px 0;font-size:11px;color:#737373}@media(max-width:1200px){.nav,main,footer{margin-left:32px;margin-right:32px}}@media(max-width:850px){.nav,main,footer{margin-left:24px;margin-right:24px}.workbench{grid-template-columns:230px minmax(0,1fr)}.settings{padding:18px}.section-rule{margin-left:-18px;margin-right:-18px}.stage{padding-left:20px;padding-right:20px}.transport{gap:6px;padding:0 14px}.presets{padding:14px}.presets>span{width:100%}}@media(max-width:620px){.nav,main,footer{margin-left:16px;margin-right:16px}.nav{height:64px}.brand{font-size:17px}.version{display:none}.nav nav{gap:18px;font-size:11px}.nav .github{font-size:0;gap:0}.nav .github span{display:none}h1{font-size:21px;margin:24px 0 18px}.workbench{display:flex;flex-direction:column}.canvas-panel{order:0}.settings{order:1;border-right:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:20px 16px;padding:18px}.between{display:none}.font-field{grid-column:1 / -1;margin:0}.section-rule{grid-column:1 / -1;margin:0 -18px}.range-field{margin:0}.select-field{align-self:center;flex-wrap:wrap}.advanced{grid-column:1 / -1;margin:0}.advanced[open] .range-field{margin-bottom:20px}.stage{min-height:230px;padding:40px 20px}.canvas-toolbar{height:47px;padding:0 16px}.presets{gap:6px;padding:13px}.presets>span{display:none}.presets button{font-size:9px;padding:6px 8px}.transport{height:60px}.play-button{min-width:72px;padding:9px 10px}.code-section{padding:25px 0}.code-window pre{font-size:11px;padding:16px}th,td{padding:10px 12px 10px 0;font-size:11px}td:nth-child(2){white-space:nowrap}}