.mx{--mx-red:#c60539;--mx-serif:"Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;--mx-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}.mx-stage{height:calc(100vh - var(--mx-top,4rem));height:calc(100svh - var(--mx-top,4rem));background:radial-gradient(at 50% 40%,#5a6e52 0%,#3a4831 70%,#232c1d 100%);min-height:22rem;position:relative;overflow:hidden}.mx-stage[data-setting=warehouse]{background:radial-gradient(at 50% 45%,#2a2825 0%,#18181a 65%,#121214 100%)}.mx-stage[data-setting=studio]{background:radial-gradient(at 50% 35%,#fff 0%,#f6f6f4 70%,#eeeeeb 100%)}.mx-stage>canvas{width:100%;height:100%;display:block}.mx-stage.is-free>canvas{cursor:grab}.mx-fallback{color:#e8eee2;font-family:var(--mx-serif);text-align:center;margin:0;position:absolute;inset:50% 1rem auto;translate:0 -50%}.mx-fallback[hidden]{display:none}.mx-spots{z-index:1;pointer-events:none;position:absolute;inset:0}.mx-spots[hidden]{display:none}.mx-spot{opacity:0;pointer-events:none;background:0 0;border:0;border-radius:50%;width:2.75rem;height:2.75rem;margin:-1.375rem 0 0 -1.375rem;padding:0;position:absolute;top:0;left:0}.mx-spot span{color:#fff;font:600 .75rem/1.4 var(--mx-serif);white-space:nowrap;background:#141414cc;border-radius:4px;padding:.15rem .5rem;position:absolute;top:calc(100% + .4rem);left:50%;translate:-50%}.mx-spot:focus-visible{opacity:1;outline:2px solid var(--mx-red);outline-offset:2px;box-shadow:0 0 0 5px #ffffffd9}.mx-corner,.mx-tools,.mx-hint,.mx-side{z-index:2;font:500 .75rem/1.4 var(--mx-mono);color:#f2f2f2;position:absolute}.mx-corner{z-index:3;gap:.3rem;display:flex;top:.6rem;left:.6rem}.mx-tools{gap:.3rem;display:flex;top:.6rem;left:50%;translate:-50%}.mx-side{pointer-events:none;flex-direction:column;align-items:flex-end;gap:.3rem;display:flex;top:.6rem;bottom:.6rem;right:.6rem}.mx-side>:not(.mx-perf){pointer-events:auto}.mx-tools[hidden],.mx-hint[hidden],.mx-side [hidden]{display:none}.mx-tool{color:inherit;font:inherit;white-space:nowrap;cursor:pointer;background:#1414148c;border:0;border-radius:4px;padding:.3rem .6rem}.mx-tool[aria-pressed=true]{background:var(--mx-red)}.mx-tool:focus-visible{outline:2px solid var(--mx-red);outline-offset:1px}.mx-tool--icon{align-items:center;gap:.4rem;display:inline-flex}.mx-tool--menu{padding:0;position:relative}.mx-tool--menu select{appearance:none;color:inherit;font:inherit;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;cursor:pointer;background:0 0;border:0;border-radius:4px;padding:.3rem 1.5rem .3rem .6rem}.mx-tool--menu select:focus-visible{outline:2px solid var(--mx-red);outline-offset:1px}.mx-tool--menu:after{content:"";pointer-events:none;border-bottom:1.5px solid;border-right:1.5px solid;width:.35rem;height:.35rem;position:absolute;top:50%;right:.6rem;translate:0 -70%;rotate:45deg}.mx-hint{text-align:center;pointer-events:none;background:#1414148c;border-radius:4px;width:max-content;max-width:calc(100% - 1.2rem);margin:0;padding:.3rem .7rem;bottom:.6rem;left:50%;translate:-50%}.mx-hint__touch{display:none}@media (hover:none) and (pointer:coarse){.mx-hint__mouse{display:none}.mx-hint__touch{display:inline}}.mx-pop>summary{-webkit-user-select:none;user-select:none;list-style:none;display:inline-block}.mx-pop>summary::-webkit-details-marker{display:none}.mx-pop[open]>summary{background:var(--mx-red)}.mx-pop__panel{width:min(24rem,100vw - 1.2rem);max-height:calc(100svh - var(--mx-top,4rem) - 3.5rem);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font:.875rem/1.55 var(--font-body);background:#141414d1;border-radius:6px;padding:.8rem .95rem .2rem;position:absolute;top:calc(100% + .3rem);left:0;overflow-y:auto}.mx-pop__title{color:#ff6f91;font:600 .7rem/1.4 var(--mx-mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .4rem}h3.mx-pop__title{margin-top:1rem}.mx-pop__panel p{margin:0 0 .7rem}.mx-pop__panel :is(strong,cite){color:#fff}.mx-pop__panel a{color:#ff8fa9;text-decoration-color:#ff8fa973}.mx-pop__panel a:where(:hover,:focus-visible){color:#ffc2d0;text-decoration-color:currentColor}.mx-pop__panel kbd{min-width:1.5em;font:600 .75rem/1.35 var(--mx-mono);text-align:center;border:1px solid #ffffff59;border-bottom-width:2px;border-radius:3px;padding:0 .3em;display:inline-block}.mx-keys{grid-template-columns:auto 1fr;gap:.4rem .8rem;margin:0 0 .8rem;display:grid}.mx-keys dt{color:#ffffffa6;font:600 .7rem/1.55rem var(--mx-mono);letter-spacing:.04em}.mx-keys dd{margin:0}.mx-debug{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#141414b8;border-radius:6px;gap:.4rem;width:max-content;max-width:min(22rem,100vw - 1.2rem);min-height:0;padding:.6rem .7rem;display:grid;overflow-y:auto}.mx-debug__stats{border-top:1px solid #fff3;padding-top:.4rem}.mx-perf{background:#1414149e;border-radius:6px;flex:none;gap:.3rem;padding:.4rem .5rem;font-size:.6875rem;display:grid}.mx-perf canvas{width:180px;height:28px;display:block}.mx-perf pre{font:inherit;white-space:pre;margin:0}.mx-debug__row{align-items:center;gap:.5rem;display:flex}.mx-debug__row input[type=range]{accent-color:var(--mx-red);flex:1}.mx-debug__row button{color:inherit;font:inherit;cursor:pointer;background:0 0;border:1px solid #ffffff4d;border-radius:4px;padding:.2rem .5rem}.mx-debug__readout{font:inherit;white-space:pre;margin:0}@media (width<=36rem){.mx-tools{top:auto;bottom:.6rem}.mx-hint,.mx-side{bottom:2.9rem}}@media (prefers-color-scheme:dark){.mx{--mx-red:#ff4f7a}}