/* Key editor (Key_editor.html), 2026-10-09: site colours on top of stylesKeyEditor.css */
.ke-title { margin: 0.3em 0 0.5em; font-size: 1.8em; color: #fff; }
.ke-beta { font-size: 0.45em; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: rgb(160, 160, 160); border: 1px solid rgb(110, 114, 118); border-radius: 3px; padding: 0.1em 0.45em; vertical-align: middle; }

/* 2026-10-23: all fields use the light grey of the number fields in value steps (was black) */
.Write { color: rgb(12, 12, 12); background-color: rgb(203, 208, 213); border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 3px; font-size: 15px; }
.Write:focus { background-color: rgb(222, 226, 230); border-color: rgb(0, 130, 105); }
.Write::placeholder { color: rgb(92, 96, 101); }

.topP1 .ke-fields { flex: 0 0 100%; display: flex; flex-wrap: wrap; gap: 0.5em 1.2em; margin: 0.2em 0 0.8em; }
.ke-fields > label.ke-field { flex: 0 1 16em; }
.ke-field { display: flex; flex-direction: column; gap: 0.2em; font-size: 14px; color: rgb(200, 200, 200); }
.ke-field .Write { width: 100%; height: 2.1em; margin: 0; padding: 0 0.6em; }
.ke-tax { flex: 0 0 100%; }
.ke-taxrow { display: flex; flex-wrap: wrap; gap: 0.35em; align-items: center; }
.ke-taxrow .Write.taxWrite { flex: 1 1 8em; max-width: 12em; width: auto; height: 2.1em; padding: 0 0.6em; }
.ke-addlevel { flex: 0 0 2.1em; height: 2.1em; font: inherit; font-size: 18px; line-height: 1; color: rgb(224, 224, 224); background: none; border: 1px dashed rgb(130, 133, 138); border-radius: 3px; cursor: pointer; }
.ke-addlevel:hover { border-style: solid; color: #fff; }

.topBox .btnT, .btnKK { color: rgb(224, 224, 224); background: none; border: 1px solid rgb(130, 133, 138); border-radius: 3px; cursor: pointer; }
.topBox .btnT:hover, .btnKK:hover { color: #fff; background: rgb(60, 63, 67); text-decoration: underline; }
.btnKK .topInfo { fill: rgb(142, 213, 182); }

.scrollbox { background-color: rgb(70, 74, 78); border-color: rgb(104, 104, 104); }
.top, .top2 { background-color: rgb(83, 88, 91); }
@media only screen and (max-width: 700px) {
    .ke-fields > label.ke-field { flex-basis: 100%; }
}
.topP1 > .btnT, .topP1 > label.btnT { align-self: flex-start; height: auto; line-height: 1.9em; margin-bottom: 0.3em; }
#TitleText .WriteTitle { width: calc(100% - 6em); vertical-align: middle; }
#TitleText { white-space: nowrap; }
.ke-fields .ke-field .Write { width: 100%; }