/* Minikraft: common visual tokens for shell, native WebIQ widgets and all views. */
:root {
  --mk-base:#edf1f4; --mk-header:#e2e8ed; --mk-nav:#e2e8ed;
  --mk-status:#e9eef2; --mk-footer:#e2e8ed; --mk-surface:#f8fafb;
  --mk-inset:#eef3f6; --mk-border:#bcc9d2; --mk-text:#263d4b;
  --mk-secondary:#536b7a; --mk-accent:#3f667c; --mk-selected:#d2e0e8;
}
html,body {background:var(--mk-base);}
.mk-root {
  color:var(--mk-text); font-family:'Segoe UI',Arial,sans-serif;
  --webiq-primary:var(--mk-accent); --webiq-primary-rgb:63 102 124;
  --webiq-on-primary:#fff; --webiq-on-primary-rgb:255 255 255;
  --webiq-primary-container:var(--mk-selected); --webiq-primary-container-rgb:210 224 232;
  --webiq-on-primary-container:var(--mk-text); --webiq-on-primary-container-rgb:38 61 75;
  --webiq-secondary:var(--mk-accent); --webiq-secondary-rgb:63 102 124;
  --webiq-secondary-container:var(--mk-selected); --webiq-on-secondary-container:var(--mk-text);
  --webiq-surface:var(--mk-surface); --webiq-surface-rgb:248 250 251;
  --webiq-on-surface:var(--mk-text); --webiq-on-surface-rgb:38 61 75;
  --webiq-on-surface-variant:var(--mk-secondary); --webiq-on-surface-variant-rgb:83 107 122;
  --webiq-outline:var(--mk-border); --webiq-outline-variant:var(--mk-border);
  --webiq-surface-container:var(--mk-inset); --webiq-surface-container-high:var(--mk-inset);
  --webiq-surface-container-highest:var(--mk-inset); --webiq-surface-container-low:var(--mk-surface);
  --webiq-surface-container-lowest:var(--mk-surface);
}
.mk-header {background:var(--mk-header);box-shadow:inset 0 1px 0 #ffffff80;}
.mk-menu {background:var(--mk-nav);padding:12px 8px;gap:8px;box-sizing:border-box;}
.mk-status {background:var(--mk-status);padding:0 14px;align-items:center;gap:12px;overflow:hidden;}
.mk-footer {background:var(--mk-footer);padding:0 12px;align-items:center;gap:12px;overflow:hidden;}
.mk-status-text {flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;}
.mk-demo-badge {font-size:10px;letter-spacing:.07em;color:var(--mk-secondary);white-space:nowrap;}
.mk-footer-note {margin-left:auto;font-size:11px;color:var(--mk-secondary);white-space:nowrap;}
.mk-header .mk-brand {flex:0 0 88px;min-width:88px;margin-left:16px;color:var(--mk-accent);font-size:23px;font-weight:700;letter-spacing:-1px;}
.mk-header .mk-station {flex:0 1 auto;min-width:0;margin-left:16px;color:var(--mk-text);font-size:18px;font-weight:600;line-height:1.15;}
.mk-header .mk-clock {margin-left:auto;color:var(--mk-secondary);font-size:13px;font-variant-numeric:tabular-nums;flex-shrink:0;}
.mk-content,.mk-main {min-width:0;min-height:0;background:var(--mk-base);}
.mk-body,.mk-body>.margin-compensator,.mk-content>.margin-compensator,.mk-main>.margin-compensator {min-height:0;min-width:0;}
.mk-main .screen {min-height:0;min-width:0;overflow:auto;}
.mk-root .view {background:var(--mk-base);color:var(--mk-text);}
.mk-page {padding:20px;box-sizing:border-box;overflow:auto;}
.mk-page-heading {margin-bottom:18px;gap:5px;}
.mk-title {font-size:23px;font-weight:600;line-height:1.25;color:var(--mk-text);}
.mk-section-title {font-size:15px;font-weight:600;color:var(--mk-text);margin-bottom:8px;}
.mk-caption {font-size:12px;color:var(--mk-secondary);line-height:1.45;}
.mk-card,.mk-surface {background:var(--mk-surface);border:1px solid var(--mk-border);border-radius:4px;box-shadow:0 1px 2px #263d4b07,inset 0 1px 0 #fff;}
.mk-card {padding:16px;margin-bottom:16px;gap:8px;box-sizing:border-box;}
.mk-metrics {gap:14px;}
.mk-metric {flex:1 1 140px;min-width:140px;}
.mk-value {font-size:27px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.3;}
.mk-process {min-width:660px;}
.mk-process-image {height:260px;width:100%;}
.mk-process-image .iqel-image {width:100%;height:100%;object-fit:contain;}
.mk-actions,.mk-component-group {gap:10px;align-items:center;}
.mk-actions {margin-top:8px;}
.mk-subnav {gap:8px;padding:12px 16px;box-sizing:border-box;background:var(--mk-base);}
.mk-menu-note {font-size:10px;letter-spacing:.12em;color:var(--mk-secondary);margin:16px 8px;}
/* WebIQ buttons are div.iqel-button-element, not HTML button elements. */
.mk-root .iq-button {--border-radius:4px;--color-label:var(--mk-text);--color-icon:var(--mk-text);--bg-color:var(--mk-surface);--border-color:var(--mk-border);--border-color-hover:var(--mk-accent);--color-label-pressed:var(--mk-text);}
.mk-root .iq-button .iqel-button-element {border-radius:4px;background:var(--mk-surface);color:var(--mk-text);box-shadow:0 1px 2px #263d4b0b;}
.mk-root .iq-button .iqel-state-layer {padding:9px 12px;min-height:38px;box-sizing:border-box;}
.mk-root .iq-button .iqel-button-label {font-size:13px;font-weight:500;}
.mk-root .iq-button .iqel-button-element:hover {background:var(--mk-inset);}
.mk-root .iq-button .iqel-button-element:focus-visible {outline:2px solid var(--mk-accent);outline-offset:2px;}
.mk-root .iq-button .iqel-button-element.pressed {box-shadow:inset 0 1px 2px #263d4b24;background:var(--mk-selected);}
.mk-menu .mk-nav {width:100%;min-width:0;}
.mk-menu .mk-nav .iqel-state-layer {padding:11px 7px;min-height:45px;}
.mk-menu .mk-nav .iqel-button-label {font-size:12px;white-space:normal;}
.mk-root .mk-nav.mk-active .iqel-button-element {background:var(--mk-selected);border-color:var(--mk-accent);box-shadow:inset 3px 0 0 var(--mk-accent);}
.mk-root .mk-nav.mk-active .iqel-button-label {font-weight:600;}
.mk-scaling-page {padding:16px;box-sizing:border-box;min-height:0;overflow:auto;}
.mk-scaling-page>.mk-subnav {padding:0 0 16px;}
.mk-channel-label {padding:12px 16px 12px 0;gap:5px;}
.mk-channel-id {font-size:11px;letter-spacing:.1em;color:var(--mk-secondary);}
.mk-scaling-card {color:var(--mk-text);}
.mk-root .iq-input-field {--bg-color:var(--mk-inset);--color-value:var(--mk-text);}
.mk-root .iq-input-field .iqel-widget-container {background:var(--mk-inset);border-radius:3px;box-shadow:inset 0 1px 2px #263d4b0c;}
.mk-root .iq-input-field input {color:var(--mk-text);font-variant-numeric:tabular-nums;}
.mk-scale-result {font-size:13px;color:var(--mk-accent);margin-top:8px;}
.mk-data-row {padding:12px 0;gap:12px;border-bottom:1px solid var(--mk-border);}
.mk-data-value {margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums;}
.mk-demo-trend {margin:4px 16px 16px;}
.mk-trend-chart {width:100%;height:280px;min-width:300px;}
.mk-trend-chart .iqel-image {height:100%;width:100%;object-fit:contain;}
.mk-recorder-placeholder {display:none!important;}
.mk-component-group[hidden] {display:none!important;}
.minikraft .main-bg {background-color:var(--mk-base);}
.minikraft .header-bg {background-color:var(--mk-header);}
.minikraft .menu-bg {background-color:var(--mk-nav);}
.minikraft .status-bg {background-color:var(--mk-status);}
.minikraft .footer-bg {background-color:var(--mk-footer);}
.minikraft .std-border {border:1px solid var(--mk-border);}
.minikraft .panel {background-color:var(--mk-surface);border:1px solid var(--mk-border);}
.minikraft .title-text {font-weight:600;}
/* Native iq-container places children inside .margin-compensator. */
.mk-menu {--container-row-gap:8px;}
.mk-status,.mk-footer {--container-column-gap:12px;}
.mk-status>.margin-compensator,.mk-footer>.margin-compensator {align-items:center;}
.mk-page-heading {--container-row-gap:5px;}
.mk-card {--container-row-gap:8px;}
.mk-metrics {--container-column-gap:14px;--container-row-gap:14px;}
.mk-root .mk-metrics>.margin-compensator>.mk-metric {flex:1 1 140px;}
.mk-actions,.mk-component-group {--container-column-gap:10px;--container-row-gap:10px;}
.mk-subnav {--container-column-gap:8px;--container-row-gap:8px;}
.mk-channel-label {--container-row-gap:5px;}
.mk-analogue-wrap {--container-row-gap:16px;}
.mk-root .mk-scaling-card>.margin-compensator>.mk-caption,.mk-root .mk-scaling-card>.margin-compensator>.mk-scale-result {flex:0 0 100%;}
.mk-root .mk-scaling-card>.margin-compensator>.iq-checkbox {flex:0 0 100%;max-width:100%;}
.mk-scaling-card .iq-checkbox .iqel-label {white-space:normal;}
.mk-data-row {--container-column-gap:12px;--container-row-gap:8px;}
.mk-root .mk-status>.margin-compensator>.mk-status-text {flex:1 1 auto;}
.mk-root .mk-header>.margin-compensator>.mk-station {flex:0 1 auto;}
@media(max-width:758px) {
  /* Channel identity is already in the page heading; omit its duplicate side label. */
  .mk-channel-label {display:none;}
}
@media(max-width:478px) {
  .mk-scaling-page {padding:8px;}
  .mk-page {padding:12px;}
  .mk-header .mk-brand {min-width:64px;margin-left:12px;font-size:21px;}
  .mk-root .mk-header>.margin-compensator>.mk-brand {flex:0 0 64px;}
  .mk-header .mk-station {font-size:14px;margin-left:8px;white-space:normal;}
  .mk-root .mk-header>.margin-compensator>.mk-station {flex:1 1 auto;}
  .mk-root .mk-header>.margin-compensator>.mk-clock {flex:0 0 102px;width:102px;font-size:11px;white-space:normal;}
  .mk-clock .iqel-label {white-space:normal;}
  .mk-footer-note {font-size:9px;}
}

/* One HMI canvas: horizontal scrolling belongs to the document, never the content panel. */
:root {--mk-canvas-min-width:960px;}
html,body {overflow-x:auto;}
.mk-root {width:max(100%,var(--mk-canvas-min-width))!important;min-width:var(--mk-canvas-min-width);}
.mk-main,.mk-content {overflow-x:clip;}
.mk-main .screen,.mk-page,.mk-scaling-page {overflow-x:hidden;}
.mk-root .mk-header>.margin-compensator>.mk-brand {flex:0 0 88px;min-width:88px;margin-left:16px;font-size:23px;}
.mk-root .mk-header>.margin-compensator>.mk-station {flex:0 1 auto;font-size:18px;margin-left:16px;}
.mk-root .mk-header>.margin-compensator>.mk-clock {flex:0 0 auto;width:auto;font-size:13px;}
.mk-trend-v2 {margin:4px 16px 16px;--container-row-gap:12px;}
.mk-trend-toolbar {--container-column-gap:8px;--container-row-gap:8px;}
.mk-trend-toolbar>.margin-compensator {align-items:flex-end;}
.mk-trend-field {width:140px;--container-row-gap:4px;}
.mk-trend-input {height:40px;min-width:110px;}
.mk-trend-mode {padding:10px 12px;border:1px solid var(--mk-border);font-weight:600;font-size:12px;}
.mk-trend-range {font-variant-numeric:tabular-nums;font-size:13px;}
.mk-trend-feedback {font-size:12px;color:var(--mk-secondary);min-height:18px;}
.mk-trend-plot {height:340px;width:100%;touch-action:pan-y;cursor:grab;user-select:none;}
.mk-trend-plot:active {cursor:grabbing;}
.mk-trend-plot .iqel-image {width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none;}
.mk-trend-signals {--container-column-gap:16px;--container-row-gap:8px;}
.mk-trend-signal {min-width:180px;}
.mk-trend-readout {white-space:normal;font-size:13px;line-height:1.6;}
.mk-trend-channel {padding:6px;border-left:3px solid var(--mk-channel-color);--container-column-gap:6px;}
.mk-trend-channel>.margin-compensator {align-items:center;}
.mk-channel-active {background:var(--mk-selected);}
.mk-trend-settings {padding-top:12px;border-top:1px solid var(--mk-border);--container-row-gap:12px;}
.mk-trend-v2>.margin-compensator {min-width:0;}
.mk-category-pickers {--container-column-gap:8px;--container-row-gap:8px;}
.mk-category-picker {position:relative;}
.mk-root .mk-category-picker>.margin-compensator>.mk-category-options {position:absolute;top:100%;left:0;z-index:40;width:285px;padding:12px;background:var(--mk-surface);border:1px solid var(--mk-border);border-radius:4px;box-shadow:0 5px 12px #263d4b25;--container-row-gap:10px;}
.mk-category-options[hidden],.mk-trend-channel[hidden] {display:none!important;}
.mk-trend-selected-name {padding:8px 2px;font-size:13px;}
.mk-unit-scale {--container-column-gap:12px;--container-row-gap:8px;padding:8px 0;border-top:1px solid var(--mk-border);}
.mk-unit-scale>.margin-compensator {align-items:flex-end;}
.mk-unit-name {width:65px;padding:10px 0;font-weight:600;}
.mk-unit-scale[hidden] {display:none!important;}

/* TREND V3 */
.mk-trend-page,.mk-trend-stage,.mk-trend-stage>.margin-compensator {min-height:0;min-width:0;}
.mk-trend-header {height:42px;padding:5px 10px;background:var(--mk-base);border-bottom:1px solid var(--mk-border);--container-column-gap:6px;z-index:45;}
.mk-trend-header>.margin-compensator {align-items:center;}
.mk-root .mk-trend-header .iq-button .iqel-state-layer {min-height:30px;padding:5px 8px;}
.mk-root .mk-trend-header .iq-button .iqel-button-label {font-size:12px;white-space:nowrap;}
.mk-trend-header .mk-category-pickers {--container-column-gap:5px;}
.mk-root .mk-trend-stage>.margin-compensator>.mk-trend-v3-stage {flex:1 1 auto;height:100%;min-height:0;min-width:0;}
.mk-trend-v3-stage {position:relative;padding:6px 10px;background:var(--mk-surface);}
.mk-trend-v3-stage>.margin-compensator {min-height:0;}
.mk-root .mk-trend-v3-stage>.margin-compensator>.mk-trend-plot {flex:1 1 0px;height:0;min-height:180px;}
.mk-trend-rangebar {height:30px;--container-column-gap:8px;}
.mk-trend-rangebar>.margin-compensator {align-items:center;}
.mk-root .mk-trend-rangebar>.margin-compensator>.mk-trend-range {flex:1 1 auto;font-size:12px;}
.mk-trend-rangebar .mk-trend-mode {font-size:10px;padding:3px 6px;}
.mk-root .mk-trend-rangebar .iq-button .iqel-state-layer {min-height:24px;padding:1px 9px;}
.mk-root .mk-trend-v3-stage>.margin-compensator>.mk-trend-drawer {position:absolute;right:0;top:0;bottom:0;width:330px;z-index:35;}
.mk-trend-drawer {background:var(--mk-surface);border-left:1px solid var(--mk-border);padding:12px;box-shadow:-4px 0 12px #263d4b18;overflow-y:auto;overflow-x:hidden;--container-row-gap:12px;}
.mk-trend-drawer>.margin-compensator {height:auto;}
.mk-drawer-section {--container-row-gap:12px;}
.mk-trend-drawer[hidden],.mk-drawer-section[hidden],.mk-trend-feedback[hidden] {display:none!important;}
.mk-root .mk-trend-drawer .mk-trend-toolbar>.margin-compensator>.mk-trend-field {flex:1 1 120px;width:120px;min-width:0;}
.mk-trend-drawer .mk-trend-field {width:100%;}
.mk-trend-drawer .mk-trend-signals {--container-row-gap:6px;}
.mk-trend-drawer .mk-trend-channel {width:100%;}
.mk-trend-drawer .mk-trend-selected-name {white-space:normal;}
.mk-trend-drawer .mk-caption,.mk-trend-readout {white-space:normal;line-height:1.5;}
.mk-root .mk-trend-drawer .iq-button .iqel-state-layer {min-height:32px;padding:6px 8px;}
.mk-status {flex-shrink:0;}

/* Navigation illustration */
.mk-navpage{padding:20px;box-sizing:border-box;--container-row-gap:16px;}
.mk-camera-choices{--container-column-gap:12px;}
.mk-camera-placeholder{padding:60px 24px;background:#e2e8ed;border:1px solid #bbc8d0;min-height:240px;}
.mk-menu{overflow-y:auto;}

/* Plant overview: fixed proportions, native accessible buttons on illustration. */
.mk-plant-scene{position:relative;width:100%;height:auto;aspect-ratio:1000/540;min-height:410px;background:#f8fafb;border:1px solid var(--mk-border);border-radius:4px;margin-bottom:12px;}
.mk-plant-scene>.margin-compensator{position:relative;height:100%;}
.mk-plant-image{position:absolute;inset:0;width:100%;height:100%;}
.mk-plant-image .iqel-image{width:100%;height:100%;object-fit:fill;}
.mk-plant-scene>.margin-compensator>.mk-map-hit{position:absolute;width:26%;}
.mk-map-intake{left:4%;top:32%;}.mk-map-upper{left:36%;top:59%;}.mk-map-lower{left:70%;top:85%;}
.mk-intake-image{width:100%;height:270px;}.mk-intake-image .iqel-image{width:100%;height:100%;object-fit:contain;}
.mk-intake-metrics{--container-column-gap:12px;--container-row-gap:12px;}
.mk-root .mk-intake-metrics>.margin-compensator>.mk-metric{flex:1 1 150px;}
.mk-turbine-split{--container-column-gap:20px;--container-row-gap:20px;width:100%;}
.mk-root .mk-turbine-split>.margin-compensator>.mk-turbine-visual{flex:1 1 430px;min-height:430px;padding:24px;box-sizing:border-box;--container-row-gap:20px;}
.mk-root .mk-turbine-split>.margin-compensator>.mk-turbine-controls{flex:0 0 320px;}
.mk-root .mk-analogue-wrap>.margin-compensator>.mk-scaling-card{flex:1 1 300px;width:350px;max-width:350px;min-width:0;box-sizing:border-box;}
@media(max-width:478px) and (orientation:portrait){
 .mk-analogue-wrap>.margin-compensator{flex-direction:column;align-items:flex-start;}
 .mk-root .mk-analogue-wrap>.margin-compensator>.mk-scaling-card{flex:0 0 auto;width:350px;max-width:350px;}
}
.mk-plant-scene{height:clamp(400px,calc(100vh - 270px),650px);aspect-ratio:auto;min-height:400px;}
.mk-plant-scene>.margin-compensator>.mk-map-hit{height:26%;}
.mk-map-intake{top:13%;}.mk-map-upper{top:39%;}.mk-map-lower{top:65%;}
.mk-root .mk-map-hit .iqel-button-element{height:100%;background:transparent;box-shadow:none;border-color:transparent;}
.mk-root .mk-map-hit .iqel-state-layer{height:100%;display:flex;align-items:flex-end;justify-content:flex-start;padding:0;}
.mk-root .mk-map-hit .iqel-button-label{padding:9px;background:var(--mk-surface);border:1px solid var(--mk-border);border-radius:4px;}
.mk-root .mk-map-hit .iqel-button-element:hover{background:#3f667c0b;border-color:var(--mk-border);}
.mk-root .mk-analogue-wrap>.margin-compensator>.mk-scaling-card{flex:1 1 300px!important;width:350px!important;max-width:350px!important;min-width:0!important;}
@media(max-width:478px) and (orientation:portrait){.mk-root .mk-analogue-wrap>.margin-compensator>.mk-scaling-card{flex:0 0 auto!important;}}

/* SHELL V2 */
.mk-root .mk-header>.margin-compensator>.mk-logo{flex:0 0 120px;min-width:120px;justify-content:center;}
.mk-logo>.margin-compensator{align-items:center;justify-content:center;gap:0;}
.mk-logo-name{font-size:21px;font-weight:700;color:var(--mk-accent);line-height:23px;}
.mk-logo-sub{font-size:10px;letter-spacing:.08em;line-height:13px;}
.mk-footer-company,.mk-footer-partner{font-size:11px;white-space:nowrap;}.mk-footer-partner{margin-left:auto;color:var(--mk-secondary);}
.mk-alarm-strip{height:34px;min-height:34px;flex-shrink:0;box-sizing:border-box;background:#f4f6f7;border-bottom:1px solid var(--mk-border);padding:0 10px;--container-column-gap:10px;}
.mk-alarm-strip>.margin-compensator{align-items:center;}
.mk-alarm-type{font-size:10px;font-weight:700;min-width:62px;}
.mk-root .mk-alarm-strip>.margin-compensator>.mk-alarm-message{flex:1 1 auto;min-width:0;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mk-alarm-count{font-size:10px;white-space:nowrap;color:var(--mk-secondary);}
.mk-root .mk-strip-button .iqel-state-layer{min-height:25px;padding:3px 8px;}.mk-root .mk-strip-button .iqel-button-label{font-size:11px;}
.mk-alarm-strip[data-severity="alarm"]{border-left:4px solid #a1453b;background:#f8edeb;}.mk-alarm-strip[data-severity="warning"]{border-left:4px solid #ac7d32;background:#faf4e9;}
.mk-plant-scene{width:100%;max-width:1000px;height:auto;min-height:0;aspect-ratio:1000/540;margin-left:auto;margin-right:auto;flex:none;}
.mk-plant-scene>.margin-compensator{position:absolute;inset:0;}.mk-plant-image .iqel-image{object-fit:contain;}
.mk-root .mk-turbine-split>.margin-compensator>.mk-turbine-visual{padding:16px;--container-row-gap:8px;}
.mk-machine-scene{position:relative;aspect-ratio:700/520;width:100%;max-width:800px;margin:auto;}
.mk-machine-scene>.margin-compensator{position:absolute;inset:0;}
.mk-machine-image{position:absolute;inset:0;width:100%;height:100%;}.mk-machine-image .iqel-image{width:100%;height:100%;object-fit:contain;}
.mk-machine-scene>.margin-compensator>.mk-machine-hit{position:absolute;}
.mk-hit-generator{left:5%;top:13%;}.mk-hit-valve{right:1%;top:30%;}.mk-hit-water{left:1%;top:57%;}.mk-hit-deflector{right:1%;bottom:7%;}
.mk-root .mk-machine-hit .iqel-state-layer{padding:6px 9px;min-height:30px;}.mk-root .mk-machine-hit .iqel-button-label{font-size:11px;}
.mk-nozzle-choices{--container-column-gap:6px;--container-row-gap:6px;}.mk-root .mk-nozzle-choices .iqel-state-layer{padding:6px 10px;min-height:30px;}
.mk-focus-text{white-space:pre-line;font-size:13px;line-height:1.7;}
.mk-root .mk-logo>.margin-compensator{align-items:center;justify-content:center;}
.mk-root .mk-logo .mk-logo-name,.mk-root .mk-logo .mk-logo-sub{width:100%;text-align:center;}
.mk-root .mk-plant-scene{width:min(100%,1000px,calc((100vh - 290px)*1.85185));min-width:650px;}
.mk-root .mk-machine-scene{width:100%;min-height:320px;height:auto;aspect-ratio:700/520;max-width:800px;margin:0;align-self:stretch;}
.mk-root .mk-machine-scene{height:clamp(250px,calc(100vh - 440px),470px);min-height:250px;aspect-ratio:auto;}

/* Direct component focus; no visible hit buttons. */
.mk-machine-scene{cursor:pointer;}
.mk-root .mk-machine-scene>.margin-compensator>.mk-focus-popup{display:none;position:absolute;z-index:10;width:230px;max-width:95%;padding:12px 32px 12px 12px;margin:0;box-sizing:border-box;box-shadow:0 4px 16px #263d4b26;cursor:default;}
.mk-root .mk-machine-scene>.margin-compensator>.mk-focus-popup.mk-open{display:block;}
.mk-focus-popup .mk-section-title{font-size:13px;margin-bottom:4px;}.mk-focus-popup .mk-focus-text{font-size:11px;line-height:1.5;}
.mk-focus-popup>.margin-compensator{position:relative;}
.mk-root .mk-focus-popup>.margin-compensator>.mk-popup-close{position:absolute;right:-26px;top:-7px;}
.mk-root .mk-popup-close .iqel-state-layer{padding:2px 7px;min-height:24px;}
.mk-root .mk-footer>.margin-compensator{align-items:center;justify-content:flex-start;}
.mk-root .mk-footer .mk-footer-credit{white-space:pre-line;font-size:10px;line-height:11px;flex:0 0 auto;max-width:none;color:var(--mk-text);}
.mk-footer-credit .iqel-label{white-space:pre-line;line-height:11px;}

/* Emphasized persistent operating information inside the existing status height. */
.mk-root .mk-status>.margin-compensator{align-items:center;justify-content:space-between;gap:14px;}
.mk-root .mk-status-state{flex:0 0 170px;font-size:14px;font-weight:700;white-space:nowrap;}
.mk-root .mk-status>.margin-compensator>.mk-status-metric{flex:1 1 100px;min-width:90px;height:32px;}
.mk-root .mk-status-metric>.margin-compensator{justify-content:center;gap:0;}
.mk-status-key{font-size:10px;line-height:12px;color:var(--mk-secondary);}
.mk-status-value{font-size:15px;line-height:18px;font-weight:650;font-variant-numeric:tabular-nums;}
.mk-status-key .iqel-label,.mk-status-value .iqel-label{line-height:inherit;}
.mk-machine-image .iqel-image{pointer-events:auto;user-select:none;-webkit-user-drag:none;}

/* Analog cards wrap against the real viewport, independently of the 960px HMI canvas. */
.mk-root .mk-analogue-wrap{flex:0 1 auto!important;width:calc(100vw - 280px)!important;max-width:100%!important;min-width:350px!important;}
.mk-root .mk-analogue-wrap>.margin-compensator{flex-direction:row!important;flex-wrap:wrap!important;align-items:stretch;justify-content:flex-start;}
.mk-root .mk-analogue-wrap>.margin-compensator>.mk-scaling-card{flex:0 0 350px!important;width:350px!important;max-width:350px!important;min-width:350px!important;}
@media(max-width:758px){.mk-root .mk-analogue-wrap{width:calc(100vw - 152px)!important;}}

/* DEMO FINISH: branding and navigation icons */
.mk-root .mk-footer .mk-footer-credit,.mk-root .mk-footer-credit .iqel-label{white-space:nowrap!important;font-size:11px;line-height:20px;}
.mk-root .mk-menu .mk-nav .iqel-state-layer{display:flex!important;align-items:center;justify-content:flex-start;gap:7px;padding:10px 5px;}
.mk-root .mk-menu .mk-nav .iqel-state-layer::before,.mk-root .mk-icon-electrical .iqel-state-layer::before{content:"";display:block;width:20px;height:20px;flex:0 0 20px;background:currentColor;-webkit-mask:var(--mk-icon) center/contain no-repeat;mask:var(--mk-icon) center/contain no-repeat;}
.mk-root .mk-menu .mk-nav .iqel-button-label{text-align:left;font-size:12px;}
.mk-electrical-link{max-width:300px;margin-top:8px;}
.mk-icon-electrical .iqel-state-layer{display:flex;align-items:center;gap:8px;}
.mk-electrical-coming{max-width:720px;padding:24px!important;}
.mk-coming-label{color:var(--mk-accent);font-weight:600;margin:12px 0;}
.mk-electrical-description{white-space:normal;line-height:1.6;max-width:650px;}
.mk-electrical-back{max-width:220px;}
.node-mkp-1{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M3%2011%2012%203%2021%2011%20M5%2010v11h5v-7h4v7h5V10%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mknav-21{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%209V3c5%200%207%204%203%207%20M15%2012h6c0%205-4%207-7%203%20M12%2015v6c-5%200-7-4-3-7%20M9%2012H3c0-5%204-7%207-3%20M14%2012a2%202%200%201%201-4%200%202%202%200%200%201%204%200%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mkp-2{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M3%203v18h18%20M6%2016l4-6%204%203%206-8%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mkp-3{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M5%2017h14l-2-3V9a5%205%200%200%200-10%200v5z%20M10%2020h4%20M12%202v2%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mknav-22{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M3%2021V10h7v11%20M14%2021V5h7v16%20M5%2013h3%20M5%2017h3%20M16%209h3%20M16%2013h3%20M16%2017h3%20M10%208l4-4%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mknav-23{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M3%207h12v12H3z%20M15%2011l6-4v12l-6-4%20M5%204h5%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mkdf-9, .mk-icon-electrical{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M13%202%204%2014h7l-1%208%2010-13h-8z%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mkp-4{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4%206h16%20M4%2012h16%20M4%2018h16%20M8%203v6%20M16%209v6%20M10%2015v6%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
.node-mkp-5{--mk-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M14%205a6%206%200%200%200-7%207L2%2017l5%205%205-5a6%206%200%200%200%207-7l-4%204-5-5z%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}
