.kmp { width: 1200px; margin: 0 auto; text-align: left; font-size: 20px; line-height: 1.25; }
.kmp .kbar { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.kmp .kbar button { font-size: 16px; padding: 2px 10px; border: 1px solid #bbb; background: #fafafa; border-radius: 4px; cursor: pointer; }
.kmp .kcount { font-size: 14px; color: #888; margin-left: 8px; }
.kgrid { display: grid; gap: 2px; font-family: "DejaVu Sans Mono", Menlo, Consolas, monospace; margin-bottom: 8px; }
.kgrid > div { height: 1.55em; display: flex; align-items: center; justify-content: center; position: relative; }
.kgrid { font-size: 22px; }
.kidx { font-size: 11px; color: #aaa; height: 1em !important; }
.klab { font-size: 14px; color: #777; justify-content: flex-end !important; padding-right: 6px; font-family: sans-serif; }
.klab.kunex { opacity: .45; }
.kc { border-radius: 3px; }
.ktext { background: #eceff1; color: #222; font-weight: bold; }
.ktext.kfuture { color: #b0b0b0; font-weight: normal; background: #f5f5f5; }
.ktext.kcursor { background: #ffd54f; }
.ktext.kbitten { color: #bbb; text-decoration: line-through; background: #fafafa; }
.ktext.kocc { box-shadow: inset 0 -4px 0 #2a76dd; }
.kneedle.kmatched { background: #c8e6c9; color: #1b5e20; }
.kneedle.kpending { background: #f7f7f7; color: #bdbdbd; }
.knext { color: #fff; font-weight: bold; }
.knext.kok { background: #43a047; }
.knext.kbad { background: #e53935; }
.knext.kfaint { opacity: .35; }
.kneedle.kunex.kmatched, .kneedle.kunex.kpending { opacity: .45; }
.ksent { font-size: 0.8em; }
.kmark { position: absolute; top: -0.55em; right: -0.25em; font-size: 0.6em; color: #333; background: #fff; border-radius: 50%; line-height: 1; padding: 1px; }
.kcolhl { background: #fff8e1; }
.kempty.kcolhl { background: #fff8e1; }
.kfull.kmatched { background: #90caf9 !important; color: #0d47a1 !important; }

.kmid { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin: 4px 0 8px; }
.kauto { flex: 0 0 auto; }
.kauto .knode { fill: #fff; stroke: #666; stroke-width: 1.5; }
.kauto .knode.kchain { stroke: #2a76dd; stroke-width: 3.5; }
.kauto .knode.kcur { fill: #2a76dd; stroke: #2a76dd; stroke-width: 3.5; }
.kauto .knlab { font: 13px sans-serif; text-anchor: middle; fill: #333; }
.kauto .knlab.kcurt { fill: #fff; font-weight: bold; }
.kauto .kflab { font: bold 14px monospace; text-anchor: middle; fill: #555; }
.kauto .kfwd { stroke: #999; stroke-width: 1.5; }
.kauto .kfail { stroke: #9e9e9e; stroke-width: 1.4; fill: none; }
.kauto .kfail.kto0 { stroke: #d6d6d6; stroke-width: 1; stroke-dasharray: 3 3; }
.kauto .khl-g { stroke: #43a047; stroke-width: 4; }
.kauto .khl-r { stroke: #e53935; stroke-width: 3.5; }
.kauto .khl-o { stroke: #fb8c00; stroke-width: 3.5; }

.ktable { font-family: sans-serif; font-size: 15px; }
.ktrow { display: flex; }
.kth { width: 44px; color: #777; text-align: right; padding-right: 6px; }
.ktd { width: 32px; text-align: center; border: 1px solid #ddd; margin: -1px 0 0 -1px; padding: 2px 0; }
.ktdi { color: #999; font-size: 12px; background: #fafafa; }
.ktd.kunknown { color: #bbb; background: #f2f2f2; }
.ktd.kread { background: #bbdefb; font-weight: bold; }
.ktd.kwrite { background: #ffcc80; font-weight: bold; }

.kbottom { display: flex; gap: 20px; align-items: flex-start; }
.kcode { flex: 0 0 520px; font-size: 15px; font-family: sans-serif; background: #fafafa; border: 1px solid #e3e3e3; border-radius: 4px; padding: 6px 10px; }
.kcode > div { padding: 1px 4px; border-radius: 3px; }
.kcode .kact { background: #fff3c4; }
.kcode .kcmt { color: #999; }
.kmsg { flex: 1; font-size: 17px; min-height: 4.2em; }
.kq { font-family: monospace; font-weight: bold; background: #eef; padding: 0 3px; border-radius: 3px; }

.g, .kmp .g { font-family: "DejaVu Serif", "Times New Roman", serif; font-style: italic; font-weight: normal; }
.kauto .knode.ktarget { stroke: #fb8c00; stroke-width: 3; stroke-dasharray: 4 3; }
.ktd.ktarget { outline: 3px dashed #fb8c00; outline-offset: -3px; }
