@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}:root{--control-height: calc(var(--unit) * 2.25);--control-text-size: calc(var(--unit) * 1);--control-radius: calc(var(--unit) * .75);--control-text-color: #fff;--control-shadow: 0 calc(var(--unit) / 2) var(--unit) rgba(0, 0, 0, .25);--control-hover: #777;--primary-object-color: #555;--secondary-object-color: #aaa;--menu-item: 3rem;--menu-bottom: 1rem;--primary-font-family: "Arial", sans-serif;--primary-color: #ffa500;--primary-color-translucent: rgba(255, 165, 0, .5);--secondary-color: #ffd000;--window-color: #222;--page-color: #333;--faded-text: #eee;--background-image-size: 30px;--panel-maxwidth: 600px;--h1-size: 1.75rem;--regular-text-size: calc(var(--unit) * .75);--footer-font-size: .75rem;--unit: 20px;--transition-popup: .3s;--tempo-hover-color: var(--secondary-object-color);--reload-gap: calc(var(--unit) * -.667)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;text-align:center}input[type=number]{font-size:var(--control-text-size)}html{padding:0;height:100%;min-height:100dvh;overflow:hidden;background-color:var(--page-color)}body{font-family:var(--primary-font-family);font-size:var(--regular-text-size);background-color:var(--page-color);background-image:url(/assets/tile-diagonal-CuJPclXR.png);background-size:var(--background-image-size);color:var(--primary-object-color);min-height:100%;margin:0;padding:0;box-sizing:border-box;transition:background-color .5s ease}a{color:var(--secondary-object-color);text-decoration:none;transition:color .3s ease}a:hover{color:var(--control-text-color)}#page{display:flex;flex-direction:column;justify-content:space-between;text-align:center;align-items:center;height:100dvh;width:100%;box-sizing:border-box}.panel-container{position:relative;display:flex;flex:0;flex-direction:column;gap:calc(var(--unit) * .75);justify-content:center;max-width:var(--panel-maxwidth);width:100%;padding:var(--unit);border-radius:calc(var(--unit) * 1.5) calc(var(--unit) * 1.5) calc(var(--unit) * 1.5) calc(var(--unit) * 1.5);background-color:var(--window-color);background-size:var(--background-image-size);box-sizing:border-box;transition:border-radius .5s ease,border .5s ease,background-color .5s ease;border-bottom:calc(var(--unit) / 2) solid #111}#notice{position:relative;display:flex;flex-direction:row;font-size:var(--regular-text-size);padding-top:var(--unit);justify-content:center}#footer{display:flex;flex-direction:column;width:100%;justify-content:center;align-items:center;color:var(--primary-font-color);font-size:var(--footer-font-size);padding:0 0 calc(var(--unit) * 1) 0}#modal{position:fixed;display:flex;justify-content:center;align-items:flex-start;inset:0;z-index:100;background-color:#00000080;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:1}#modal-window{color:var(--secondary-object-color);position:relative;display:flex;flex-direction:column;padding:calc(var(--unit) * .5) 0 calc(var(--unit) * 1) 0;border-radius:var(--control-radius);background-color:#333;box-sizing:border-box;box-shadow:0 calc(var(--unit) / 2) var(--unit) #00000080;z-index:100;opacity:1;margin:var(--unit);width:100%;flex:1;max-width:var(--panel-maxwidth);min-height:calc(var(--unit) * 10);overflow:hidden}#modal-window-viewport{overflow-y:auto;padding:0 var(--unit);flex:1 1 auto;scrollbar-color:var(--secondary-object-color) rgba(0,0,0,0)}#modal-window-header{display:flex;position:relative;justify-content:center;align-items:center;margin:calc(var(--unit) * .5) var(--unit) var(--unit) var(--unit);box-sizing:border-box}#modal-window-close{position:absolute;font-size:var(--unit);right:calc(var(--unit) * .25);z-index:102;color:#aaa;cursor:pointer}#modal-window-close:hover{transition:color .2s ease;color:var(--control-text-color)}#modal a{color:var(--primary-color)}#modal a:hover{color:var(--secondary-color)}#modal h1{font-size:var(--h1-size);color:var(--control-text-color);margin:0;text-align:center;margin-bottom:calc(var(--h1-size) * .5)}#modal h2{font-size:var(--control-text-size);color:var(--control-text-color);margin-top:calc(var(--control-text-size) * 2);margin-bottom:calc(var(--control-text-size) / 2)}#emphasis{color:var(--control-text-color)}#help{text-align:justify}#help-button,#config-button,#copyURL-button,#refresh-button{font-size:var(--control-text-size);color:var(--secondary-object-color);position:absolute;cursor:pointer;transition:color .3s ease}#config-badge{display:none;position:absolute;background-color:orange;z-index:2;width:calc(var(--unit) * .75);height:calc(var(--unit) * .75);top:calc(var(--unit) * -.25);right:calc(var(--unit) * -.25);border-radius:50%;font-size:calc(var(--unit) * .5);color:#000}#copyURL-button{font-size:var(--control-text-size);color:var(--secondary-object-color);left:var(--unit);bottom:var(--unit);cursor:pointer;transition:color .3s ease;display:flex;justify-content:center}#copyURL-tooltip-button-inside,#copyURL-tooltip-button-outside{position:absolute;background-color:#000c;color:#fff;padding:calc(var(--unit) * .25) calc(var(--unit) * .5);border-radius:calc(var(--unit) * .25);opacity:0;left:0;bottom:var(--unit);transition:opacity .3s;pointer-events:none;z-index:1000;font-size:var(--regular-text-size);white-space:nowrap}#refresh-button{position:absolute;font-size:var(--control-text-size);color:var(--secondary-object-color);right:var(--unit);bottom:var(--unit);cursor:pointer;transition:color .3s ease;display:flex;justify-content:center}#refresh-button-text{position:absolute;font-size:calc(var(--unit) * .5);bottom:var(--reload-gap)}#help-button{left:var(--unit);top:var(--unit)}#config-button{right:var(--unit);top:var(--unit)}#help-button:hover,#config-button:hover,#refresh-button:hover,#copyURL-button:hover{color:var(--control-text-color)}#configuration{display:flex;flex-direction:column}#toprow-container{display:flex;justify-content:center;gap:calc(var(--unit) * .75)}#steadyrow-container{display:flex;position:relative;justify-content:center;align-items:center;background-color:#555555bf;border-radius:var(--control-radius);gap:calc(var(--unit) * .75)}#steady-ui-connector{display:none}#logos-container{display:flex;flex-direction:column;justify-content:center}#logos-container-mobile{display:none;flex-direction:column;justify-content:center;max-width:var(--panel-maxwidth);width:100%;align-items:center;text-align:center}.logo{width:37.5%;align-self:center;transition:width 1s ease;color:var(--primary-object-color)}.logo svg{color:var(--primary-object-color);transition:color .3s ease}.logo svg path{fill:var(--secondary-object-color)}#beats-logo{width:25%;align-self:center;color:var(--primary-color)}.beats-logo-drummachine{padding-bottom:0}#beats-logo-modal{width:80%}#beats-logo-container{display:flex;flex-direction:row;justify-content:center;align-items:center}#beats-logo-decoration-left{background:linear-gradient(to left,var(--primary-color),transparent);width:20%;height:calc(var(--unit) / 4);margin-right:var(--unit)}#beats-logo-decoration-right{background:linear-gradient(to right,var(--primary-color),transparent);width:20%;height:calc(var(--unit) / 4);margin-left:var(--unit)}input,button{font-family:var(--primary-font-family);color:var(--control-text-color);box-sizing:border-box;width:100%;border:none;border-radius:var(--control-radius);font-weight:700;height:var(--control-height);-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:var(--control-text-size);justify-content:center;align-items:center;text-align:center;text-align-last:center}button{display:flex;justify-content:center;align-items:center;background-color:var(--primary-object-color);color:var(--control-text-color);cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background-color .3s ease;text-wrap:nowrap;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:none;transition:height .5s ease}.small-button{height:auto;font-size:var(--regular-text-size);font-weight:400;width:auto;padding:calc(var(--unit) / 4) calc(var(--unit) / 2) calc(var(--unit) / 4) calc(var(--unit) / 2);border-radius:calc(var(--unit) * .325)}button:hover{background:var(--control-hover)}.dropdownbutton-container{z-index:5}.dropdownbutton-container.kit{width:40%}.dropdownbutton-container.timesignature{min-width:20%}.dropdownbutton-container.feel{width:40%}.dropdownbutton-container.timesignature{width:20%}.dropdownbutton-container.steadyinst{width:38%}.dropdownbutton-container.steadypat{width:62%}.dropdownbutton-container.loop{width:100%}.dropdownbutton-dropdown{display:none;position:absolute;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:5000;width:100%;top:0;min-width:calc(var(--unit) * 2);min-height:var(--control-height);color:var(--control-text-color);border-radius:var(--control-radius);background:#555555bf;backdrop-filter:blur(var(--unit));-webkit-backdrop-filter:blur(var(--unit));-moz-backdrop-filter:blur(var(--unit));box-shadow:0 calc(var(--unit) / 2) var(--unit) #00000080;overflow:hidden;transform:scaleY(0);transform-origin:top;transition:transform .15s ease,opacity .15s ease;opacity:0;cursor:default}.dropdownbutton-dropdown{display:none;position:absolute;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:100;width:100%;top:0;min-width:calc(var(--unit) * 2);min-height:var(--control-height);color:var(--control-text-color);border-radius:var(--control-radius);background:#555555bf;backdrop-filter:blur(var(--unit));-webkit-backdrop-filter:blur(var(--unit));-moz-backdrop-filter:blur(var(--unit));box-shadow:0 calc(var(--unit) / 2) var(--unit) #00000080;overflow:hidden;left:0;transform:scaleY(0);transform-origin:top;transition:transform .15s ease,opacity .15s ease;opacity:0;cursor:default}.dropdownbutton-dropdown.small{border-radius:calc(var(--control-radius) * .5)}.dropdownbutton-dropdown.open{display:block;transform:scaleY(1);opacity:1}.dropdownbutton-dropdown.dropup{top:auto;transform-origin:bottom}.dropdownbutton-dropdown-list{display:flex;flex-direction:column;align-items:flex-start;width:100%;height:auto;overflow-y:scroll}.dropdownbutton-dropdown-choice{width:100%;min-height:var(--menu-item);align-items:center;border-bottom:none;border-bottom:1px solid var(--control-hover);font-size:var(--regular-text-size);display:flex;flex-direction:row;text-align:left;box-sizing:border-box}.dropdownbutton-dropdown-choice.beats{min-height:auto;flex-direction:column;justify-content:left;align-items:flex-start}.choice-main{width:100%;min-height:var(--menu-item);align-items:center;font-size:var(--regular-text-size);display:flex;flex-direction:row;text-align:left;box-sizing:border-box}.choice-details{width:100%;display:flex;flex-direction:row}.choice-details-content{justify-content:left;width:100%;min-height:var(--menu-item);display:flex;align-items:center;color:var(--secondary-object-color);font-size:calc(var(--regular-text-size) * .75);position:relative}.choice-details-content:before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(to right,transparent,var(--control-hover))}.dropdownbutton-dropdown-choice:last-child{border-bottom:none}.dropdownbutton-dropdown-choice.last-visible-choice{border-bottom:none}.dropdownbutton-dropdown-choice:hover{background:var(--control-hover)}.dropdownbutton-dropdown-choice.disabled{opacity:.5;cursor:default}.dropdownbutton-dropdown-choice.disabled:hover{background:transparent}.dropdownbutton-dropdown-choice.flash{animation:flashBackground .3s forwards}@keyframes flashBackground{0%{background-color:#fff0}50%{background-color:#ffffff80}to{background-color:#fff0}}.bold{font-weight:700}.checkspace{display:flex;align-items:center;justify-content:center;font-size:var(--regular-text-size);min-width:calc(var(--unit) * 1.5)}.morespace{display:flex;color:var(--secondary-object-color);justify-content:center;align-items:center;min-width:var(--menu-item);min-height:100%;box-sizing:border-box;transition:color .2s ease-out;visibility:hidden;pointer-events:none}.morespace:hover{color:var(--control-text-color)}.dropdownbutton-divider{width:100%;display:flex;flex-direction:row;height:auto}.dropdownbutton-dropdown-categories{display:flex;flex-direction:column;min-width:30%;justify-content:flex-start;background:var(--primary-object-color);overflow-y:auto}.dropdownbutton-dropdown-categories-choice{width:100%;min-height:var(--menu-item);align-items:center;font-size:var(--regular-text-size);display:flex;flex-direction:row;text-align:left;box-sizing:border-box;padding:0 0 0 var(--control-radius)}.dropdownbutton-dropdown-categories-choice.selected,.dropdownbutton-dropdown-categories-choice:hover{background:var(--control-hover)}.gradient-random,.random{background:linear-gradient(to right,#ff78b5,#09f);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.invisible-overlay{position:fixed;top:0;left:0;width:100dvw;height:100dvh;background-color:#00000040;z-index:99;visibility:hidden}ul,ol{list-style:none;padding-left:calc(var(--regular-text-size) / 2)}li:not(:last-child){padding-bottom:calc(var(--regular-text-size))}ul li,ol li{position:relative;padding-left:calc(var(--regular-text-size))}ul li:before{content:"★";font-size:calc(var(--regular-text-size) / 2);line-height:var(--regular-text-size);position:absolute;left:0}ol li:before{counter-increment:list-counter;content:counter(list-counter) ". ";position:absolute;left:0}ol{counter-reset:list-counter}#play-stop{background-color:var(--primary-color);color:#000;position:relative}#play-stop:hover{background-color:var(--secondary-color)}#play-stop:focus{background-color:var(--primary-color)}#play-container{position:relative}#current-measure{position:absolute;z-index:1;font-size:calc(var(--control-text-size) * 4);font-weight:700;display:none;align-items:center;justify-content:center;color:#ffd000;width:100%;height:100%;pointer-events:none;text-shadow:0 0 calc(var(--unit) / 2) #ffd000;transform-origin:center}#beat-text{position:relative;z-index:2}#drum-kit{min-width:40%}#beat-steady-container{display:flex;flex-direction:column;background-color:#46464680;gap:var(--unit);border-radius:var(--control-radius)}#steady-instrument{min-width:38%}#steady-pattern{min-width:62%}#time-signature-button{min-width:20%}.dropdown-button{min-width:21}#feel{min-width:40%}#feel:hover{background-color:var(--control-hover)}.nowrap{white-space:nowrap}.swiper-container{position:relative;box-sizing:border-box;width:100%;border:none;border-radius:var(--control-radius);font-weight:700;height:var(--control-height);background-color:var(--primary-object-color);color:#fff;text-align:center;font-size:var(--control-text-size);overflow:none;display:flex;align-items:center;transition:background-color .3s ease;justify-content:center;cursor:grab;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.swiper-container:hover{background-color:var(--control-hover)}.swiper-wrapper{transition-timing-function:ease-out;width:100%}.randomize-container{display:flex;justify-content:center;align-items:center}.generate-container{display:flex;justify-content:center}#generate-button{color:var(--secondary-object-color);display:flex;flex-direction:row;gap:calc(var(--unit) * .5);transition:color .3s ease,background-color .3s ease}#generate-button:hover{color:var(--control-text-color);background-color:var(--control-hover)}#generate-button-desktop{color:var(--secondary-object-color);display:flex;flex-direction:row;gap:calc(var(--unit) * .5);transition:color .3s ease,background-color .3s ease}#generate-button-desktop:hover{color:var(--control-text-color);background-color:var(--control-hover)}.desktop-panel-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}.mobile-only{display:flex}.desktop-only{display:none!important}@media (min-width: 601px){.mobile-only{display:none}.desktop-only{display:flex!important}.desktop-panel-wrapper{gap:var(--unit)}#modal{align-items:center}}#swiper-textbox{display:flex;position:absolute;align-items:center;justify-content:center;width:20%;height:100%;z-index:5;pointer-events:none}#tempo-entry{z-index:2;padding:0;margin:0;height:100%;width:100%;outline:none;background-color:var(--secondary-object-color);cursor:text;transition:background-color .3s ease,box-shadow .3s ease}#tempo-entry::placeholder{color:#ffffff40;transition:color .3s ease}.swiper-container:hover .swiper-gradient{background-color:var(--control-hover)}.swiper-gradient{position:absolute;border-radius:var(--control-radius);pointer-events:none;inset:0;z-index:2;background-color:var(--primary-object-color);width:100%;height:100%;transition:background-color .3s ease;mask-image:linear-gradient(to right,black,transparent 45%,transparent 55%,black);-webkit-mask-image:linear-gradient(to right,black,transparent 45%,transparent 55%,black)}#tempo .swiper-slide{display:flex;justify-content:center;align-items:center;align-self:center;color:#ffffff80;border-radius:calc(var(--control-radius));transition:background-color .3s ease}#tempo .swiper-slide-active{color:var(--control-text-color);cursor:pointer}#tempo .swiper-slide-active:hover{background-color:var(--tempo-hover-color)}.button-outside{display:none}.button-inside{display:block}@media (max-width: 600px){:root{--tempo-hover-color: none;--reload-gap: calc(var(--unit) * -.5);--control-height: calc(var(--unit) * 2.75);--control-radius: calc(var(--unit) * .75);--regular-text-size: 3.25vw}.panel-container{border-bottom:0;border-color:var(--window-color);background:none;gap:calc(var(--unit) * .85);padding:0 var(--unit)}#toprow-container{gap:calc(var(--unit) * .85)}#steady-ui-connector{min-width:var(--unit)}#notice{font-size:3.75vw;padding-top:0}body{background-color:var(--window-color)}.button-inside{display:none}.button-outside{display:block}#help-button,#config-button{position:fixed;top:var(--unit);z-index:15}#logos-container{display:none}#logos-container-mobile{display:flex}#beats-logo{width:50%}#logos-container-mobile .logo{width:55%}#beats-logo-decoration-left,#beats-logo-decoration-right{width:25%}}@media (max-width: 429px){:root{--menu-item: 11vw;--control-height: 13vw;--unit: 4.5vw;--control-radius: 3vw;--vol-height: 7vw;--control-text-size: 4.75vw;--h1-size: 6.5vw;--background-image-size: 7vw;--footer-font-size: 2.8vw}button{transition:none}}@media (max-height: 750px) and (min-width: 601px){:root{--menu-item: 6dvh;--control-height: 6dvh;--unit: 2.75dvh;--control-radius: 2dvh;--vol-height: 7dvh;--control-text-size: 2.75dvh;--h1-size: 3.5dvh;--regular-text-size: 2dvh;--background-image-size: 4dvh;--footer-font-size: 1.5dvh;--panel-maxwidth: 80vh}#beats-logo{width:17.75dvh}button{transition:none}}@keyframes fadeOut{0%{opacity:1}to{opacity:.75}}@keyframes fadeOutBackground{0%{background-color:var(--secondary-color)}to{background-color:var(--primary-color)}}@keyframes measurePulse{0%{transform:scale(1);opacity:1}60%{transform:scale(1.4);opacity:.4}to{transform:scale(1);opacity:0}}.config-control-label{display:flex;flex-direction:row;justify-content:space-between;min-width:calc(var(--unit) * 6);max-width:calc(var(--unit) * 6);align-items:center}.volume-control:last-child{border-bottom:none}.volume-control label{display:flex;align-items:center}.mark-measures-values{display:flex;width:100%;gap:calc(var(--unit) * .5);align-items:center;-webkit-user-select:none;user-select:none;text-wrap:nowrap}#master-label{padding:calc(var(--unit) * .25);border:1px solid rgba(0,0,0,0);border-radius:calc(var(--unit) * .25);min-width:calc(var(--unit) * 3);-webkit-user-select:none;user-select:none;text-align:center;box-sizing:border-box;white-space:nowrap}.instrument-label{padding:calc(var(--unit) * .25);border-radius:calc(var(--unit) * .25);border:1px solid #444;-webkit-user-select:none;user-select:none;min-width:calc(var(--unit) * 3);text-align:center;box-sizing:border-box;white-space:nowrap}.instrument-label:hover{background-color:#777;border:1px solid #777;color:#fff}.centered-row{display:flex;width:100%;justify-content:center}#restore-defaults{margin-top:var(--unit)}.config-control-label-text{text-align:center;min-width:calc(var(--unit) * 3);padding:calc(var(--unit) * .25);box-sizing:border-box;-webkit-user-select:none;user-select:none;white-space:nowrap}.instrument-label.solo{background-color:var(--primary-color);color:var(--control-text-color)}.volume-icon{margin-right:var(--unit);margin-left:var(--unit);color:var(--control-text-color);font-size:var(--control-text-size)}.volume-icon:hover{transform:scale(1.2)}.volume-channel{display:flex;flex-direction:row;padding:calc(var(--unit) * .25);box-sizing:border-box;align-items:center;-webkit-user-select:none;user-select:none;margin:0 calc(var(--unit) * .5);white-space:nowrap}.volume-channel:last-child{border-bottom:solid 1px #444;padding-bottom:var(--unit)}.volume-control{box-sizing:border-box;padding:calc(var(--unit) * .5)}.mark-measures-control{display:flex;flex-direction:row;padding:calc(var(--unit) * 1) calc(var(--unit) * .25);justify-content:center;margin:0 calc(var(--unit) * .5) 0 calc(var(--unit) * .5);border-bottom:1px solid #444}.mark-measures-control--stacked{flex-direction:column;gap:calc(var(--unit) * .5);align-items:stretch}.mark-measures-row{display:flex;flex-direction:row;justify-content:space-between;gap:calc(var(--unit) * 1)}.volume-control{display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center}.volume-slider{-webkit-appearance:none;appearance:none;width:100%;height:var(--control-text-size);background:var(--primary-object-color);outline:none;border-radius:var(--control-radius);position:relative;padding:0}.volume-slider.disabled{opacity:.25}.volume-slider:hover{background:#777}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--control-text-size);height:var(--control-text-size);background:var(--secondary-object-color);border-radius:50%;cursor:pointer;position:relative;z-index:1;box-shadow:0 0 5px #00000080}.volume-slider::-webkit-slider-thumb:hover{background:var(--control-text-color);transform:scale(1.2)}.volume-slider::-moz-range-thumb{width:var(--control-text-size);height:var(--control-text-size);background:var(--secondary-object-color);border-radius:50%;cursor:pointer;position:relative;z-index:2}.volume-slider::-moz-range-thumb:hover{background:var(--control-text-color)}.volume-slider::-ms-thumb{width:var(--control-text-size);height:var(--control-text-size);background:var(--secondary-object-color);border-radius:50%;cursor:pointer;position:relative;z-index:2;margin-top:calc(var(--vol-height) / -2)}.volume-slider::-ms-thumb:hover{background:var(--control-text-color)}#configuration h2{margin-top:20px;margin-bottom:10px}.dropdownbutton-button.small{height:auto;font-size:var(--regular-text-size);font-weight:400;padding:calc(var(--unit) / 4) calc(var(--unit) / 2) calc(var(--unit) / 4) calc(var(--unit) / 2);border-radius:calc(var(--control-radius) / 2)}.dropdownbutton-button.disabled,#feel.disabled{pointer-events:none;opacity:.25}#steady-instrument-button.disabled,#steady-pattern-button.disabled,#steady-ui-connector.disabled{display:none}#beat-steady-container.disabled,#beat-pattern-button.disabled{pointer-events:none;opacity:.25}.switch-container{display:flex;justify-content:center;width:100%;color:var(--control-text-color);font-size:var(--unit)}.switch{position:relative;display:inline-block;width:calc(var(--unit) * 1.5);height:var(--unit)}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#777;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:"";height:calc(var(--unit) * 1);width:calc(var(--unit) * 1);left:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s;transform:scale(.75)}.slider:hover:before{background-color:#fff}input:checked+.slider{background-color:var(--primary-color)}input:focus+.slider{box-shadow:0 0 1px var(--primary-color)}input:checked+.slider:before{-webkit-transform:translateX(calc(var(--unit) * .5)) scale(.75);-ms-transform:translateX(calc(var(--unit) * .5)) scale(.75);transform:translate(calc(var(--unit) * .5)) scale(.75);background-color:#fff}.slider.round{border-radius:calc(var(--unit) * .5)}.slider.round:before{border-radius:50%}#logos-container-mobile #beats-logo-drummachine{width:85%}#logos-container-mobile #beats-logo-container{width:100%;display:flex;justify-content:center;line-height:0;margin-top:calc(var(--unit) * .75)}#logos-container-mobile #beats-logo{line-height:0;font-size:0}#logos-container-mobile #beats-logo svg{width:100%;height:auto;display:block;vertical-align:top}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}