:root{--main-color: #0B1020;--accent-color: #1A2235;--border-color: #2A344A;--text-color: #E5E7EB}html,body{padding:0;margin:0;height:100%}body{display:flex;flex-direction:column;font-family:monospace;font-size:18px;background-color:var(--main-color);color:var(--text-color);align-items:center;padding:1em;box-sizing:border-box}.metronome{flex:1;display:flex;flex-direction:column;margin-bottom:3em;max-width:600px;width:100%;input[type=button],input[type=number]{height:3em;border:2px solid var(--border-color);border-radius:12px;background-color:var(--accent-color);color:var(--text-color);font-family:inherit;font-size:inherit;cursor:pointer;box-sizing:border-box;padding:0;margin:0;line-height:3em}.params{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1em;.param{display:flex;flex-direction:column;border:2px solid var(--border-color);border-radius:12px;padding:1em;gap:1em;input[type=button]{height:5em}#meter{width:2em;height:2em;border:2px solid var(--border-color);border-radius:1em;box-sizing:border-box;background-color:#fff;align-self:center}.split{display:flex;flex-direction:row;label{flex:1}label{color:var(--text-color)}input[type=number]{width:4em;height:2em;-moz-appearance:textfield;line-height:2em;box-sizing:border-box;text-align:center}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}}select{height:3em;text-align:center;color:var(--text-color);background-color:var(--accent-color);border:2px solid var(--border-color);border-radius:12px;font-size:inherit;font-family:inherit}option{text-align:center}}.beats,.subdivisions{display:none}}}