.tm-process-panel:has(> .tm-kvgm) {
  --kv-art-limit: max(865px, calc((100svh - 320px) * 1.289855));
  width: min(100%, var(--kv-art-limit)); justify-self: center;
  border: 0; border-radius: 0; background: transparent;
}
.tm-process-panel:has(> .tm-kvgm) > header { padding-inline: 0; }
.tm-kvgm {
  --kv-text: #20262b; --kv-muted: #5b6570; --kv-line: #cbd4da; --kv-surface: #f8fbfc;
  min-width: 0; color: var(--kv-text); background: transparent;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  font-variant-numeric: tabular-nums; letter-spacing: 0;
}
.tm-kvgm *, .tm-kvgm-dialog * { box-sizing: border-box; letter-spacing: 0; }
.tm-kvgm button { font-family: inherit; color: inherit; cursor: pointer; }
.tm-kvgm button:focus-visible, .tm-kvgm-dialog button:focus-visible { outline: 2px solid #1d5b87; outline-offset: 2px; }
.tm-kvgm-toolbar { display: flex; justify-content: space-between; gap: 8px 12px; align-items: center; flex-wrap: wrap; min-height: 44px; margin-bottom: 12px; padding: 0; color: var(--mon-text, var(--kv-text)); }
.tm-kvgm-controls { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.tm-kvgm-controls > div { display: flex; border: 1px solid var(--kv-line); border-radius: 4px; }
.tm-kvgm-controls button { min-height: 36px; border: 0; border-radius: 3px; background: transparent; padding: 6px 10px; font-size: 11px; white-space: nowrap; }
.tm-kvgm-controls button[aria-pressed="true"] { background: var(--kv-surface); color: #285976; box-shadow: inset 0 0 0 1px var(--kv-line); }
.tm-kvgm-toolbar .tm-kvgm-motion { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--kv-line); background: var(--kv-surface); color: var(--kv-text); }
.tm-kvgm-motion svg { width: 16px; height: 16px; }
.tm-kvgm-motion:disabled { cursor: default; opacity: .55; }
.tm-kvgm-workspace { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 0; align-items: start; }
.tm-kvgm-art { position: relative; width: min(100%, max(865px, calc((100svh - 320px) * 1.289855))); aspect-ratio: 1424 / 1104; margin: 0 auto; }
.tm-kvgm-source { display: block; width: 100%; height: 100%; object-fit: contain; }
.tm-kvgm-equipment, .tm-kvgm-water, .tm-kvgm-inline { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.tm-kvgm .tm-kvgm-equipment { width: 100%; height: 100%; }
.tm-kvgm-rotor { transform-box: view-box; transform-origin: 0 0; animation: tm-kvgm-spin 6s linear infinite; animation-play-state: paused; }
.tm-kvgm[data-motion="on"] [data-running="true"] .tm-kvgm-rotor { animation-play-state: running; }
.tm-kvgm-alarm { fill: none; stroke: #a43131; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; animation: tm-kvgm-blink 1.6s steps(1, end) infinite; }
.tm-kvgm-alarm[data-active="false"] { display: none; }
.tm-kvgm[data-motion="off"] .tm-kvgm-alarm { animation: none; opacity: 1; }
.tm-kvgm-water span { position: absolute; transform: translate(-50%, -50%); white-space: nowrap; color: #23568d; font-size: 11px; font-weight: 650; line-height: 14px; }
.tm-kvgm-water [data-water="supply"] { color: #a02c31; }
.tm-kvgm-readout { display: grid; grid-template-rows: auto 23px; gap: 6px; min-width: 0; min-height: 74px; padding: 9px; text-align: left; border: 1px solid var(--kv-line); border-radius: 4px; background: var(--kv-surface); }
.tm-kvgm-readout:hover { background: #f2f6f8; border-color: #7193aa; }
.tm-kvgm-label { color: #48555e; font-size: 11px; line-height: 15px; }
.tm-kvgm-value { display: flex; align-items: baseline; gap: 4px; min-width: 0; white-space: nowrap; line-height: 20px; }
.tm-kvgm-value strong { font-weight: 620; font-size: 19px; }
.tm-kvgm-value > span { font-size: 10px; color: var(--kv-muted); }
.tm-kvgm-state { display: none; }
.tm-kvgm-readout[data-state="alarm"] .tm-kvgm-state { display: inline-flex; }
.tm-kvgm-state svg { width: 12px; height: 12px; }
.tm-kvgm-readout[data-state="alarm"] { background: #fdf3f3; border-color: #d5a2a2; }
.tm-kvgm-readout[data-state="alarm"] strong, .tm-kvgm-readout[data-state="alarm"] .tm-kvgm-state { color: #a43131; }
.tm-kvgm-readout[data-state="warning"] { background: #fffbef; border-color: #d6bd7f; }
.tm-kvgm-readout[data-state="warning"] strong { color: #896800; }
.tm-kvgm-readout[data-state="nocomm"] strong, .tm-kvgm-readout[data-state="nodata"] strong { color: #6b7881; }
.tm-kvgm-readout[data-state="sensor_fault"] strong { color: #824571; }
.tm-kvgm-readout-inline { position: absolute; transform: translate(-50%, -50%); min-width: max-content; height: 44px; min-height: 44px; grid-template-rows: 13px 19px; gap: 2px; padding: 4px 5px; pointer-events: auto; }
.tm-kvgm-readout-inline .tm-kvgm-label { font-size: 11px; line-height: 13px; white-space: nowrap; }
.tm-kvgm-readout-inline .tm-kvgm-value { gap: 3px; line-height: 19px; }
.tm-kvgm-readout-inline strong { font-size: 16px; line-height: 19px; }
.tm-kvgm-readout-inline .tm-kvgm-value > span { font-size: 9px; }
.tm-kvgm-list { min-width: 0; }
.tm-kvgm-list nav { display: flex; border-bottom: 1px solid var(--kv-line); margin-bottom: 10px; color: var(--mon-text, var(--kv-text)); }
.tm-kvgm-list nav button { flex: 1 1 0; min-width: 0; padding: 10px 4px; min-height: 44px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; font-size: 11px; line-height: 16px; }
.tm-kvgm-list nav button[aria-selected="true"] { border-bottom-color: var(--mon-accent, #37617a); color: var(--mon-accent, #285976); font-weight: 650; }
.tm-kvgm-list section h4 { margin: 0 0 8px; font-size: 12px; font-weight: 650; color: var(--mon-text, var(--kv-text)); }
.tm-kvgm-list section > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.tm-kvgm[data-layout="inline"][data-compact="false"] .tm-kvgm-list { display: none; }
.tm-kvgm[data-layout="panel"] .tm-kvgm-inline, .tm-kvgm[data-compact="true"] .tm-kvgm-inline { visibility: hidden; }
.tm-kvgm[data-compact="true"] .tm-kvgm-list section { display: none; }
.tm-kvgm[data-compact="true"][data-group="gas"] [data-kv-section="gas"], .tm-kvgm[data-compact="true"][data-group="water"] [data-kv-section="water"], .tm-kvgm[data-compact="true"][data-group="flue"] [data-kv-section="flue"] { display: block; }
.tm-kvgm[data-compact="true"] .tm-kvgm-list h4 { display: none; }
.tm-kvgm[data-layout="panel"][data-compact="false"] .tm-kvgm-list nav { display: none; }
.tm-kvgm[data-layout="panel"][data-compact="false"] .tm-kvgm-list section + section { margin-top: 14px; }
.tm-kvgm-footer { min-height: 32px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 14px; padding: 8px 0; color: var(--mon-text-2, var(--kv-muted)); font-size: 11px; line-height: 16px; }
.tm-kvgm-asset-error { display: none; padding: 12px 0; color: var(--mon-text-2, #6b7881); font-size: 12px; }
.tm-kvgm[data-asset-error="true"] .tm-kvgm-asset-error { display: block; }
.tm-kvgm[data-asset-error="true"] .tm-kvgm-art { display: none; }
.tm-kvgm-dialog { width: min(440px, calc(100vw - 24px)); max-height: calc(100svh - 32px); overflow: auto; border: 1px solid #cbd4da; border-radius: 6px; padding: 20px; background: #f8fbfc; color: #20262b; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; }
.tm-kvgm-dialog::backdrop { background: rgb(20 26 31 / .42); }
.tm-kvgm-dialog header { display: flex; align-items: flex-start; gap: 12px; justify-content: space-between; }
.tm-kvgm-dialog h3 { margin: 0; font-size: 16px; line-height: 22px; font-weight: 650; }
.tm-kvgm-dialog button { display: grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; padding: 0; border: 1px solid #cbd4da; border-radius: 3px; background: transparent; color: #20262b; cursor: pointer; }
.tm-kvgm-dialog button svg { width: 16px; height: 16px; }
.tm-kvgm-dialog-value { margin: 20px 0; font-size: 28px; font-weight: 650; font-variant-numeric: tabular-nums; }
.tm-kvgm-dialog-value small { font-size: 13px; font-weight: 400; color: #5b6570; }
.tm-kvgm-dialog dl { margin: 0; display: grid; gap: 10px; font-size: 12px; line-height: 18px; }
.tm-kvgm-dialog dl > div { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 8px; }
.tm-kvgm-dialog dt { color: #5b6570; }
.tm-kvgm-dialog dd { margin: 0; overflow-wrap: anywhere; }
@keyframes tm-kvgm-spin { to { transform: rotate(360deg); } }
/* Static scene geometry stays in external CSS to honor the portal CSP. */
.tm-kvgm-readout-inline[data-kv-signal="AF2"] { left: 9.12921348%; top: 72.91666667%; width: 80px; }
.tm-kvgm-readout-inline[data-kv-signal="I8"] { left: 9.12921348%; top: 81.34057971%; width: 112px; }
.tm-kvgm-readout-inline[data-kv-signal="AP"] { left: 14.74719101%; top: 47.10144928%; width: 112px; }
.tm-kvgm-readout-inline[data-kv-signal="GP"] { left: 60.74438202%; top: 83.51449275%; width: 100px; }
.tm-kvgm-readout-inline[data-kv-signal="GV"] { left: 34.41011236%; top: 75.18115942%; width: 64px; }
.tm-kvgm-readout-inline[data-kv-signal="TI"] { left: 20.36516854%; top: 38.94927536%; width: 108px; }
.tm-kvgm-readout-inline[data-kv-signal="IA"] { left: 56.17977528%; top: 56.15942029%; width: 56px; }
.tm-kvgm-readout-inline[data-kv-signal="PW"] { left: 90.58988764%; top: 50.72463768%; width: 96px; }
.tm-kvgm-readout-inline[data-kv-signal="QW"] { left: 90.58988764%; top: 73.46014493%; width: 84px; }
.tm-kvgm-readout-inline[data-kv-signal="TO"] { left: 90.58988764%; top: 35.23550725%; width: 108px; }
.tm-kvgm-readout-inline[data-kv-signal="TS"] { left: 90.58988764%; top: 27.26449275%; width: 64px; }
.tm-kvgm-readout-inline[data-kv-signal="DF1"] { left: 59.69101124%; top: 8.15217391%; width: 64px; }
.tm-kvgm-readout-inline[data-kv-signal="I7"] { left: 59.69101124%; top: 17.21014493%; width: 112px; }
.tm-kvgm-readout-inline[data-kv-signal="DR"] { left: 58.63764045%; top: 26.17753623%; width: 108px; }
.tm-kvgm-readout-inline[data-kv-signal="O2"] { left: 45.99719101%; top: 34.69202899%; width: 84px; }
.tm-kvgm-readout-inline[data-kv-signal="TF"] { left: 58.63764045%; top: 34.69202899%; width: 96px; }
.tm-kvgm-water [data-water="supply"] { left: 89.88764045%; top: calc(40.39855072% + 26px); }
.tm-kvgm-water [data-water="return"] { left: 89.88764045%; top: calc(62.40942029% + 35px); }
@keyframes tm-kvgm-blink { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
@media (min-width: 1200px) { .tm-process-panel:has(> .tm-kvgm[data-layout="panel"]) { width: min(100%, calc(var(--kv-art-limit) + 314px)); } .tm-kvgm[data-layout="panel"] .tm-kvgm-workspace { grid-template-columns: minmax(0, 1fr) 300px; } .tm-kvgm[data-layout="panel"] .tm-kvgm-list nav { display: none; } .tm-kvgm[data-layout="panel"] .tm-kvgm-list section { display: block; } .tm-kvgm[data-layout="panel"] .tm-kvgm-list section h4 { display: block; } .tm-kvgm[data-layout="panel"] .tm-kvgm-list section + section { margin-top: 14px; } }
@media (max-width: 680px) { .tm-kvgm-toolbar { gap: 8px; } .tm-kvgm-controls { flex: 1 1 100%; gap: 6px; } .tm-kvgm-controls > div { flex: 1; } .tm-kvgm-controls > div button { flex: 1; padding: 6px; min-height: 42px; } .tm-kvgm-toolbar .tm-kvgm-motion { width: 42px; height: 42px; } .tm-kvgm-water span { font-size: 10px; } }
@media (prefers-reduced-motion: reduce) { .tm-kvgm-rotor { animation-play-state: paused !important; } .tm-kvgm-alarm { animation: none; opacity: 1; } }