html,body.mx-app{margin:0;height:100%;overflow:hidden;background:#111}body.mx-app{display:flex;flex-direction:column;font-family:monospace}.mx-hamburger{position:fixed;top:8px;left:8px;z-index:30;width:40px;height:40px;font-size:18px;background:#262842;color:#edebf5;border:1px solid #565a82;border-radius:4px;cursor:pointer}.mx-toolbar{display:none;flex-direction:column;align-items:stretch;gap:10px;position:fixed;inset:0 0 auto;z-index:20;padding:56px 16px 16px;background:#1a1b2e;border-bottom:2px solid #43456a;font-family:monospace;font-size:14px;color:#edebf5;max-height:100%;overflow-y:auto;box-sizing:border-box}.mx-toolbar.mx-open{display:flex}.mx-toolbar .mx-field{display:flex;align-items:center;gap:6px}.mx-toolbar select,.mx-toolbar button,.mx-toolbar .mx-home{font-family:monospace;font-size:13px;background:#262842;color:#edebf5;border:1px solid #565a82;padding:6px 8px;cursor:pointer}.mx-toolbar .mx-home{display:block;text-align:center;text-decoration:none;box-sizing:border-box}.mx-toolbar .mx-volume{width:90px}.mx-toolbar .mx-status{color:#8a8;font-size:12px;margin-top:auto}.mx-main{flex:1;min-height:0;display:flex;flex-direction:column}.mx-canvas-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.mx-canvas-wrap canvas{display:block;image-rendering:pixelated}@media(min-width:700px){body.mx-app{flex-direction:row}.mx-hamburger{display:none}.mx-toolbar{display:flex!important;position:static;inset:auto;order:1;width:220px;flex-shrink:0;height:100%;padding:16px;border-bottom:none;border-right:2px solid #43456a}.mx-main{order:2}}.mx-vkb{gap:4px;padding:10px;background:#16171f;border-top:2px solid #43456a;-webkit-user-select:none;user-select:none;touch-action:none}.mx-vkb-flex{display:flex;flex-direction:column}.mx-vkb-grid{display:grid}.mx-vkb-row{display:flex;gap:4px}.mx-vkb[hidden]{display:none}.mx-vkb-key{min-width:0;min-height:0;padding:4px 2px;font-family:monospace;font-weight:700;font-size:11px;line-height:1.25;white-space:pre-line;color:#e8e8ea;background:#3a3b42;border:none;border-radius:5px;box-shadow:inset 0 2px #ffffff1f,inset 0 -3px #00000059,0 2px 2px #0006;display:flex;flex-direction:column;justify-content:center;gap:1px}.mx-vkb-top{display:flex;justify-content:space-between;font-size:7px;font-weight:400;line-height:1;min-height:8px}.mx-vkb-top span:empty:not(.mx-vkb-swatch){visibility:hidden}.mx-vkb-swatch{width:7px;height:7px;border-radius:2px;align-self:center;box-shadow:0 0 0 1px #0006}.mx-vkb-main{font-size:13px}.mx-vkb-bottom{font-size:7px;font-weight:400;color:#b8b8c0;line-height:1;min-height:8px}.mx-vkb-bottom:empty{visibility:hidden}.mx-vkb-key:active{box-shadow:inset 0 2px 4px #00000080;transform:translateY(1px)}.mx-vkb-locked{box-shadow:inset 0 0 0 2px #7fb8ae,inset 0 2px 4px #00000080}.mx-vkb-green{background:#3c8a52}.mx-vkb-red{background:#b0392f}.mx-vkb-blue{background:#2f6fa8}.mx-vkb-rubber{background:#9c9890;padding:12px 8px}.mx-vkb-rubber .mx-vkb-key{background:#232323;box-shadow:inset 0 1px #ffffff14,0 2px 3px #00000080}.mx-vkb-rubber .mx-vkb-key:active{box-shadow:inset 0 1px 4px #0009}.mx-vkb-rubber .mx-vkb-main{font-size:16px;color:#f0f0f0}.mx-vkb-rubber .mx-vkb-green{background:#2f9e44}.mx-vkb-rubber .mx-vkb-blue{background:#2f6fa8}.mx-vkb-plus{background:#1b1b1b;padding:10px 8px}.mx-vkb-plus .mx-vkb-key{background:#333;border-radius:8px;box-shadow:inset 0 2px 1px #ffffff26,inset 0 -4px #0006,0 2px 2px #0009}.mx-vkb-plus .mx-vkb-key:active{box-shadow:inset 0 2px 5px #000000b3}.mx-vkb-plus .mx-vkb-main{font-size:15px;color:#f0f0f0}.mx-vkb-rainbow{border-radius:4px;background:linear-gradient(to bottom,#2f6fa8 0% 20%,#c0392b 20% 40%,#e07b1a 40% 60%,#d4c02a 60% 80%,#3ca35c 80% 100%)}