@property --u{syntax:"<length>";inherits:true;initial-value:10px}html{color:#c4c4c4;--u:min(calc(7.5px * 1920 / 100cqi), calc(7.5px * 1920 / 100cqb), 10px);height:100dvh;font-family:ui-sans-serif,system-ui,sans-serif;font-size:var(--u);touch-action:none;overscroll-behavior:none;background:#000;margin:0;line-height:1.35;container-type:size}button,input,select,textarea,output{font:inherit;letter-spacing:inherit;color:inherit}body,#root{touch-action:none;background:#000;height:100%;margin:0;overflow:hidden}canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}canvas:active{cursor:grabbing}canvas.probe-on,canvas.probe-on:active{cursor:crosshair}.probe{pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;inset:0}.credit{bottom:max(1rem, env(safe-area-inset-bottom));left:max(1rem, env(safe-area-inset-left));z-index:2;color:#fff;-webkit-user-select:none;user-select:none;white-space:nowrap;pointer-events:none;gap:.5em;display:flex;position:fixed}.credit a{color:inherit;pointer-events:auto;touch-action:manipulation;text-decoration:none}.dev{touch-action:manipulation;--hi:#ececec;--lo:#777;--line:#2a2a2a;--fill:#161616;--inset:1rem;--edge:max(var(--inset), env(safe-area-inset-top,0px));--edge-r:max(var(--inset), env(safe-area-inset-right,0px));--edge-b:max(var(--inset), env(safe-area-inset-bottom,0px));--edge-l:max(var(--inset), env(safe-area-inset-left,0px));top:var(--edge);right:var(--edge-r);z-index:2;width:min(20rem, calc(100svw - var(--edge-l) - var(--edge-r) - 2px));max-height:calc(100svh - var(--edge) - var(--edge-b) - 2px);border:1px solid var(--line);corner-shape:squircle;background:#0a0a0ae0;border-radius:1rem;flex-direction:column;display:flex;position:fixed;overflow:hidden}.dev-bar,.dev-block{border-bottom:1px solid var(--line);flex-direction:column;gap:.5rem;padding:.75rem;display:flex}.dev-bar{flex-direction:row;flex-shrink:0;justify-content:space-between;align-items:center}.dev:not(.open) .dev-bar{border-bottom:0}.dev-title,.dev-toggle span,.dev-toggle label,.dev-knob span,.dev-fps span,.dev-pair span{font:inherit;color:var(--lo);margin:0;font-weight:600}.dev-title{color:var(--hi)}.dev-title,.dev-toggle span,.dev-toggle label,.dev-knob span,.dev-fps span,.dev-pair span{letter-spacing:.08em}.dev-body{overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:var(--line) transparent;flex-direction:column;flex:auto;min-height:0;display:flex;overflow:auto}.dev-toggle,.dev-pair,.dev-knob{grid-template-columns:1fr auto;align-items:center;gap:.5rem;display:grid}.dev-hint{color:var(--lo);margin:0}.dev-knob output,.dev-fps output,.dev-pair output{font-variant-numeric:tabular-nums;text-align:right;color:var(--hi)}.dev-knob input{appearance:none;cursor:pointer;background:0 0;grid-column:1/-1;width:100%;height:1.1rem;margin:0}.dev-knob input::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--hi) var(--knob), var(--line) var(--knob));border-radius:1px;height:2px}.dev-knob input::-webkit-slider-thumb{appearance:none;background:var(--hi);border-radius:50%;width:.7rem;height:.7rem;margin-top:-.29rem}.dev-knob input::-moz-range-track{background:var(--line);height:2px}.dev-knob input::-moz-range-progress{background:var(--hi);height:2px}.dev-knob input::-moz-range-thumb{background:var(--hi);border:0;border-radius:50%;width:.7rem;height:.7rem}.dev-fps{grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;display:grid}.dev-fps-plot{width:100%;height:1.1rem;display:block}.dev-fps-plot line{stroke:var(--lo);stroke-dasharray:2 2;stroke-width:1px}.dev-fps-plot polyline{fill:none;stroke:var(--hi);stroke-width:1.25px;stroke-linejoin:round;stroke-linecap:round}.dev button{appearance:none;background:var(--fill);border:1px solid var(--line);corner-shape:squircle;cursor:pointer;border-radius:.5rem;padding:.5rem .75rem}.dev select{border:1px solid var(--line);background:var(--fill);cursor:pointer;border-radius:.5rem;max-width:12rem;padding:.5rem .75rem}.dev button[aria-pressed=true],.dev button[aria-expanded=true]{border-color:var(--hi);color:var(--hi)}#root{position:relative}.fps-stick{z-index:1;pointer-events:none;opacity:0;background:#1115;border:1px solid #ffffff2e;border-radius:50%;width:7.25em;height:7.25em;transition:opacity .18s;position:fixed;top:0;left:0}.fps-stick[data-active=true]{opacity:1}.fps-stick span{background:#ececec55;border:1px solid #ffffff42;border-radius:50%;width:2.75em;height:2.75em;margin:-1.375em 0 0 -1.375em;position:absolute;top:50%;left:50%}.fps-touch{z-index:1;pointer-events:none;display:none;position:fixed;inset:0}.fps-lift{pointer-events:auto;right:calc(1rem + env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));gap:.5rem;display:flex;position:absolute}.fps-key{appearance:none;color:#ececec;letter-spacing:.06em;text-transform:uppercase;touch-action:none;-webkit-user-select:none;user-select:none;background:#101010b8;border:1px solid #2a2a2a;border-radius:50%;place-items:center;width:3.5rem;height:3.5rem;padding:0;font-size:.7rem;display:grid}.fps-key:active{border-color:#ececec}@media (pointer:coarse){.fps-touch{display:block}}
