*,:before,:after{box-sizing:border-box}html{scroll-padding-top:var(--space-xl);-webkit-text-size-adjust:100%}body{background:var(--color-bg);color:var(--color-text);font:var(--weight-regular) var(--text-body) / var(--leading-body) var(--font-sans);font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}img,video,svg{max-width:100%;display:block}h1,h2,h3,p,ul,ol,figure,pre{margin:0;padding:0}ul,ol{list-style:none}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}a{color:inherit}code,pre{font-family:var(--font-mono)}button{font:inherit;color:inherit}::selection{background:var(--color-selection)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-width)}.js-only{display:none!important}.js .js-only{display:inline-flex!important}.js .tabs.js-only{display:flex!important}.ways-list li,.demo-copy,.principle-grid li,.sheet-item,.formula-copy,.formula-figure,.install-item,.m-item{grid-template-columns:minmax(0,1fr)}.skip-link{top:var(--space-sm);left:var(--space-md);z-index:10;padding:var(--space-sm) var(--space-md);background:var(--color-bg);border:var(--rule-width) solid var(--color-text);position:fixed;transform:translateY(-200%)}.skip-link:focus{transform:none}.container{width:min(var(--page-width), calc(100% - 2 * var(--space-gutter)));margin-inline:auto}.section{padding-block:var(--space-xl);border-top:var(--rule-width) solid var(--color-rule)}.section-head{column-gap:var(--space-gutter);row-gap:var(--space-md);margin-bottom:var(--space-lg);grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.section-head h2{grid-column:1/span 5}.section-head p{color:var(--color-text-soft);max-width:var(--measure);grid-column:7/span 6}h1{font-size:var(--text-title);line-height:var(--leading-title);letter-spacing:var(--tracking-title);font-weight:var(--weight-semibold)}h2,.heading{font-size:var(--text-heading);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);font-weight:var(--weight-semibold)}h3{font-size:var(--text-body);line-height:var(--leading-heading);font-weight:var(--weight-semibold)}.lede{color:var(--color-text-soft)}.caption{font-size:var(--text-caption);line-height:var(--leading-caption);color:var(--color-text-muted)}.links{gap:var(--space-xs) var(--space-md);font-size:var(--text-ui);flex-wrap:wrap;display:flex}.links a,.lede a,.text-link{color:var(--color-link);text-decoration:underline;text-decoration-thickness:var(--rule-width);text-underline-offset:var(--underline-offset)}.links a:hover,.lede a:hover,.text-link:hover{text-decoration-thickness:var(--focus-width)}.button{align-items:center;gap:var(--space-sm);min-height:var(--control-height);padding:0 var(--space-md);border:var(--rule-width) solid var(--color-action);border-radius:var(--radius-sm);background:var(--color-action);color:var(--color-on-action);font-size:var(--text-ui);font-weight:var(--weight-medium);cursor:pointer;transition:background-color var(--duration) var(--ease);text-decoration:none;display:inline-flex}.button:hover{background:var(--color-text-soft)}.button.secondary{color:var(--color-text);border-color:var(--color-rule-strong);background:0 0}.button.secondary:hover{border-color:var(--color-text)}.actions{gap:var(--space-sm);flex-wrap:wrap;display:flex}.command{justify-content:space-between;align-items:center;gap:var(--space-md);min-height:var(--control-height);padding:0 var(--space-xs) 0 var(--space-md);border:var(--rule-width) solid var(--color-rule);border-radius:var(--radius-sm);background:var(--color-bg-subtle);font-size:var(--text-caption);display:flex}.command code{white-space:nowrap;overflow-x:auto}.prompt{color:var(--color-text-muted)}.copy{width:var(--control-height-small);height:var(--control-height-small);border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;flex:none;justify-content:center;align-items:center}.copy:hover{color:var(--color-text)}.copy svg{width:var(--icon-size);height:var(--icon-size)}.copy .done,.copy.copied .idle{display:none}.copy.copied .done{display:block}.site-header{z-index:5;background:var(--color-bg);border-bottom:var(--rule-width) solid var(--color-rule);position:sticky;top:0}.nav{height:var(--space-xl);justify-content:space-between;align-items:center;display:flex}.brand{align-items:center;gap:var(--space-sm);font-size:var(--text-ui);font-weight:var(--weight-semibold);text-decoration:none;display:inline-flex}.nav-links{align-items:center;gap:var(--space-lg);font-size:var(--text-ui);display:flex}.nav-links a{color:var(--color-text-soft);text-decoration:none}.nav-links a:hover{color:var(--color-text)}.hero{padding-block:var(--space-xl)}.hero-head{column-gap:var(--space-gutter);row-gap:var(--space-lg);margin-bottom:var(--space-xl);grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;display:grid}.hero-head h1{grid-column:1/span 6}.hero-side{gap:var(--space-gutter);grid-column:7/span 6;display:grid}.facts{gap:var(--space-xs) var(--space-lg);margin-top:var(--space-lg);font-size:var(--text-ui);color:var(--color-text-muted);flex-wrap:wrap;display:flex}.facts b{color:var(--color-text);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums}.clip{border-radius:var(--radius-md);background:var(--color-media);isolation:isolate;position:relative;overflow:hidden}.clip-poster,.clip-poster img,.clip-video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.clip-video{opacity:0;transition:opacity var(--duration) var(--ease)}.clip-video[data-live]{opacity:1}.clip-play{right:var(--space-md);bottom:var(--space-md);z-index:3;width:var(--control-height);height:var(--control-height);border-radius:var(--radius-sm);background:var(--color-on-media);color:var(--color-media);cursor:pointer;border:0;justify-content:center;align-items:center;display:none;position:absolute}@media (prefers-reduced-motion:reduce){.clip-play{display:inline-flex}}.clip-play[hidden]{display:none!important}.player-caption{justify-content:space-between;gap:var(--space-md);padding-top:var(--space-md);margin-top:var(--space-sm);font-size:var(--text-caption);line-height:var(--leading-caption);color:var(--color-text-muted);display:flex;position:relative}.track{height:var(--rule-width);background:var(--color-rule);position:absolute;inset:0 0 auto}.track-fill{background:var(--color-accent);transform-origin:0;transform:scaleX(var(--progress,0));position:absolute;inset:0}.player-time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;flex:none}.ways-list{gap:var(--space-gutter);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.ways-list li{align-content:start;gap:var(--space-md);display:grid}.ways-list p:not(.links){color:var(--color-text-soft)}:not(pre)>code{font-size:var(--text-code-inline)}.command code,.caption code{font-size:inherit}.section-head code,.install code{color:var(--color-text)}.code{padding:var(--space-md);border-radius:var(--radius-md);background:var(--color-code-bg);color:var(--color-code-text);font-size:var(--text-caption);line-height:var(--leading-body);tab-size:4;overflow-x:auto}.code .prompt,.tk-c{color:var(--color-code-muted)}.tk-s{color:var(--color-code-string)}.tk-n{color:var(--color-code-number)}.tk-k,.tk-m{color:var(--color-code-keyword)}.tk-t{color:var(--color-code-type)}.tk-f{color:var(--color-code-call)}.tabs{gap:var(--space-lg);margin-bottom:var(--space-lg);border-bottom:var(--rule-width) solid var(--color-rule);display:flex;overflow-x:auto}.tabs [role=tab]{margin-bottom:calc(-1 * var(--rule-width));padding:var(--space-sm) 0 var(--space-md);border:0;border-bottom:var(--focus-width) solid transparent;color:var(--color-text-muted);font-size:var(--text-ui);font-weight:var(--weight-medium);white-space:nowrap;cursor:pointer;background:0 0}.tabs [role=tab]:hover{color:var(--color-text)}.tabs [role=tab][aria-selected=true]{color:var(--color-text);border-bottom-color:var(--color-text)}.demo-panel{column-gap:var(--space-gutter);row-gap:var(--space-lg);grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;display:grid}.demo-panel+.demo-panel{margin-top:var(--space-xl)}.js .demo-panel+.demo-panel{margin-top:0}.js .demo-panel:not(.is-active){display:none}.demo-copy{gap:var(--space-md);grid-column:1/span 5;justify-items:start;display:grid}.demo-copy>p{color:var(--color-text-soft)}.demo-copy .code-block{width:100%}.code-file{margin-bottom:var(--space-sm);font-family:var(--font-mono);font-size:var(--text-caption);color:var(--color-text-muted)}.demo-panel .player{grid-column:6/span 7}.principle-grid{gap:var(--space-xl) var(--space-gutter);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.principle-grid li{align-content:start;gap:var(--space-sm);padding-top:var(--space-md);border-top:var(--rule-width) solid var(--color-text);display:grid}.principle-grid p{color:var(--color-text-soft);font-size:var(--text-ui)}.principle-grid .code{margin-top:var(--space-sm)}.sheet{gap:var(--space-lg) var(--space-gutter);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.sheet-item{align-content:start;gap:var(--space-xs);display:grid}.sheet-item .clip{margin-bottom:var(--space-sm)}.sheet-item h3 a{text-decoration:none}.sheet-item h3 a:hover{text-decoration:underline}.sheet-more{padding:var(--space-gutter);border:var(--rule-width) solid var(--color-rule);border-radius:var(--radius-md);align-content:center;justify-items:start}.sheet-more a{font-weight:var(--weight-semibold);color:var(--color-link)}.formula-grid{column-gap:var(--space-gutter);row-gap:var(--space-lg);grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;display:grid}.formula-copy{gap:var(--space-md);grid-column:1/span 5;justify-items:start;display:grid}.formula-copy p{color:var(--color-text-soft)}.formula-figure{gap:var(--space-md);grid-column:7/span 6;display:grid}.formula-art{color:var(--color-text)}.formula-art svg{width:100%;height:auto}.strip{scroll-padding-inline:max(var(--space-gutter), (100% - var(--page-width)) / 2);padding-inline:max(var(--space-gutter), (100% - var(--page-width)) / 2);scroll-snap-type:x proximity;scrollbar-width:thin;overflow-x:auto}.strip-track{gap:var(--space-gutter);width:max-content;padding-bottom:var(--space-md);display:flex}.m-item{gap:var(--space-sm);width:var(--strip-item-width);scroll-snap-align:start;display:grid}.m-item .caption{font-family:var(--font-mono);text-decoration:none}.m-item .caption:hover{color:var(--color-text);text-decoration:underline}.install-grid{gap:var(--space-lg) var(--space-gutter);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.install-item{gap:var(--space-md);align-content:start;display:grid}.faq-grid{column-gap:var(--space-gutter);row-gap:var(--space-lg);grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.faq-grid h2{grid-column:1/span 4}.faq-list{border-top:var(--rule-width) solid var(--color-rule);grid-column:5/span 8}.faq-list details{border-bottom:var(--rule-width) solid var(--color-rule)}.faq-list summary{justify-content:space-between;gap:var(--space-md);padding-block:var(--space-md);font-weight:var(--weight-medium);cursor:pointer;list-style:none;display:flex}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";color:var(--color-text-muted)}.faq-list details[open] summary:after{content:"−"}.faq-list details p{padding-bottom:var(--space-md);color:var(--color-text-soft);font-size:var(--text-ui);max-width:var(--measure)}.faq-list a{color:var(--color-link)}.teaser{width:min(var(--dialog-width), calc(100vw - 2 * var(--space-gutter)));border-radius:var(--radius-md);background:var(--color-media);border:0;padding:0;overflow:hidden}.teaser::backdrop{background:var(--color-backdrop)}.teaser video{aspect-ratio:16/9;width:100%;height:auto}.teaser form{top:var(--space-sm);right:var(--space-sm);z-index:1;position:absolute}.teaser-close{min-height:var(--control-height-small);padding:0 var(--space-md);border:var(--rule-width) solid var(--color-on-media);border-radius:var(--radius-sm);background:var(--color-media);color:var(--color-on-media);font-size:var(--text-caption);cursor:pointer}.site-footer{padding-block:var(--space-xl) var(--space-lg);border-top:var(--rule-width) solid var(--color-rule);font-size:var(--text-ui)}.footer-grid{gap:var(--space-lg) var(--space-gutter);grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.footer-about{align-content:start;gap:var(--space-md);color:var(--color-text-soft);grid-column:1/span 6;display:grid}.footer-about .brand{color:var(--color-text)}.footer-column{align-content:start;gap:var(--space-sm);grid-column:span 2;display:grid}.footer-column h3{font-size:var(--text-ui);margin-bottom:var(--space-xs)}.footer-column a{color:var(--color-text-soft);text-decoration:none}.footer-column a:hover{color:var(--color-text);text-decoration:underline}.footer-bottom{margin-top:var(--space-xl);padding-top:var(--space-md);border-top:var(--rule-width) solid var(--color-rule);font-size:var(--text-caption);color:var(--color-text-muted)}@media (width<=60rem){.hero-head h1,.hero-side,.section-head h2,.section-head p,.footer-about{grid-column:1/-1}.footer-column{grid-column:span 4}.demo-copy,.demo-panel .player,.formula-copy,.formula-figure,.faq-grid h2,.faq-list{grid-column:1/-1}.ways-list,.install-grid{gap:var(--space-lg);grid-template-columns:minmax(0,1fr)}.principle-grid,.sheet{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=40rem){h1{font-size:var(--text-title-small)}.desktop-link{display:none}.player-caption{gap:var(--space-xs);flex-direction:column}.footer-column{grid-column:1/-1}.principle-grid,.sheet{grid-template-columns:minmax(0,1fr)}.m-item{width:70vw}}