@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:500;src:url(./mali-thai-500-normal-D89rMT77.woff2)format("woff2"),url(./mali-thai-500-normal-Cph2qha9.woff)format("woff");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:500;src:url(./mali-vietnamese-500-normal-KDrNRwfW.woff2)format("woff2"),url(./mali-vietnamese-500-normal--OY07q2c.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:500;src:url(./mali-latin-ext-500-normal-BfJE4UMZ.woff2)format("woff2"),url(./mali-latin-ext-500-normal-FoLEyOKS.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:500;src:url(./mali-latin-500-normal-B01M-LP6.woff2)format("woff2"),url(./mali-latin-500-normal-Thgqw_9f.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:700;src:url(./mali-thai-700-normal-DjdebB47.woff2)format("woff2"),url(./mali-thai-700-normal-HU8A-eti.woff)format("woff");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:700;src:url(./mali-vietnamese-700-normal-cyBa8w1S.woff2)format("woff2"),url(./mali-vietnamese-700-normal-BxAmfcK6.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:700;src:url(./mali-latin-ext-700-normal-Bxl-P7gA.woff2)format("woff2"),url(./mali-latin-ext-700-normal-CjT8jNpY.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Mali;font-style:normal;font-display:swap;font-weight:700;src:url(./mali-latin-700-normal-UA1FHiAM.woff2)format("woff2"),url(./mali-latin-700-normal-DHEtm6Un.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--pad:max(12px, env(safe-area-inset-left));--pad-r:max(12px, env(safe-area-inset-right));--top:max(12px, env(safe-area-inset-top));--foot:calc(max(var(--sheet,0px), env(safe-area-inset-bottom)) + 14px);--ink:#3a2418;--ink-soft:#5c3d28;--paper:#f5e8cc;--paper-deep:#ead5a8;--cream:#fff4dc;--honey:#f3cf6e;--focus:#b8321f;--wood:repeating-linear-gradient(177deg, transparent 0 6px, #28120424 6px 7px, transparent 7px 13px), linear-gradient(#8d5a35, #6e4322 55%, #55331a);--grain:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .23 0 0 0 0 .14 0 0 0 0 .09 .5 0 0 0 -.17'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");--lift:2px 3px 0 #3a24186b;--drop:3px 5px 0 #3a241840, 6px 12px 22px #28180a47;--wobble:16px 21px 14px 22px / 20px 14px 22px 16px;--stick:132px;--run:80px}html,body{overscroll-behavior:none;height:100%;color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;font:500 13px/1.45 Mali,system-ui,sans-serif;overflow:hidden}body{background:linear-gradient(#9eabb9,#e3e9ef)}[hidden]{display:none!important}#stage{position:fixed;inset:0}#stage canvas{touch-action:none;display:block}button,input,pre,output,kbd{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}summary{cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}summary:focus-visible{outline-offset:-6px;border-radius:10px}#panel>summary:focus-visible{outline-color:var(--cream)}.paper{color:var(--ink);background:var(--grain), radial-gradient(130% 100% at 15% 0%, #fdf5e2 0%, var(--paper) 45%, var(--paper-deep) 100%);border:2px solid var(--ink);border-radius:var(--wobble);box-shadow:inset 0 0 0 3px #fff9e8bf, inset 0 0 0 4.5px #3a24184d, var(--drop)}#panel{top:var(--top);left:var(--pad);overscroll-behavior:contain;width:288px;max-height:calc(100% - 28px);position:fixed;overflow:auto}#panel>summary{z-index:1;background:var(--wood);min-height:46px;color:var(--cream);text-shadow:0 1px #1e0e0499;border-bottom:2px solid var(--ink);align-items:center;gap:10px;padding:0 16px;font-size:15px;font-weight:700;display:flex;position:sticky;top:0}#panel:not([open])>summary{border-bottom:0}#panel>summary:after,#stats>summary:after{content:"";border:2.5px solid;border-width:0 2.5px 2.5px 0;width:7px;height:7px;margin-left:auto;transition:transform .15s;transform:rotate(-45deg)}#panel[open]>summary:after,#stats[open]>summary:after{transform:translateY(-2px)rotate(45deg)}#panel .body{padding:2px 16px 16px}h3{color:var(--ink-soft);align-items:center;gap:8px;margin:12px 0 8px;font-size:13px;font-weight:700;display:flex}h3:after{content:"";border-top:2px dashed #3a24184d;flex:1}button{border:2px solid var(--ink);cursor:pointer;min-height:44px}#presets{grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:8px;display:grid}#presets button{background:var(--grain), linear-gradient(160deg, #fffbf1, #f0e0be);min-height:70px;box-shadow:var(--lift);border-radius:12px 15px 11px 16px/15px 11px 16px 12px;align-content:center;justify-items:center;gap:2px;padding:6px 4px;font-size:12px;line-height:1.25;transition:transform 80ms,box-shadow 80ms;display:grid}#presets svg{width:34px;height:34px}#presets button:hover{transform:translate(-1px,-1px);box-shadow:3px 4px #3a24186b}#presets button:active,#presets button[aria-pressed=true]{background:var(--grain), radial-gradient(circle at 35% 25%, #fdebb0, var(--honey));transform:translate(2px,3px);box-shadow:inset 2px 3px #3a241838}#presets button[aria-pressed=true]{font-weight:700}#sliders label{grid-template-columns:82px 1fr 42px;align-items:center;gap:8px;display:grid}output{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}input[type=range]{appearance:none;cursor:pointer;--p:50%;background:0 0;border-radius:10px;width:100%;height:44px;margin:0}input[type=range]::-webkit-slider-runnable-track{box-sizing:border-box;border:2px solid var(--ink);background:linear-gradient(90deg, #b8432a var(--p), transparent var(--p)), var(--wood);border-radius:7px;height:12px;box-shadow:inset 1px 2px 2px #0000004d}input[type=range]::-moz-range-track{box-sizing:border-box;border:2px solid var(--ink);background:var(--wood);border-radius:7px;height:12px}input[type=range]::-moz-range-progress{background:#b8432a;border-radius:5px 0 0 5px;height:8px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--ink);width:26px;height:26px;box-shadow:var(--lift);background:radial-gradient(circle at 35% 30%,#fffaf0,#ecd7aa 55%,#c9a46b);border-radius:50%;margin-top:-9px}input[type=range]::-moz-range-thumb{box-sizing:border-box;border:2px solid var(--ink);width:26px;height:26px;box-shadow:var(--lift);background:radial-gradient(circle at 35% 30%,#fffaf0,#ecd7aa 55%,#c9a46b);border-radius:50%}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.1)}#reset{background:var(--wood);width:100%;color:var(--cream);text-shadow:0 1px #1e0e0499;box-shadow:inset 1px 1px 0 #ffe6be40, var(--lift);border-radius:10px 13px 9px 14px/13px 9px 14px 10px;margin-top:12px;padding:6px 12px;font-weight:700}#reset:active{transform:translate(2px,3px);box-shadow:inset 2px 3px 4px #00000059}.hint{color:var(--ink-soft);border-top:2px dashed #3a24184d;margin:14px 0 0;padding-top:10px;font-size:12px}.for-coarse{display:none}#stats{top:var(--top);right:var(--pad-r);pointer-events:none;border-radius:12px 16px 10px 15px/15px 10px 16px 12px;max-width:calc(100% - 24px);position:fixed;transform:rotate(.8deg)}#stats>summary{pointer-events:auto;align-items:center;gap:10px;min-height:44px;padding:0 14px;font-weight:700;display:flex}#stats:before{content:"";background:#ecdeb6c7;border:1px solid #3a24182e;width:58px;height:18px;position:absolute;top:-9px;left:50%;transform:translate(-50%)rotate(-4deg)}#stats:not([open]):before{width:34px}#stats pre{white-space:pre;margin:-4px 0 0;padding:0 16px 12px;font-size:12px;line-height:1.6}#joystick,#run-btn{bottom:var(--foot);touch-action:none;-webkit-touch-callout:none;transition:bottom .2s;display:none;position:fixed}#joystick{left:var(--pad);width:var(--stick);height:var(--stick);box-sizing:border-box;border:3px solid var(--ink);box-shadow:inset 3px 4px 4px #ffe2b44d, inset -3px -4px 6px #00000059, var(--drop);background:repeating-radial-gradient(circle,#8c5a31 0 2px,#774723 2px 5px,#6a3d1d 5px 6px);border-radius:50%;place-items:center}#joystick:before{content:"";border:2px solid var(--ink);background:var(--grain), radial-gradient(circle at 40% 35%, var(--paper), var(--paper-deep));border-radius:50%;position:absolute;inset:18px;box-shadow:inset 3px 5px 6px #3a241859}#joystick .knob{box-sizing:border-box;border:2.5px solid var(--ink);width:60px;height:60px;color:var(--ink);background:radial-gradient(circle at 35% 30%,#fffdf6,#f1dfb8 60%,#d6b57e);border-radius:50%;place-items:center;transition:transform .22s cubic-bezier(.3,1.7,.5,1);display:grid;position:relative;box-shadow:3px 5px #3a241859}#joystick.active .knob{transition:none;box-shadow:2px 3px #3a241859}#joystick .knob svg{width:32px;height:32px}#run-btn{right:var(--pad-r);margin-bottom:calc((var(--stick) - var(--run)) / 2);width:var(--run);height:var(--run);border:3px solid var(--ink);color:var(--cream);text-shadow:0 1px #1e080099;box-shadow:inset 0 0 0 3px #ffecc84d, var(--drop);background:radial-gradient(circle at 38% 30%,#b9502f,#a13f25 50%,#7a2b17);border-radius:50%;align-content:center;place-items:center;padding:0;font-size:15px;font-weight:700;line-height:1}#run-btn svg{width:26px;height:26px;margin-bottom:2px}#run-btn.held{background:radial-gradient(circle at 38% 30%,#9a3d22,#7a2b17);transform:translate(2px,3px)scale(.96);box-shadow:inset 2px 4px 6px #00000073}#follow-btn{right:var(--pad-r);bottom:var(--foot);min-height:44px;font:inherit;cursor:pointer;align-items:center;gap:6px;padding:0 14px;font-size:13px;font-weight:700;transition:bottom .2s;display:flex;position:fixed}#follow-btn svg{width:22px;height:22px}#follow-btn[aria-pressed=true]{background:var(--grain), radial-gradient(circle at 35% 25%, #fdebb0, var(--honey));transform:translate(2px,3px);box-shadow:inset 2px 3px #3a241838}#keys{left:0;right:0;bottom:var(--foot);pointer-events:none;box-sizing:border-box;border-radius:12px 16px 10px 15px/15px 10px 16px 12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 14px;width:fit-content;max-width:calc(100% - 48px);margin:0 auto;padding:8px 16px;font-size:12px;display:flex;position:fixed}#keys b{font-size:13px}#keys>*{white-space:nowrap}kbd{box-sizing:border-box;border:1.5px solid var(--ink);background:linear-gradient(#fffaf0,#ecd9b0);border-radius:5px 6px;place-items:center;min-width:22px;height:22px;margin:0 1px;padding:0 4px;font-size:11px;font-weight:700;display:inline-grid;box-shadow:1px 2px #3a241873}@media (pointer:coarse){#follow-btn{bottom:calc(var(--foot) + var(--stick) + 10px)}#joystick,#run-btn{display:grid}#keys,.for-fine{display:none}.for-coarse{display:inline}}@media (height<=500px) and (pointer:coarse){:root{--stick:116px;--run:72px}#joystick .knob{width:54px;height:54px}}@media (pointer:coarse) and (width>=701px){#panel{max-height:calc(100% - var(--top) - var(--stick) - 40px - env(safe-area-inset-bottom))}}@media (width<=700px){#panel{width:auto;max-height:50%;padding-bottom:env(safe-area-inset-bottom);border-width:2px 0 0;border-radius:18px 18px 0 0;inset:auto 0 0}#panel>summary{padding:0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left))}#stats pre{font-size:11px}}
