/* Room measure tool (/tools/room-measure). Scoped under .kx-rm. */
.kx-rm { max-width: 760px; margin: 0 auto; }
.kx-rm-how { padding-left: 1.2em; line-height: 1.6; }
.kx-rm-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.kx-rm button, .kx-rm-file { padding: 10px 14px; border-radius: 10px; border: 1px solid #0c2a44; background: #fff; color: #0c2a44; font: inherit; font-weight: 600; cursor: pointer; line-height: 1.3; }
.kx-rm .kx-rm-go { background: #0c2a44; color: #fff; }
.kx-rm button:disabled { opacity: .45; cursor: default; }
.kx-rm button:focus-visible, .kx-rm-file:focus-within { outline: 3px solid #f59e0b; outline-offset: 2px; }
.kx-rm-small { font-size: .9em; color: #475467; }
.kx-rm-status { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; border-radius: 10px; padding: 8px 10px; }
.kx-rm-view { position: relative; background: #000; border-radius: 12px; overflow: hidden; }
.kx-rm-view video { display: block; width: 100%; height: auto; max-height: 70vh; object-fit: contain; }
.kx-rm-view canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.kx-rm-hint, .kx-rm-prompt { font-weight: 600; margin: 8px 0; min-height: 1.4em; }
.kx-rm-stage { position: relative; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.kx-rm-stage canvas[data-rm="photo"] { display: block; width: 100%; height: auto; border-radius: 10px; background: #111; }
.kx-rm-stage canvas[data-rm="marks"] { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; }
.kx-rm-loupe { position: absolute; width: 150px; height: 150px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .35); pointer-events: none; z-index: 2; }
.kx-rm-loupe[hidden] { display: none; }
.kx-rm-live { color: #2563eb; font-weight: 600; min-height: 1.4em; }
.kx-rm-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.kx-rm-actions input { width: 7em; padding: 8px; border-radius: 8px; border: 1px solid #cbd5e1; font: inherit; }
.kx-rm-banner { background: #fff7e6; border: 1px solid #f5c26b; border-radius: 10px; padding: 8px 10px; margin: 8px 0; }
.kx-rm-banner input { width: 5em; padding: 4px 6px; border-radius: 6px; border: 1px solid #cbd5e1; font: inherit; }
.kx-rm-banner button { padding: 6px 10px; margin-left: 4px; }
.kx-rm-banner-msg { display: block; color: #b91c1c; margin-top: 4px; }
.kx-rm-banner-msg:empty { display: none; }
.kx-rm-table { border-collapse: collapse; margin: 8px 0; font-size: 1.1em; }
.kx-rm-table th, .kx-rm-table td { padding: 6px 14px 6px 0; text-align: left; }
.kx-rm-table td:nth-child(2) { font-weight: 700; }
.kx-rm-table .green, .kx-rm-level.green { color: #15803d; }
.kx-rm-table .amber, .kx-rm-level.amber { color: #b45309; }
.kx-rm-table .red, .kx-rm-level.red { color: #b91c1c; }
.kx-rm-level { font-weight: 700; }
.kx-rm-warn { color: #b45309; }
.kx-rm-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 8px 0; }
.kx-rm-row select, .kx-rm-row input[type="text"] { padding: 8px; border-radius: 8px; border: 1px solid #cbd5e1; font: inherit; max-width: 100%; }
@media (max-width: 767px) {
    .kx-rm-acts button, .kx-rm-actions button { flex: 1 1 45%; }
    .kx-rm-actions input { flex: 1 1 30%; }
}