:root {
    --rule-width: 700px;
    --item-width: 125px;
}

* {
    box-sizing: border-box;
}

body {
    background: #0001;
}
.rule {
    display: inline-block;
    background: #0021;
    min-width: var(--rule-width);
    padding: 7px 7px 7px 0;
    border-radius: 3px;
}
.rule div {
    display: inline-block;
    padding-left: 7px;
}
.drag {
    cursor: pointer;
}
.plus {
    display: inline-block;
    cursor: pointer;
    float: right;
}
.number {
    width: var(--item-width);
    text-align: right;
}
.text {
    width: var(--item-width * 4);
    text-align: left;
}
.embed {
    /*display: block;*/
}
#samples {
    position: fixed;
    bottom: 10px;
}
input[type=checkbox] {
    vertical-align: top;
    accent-color: white;
}
.copy {
    cursor: pointer;
}
.choices {
    display: none;
    margin-left: 30px;
    border: thin solid #bbb;
    background: #eee;
    max-width: 500px;
    max-height: 200px;
    overflow-x: hidden;
    overflow-y: scroll;
}
.selected {
    display: none;
    margin-left: 30px;
    border: thin solid #bbb;
    background: #eee;
    max-width: 500px;
    max-height: 75px;
    overflow-x: hidden;
    overflow-y: scroll;
}
.visible {
    display: block;
}
.choices:hover, .selected:hover {
    display: block;
}