:root{--text-pt:13;--text-size:calc(var(--text-pt) * 1pt);font-size:var(--text-size);--border-width:2px;--card-outline-width:4px;--underline-width:1px;color-scheme:light;--color-accent:mediumpurple;--color-accent-text:light-dark(#fff,#000);--color-background:light-dark(#f9f8f4,#1a1a1a);--color-feature:light-dark(#ede8df,#252525);--color-feature-alternate:mediumseagreen;--color-grid:gray;--color-text:light-dark(#000,#e8e7e4);--color-text-contrast:light-dark(#000,#fff);--color-text-secondary:light-dark(#666,#8a8a8a);--dash-color:var(--color-feature);--dash-pattern:linear-gradient(to right, var(--dash-color) 0 50%, var(--color-background) 50%);--font:ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;font-family:var(--font);--grid-ch:1ch;--col:98ch;--page-gutter:2ch;--header-gap:2ch;--line:round(2.5ch, 1px);--h1-pt:18;--h2-pt:14.5;--h3-pt:14;--h1-size:calc(var(--h1-pt) * 1pt);--h2-size:calc(var(--h2-pt) * 1pt);--h3-size:calc(var(--h3-pt) * 1pt);--h1-step:1.5;--h2-step:1;--h3-step:1;--h1-tracking:calc(var(--h1-step) * var(--text-pt) / var(--h1-pt) * 1ch - 1ch);--h2-tracking:calc(var(--h2-step) * var(--text-pt) / var(--h2-pt) * 1ch - 1ch);--h3-tracking:calc(var(--h3-step) * var(--text-pt) / var(--h3-pt) * 1ch - 1ch);--content-w:round(down, min(var(--col), calc(100vw - 2 * var(--page-gutter))), var(--grid-ch));--content-left:calc((100vw - var(--content-w)) / 2);--viewport-bleed:calc(50% - 50vw)}@supports (width:1rch){:root{--grid-ch:1rch;--col:98rch;--page-gutter:2rch;--header-gap:2rch;--line:round(2.5rch, 1px)}}[data-subdomain]{--color-accent:mediumseagreen;--color-feature-alternate:mediumpurple}:root:has(.theme-picker input[value=dark]:checked){color-scheme:dark;--themed-img-light:none;--themed-img-dark:block}@media (prefers-color-scheme:dark){:root:has(.theme-picker input[value=auto]:checked){color-scheme:dark;--themed-img-light:none;--themed-img-dark:block}}*{box-sizing:border-box;text-decoration-thickness:var(--underline-width)}input[type=search]{appearance:none;border-radius:0}*+*{margin-top:var(--line)}html{background:var(--color-feature);overflow-y:scroll}body{background:var(--color-background);color:var(--color-text);font-family:var(--font);line-height:var(--line);margin:0;overflow-x:hidden}p{margin:0}*+p{margin-top:var(--line)}a{color:var(--color-text);text-decoration-line:underline}a:hover{text-decoration-line:none}strong{font-weight:700}::selection{background:var(--color-feature-alternate);color:var(--color-background)}.page-shell{isolation:isolate;width:var(--content-w);min-height:round(up, 100vh, var(--line));padding:var(--line) 0 0;flex-direction:column;margin:0 auto;display:flex;position:relative}.page-shell>main{flex:1 0 auto}.flow-reset>*,.site-header>*,.header-main>*,.header-brand-label>*,.header-explore-chip>*,.header-actions>*,.surface-band>*,.footer-controls>*,.theme-picker>*,.cell-overhang>*,.grid-overlay+*{margin-top:0}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.header-action-line{display:contents}.text-muted{color:var(--color-text-secondary)}.text-accent{color:var(--color-accent)}.text-alternate{color:var(--color-feature-alternate)}.surface-accent{--surface-color:var(--color-accent);isolation:isolate;background:var(--surface-color)}.accent-chip{background:var(--color-accent);color:var(--color-background);padding:0}.align-right{text-align:right}.cell-overhang{padding-inline:var(--grid-ch);margin-inline:calc(-1 * var(--grid-ch))}.button{height:calc(2 * var(--line));padding:0 calc(2 * var(--grid-ch));background:var(--color-feature);color:inherit;align-items:center;text-decoration-line:none;display:inline-flex}.button:hover{text-decoration-line:underline}.button--accent{background:var(--color-accent);color:var(--color-accent-text)}.button--accent:hover{color:var(--color-accent-text)}.mono-flow,.mono-section,.mono-copy{font-size:var(--text-size);line-height:var(--line)}.mono-flow>*{margin-top:0}.mono-section{margin-top:var(--line)}.mono-section-heading,.mono-copy{margin:0}.mono-copy>:first-child{margin-top:0}.mono-line{height:var(--line);font-size:var(--text-size);line-height:var(--line);align-items:flex-start;margin:0;display:flex}.mono-line-text{font-weight:700;display:block}.mono-line-text--trim{text-box-edge:cap alphabetic;text-box-trim:trim-both;line-height:1}.mono-line-text--h1{font-size:var(--h1-size);letter-spacing:var(--h1-tracking)}.mono-line-text--h2{font-size:var(--h2-size);letter-spacing:var(--h2-tracking);line-height:inherit}.mono-line-text--h3{font-size:var(--h3-size);letter-spacing:var(--h3-tracking);line-height:inherit}.mono-line--wrap{height:auto;min-height:var(--line)}.mono-icon{height:var(--line);line-height:var(--line);vertical-align:top;display:inline-block}.site-header{--header-edge:calc(2 * var(--grid-ch));--viewport-pinned-header-offset:calc((100vw - var(--col)) / -2 + var(--header-edge));--logo-w:calc(14 * var(--grid-ch));--logo-gap:calc(4 * var(--grid-ch));--nav-w:calc(20 * var(--grid-ch));align-items:baseline;gap:var(--grid-ch);width:100%;height:var(--line);display:flex;position:relative}.header-brand{top:0;left:min(0px, var(--viewport-pinned-header-offset));color:var(--color-text);margin-right:calc(5 * var(--grid-ch));white-space:nowrap;font-weight:700;position:absolute}.header-brand-label{align-items:baseline;column-gap:var(--grid-ch);width:var(--logo-w);display:inline-flex}.brand-icon-cell{width:calc(2 * var(--grid-ch));text-align:left;flex-shrink:0;display:inline-block}.header-brand-text{letter-spacing:var(--h3-tracking);flex-shrink:0}.header-brand:hover .header-brand-text{text-decoration-line:underline}.header-main{gap:var(--header-gap);min-width:0;max-width:var(--col);margin-left:round(nearest, min(calc(var(--logo-w) + var(--logo-gap)), max(0px, calc(var(--header-edge) + var(--logo-w) + var(--logo-gap) - var(--content-left)))), var(--grid-ch));margin-right:max(0px, calc(var(--header-edge) + var(--nav-w) - max(0px, (100vw - var(--col)) / 2)));flex:1;display:flex}.header-actions{top:0;right:min(0px, var(--viewport-pinned-header-offset));gap:calc(2 * var(--grid-ch));white-space:nowrap;display:flex;position:absolute}.site-header a,.footer a{text-decoration-line:none}.site-header a:hover,.footer a:hover{text-decoration-line:underline}.header-brand:hover,.site-header .header-explore-chip:hover{text-decoration-line:none}.header-explore-chip{align-self:stretch;align-items:center;gap:var(--grid-ch);padding:0 var(--grid-ch);background:var(--color-background);text-decoration-line:none;display:inline-flex;position:relative}.header-explore-chip:before{content:"";inset:calc(var(--border-width) / -2);border:var(--border-width) solid var(--color-feature);pointer-events:none;position:absolute}.header-explore-chip:hover:before{border-color:var(--color-text)}.header-explore-icon-cell{width:calc(2 * var(--grid-ch));margin-left:calc(3 * var(--grid-ch));text-align:right}.brand-icon,.header-brand-text,.header-explore-icon,.header-explore-text,.header-actions a{font-size:var(--h3-size)}.header-explore-text,.header-actions a{letter-spacing:var(--h3-tracking)}@media (width<=640px){:root{--page-gutter:var(--grid-ch)}.site-header{grid-template-columns:auto 1fr;grid-template-rows:var(--line) var(--line);row-gap:var(--line);padding-bottom:var(--line);height:auto;display:grid;position:relative}.site-header:before{content:"";top:calc(-1 * var(--line));bottom:0;left:var(--viewport-bleed);right:var(--viewport-bleed);z-index:-1;background:var(--color-feature);position:absolute}.header-brand{grid-area:1/1;margin-right:0;position:static}.header-main{max-width:none;margin:0;display:contents}.header-explore-chip{grid-area:1/2;justify-self:end}.header-explore-chip:before{border-width:0}.header-actions{grid-area:2/1/auto/-1;justify-content:flex-start;position:static}.header-rule{display:none}.surface-band.footer{margin-top:var(--line);padding-block:var(--line)}}.header-rule{height:var(--line);border:0;margin:0;position:relative;overflow:visible}.header-rule:before{content:"";top:calc(var(--line) - var(--border-width) / 2);left:var(--viewport-bleed);right:var(--viewport-bleed);height:var(--border-width);background-image:var(--dash-pattern);background-position-x:var(--content-left);background-size:calc(2 * var(--grid-ch)) 100%;position:absolute}[data-subdomain] .page-shell{padding-top:calc(2 * var(--line))}@media (width<=640px){[data-subdomain] .page-shell{padding-top:0}}.surface-band{padding:var(--line) 0;position:relative}.surface-band:before{content:"";z-index:-1;background:var(--color-feature);position:absolute;inset:0}.content-overhang-band{padding:calc(2 * var(--line)) 0}.content-overhang-band:before{left:max(var(--viewport-bleed), calc(-4 * var(--grid-ch)));right:max(var(--viewport-bleed), calc(-4 * var(--grid-ch)))}@media (width<=690px){.content-overhang-band{padding:var(--line) 0}}.grid-square-media{--grid-square-media-size:round(down, var(--grid-square-media-w,100%), var(--grid-ch));width:var(--grid-square-media-size);height:round(up, var(--grid-square-media-size), var(--line));background:0 0;display:block;overflow:hidden}.grid-square-media>img{object-fit:cover;object-position:top center;width:100%;height:100%;display:block}.grid-square-media>.themed-img-light{display:var(--themed-img-light,block)}.grid-square-media>.themed-img-dark{display:var(--themed-img-dark,none)}.ghost-text{color:var(--color-text-secondary);user-select:none}.play-button-background{fill:var(--play-button-bg)}.play-button-foreground{fill:var(--play-button-fg)}.feature-band{isolation:isolate;padding:calc(2 * var(--line)) calc(4 * var(--grid-ch));background-color:var(--color-feature);color:var(--color-text-contrast);position:relative;overflow:hidden}.feature-band:before{content:"";z-index:-1;background-image:var(--feature-band-image);opacity:.33;background-position:50%;background-size:cover;position:absolute;inset:0}@media (width<=640px){.feature-band{margin-inline:var(--viewport-bleed);padding:var(--line) var(--content-left)}}.link{text-decoration-line:none}.link:hover,.link .underline{text-decoration-line:underline}.no-underline{text-decoration-line:none;display:inline-block}.link:hover .no-underline{text-decoration-line:underline}.grid-overlay{z-index:999;pointer-events:none;opacity:.2;background-image:repeating-linear-gradient(var(--color-grid) 0 1px, transparent 1px 100%), repeating-linear-gradient(90deg, var(--color-grid) 0 1px, transparent 1px 100%), linear-gradient(to left, var(--color-grid) 1px, transparent 1px);background-size:var(--grid-ch) var(--line), var(--grid-ch) var(--line), 100% 100%;background-repeat:repeat,repeat,no-repeat;display:none;position:absolute;inset:0}body:has(.grid-toggle input:checked) .grid-overlay{display:block}.footer{align-items:flex-start;gap:var(--line);margin-top:calc(var(--line) * 2);padding-block:calc(var(--line) * 2);flex-direction:column;flex:none;display:flex}.footer:before{left:var(--viewport-bleed);right:var(--viewport-bleed)}.footer-controls{align-items:center;width:100%;display:flex}.theme-picker{gap:calc(2 * var(--grid-ch));white-space:nowrap;border:0;margin:0;padding:0;display:flex}.theme-picker--compact{gap:0}@media (scripting:none){.theme-picker,.footer-controls:not(:has(.grid-toggle-wrap)){display:none}}.theme-picker label,.grid-toggle{cursor:pointer;white-space:nowrap}.theme-picker label>span,.grid-toggle>span{height:var(--line);padding:0 var(--grid-ch);color:var(--color-text-secondary);vertical-align:top;background-color:#0000;align-items:center;margin-top:0;display:inline-flex}.theme-picker label>span{margin:0 calc(-1 * var(--grid-ch))}.theme-picker--compact label>span{width:var(--line);justify-content:center;margin:0;padding:0}.theme-picker label>span>*{margin-top:0}.grid-toggle>span{margin:0 calc(-1 * var(--grid-ch)) 0 0}.theme-picker label:hover .label-text,.grid-toggle:hover .label-text{text-decoration-line:underline}.theme-picker--compact label:hover>span{color:var(--color-text)}.grid-toggle:hover>span{text-decoration-line:underline}.theme-picker input,.grid-toggle input{opacity:0;pointer-events:none;position:absolute}.theme-picker input:checked+span,.grid-toggle input:checked+span{background-color:var(--color-accent);color:var(--color-accent-text)}.theme-picker--compact input:checked+span:hover{color:var(--color-text)}.footer-controls .grid-toggle-wrap{margin-left:auto}:root[data-play-theme=dark]{color-scheme:dark;--themed-img-light:none;--themed-img-dark:block}@media (prefers-color-scheme:dark){:root[data-play-theme=auto]{color-scheme:dark;--themed-img-light:none;--themed-img-dark:block}}html,body{background:var(--color-background);width:100%;height:100%;color:var(--color-text);overflow:hidden}#root{background:var(--color-background);width:100vw;height:100vh;margin-top:0}#root canvas{touch-action:none;user-select:none}#root *,#root *+*{margin-top:0}.global-spinner{pointer-events:none;place-content:center;display:grid;position:fixed;inset:0}.play-spinner-box{--spinner-step-x:calc(4 * var(--grid-ch));--spinner-step-y:calc(2 * var(--line));width:calc(2 * var(--spinner-step-x));height:calc(2 * var(--spinner-step-y));display:block;position:relative}.play-spinner-slot{width:var(--spinner-step-x);height:var(--spinner-step-y);place-items:center;animation:2s step-end infinite spinner-hop-position;display:grid;position:absolute;top:0;left:0}.play-spinner-face{width:var(--spinner-step-x);aspect-ratio:1;font-size:calc(2 * var(--h3-size));line-height:var(--spinner-step-x);transform-origin:50%;place-items:center;animation:2s step-end infinite spinner-hop-rotation;display:grid}button,input,select,textarea{font:inherit}.bug-report-trigger{top:var(--line);left:calc(2 * var(--grid-ch));z-index:5;height:calc(2 * var(--line));padding:0 calc(2 * var(--grid-ch));background:var(--color-accent);color:var(--color-accent-text);cursor:pointer;border:0;position:fixed}.bug-report-trigger:hover{text-decoration-line:underline}.bug-report-dialog{width:min(calc(76 * var(--grid-ch)), calc(100vw - 4 * var(--grid-ch)));height:fit-content;max-height:calc(100dvh - 4 * var(--line));padding:var(--line) calc(2 * var(--grid-ch));border:var(--border-width) solid var(--color-text);background:var(--color-background);color:var(--color-text);margin:0;position:fixed;inset:50% auto auto 50%;overflow:auto;transform:translate(-50%,-50%)}.bug-report-dialog::backdrop{background:linear-gradient(to right, color-mix(in srgb, var(--color-grid) 30%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, var(--color-grid) 30%, transparent) 1px, transparent 1px), color-mix(in srgb, var(--color-background) 52%, transparent);background-size:var(--grid-ch) var(--line), var(--grid-ch) var(--line), auto}.bug-report-form{gap:var(--line) calc(2 * var(--grid-ch));grid-template-columns:minmax(0,1fr);margin:0;display:grid}.bug-report-form>*{margin-top:0}.bug-report-header h2{height:var(--line);font-size:var(--h2-size);line-height:var(--line);letter-spacing:var(--h2-tracking);margin:0}.bug-report-field,.bug-report-screenshot{align-content:start;gap:var(--line);min-width:0;margin:0;display:grid}.bug-report-field>span{height:var(--line);color:var(--color-text-secondary);padding:0}.bug-report-field select,.bug-report-field textarea{border:var(--border-width) solid var(--color-text);background:var(--color-feature);width:100%;color:var(--color-text);border-radius:0}.bug-report-field select{height:calc(2 * var(--line));padding:0 var(--grid-ch)}.bug-report-field textarea{min-height:calc(6 * var(--line));padding:calc(.5 * var(--line)) var(--grid-ch);resize:vertical}.bug-report-screenshot{min-height:calc(8 * var(--line));padding:var(--line) calc(2 * var(--grid-ch));background:var(--color-feature)}.bug-report-screenshot img{width:100%;max-height:calc(12 * var(--line));object-fit:contain;background:var(--color-background);display:block}.bug-report-screenshot p{color:var(--color-text-secondary);margin:0}.bug-report-actions{align-items:center;gap:calc(2 * var(--grid-ch));grid-template-columns:1fr auto auto;display:grid}.bug-report-button{min-width:calc(12 * var(--grid-ch));height:calc(2 * var(--line));padding:0 calc(2 * var(--grid-ch));color:var(--color-text);cursor:pointer;border:0}.bug-report-button:hover{text-decoration-line:underline}.bug-report-button--cancel{background:var(--color-feature);color:var(--color-text)}.bug-report-button--submit{background:var(--color-accent);color:var(--color-accent-text)}.bug-report-button--submit:disabled{background:var(--color-feature);color:var(--color-text-secondary);cursor:wait}.bug-report-submit-status{width:calc(4 * var(--grid-ch));height:calc(2 * var(--line));justify-self:end;place-items:center;margin:0;display:grid}.bug-report-submit-spinner{--spinner-step-x:calc(2 * var(--grid-ch));--spinner-step-y:var(--line);color:var(--color-accent)}@media (width<=640px){.bug-report-dialog{max-height:calc(100dvh - 2 * var(--line))}.bug-report-form{gap:calc(.5 * var(--line)) calc(2 * var(--grid-ch));grid-template-columns:1fr}.bug-report-field,.bug-report-screenshot{gap:calc(.5 * var(--line))}.bug-report-field textarea{height:calc(4 * var(--line));min-height:calc(4 * var(--line))}.bug-report-screenshot{min-height:calc(4 * var(--line));padding:calc(.5 * var(--line)) var(--grid-ch)}.bug-report-screenshot img{max-height:calc(3 * var(--line))}.bug-report-actions{bottom:calc(-1 * var(--line));grid-template-columns:calc(4 * var(--grid-ch)) 1fr 1fr;padding-block:var(--line);background:var(--color-background);position:sticky}.bug-report-button{width:100%}}@keyframes fade-in{0%{opacity:0}}@keyframes spinner-hop-position{0%{top:0;left:0}25%{top:0;left:calc(4 * var(--grid-ch))}50%{top:calc(2 * var(--line));left:calc(4 * var(--grid-ch))}75%{top:calc(2 * var(--line));left:0}to{top:0;left:0}}@keyframes spinner-hop-rotation{0%{transform:rotate(0)}25%{transform:rotate(-90deg)}50%{transform:rotate(-180deg)}75%{transform:rotate(-270deg)}to{transform:rotate(-360deg)}}