@import url("https://fonts.googleapis.com/css2?family=Arimo:wght@400;700&display=swap");
@font-face{font-family:"LCD Display";src:url("assets/fonts/lcd-display-font/lcd-display.otf.woff2") format("woff2");font-style:normal;font-weight:400;font-display:block}
:root{font-family:Arimo,sans-serif;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#111;color:#eee}
body{display:block;padding:12px}
button,input,select{font:inherit}
button{cursor:pointer}

[hidden]{display:none!important}
.start-gate{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.88);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.start-card,.jonny-card{width:min(520px,100%)}
.start-card{padding:24px;border:1px solid #3a3a3a;border-radius:14px;background:#171717;box-shadow:0 18px 70px #000;color:#eee;text-align:center}
.jonny-gate{z-index:11000}
.jonny-card{overflow:hidden;border:1px solid #3a3a3a;border-radius:14px;background:#0835ff;box-shadow:0 18px 70px #000}
.jonny-dismiss{display:block;width:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;line-height:0;touch-action:manipulation}
.jonny-dismiss:focus-visible{outline:3px solid #fff;outline-offset:-4px}
.jonny-card img{display:block;width:100%;height:auto;max-width:100%;user-select:none;-webkit-user-drag:none;pointer-events:none}
.start-card h1{margin:4px 0 10px;font-size:30px}.start-card p{margin:0 auto 18px;max-width:440px;line-height:1.45;color:#c9c9c9}
.start-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#8abfff}.start-credit{margin-top:12px;font-size:12px;color:#aaa}.start-credit a{color:#8abfff;text-decoration:none}.start-credit a:hover{text-decoration:underline}.start-card button{font-size:18px;font-weight:700;padding:11px 24px;border-radius:8px;border:1px solid #75b9ff;background:#1f5f96;color:white;box-shadow:0 0 0 1px #000 inset}.start-card button:hover{background:#2674b6}.start-card .tiny{margin-top:14px;line-height:1.4}
main{width:min(100%,1120px);margin:0 auto}
.sim-shell{display:grid;gap:14px}
.stage-host{position:relative;width:min(100%,1050px,calc((100svh - 24px) * 4 / 3));margin:0 auto;aspect-ratio:4/3;background:#000;overflow:hidden;border:1px solid #333;box-shadow:0 10px 35px #0009;outline:none}
.stage-host.selected-keypad{box-shadow:0 0 0 2px #78bfff,0 10px 35px #0009}
.stage{position:absolute;width:480px;height:360px;transform-origin:0 0;user-select:none;-webkit-user-select:none}
.sprite{position:absolute;display:block;pointer-events:none}
.main{left:7px;top:22px;width:389px;height:328px;z-index:1}
.switch-label-overlay{display:none;left:7px;top:22px;width:389px;height:328px;z-index:2;clip-path:inset(98px 319px 0 0);pointer-events:none}
.stage.primary-alt>.switch-label-overlay{display:block!important}

/* Each Scratch cover costume is kept full-width. preserveAspectRatio="none"
   is injected into the animation SVGs by the runtime so the SVG's own crop
   box cannot letterbox an intermediate frame and make the cover implode. */
.door-img{position:absolute;left:169.125px;top:123.389px;width:226.322px;height:122.423px;display:block;pointer-events:none;z-index:30;object-fit:fill}
.door-button{position:absolute;left:169.125px;top:123.389px;width:226.322px;height:122.423px;margin:0;padding:0;border:0;background:transparent;cursor:pointer;z-index:31;overflow:visible;outline:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.door-button:focus-visible{outline:1px solid #78bfff;outline-offset:1px}

.lcd{position:absolute;left:199px;top:57px;width:160px;height:37px;overflow:hidden;display:block;filter:contrast(1.02);z-index:16}
.lcd canvas{display:block;width:160px;height:37px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:pre!important;border:0!important}
.led-stack{position:absolute;display:block;width:14px;height:5px;z-index:17;pointer-events:none}
.armed-led{left:128px;top:138px}.ready-led{left:128px;top:160px}
.led-stack img{position:absolute;inset:0;width:100%;height:100%;display:block}
.led-stack .led-on{opacity:0;transition:opacity .035s linear}
.led-stack .led-on.lit{opacity:1}
#keys{position:absolute;inset:0;z-index:20;pointer-events:none}
.key-hit,.switch-hit{position:absolute;margin:0;padding:0;border:0;background:transparent;cursor:pointer;outline:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.key-hit{pointer-events:auto}
.key-hit img,.switch-hit img{width:100%;height:100%;display:block;pointer-events:none}.key-hit img{object-fit:contain}
.key-hit:focus-visible,.switch-hit:focus-visible{outline:2px solid #78bfff;outline-offset:2px}
.key-hit:active img,.key-hit.keyboard-pressed img{transform:translateY(.7px);filter:brightness(.78)}
.switch-hit{z-index:12}.switch-hit img{transition:filter .08s linear}
.power-switch{left:24px;top:135px;width:36px;height:59px}.entry-switch{left:24px;top:211px;width:36px;height:59px}.perimeter-switch{left:24px;top:286px;width:36px;height:59px}

.status-panel,.manager-panel{background:#1b1b1b;border:1px solid #303030;border-radius:10px;padding:12px 14px;display:grid;gap:8px;font-size:14px}
.status-head,.manager-heading{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.toolbar-select{display:grid;gap:3px;font-size:11px;color:#aaa}.toolbar-select select{background:#101010;color:#eee;border:1px solid #444;border-radius:6px;padding:7px 9px}
.toolbar button,.device-form button,.device-card button,.aux-card button{border:1px solid #505050;background:#2a2a2a;color:#eee;border-radius:6px;padding:7px 10px}
.toolbar button:hover,.device-form button:hover,.device-card button:hover,.aux-card button:hover{background:#343434}
button.danger{border-color:#6d3535;color:#ffbcbc}
.tiny{font-size:12px;color:#aaa}.tiny code,.help-grid code{color:#cbe7ff}
.focus-status{font-size:12px;padding:7px 9px;border-radius:6px;background:#151d24;border:1px solid #263b4b;color:#cbe7ff}
details{margin-top:3px}summary{cursor:pointer;color:#ccc}.help-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:5px 16px;margin-top:10px;font-size:12px;color:#bbb}


.keypad-workspace-scroll{overflow:auto;border:1px solid #303030;border-radius:8px;background:#0d0d0d;max-width:100%}
.aux-keypads{position:relative;width:1100px;height:720px;background:#111;overflow:hidden}
.aux-keypads>.empty-bus{position:absolute;left:14px;top:14px;color:#888;font-size:12px}
.aux-card{position:absolute;width:330px;background:#131313;border:1px solid #333;border-radius:8px;padding:9px;display:grid;gap:7px;touch-action:none;box-shadow:0 8px 18px #0007}
.aux-card.model-6150{width:320px}
.aux-card.selected-keypad{border-color:#78bfff;box-shadow:0 0 0 1px #78bfff inset,0 8px 18px #0007}
.aux-card.drag-blocked{border-color:#d88b3b}
.aux-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:#bbb;cursor:grab;user-select:none;touch-action:none}
.aux-card-head:active{cursor:grabbing}
.aux-card-head strong{color:#eee}.aux-card-head .drag-hint{font-size:10px;color:#777}
.aux-kp-wrap{width:100%;max-width:389px;aspect-ratio:389/328;position:relative;background:transparent;margin:auto;overflow:visible;border-radius:3px;touch-action:auto}
.aux-kp-wrap>.kp-base{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.aux-kp-wrap.kp6160 .kp-base{clip-path:inset(0 0 19.4% 20.1%)}
.aux-lcd{position:absolute;left:49.357%;top:10.671%;width:41.131%;height:11.280%;z-index:4}
.aux-lcd canvas{width:100%;height:100%;display:block}
.aux-led{position:absolute;width:3.599%;height:1.524%;z-index:5}.aux-led.armed{left:31.105%;top:35.366%}.aux-led.ready{left:31.105%;top:42.073%}
.aux-led img{position:absolute;inset:0;width:100%;height:100%}.aux-led .led-on{opacity:0}
.aux-keys{position:absolute;inset:0;z-index:8}
/* The manager-panel button theme must never leak into the physical keypad
   hit targets.  In v0.10 its padding/background collapsed the SVG artwork
   into the little black lozenges seen on auxiliary 6150/6160 keypads. */
.aux-card .aux-keys .key-hit{position:absolute;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;min-width:0;min-height:0}
.aux-card .aux-keys .key-hit:hover,.aux-card .aux-keys .key-hit:focus{background:transparent}
.aux-card .aux-keys .key-hit img{width:100%;height:100%;display:block;object-fit:contain}
.aux-card .aux-cover-hit{margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;min-width:0;min-height:0}
.aux-card .aux-cover-hit:hover,.aux-card .aux-cover-hit:focus{background:transparent}
.aux-cover{position:absolute;z-index:10;left:41.677%;top:30.911%;width:58.180%;height:37.324%;object-fit:fill;pointer-events:none}
.aux-cover-hit{position:absolute;z-index:11;left:41.677%;top:30.911%;width:58.180%;height:37.324%;background:transparent;border:0}
.aux-disabled{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#0009;color:#ddd;font-weight:bold;text-align:center;padding:20px}.aux-disabled[hidden]{display:none!important}

/* 6150 fixed-English keypad. The original Scratch artwork is staged in a
   480x360 scene; this wrapper crops only the keypad itself while preserving
   the exact sprite geometry. */
.aux-kp-wrap.kp6150{aspect-ratio:297/306;max-width:297px;background:transparent}
.kp6150 .kp6150-base{position:absolute;left:-26.07%;top:.20%;width:125.62%;height:99.94%;pointer-events:none;clip-path:inset(0 .44% 0 20.75%)}
.kp6150 .aux-lcd{left:47.85%;top:9.09%;width:34.82%;height:12.32%}
.kp6150 .aux-led{width:4.85%;height:1.63%}.kp6150 .aux-led.armed{left:22.10%;top:31.16%}.kp6150 .aux-led.ready{left:22.16%;top:38.88%}
.kp6150 .aux-cover,.kp6150 .aux-cover-hit{left:30.94%;top:25.62%;width:68.60%;height:43.60%}
.kp6150 .aux-cover{object-fit:fill}

.device-form{display:grid;grid-template-columns:90px 150px minmax(180px,1fr) minmax(150px,1fr) auto;gap:8px;align-items:end}
.device-form label{display:grid;gap:4px;font-size:11px;color:#aaa}.device-form input,.device-form select{width:100%;background:#101010;color:#eee;border:1px solid #444;border-radius:5px;padding:7px}
.device-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:9px}
.device-card{background:#131313;border:1px solid #333;border-radius:8px;padding:9px;display:grid;gap:7px}
.device-card.fault{border-color:#b88725}.device-card.alarmish{border-color:#a33}
.device-title{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.device-title strong{font-size:13px}.device-meta{font-size:11px;color:#999;line-height:1.35}
.device-actions{display:flex;gap:6px;flex-wrap:wrap}.device-actions button{padding:5px 8px;font-size:11px}
.device-actions button.active{background:#543b14;border-color:#9f7528}.device-actions button.remove{margin-left:auto;color:#f0aaaa}

@media(max-width:760px){body{padding:6px}.start-gate{backdrop-filter:none;-webkit-backdrop-filter:none}.stage-host{box-shadow:0 5px 18px #0008}.stage-host.selected-keypad{box-shadow:0 0 0 2px #78bfff,0 5px 18px #0008}.device-form{grid-template-columns:1fr 1fr}.device-form button{grid-column:1/-1}.status-panel{font-size:12px}}


.device-card.has-art{grid-template-columns:74px 1fr;align-items:center}
.device-card.has-art .device-art{grid-row:1/4;display:grid;place-items:center;min-height:92px;background:#f3f3f3;border-radius:6px;overflow:hidden;padding:5px}
.device-card.has-art .device-art img{max-width:100%;max-height:90px;display:block}
.device-card.has-art .device-art.contact-pair{grid-template-columns:1fr .28fr;gap:3px}
.device-card.has-art .device-art.contact-pair img:last-child{max-height:62px}
.device-card.has-art .device-title,.device-card.has-art .device-meta,.device-card.has-art .device-actions{grid-column:2}
.device-art.contact-pair img:last-child{transition:transform .16s ease}
.device-art.contact-pair.open img:last-child{transform:translateX(13px)}

/* v0.19.5 — Honeywell 6160V and swappable ECP-16 primary keypad */
.primary-swap-host{position:absolute;left:78px;top:22px;width:316px;height:338px;z-index:50;background:transparent;display:grid;place-items:start center;overflow:visible}
.primary-swap-host[hidden]{display:none!important}
.stage.primary-alt>.door-img,.stage.primary-alt>.door-button,.stage.primary-alt>.lcd,.stage.primary-alt>.led-stack,.stage.primary-alt>#keys{display:none!important;visibility:hidden!important;pointer-events:none!important}
.primary-swap-host .primary-swapped{position:relative!important;left:auto!important;top:auto!important;width:310px!important;max-width:310px!important;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;display:block}
.primary-swap-host .primary-swapped .aux-card-head{display:none}
.primary-swap-host .primary-swapped .aux-kp-wrap{margin:auto}

.aux-card.model-6160v{width:330px}
.aux-kp-wrap.kp6160v{position:relative!important;width:100%!important;max-width:310px!important;aspect-ratio:258/185!important;background:transparent;overflow:visible!important;margin:auto;border-radius:2px}
.kp6160v .kp6160v-base{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;pointer-events:none;object-fit:fill!important;z-index:1}
/* The clean 6160V model uses the same physical keypad-body crop as the old
   photo reference, so these are the measured 6160V locations rather than the
   regular 6160 stage coordinates. */
.kp6160v .aux-lcd{left:36%!important;top:13.57%!important;width:52.2%!important;height:16.9%!important;z-index:4;background:#8cb941;overflow:hidden}
.kp6160v .aux-lcd canvas{width:100%;height:100%;display:block}
.kp6160v .aux-led{position:absolute;z-index:18;display:block;pointer-events:none}
.kp6160v .aux-led.armed{left:14.0%;top:51.1%;width:5.6%;height:2.0%}
.kp6160v .aux-led.ready{left:14.0%;top:61.5%;width:5.6%;height:2.0%}
.kp6160v .aux-led.armed img,.kp6160v .aux-led.ready img{position:absolute;inset:0;width:100%;height:100%;display:block}
.kp6160v .aux-led.message{left:14.2%;top:72.2%;width:5.2%;height:3.3%}
.kp6160v .aux-led.message .led-off,.kp6160v .aux-led.message .led-on{position:absolute;inset:0;border-radius:999px;display:block}
.kp6160v .aux-led.message .led-off{background:#48545e;box-shadow:inset 0 0 2px #000a}
.kp6160v .aux-led.message .led-on{opacity:0;background:#d09a1c;color:#d09a1c;box-shadow:0 0 6px currentColor,inset 0 0 1px #fff8}
.kp6160v .aux-led.mic{display:none!important}
.kp6160v .aux-keys{position:absolute;inset:0;z-index:8}
.kp6160v .key-hit{position:absolute!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}
.kp6160v .key-hit img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.kp6160v .key-hit:active img,.kp6160v .key-hit.keyboard-pressed img{transform:translateY(.7px);filter:brightness(.78)}
.kp6160v .aux-cover{position:absolute;z-index:10;object-fit:fill;pointer-events:none}
.kp6160v .aux-cover-hit{position:absolute;z-index:11;background:transparent;border:0;margin:0;padding:0;box-shadow:none}
.kp6160v.closed .key-hit[data-key="1"],.kp6160v.closed .key-hit[data-key="2"],.kp6160v.closed .key-hit[data-key="3"],
.kp6160v.closed .key-hit[data-key="4"],.kp6160v.closed .key-hit[data-key="5"],.kp6160v.closed .key-hit[data-key="6"],
.kp6160v.closed .key-hit[data-key="7"],.kp6160v.closed .key-hit[data-key="8"],.kp6160v.closed .key-hit[data-key="9"],
.kp6160v.closed .key-hit[data-key="*"],.kp6160v.closed .key-hit[data-key="0"],.kp6160v.closed .key-hit[data-key="#"]{pointer-events:none}

@media(max-width:760px){body{padding:6px}.start-gate{backdrop-filter:none;-webkit-backdrop-filter:none}.stage-host{box-shadow:0 5px 18px #0008}.stage-host.selected-keypad{box-shadow:0 0 0 2px #78bfff,0 5px 18px #0008}.device-form{grid-template-columns:1fr 1fr}.device-form button{grid-column:1/-1}.status-panel{font-size:12px}}


.device-card.has-art{grid-template-columns:74px 1fr;align-items:center}
.device-card.has-art .device-art{grid-row:1/4;display:grid;place-items:center;min-height:92px;background:#f3f3f3;border-radius:6px;overflow:hidden;padding:5px}
.device-card.has-art .device-art img{max-width:100%;max-height:90px;display:block}
.device-card.has-art .device-art.contact-pair{grid-template-columns:1fr .28fr;gap:3px}
.device-card.has-art .device-art.contact-pair img:last-child{max-height:62px}
.device-card.has-art .device-title,.device-card.has-art .device-meta,.device-card.has-art .device-actions{grid-column:2}
.device-art.contact-pair img:last-child{transition:transform .16s ease}
.device-art.contact-pair.open img:last-child{transform:translateX(13px)}

/* v0.19.5 — Honeywell 6160V and swappable ECP-16 primary keypad */
.primary-swap-host{position:absolute;left:78px;top:22px;width:316px;height:338px;z-index:50;background:transparent;display:grid;place-items:start center;overflow:visible}
.primary-swap-host[hidden]{display:none!important}
.stage.primary-alt>.door-img,.stage.primary-alt>.door-button,.stage.primary-alt>.lcd,.stage.primary-alt>.led-stack,.stage.primary-alt>#keys{display:none!important;visibility:hidden!important;pointer-events:none!important}
.primary-swap-host .primary-swapped{position:relative!important;left:auto!important;top:auto!important;width:310px!important;max-width:310px!important;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;display:block}
.primary-swap-host .primary-swapped .aux-card-head{display:none}
.primary-swap-host .primary-swapped .aux-kp-wrap{margin:auto}

.aux-card.model-6160v{width:330px}
.aux-kp-wrap.kp6160v{position:relative!important;width:100%!important;max-width:310px!important;aspect-ratio:258/185!important;background:transparent;overflow:visible!important;margin:auto;border-radius:2px}
.kp6160v .kp6160v-base{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;pointer-events:none;object-fit:fill!important;z-index:1}
/* The clean 6160V model uses the same physical keypad-body crop as the old
   photo reference, so these are the measured 6160V locations rather than the
   regular 6160 stage coordinates. */
.kp6160v .aux-lcd{left:36%!important;top:13.57%!important;width:52.2%!important;height:16.9%!important;z-index:4;background:#8cb941;overflow:hidden}
.kp6160v .aux-lcd canvas{width:100%;height:100%;display:block}
.kp6160v .aux-led{position:absolute;z-index:18;display:block;pointer-events:none}
.kp6160v .aux-led.armed{left:14.0%;top:51.1%;width:5.6%;height:2.0%}
.kp6160v .aux-led.ready{left:14.0%;top:61.5%;width:5.6%;height:2.0%}
.kp6160v .aux-led.armed img,.kp6160v .aux-led.ready img{position:absolute;inset:0;width:100%;height:100%;display:block}
.kp6160v .aux-led.message{left:14.2%;top:72.2%;width:5.2%;height:3.3%}
.kp6160v .aux-led.message .led-off,.kp6160v .aux-led.message .led-on{position:absolute;inset:0;border-radius:999px;display:block}
.kp6160v .aux-led.message .led-off{background:#48545e;box-shadow:inset 0 0 2px #000a}
.kp6160v .aux-led.message .led-on{opacity:0;background:#d09a1c;color:#d09a1c;box-shadow:0 0 6px currentColor,inset 0 0 1px #fff8}
.kp6160v .aux-led.mic{display:none!important}
.kp6160v .aux-keys{position:absolute;inset:0;z-index:8}
.kp6160v .key-hit{position:absolute!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}
.kp6160v .key-hit img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.kp6160v .key-hit:active img,.kp6160v .key-hit.keyboard-pressed img{transform:translateY(.7px);filter:brightness(.78)}
.kp6160v .aux-cover{position:absolute;z-index:10;object-fit:fill;pointer-events:none}
.kp6160v .aux-cover-hit{position:absolute;z-index:11;background:transparent;border:0;margin:0;padding:0;box-shadow:none}
.kp6160v.closed .key-hit[data-key="1"],.kp6160v.closed .key-hit[data-key="2"],.kp6160v.closed .key-hit[data-key="3"],
.kp6160v.closed .key-hit[data-key="4"],.kp6160v.closed .key-hit[data-key="5"],.kp6160v.closed .key-hit[data-key="6"],
.kp6160v.closed .key-hit[data-key="7"],.kp6160v.closed .key-hit[data-key="8"],.kp6160v.closed .key-hit[data-key="9"],
.kp6160v.closed .key-hit[data-key="*"],.kp6160v.closed .key-hit[data-key="0"],.kp6160v.closed .key-hit[data-key="#"]{pointer-events:none}

/* v0.19.6 — geometry taken from 6160V-Excluding-Voice-Implementation.sb3. */
.stage.primary-6160v>.sprite.main{display:block!important;clip-path:inset(0 82% 0 0);visibility:visible!important}
.stage.primary-6160v .primary-swap-host{left:86px;top:22px;width:310px;height:333px;place-items:start center}
.aux-kp-wrap.kp6160v{position:relative!important;width:100%!important;max-width:310px!important;aspect-ratio:309.919944/333!important;background:transparent!important;overflow:visible!important;margin:auto;border-radius:2px}
.kp6160v .kp6160v-base{position:absolute!important;left:0!important;top:0!important;width:100%!important;height:66.748443%!important;display:block!important;pointer-events:none;object-fit:fill!important;z-index:1}
.kp6160v .aux-lcd{left:36.31885%!important;top:10.40498%!important;width:51.49717%!important;height:11.05105%!important;z-index:4;background:#8cb941;overflow:hidden}
.kp6160v .aux-lcd canvas{width:100%;height:100%;display:block}
.kp6160v .aux-led{position:absolute;z-index:18;display:block;pointer-events:none}
.kp6160v .aux-led.armed{left:13.61173%!important;top:34.72354%!important;width:4.64636%!important;height:1.49292%!important}
.kp6160v .aux-led.ready{left:13.61173%!important;top:41.51495%!important;width:4.64636%!important;height:1.49292%!important}
.kp6160v .aux-led.message{left:13.61174%!important;top:48.30806%!important;width:4.64636%!important;height:1.49292%!important}
.kp6160v .aux-led.armed img,.kp6160v .aux-led.ready img,.kp6160v .aux-led.message img{position:absolute;inset:0;width:100%;height:100%;display:block}
.kp6160v .aux-led .led-on{opacity:0}
.kp6160v .aux-keys{position:absolute;inset:0;z-index:8}
.kp6160v .key-hit{position:absolute!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}
.kp6160v .key-hit img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.kp6160v .key-hit:active img,.kp6160v .key-hit.keyboard-pressed img{transform:translateY(.7px);filter:brightness(.78)}
.kp6160v .aux-cover{position:absolute;z-index:10;object-fit:fill;pointer-events:none}
.kp6160v .aux-cover-hit{position:absolute;z-index:11;background:transparent;border:0;margin:0;padding:0;box-shadow:none}

/* v1.0.2: 6150 door costumes are precomposed onto a constant stage canvas. */
.kp6150 .aux-cover{left:0;top:0;width:100%;height:107%;object-fit:fill;overflow:visible}

/* 6160V local message-center LED: solid while recording, flashing until first playback. */
@keyframes messageWaitingBlink{0%,48%{opacity:1}49%,100%{opacity:0}}
.kp6160v .aux-led.message.recording .led-on{opacity:1!important;animation:none!important}
.kp6160v .aux-led.message.waiting .led-on{opacity:1;animation:messageWaitingBlink 1s steps(1,end) infinite}


/* v1.0.7 public changelog */
.start-actions{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.start-actions .secondary{background:#30343a;border:1px solid #60656d;color:#fff}
.changelog-dialog{width:min(760px,calc(100vw - 28px));max-height:min(82vh,760px);padding:0;border:1px solid #545860;border-radius:16px;background:#17191c;color:#f4f4f4;box-shadow:0 24px 80px rgba(0,0,0,.55)}
.changelog-dialog::backdrop{background:rgba(0,0,0,.72)}
.changelog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px 14px;border-bottom:1px solid #36393f}
.changelog-head h2{margin:4px 0 0;font-size:1.35rem}
.dialog-close{min-width:42px;height:42px;padding:0;border-radius:50%;font-size:1.7rem;line-height:1;background:#292c31;color:#fff;border:1px solid #4b4f56}
.changelog-scroll{overflow:auto;max-height:58vh;padding:4px 24px 14px}
.release-entry{padding:16px 0;border-bottom:1px solid #303238}
.release-entry:last-child{border-bottom:0}
.release-entry h3{margin:0 0 7px;font-size:1rem;color:#fff}
.release-entry p,.release-entry li{color:#d5d7da;line-height:1.5}
.release-entry p{margin:0}
.release-entry ul{margin:8px 0 0;padding-left:20px}
.release-entry.current h3{font-size:1.08rem}
.changelog-foot{display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:14px 24px 18px;border-top:1px solid #36393f;font-size:.86rem;color:#aeb2b8}
.changelog-foot a{color:#8bc9ff}
@media (max-width:620px){.changelog-head,.changelog-scroll,.changelog-foot{padding-left:16px;padding-right:16px}.changelog-scroll{max-height:62vh}.changelog-foot{gap:8px}}

/* v1.0.8.9 — function-key/backlight/fire-alarm reliability pass */
.function-label-grid{display:grid;grid-template-columns:repeat(4,minmax(190px,1fr));gap:10px}
.function-label-row{display:grid;grid-template-columns:30px 72px 1fr;gap:9px;align-items:center;background:#131313;border:1px solid #353535;border-radius:9px;padding:9px;color:#ddd}
.function-key-letter{display:grid;place-items:center;width:28px;height:28px;border-radius:999px;background:#252525;border:1px solid #4b4b4b;font-weight:800}
.function-label-preview{width:70px;height:auto;display:block;object-fit:contain}
.function-label-select-wrap{display:grid;gap:4px;font-size:11px;color:#aaa;min-width:0}
.function-label-select-wrap select{width:100%;min-width:0;background:#101010;color:#eee;border:1px solid #444;border-radius:5px;padding:6px}
.function-label-behavior{display:block;color:#8f949b;line-height:1.25;min-height:2.5em}
@media(max-width:900px){.function-label-grid{grid-template-columns:repeat(2,minmax(190px,1fr))}}
@media(max-width:520px){.function-label-grid{grid-template-columns:1fr}.function-label-row{grid-template-columns:30px 76px 1fr}}

/* v1.1 — Vista Emulator DELUXE identity */
.deluxe-brand{display:flex;flex-direction:column;align-items:center;gap:0;margin:2px auto 14px;line-height:.9;text-transform:uppercase;filter:drop-shadow(0 4px 16px #0008)}
.deluxe-brand-name{font-size:clamp(28px,7vw,46px);font-weight:900;letter-spacing:-.045em;color:#f5f7fb;text-shadow:0 1px 0 #fff3}
.deluxe-brand strong{font-size:clamp(38px,10vw,66px);font-weight:1000;letter-spacing:.12em;padding-left:.12em;color:#8bcaff;background:none;-webkit-text-fill-color:currentColor;text-shadow:none}
.start-card #startTitle{font-size:18px;margin:0 0 12px;color:#d9e6f2;font-weight:700}
.runtime-brand{display:flex;flex-direction:column;gap:2px}
.runtime-brand-title{font-size:21px;font-weight:900;letter-spacing:-.02em;color:#f5f7fb}
.runtime-brand-title b{font-size:1.08em;letter-spacing:.08em;color:#8bcaff}
.runtime-brand-meta{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#8f9ca8}
.deluxe-release{border-left:3px solid #7dbdff;padding-left:14px}
@media(max-width:620px){.deluxe-brand strong{letter-spacing:.08em;padding-left:.08em}.runtime-brand-title{font-size:18px}}


/* v1.2 — simulated central-station Monitoring Center */
.monitoring-center-panel{margin-bottom:28px}
.monitoring-heading{align-items:center}
.monitoring-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.monitoring-online{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid #3c5142;border-radius:999px;background:#17251b;color:#ccebd2;font-size:12px;font-weight:700;letter-spacing:.02em}
.monitoring-dot{width:8px;height:8px;border-radius:50%;background:#61d47b;box-shadow:0 0 9px rgba(97,212,123,.75)}
.monitoring-summary{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:10px 12px;margin:10px 0;border:1px solid #34383d;border-radius:8px;background:#111315;color:#aeb4bb;font-size:12px}
.monitoring-event-list{display:grid;gap:8px;max-height:420px;overflow:auto;padding-right:3px}
.monitoring-empty{padding:24px 16px;text-align:center;border:1px dashed #42464d;border-radius:9px;color:#888;background:#101113}
.monitoring-event{display:grid;grid-template-columns:minmax(112px,150px) 1fr auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid #3b3f45;border-left:5px solid #68717c;border-radius:9px;background:#151719}
.monitoring-event.sev-alarm{border-left-color:#e94d4d;background:#1c1516}
.monitoring-event.sev-fire{border-left-color:#ff6a3d;background:#211612}
.monitoring-event.sev-duress{border-left-color:#ff2b80;background:#23111a;box-shadow:inset 0 0 0 1px rgba(255,43,128,.12)}
.monitoring-event.sev-test{border-left-color:#62a9ff}
.monitoring-event.sev-openclose{border-left-color:#7ccf83}
.monitoring-event.sev-bypass{border-left-color:#d3a84d}
.monitoring-time{font-variant-numeric:tabular-nums;color:#90969e;font-size:11px;line-height:1.35}
.monitoring-title{font-weight:800;color:#f3f4f5;letter-spacing:.025em}
.monitoring-event.sev-duress .monitoring-title{color:#ff80b2}
.monitoring-detail{margin-top:3px;color:#bec3c9;font-size:12px;line-height:1.35}
.monitoring-meta{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.monitoring-chip{padding:4px 6px;border-radius:5px;border:1px solid #3d4248;background:#0e0f11;color:#abb1b8;font:10px/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
.monitoring-duress-help{margin-top:10px;padding-top:10px;border-top:1px solid #30343a}
@media(max-width:720px){.monitoring-event{grid-template-columns:1fr;gap:5px}.monitoring-meta{justify-content:flex-start}.monitoring-actions{justify-content:flex-start}.monitoring-heading{align-items:flex-start}}


/* v1.4.1 — real 6270 / 6271CV touchscreen implementation.
   The supplied SWF art is used for button faces; geometry is normalized here
   because the old Flash demo mixed several inconsistent source rectangles. */
.aux-card.model-6270{width:392px}
.aux-card.model-6271cv{width:404px}
.aux-kp-wrap.kp6270,.aux-kp-wrap.kp6271cv{
  width:100%!important;max-width:376px!important;aspect-ratio:360/304!important;
  position:relative!important;overflow:visible!important;margin:auto!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
}
.aux-kp-wrap.kp6271cv{max-width:388px!important}
.touch-device-bezel{
  position:absolute;inset:0;border-radius:17px;padding:15px 17px 24px;
  display:grid;grid-template-rows:auto 1fr;gap:6px;
  background:#d8d8d6;
  border:2px solid #7b7f82;box-shadow:inset 0 2px 1px #fff, inset 0 -5px 10px #7774,0 7px 14px #0006;
}
.kp6271cv .touch-device-bezel{
  background:#142944;
  border-color:#5f7693;box-shadow:inset 0 2px 1px #94b7e733,inset 0 -6px 12px #0008,0 7px 14px #0008;
}
.touch-model-mark{
  height:17px;display:flex;align-items:center;justify-content:space-between;
  padding:0 5px;font:700 10px/1 Arimo,sans-serif;letter-spacing:.05em;color:#444;text-transform:uppercase;
}
.touch-model-mark strong{font-size:11px;color:#222}
.kp6271cv .touch-model-mark{color:#c9d6e8}.kp6271cv .touch-model-mark strong{color:#f3d952}
.touch-screen{
  position:relative;width:100%;aspect-ratio:4/3;min-height:0;overflow:hidden;
  padding:5px;background:#f4f4f2;border:2px solid #686b6e;border-radius:3px;
  display:grid;grid-template-rows:17px 34px 48px 1fr 30px;gap:3px;
  color:#111;font-family:Arimo,sans-serif;box-shadow:inset 0 0 0 1px #fff;
}
.kp6271cv .touch-screen{background:#19548f;border-color:#081d32;color:#f6ee54;box-shadow:inset 0 0 0 1px #5fa0d455}
.touch-screen button{margin:0!important;padding:0!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;min-width:0!important;min-height:0!important;color:inherit!important}
.touch-screen button:hover,.touch-screen button:focus{background:transparent!important}
.touch-screen-top{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.touch-screen-title{font-weight:800;font-size:12px;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.touch-clock{font:700 10px/1 Arimo,sans-serif;white-space:nowrap;color:#444}.kp6271cv .touch-clock{color:#eef4ff}
.touch-nav-source{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;align-items:center}
.touch-img-action{display:grid!important;place-items:center!important;overflow:visible!important;cursor:pointer}
.touch-img-action img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.touch-img-action:active img{transform:translateY(1px);filter:brightness(.82)}
.touch-nav-source .touch-img-action{height:32px}
.touch-nav-source .touch-img-action.is-active{outline:1px dashed rgba(0,0,0,.45)!important;outline-offset:-2px}
.kp6271cv .touch-nav-source .touch-img-action.is-active{outline-color:#f4df53!important}
.touch-status-pane{
  padding:4px 6px;border:1px solid #aaa;background:#fff;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:6px;align-items:center;overflow:hidden;
}
.kp6271cv .touch-status-pane{background:#0d477c;border-color:#71a0c2;color:#f8f4b1}
.touch-status-pill{grid-row:1/3;align-self:center;padding:3px 5px;border-radius:2px;border:1px solid #888;background:#ddd;color:#111;font-size:8px;font-weight:800;letter-spacing:.03em;white-space:nowrap}
.kp6271cv .touch-status-pill{background:#0a3158;color:#ffeb65;border-color:#6aa3cb}
.touch-status-pill.state-armed{background:#d9e7cf;color:#20451d}.touch-status-pill.state-alarm{background:#ffdbd6;color:#8c0909}.touch-status-pill.state-entry{background:#faedc9;color:#5c4109}.touch-status-pill.state-off{background:#ddd;color:#555}
.touch-display-main{font-size:12px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.touch-display-sub{font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.touch-display-meta{display:none}
.touch-page-stack{position:relative;overflow:hidden;min-height:0}
.touch-page{display:none!important;height:100%;min-height:0;overflow:hidden}.touch-page.is-active{display:grid!important}
.touch-security-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:3px;align-items:center}
.touch-security-grid .touch-img-action{height:39px}
.touch-more-source-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;align-items:center}
.touch-more-source-grid .touch-img-action{height:27px}
.touch-page-footer{display:flex;gap:5px;justify-content:center;align-items:center;margin-top:2px;min-height:23px}
.touch-page-footer .touch-img-action{height:22px;max-width:120px}
.touch-message-list,.touch-event-list,.touch-zone-list,.touch-mode-list,.touch-setup-list{height:100%;overflow:auto;display:grid;align-content:start;gap:2px;padding:2px;background:#fff;border:1px solid #aaa}
.kp6271cv .touch-message-list,.kp6271cv .touch-event-list,.kp6271cv .touch-zone-list,.kp6271cv .touch-mode-list,.kp6271cv .touch-setup-list{background:#08477b;border-color:#73a1c3;color:#f8ef64}
.touch-list-row,.touch-list-empty,.touch-zone-row,.touch-mode-card{display:grid;grid-template-columns:1fr auto;gap:4px;padding:3px 4px;border-bottom:1px solid #ddd;font-size:8px;line-height:1.15;background:#f7f7f7;color:#111}
.touch-list-row span,.touch-zone-row span,.touch-mode-card span{font-weight:400}.touch-list-row strong,.touch-zone-row strong,.touch-mode-card strong{font-size:8px}
.kp6271cv .touch-list-row,.kp6271cv .touch-list-empty,.kp6271cv .touch-zone-row,.kp6271cv .touch-mode-card{background:#0b568e;color:#fff16e;border-color:#2c6f9f}
.touch-zone-row.is-fault{background:#ffe8d7}.touch-zone-row.is-bypass{background:#e5e5e5}.kp6271cv .touch-zone-row.is-fault{background:#7d3d24}.kp6271cv .touch-zone-row.is-bypass{background:#40556c}
.touch-output-state{padding:6px;background:#fff;border:1px solid #aaa;font-size:10px;color:#111}.kp6271cv .touch-output-state{background:#0b4b80;border-color:#73a1c3;color:#ffed63}
.touch-output-chips{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px}.touch-output-chips span{padding:2px 4px;border:1px solid #bbb;background:#eee;font-size:8px}.kp6271cv .touch-output-chips span{border-color:#7da6c7;background:#0a375f}
.touch-light-source-row{display:grid;grid-template-columns:repeat(3,1fr);place-items:center;gap:5px;margin-top:6px}.touch-light-source-row .touch-img-action{height:42px}
.touch-console-hint{font-size:8px;padding:2px 4px;text-align:center;color:#444}.kp6271cv .touch-console-hint{color:#e6efff}
.touch-keys{display:grid!important;grid-template-columns:repeat(3,1fr)!important;grid-template-rows:repeat(4,1fr)!important;gap:2px!important;position:relative!important;inset:auto!important;z-index:auto!important;min-height:0}
.touch-keys .key-hit.touch-source-key{position:relative!important;left:auto!important;top:auto!important;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;display:grid!important;place-items:center!important;overflow:hidden}
.touch-keys .touch-source-key img{display:block!important;max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain!important;pointer-events:none}
.touch-keys .touch-source-key:active img,.touch-keys .touch-source-key.keyboard-pressed img{transform:translateY(1px);filter:brightness(.8)}
.touch-emergency-row{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;align-items:center}
.touch-emergency-row .touch-img-action{height:28px}
.aux-kp-wrap.kp6270 .aux-disabled,.aux-kp-wrap.kp6271cv .aux-disabled{border-radius:15px}
.stage.primary-touch .primary-swap-host{left:18px!important;top:6px!important;width:444px!important;height:348px!important;place-items:center!important}
.stage.primary-touch .primary-swapped{width:430px!important;max-width:430px!important;height:auto!important}
.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6270,.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6271cv{max-width:430px!important}
@media(max-width:760px){.touch-screen{grid-template-rows:16px 32px 45px 1fr 28px}.touch-security-grid .touch-img-action{height:34px}.touch-more-source-grid .touch-img-action{height:24px}}
/* Keep the panel's physical POWER / E-E / INST simulator switches visible when
   a TouchCenter is installed as the primary browser keypad. */
.stage.primary-touch .primary-swap-host{left:78px!important;top:17px!important;width:392px!important;height:338px!important;place-items:start center!important}
.stage.primary-touch .primary-swapped{width:386px!important;max-width:386px!important}
.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6270,.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6271cv{max-width:386px!important}

/* v1.4.2 — SWF source-asset fidelity.
   The 6270/6271CV graphical controls are source-extracted PNGs. CSS only lays
   them out and renders dynamic text/state; it must not draw substitute keypad
   buttons, labels, or a fake physical bezel. */
.aux-kp-wrap.kp6270,.aux-kp-wrap.kp6271cv{
  background:transparent!important;border:0!important;box-shadow:none!important;
}
.kp6270 .touch-device-bezel,.kp6271cv .touch-device-bezel{
  position:absolute;inset:0;padding:0;display:block;background:transparent!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;
}
.kp6270 .touch-model-mark,.kp6271cv .touch-model-mark{display:none!important}
.kp6270 .touch-screen,.kp6271cv .touch-screen{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  aspect-ratio:4/3!important;border-radius:0!important;box-shadow:none!important;
}
.kp6270 .touch-screen{background:#f4f4f2!important;border:1px solid #8c8c8c!important}
.kp6271cv .touch-screen{background:#1d5e9b!important;border:1px solid #0a2a4c!important}
.touch-img-action,.touch-source-key{
  background:transparent!important;border:0!important;box-shadow:none!important;
  border-radius:0!important;padding:0!important;margin:0!important;
}
.touch-img-action img,.touch-source-key img{
  display:block!important;width:auto!important;height:auto!important;max-width:100%!important;
  max-height:100%!important;object-fit:contain!important;filter:none;
}
.touch-img-action:active img,.touch-source-key:active img{filter:brightness(.78)}
/* Dynamic emulator status/list surfaces are text/data, not replacement source art. */
.touch-status-pane,.touch-message-list,.touch-event-list,.touch-zone-list,.touch-mode-list,.touch-setup-list,.touch-output-state{
  border-radius:0!important;box-shadow:none!important;
}
.touch-emergency-row.has-two{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.touch-emergency-row.has-three{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.touch-source-note{position:absolute;left:0;right:0;bottom:-17px;text-align:center;font-size:8px;color:#777;letter-spacing:.02em}
.kp6271cv .touch-source-note{color:#9eb3c8}
/* Old improvised vector-like fallbacks are explicitly disabled. */
.touch-emergency-fallback,.touch-text-action{display:none!important}

/* v1.4.3 — TouchCenter SWF stage reconstruction.
   The physical housings are isolated from the original SWF 700px stage JPEGs;
   the 320×240 screen and primary security controls use coordinates recovered
   from the SWF display-list matrices. */
.aux-kp-wrap.kp6270,.aux-kp-wrap.kp6271cv{
  position:relative!important;height:auto!important;overflow:visible!important;
  padding:0!important;margin:0 auto!important;background:transparent!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;
}
.aux-kp-wrap.kp6270{width:100%!important;max-width:430px!important;aspect-ratio:537/443!important}
.aux-kp-wrap.kp6271cv{width:100%!important;max-width:430px!important;aspect-ratio:503/348!important}
.touch-shell-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-drag:none;z-index:1}
.kp6270 .touch-screen,.kp6271cv .touch-screen{
  position:absolute!important;inset:auto!important;display:block!important;padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important;
  aspect-ratio:auto!important;background:transparent!important;z-index:4;font-family:Arimo,sans-serif;
}
.kp6270 .touch-screen{left:19.92551%!important;top:12.41535%!important;width:59.59032%!important;height:54.17607%!important}
.kp6271cv .touch-screen{left:18.29026%!important;top:15.51724%!important;width:63.61829%!important;height:68.96552%!important}
.touch-page-stack{position:absolute!important;inset:0!important;display:block!important;overflow:hidden!important;min-height:0!important;z-index:1}
.touch-page{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;margin:0!important;box-sizing:border-box!important;overflow:hidden!important;display:none!important}
.touch-page.is-active{display:block!important}
.touch-source-security{background:transparent!important}
.touch-page-bg{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill;pointer-events:none;user-select:none;z-index:0}
.touch-source-positioned{position:absolute!important;display:block!important;overflow:hidden!important;z-index:4!important;cursor:pointer!important}
.touch-source-positioned img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:fill!important;pointer-events:none!important}
.touch-source-positioned:focus-visible{outline:1px solid #fff!important;outline-offset:-2px!important}
.touch-source-clock-icon{position:absolute;left:90.625%;top:89.16667%;width:9.375%;height:10.83333%;display:block;object-fit:fill;z-index:2;pointer-events:none}
.touch-source-status{position:absolute;z-index:3;display:block;text-align:center;white-space:nowrap;overflow:hidden;color:#090909;font-family:Arimo,sans-serif;font-weight:400;pointer-events:none;box-sizing:border-box}
.kp6271cv .touch-source-status{left:13.21875%;top:.14583%;width:73.75%;height:12.35417%;font-size:20px;line-height:29.65px}
.kp6270 .touch-source-status{left:13.21875%;top:.14583%;width:73.75%;height:12.35417%;font-size:20px;line-height:29.65px;font-weight:400}
.touch-source-date{position:absolute;z-index:3;pointer-events:none;white-space:nowrap;overflow:hidden;font-family:Arimo,sans-serif}
.kp6271cv .touch-source-date{left:1.3%;bottom:1.3%;max-width:48%;height:6%;color:#e7ff35;font-size:6px;font-weight:700;line-height:1}
.kp6270 .touch-source-date{display:none}

/* Dynamic physical LEDs over the original black lens artwork. */
.touch-shell-led{position:absolute;z-index:5;display:block;pointer-events:none;background:transparent;opacity:0;border-radius:3px;box-shadow:none}
.touch-shell-led.is-on{opacity:.96}
.touch-shell-led.led-armed.is-on{background:#f22522;box-shadow:0 0 3px rgba(242,37,34,.75)}
.touch-shell-led.led-ready.is-on{background:#4fd85d;box-shadow:0 0 3px rgba(79,216,93,.75)}
.touch-shell-led.led-message.is-on{background:#e7dd2f;box-shadow:0 0 3px rgba(231,221,47,.7)}
.kp6271cv .touch-shell-led.led-armed{left:86.87873%;top:31.32184%;width:3.97614%;height:2.01149%}
.kp6271cv .touch-shell-led.led-ready{left:86.67992%;top:39.08046%;width:3.97614%;height:2.01149%}
.kp6271cv .touch-shell-led.led-message{left:86.67992%;top:47.12644%;width:3.97614%;height:2.01149%}
.kp6270 .touch-shell-led.led-armed{left:10.80074%;top:30.92551%;width:2.60708%;height:2.25734%;border-radius:50%}
.kp6270 .touch-shell-led.led-ready{left:10.80074%;top:38.82619%;width:2.60708%;height:2.25734%;border-radius:50%}
.kp6270 .touch-shell-led.led-message{left:10.80074%;top:46.95260%;width:2.60708%;height:2.25734%;border-radius:50%}

/* 6270 bezel keys are part of the source shell bitmap. These transparent hit
   regions preserve the real physical artwork rather than painting replacements. */
.touch-shell-hotspot{position:absolute;z-index:6;margin:0;padding:0;border:0;background:transparent;box-shadow:none;border-radius:0;cursor:pointer}
.kp6270 .hs-home{left:31.1%;top:77.15%;width:8.0%;height:6.4%}
.kp6270 .hs-func{left:40.45%;top:77.15%;width:8.0%;height:6.4%}
.kp6270 .hs-panic{left:50.15%;top:77.15%;width:8.0%;height:6.4%}
.kp6270 .hs-back{left:59.85%;top:77.15%;width:8.0%;height:6.4%}
.touch-shell-hotspot:focus-visible{outline:1px dashed rgba(30,90,180,.8);outline-offset:-1px}

/* The source security page is the fidelity target. Other emulator utility
   pages keep source-extracted controls but use a compact data surface. */
.touch-generic-chrome{position:absolute;left:0;right:0;top:0;height:74px;z-index:20;box-sizing:border-box;padding:2px 3px 3px;display:grid;grid-template-rows:14px 25px 28px;gap:2px;background:#efefed;color:#111}
.kp6271cv .touch-generic-chrome{background:#1f639e;color:#f7ed65}
.touch-screen[data-touch-page="security"] .touch-generic-chrome{display:none!important}
.touch-screen-top{display:flex;align-items:center;justify-content:space-between;gap:4px;min-width:0}
.touch-screen-title{font-size:10px!important;font-weight:700!important;line-height:1!important}
.touch-clock{font-size:8px!important;line-height:1!important}
.touch-nav-source{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:2px!important;align-items:center!important;min-height:0!important}
.touch-nav-source .touch-img-action{height:25px!important;min-height:0!important}
.touch-status-pane{height:28px!important;min-height:0!important;box-sizing:border-box!important;padding:2px 3px!important;column-gap:3px!important}
.touch-status-pill{padding:1px 3px!important;font-size:6.5px!important}
.touch-display-main{font-size:8px!important}.touch-display-sub{font-size:6.5px!important}
.touch-generic-page{top:74px!important;height:calc(100% - 74px)!important;padding:2px!important;background:#efefed!important;color:#111!important}
.kp6271cv .touch-generic-page{background:#1e6099!important;color:#fff!important}
.touch-generic-page.is-active{display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;gap:2px!important}
.touch-generic-page[data-page="more"].is-active{grid-template-rows:minmax(0,1fr) auto auto!important}
.touch-generic-page[data-page="console"].is-active{grid-template-rows:auto minmax(0,1fr) auto!important}
.touch-generic-page[data-page="lights"].is-active{grid-template-rows:minmax(0,1fr) auto auto!important}
.touch-more-source-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:repeat(3,minmax(0,1fr))!important;gap:1px!important;min-height:0!important}
.touch-more-source-grid .touch-img-action{height:auto!important;min-height:0!important}
.touch-emergency-row{min-height:25px!important;gap:2px!important}.touch-emergency-row .touch-img-action{height:25px!important}
.touch-page-footer{min-height:21px!important;height:21px!important;margin:0!important;gap:2px!important}.touch-page-footer .touch-img-action{height:21px!important}
.touch-light-source-row{margin:0!important;gap:3px!important}.touch-light-source-row .touch-img-action{height:32px!important}
.touch-message-list,.touch-event-list,.touch-zone-list,.touch-mode-list,.touch-setup-list{min-height:0!important;height:auto!important}
.touch-list-row,.touch-list-empty,.touch-zone-row,.touch-mode-card{font-size:7px!important;padding:2px 3px!important}.touch-list-row strong,.touch-zone-row strong,.touch-mode-card strong{font-size:7px!important}
.touch-console-hint{font-size:6.5px!important;padding:1px 2px!important}
.touch-keys{gap:1px!important}.touch-keys .key-hit.touch-source-key{min-height:0!important}
.touch-output-state{font-size:8px!important;padding:3px!important}.touch-output-chips{margin-top:2px!important;gap:2px!important}.touch-output-chips span{font-size:6.5px!important;padding:1px 2px!important}
.touch-source-note{position:absolute;left:0;right:0;top:100%;bottom:auto!important;margin-top:2px;text-align:center;font-size:7px;color:#777;letter-spacing:.01em;z-index:7;pointer-events:none}

/* Existing primary-keypad slot constraints, preserving each source shell's ratio. */
.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6270,.stage.primary-touch .primary-swapped .aux-kp-wrap.kp6271cv{width:100%!important;max-width:386px!important}
@media(max-width:760px){
  .aux-kp-wrap.kp6270,.aux-kp-wrap.kp6271cv{max-width:100%!important}
  .touch-generic-chrome{height:70px;grid-template-rows:13px 23px 27px}
  .touch-generic-page{top:70px!important;height:calc(100% - 70px)!important}
}


/* v1.4.4 — source-frame fidelity pass.
   Do not re-grid or resize SWF controls. The TouchCenter screen remains a
   single 320×240 coordinate plane; source raster controls are placed at their
   recovered SWF coordinates. */
.touch-source-note,.touch-generic-chrome{display:none!important}
.touch-source-more,.touch-source-utility{background:transparent!important;color:inherit!important;padding:0!important}
.touch-source-flat-bg{position:absolute;inset:0;z-index:0;background:#f3f3f1;pointer-events:none}
.kp6271cv .touch-source-flat-bg{background:#23639d}
.touch-source-header{position:absolute;inset:0 auto auto 0;width:100%;height:100%;object-fit:fill;z-index:1;pointer-events:none;image-rendering:auto}
.touch-source-status-shared{z-index:3!important}
.touch-source-more .touch-source-positioned{z-index:5!important}
.touch-source-more .touch-source-positioned img{width:100%!important;height:100%!important;object-fit:fill!important;image-rendering:auto!important}
.touch-source-utility .touch-source-positioned{z-index:6!important}
.touch-event-source-bg{position:absolute;left:0;top:34px;width:100%;height:auto;z-index:2;pointer-events:none;object-fit:contain;image-rendering:auto}
.kp6270 .touch-event-source-bg{top:37px}
.touch-source-data-overlay{position:absolute!important;left:4%!important;right:4%!important;top:27%!important;bottom:16%!important;z-index:4!important;margin:0!important;padding:3px!important;overflow:auto!important;box-sizing:border-box!important;border:0!important;background:rgba(255,255,255,.88)!important;color:#111!important;font-family:Arimo,sans-serif!important}
.kp6271cv .touch-source-data-overlay{background:rgba(7,72,124,.90)!important;color:#fff!important}
.touch-source-data-overlay .touch-list-row,.touch-source-data-overlay .touch-list-empty,.touch-source-data-overlay .touch-zone-row,.touch-source-data-overlay .touch-mode-card{font-size:7px!important;line-height:1.15!important;padding:2px 3px!important;border-radius:0!important}
.touch-source-data-overlay .touch-list-row strong,.touch-source-data-overlay .touch-zone-row strong,.touch-source-data-overlay .touch-mode-card strong{font-size:7px!important}
.touch-source-utility[data-page="messages"] .touch-source-data-overlay{top:31%!important;bottom:20%!important;background:transparent!important;color:inherit!important}
.touch-source-utility[data-page="events"] .touch-source-data-overlay{top:29%!important;bottom:25%!important;background:transparent!important;color:inherit!important}
.touch-source-utility .touch-page-footer{position:absolute!important;left:4%!important;right:4%!important;bottom:2%!important;height:26px!important;min-height:26px!important;z-index:7!important;display:flex!important;justify-content:space-between!important;gap:6px!important;margin:0!important}
.touch-source-utility .touch-page-footer .touch-img-action{height:26px!important;max-width:46%!important}
.touch-source-utility[data-page="lights"] .touch-output-state{position:absolute!important;left:8%!important;right:8%!important;top:28%!important;z-index:4!important;border:0!important;background:transparent!important;color:inherit!important;text-align:center!important}
.touch-source-utility[data-page="lights"] .touch-light-source-row{position:absolute!important;left:12%!important;right:12%!important;top:55%!important;z-index:5!important;display:flex!important;justify-content:space-around!important;gap:10px!important;margin:0!important}
.touch-source-utility[data-page="lights"] .touch-light-source-row .touch-img-action{height:41px!important;width:auto!important}
.touch-source-utility[data-page="console"] .touch-console-hint{position:absolute!important;left:25%!important;right:18%!important;top:3%!important;height:20%!important;z-index:4!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#1b1b1b!important;color:#39f35a!important;font:700 10px/1 monospace!important;padding:0!important}
.kp6270 .touch-source-utility[data-page="console"] .touch-console-hint{background:#eee!important;color:#111!important;border:1px solid #777!important}
.touch-source-utility[data-page="console"] .touch-keys{position:absolute!important;left:25%!important;right:10%!important;top:25%!important;bottom:3%!important;z-index:5!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;grid-template-rows:repeat(4,1fr)!important;gap:2px!important}
.touch-source-utility[data-page="console"] .touch-keys .touch-source-key img{max-width:100%!important;max-height:100%!important;image-rendering:auto!important}
/* Native source pages must not inherit the old generic-page crop/74px offset. */
.touch-page.touch-source-more,.touch-page.touch-source-utility{top:0!important;height:100%!important;width:100%!important;display:none!important;overflow:hidden!important}
.touch-page.touch-source-more.is-active,.touch-page.touch-source-utility.is-active{display:block!important}
/* Keep the source raster crisp and uniformly scaled with the 320×240 screen. */
.touch-page-bg,.touch-source-clock-icon,.touch-source-header,.touch-shell-image{image-rendering:auto!important}


/* v1.4.5 — source-accurate TouchCenter header/navigation repair.
   The SWF ArmStatus field is Arial 20px, centered in a 236×29.65 field at
   x=42.3/y=0.35 on the native 320×240 page. Home/Back now follow the
   TouchCenter navigation model rather than both aliasing the Arming page. */
.touch-source-home{background:transparent!important;color:inherit!important;padding:0!important}
.touch-page.touch-source-home{top:0!important;height:100%!important;width:100%!important;display:none!important;overflow:hidden!important}
.touch-page.touch-source-home.is-active{display:block!important}
.touch-source-home .touch-source-positioned{z-index:5!important}
.touch-source-home .touch-source-positioned img{width:100%!important;height:100%!important;object-fit:fill!important;image-rendering:auto!important}


/* v1.4.6 — utility-page collision repair.
   The event-log screen is one 320×240 SWF coordinate plane. Do not stack
   generic footer controls, the clock/date footer, or a translucent browser
   list on top of the source event-log frame. */
.kp6271cv .touch-source-status{
  font-family:Arimo,sans-serif!important;
  font-size:16px!important;
  line-height:32px!important;
  font-weight:400!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
.touch-source-utility[data-page="events"] .touch-event-source-bg{
  left:0!important;top:34px!important;width:100%!important;height:206px!important;
  object-fit:fill!important;z-index:2!important;
}
.touch-source-utility[data-page="events"] .touch-event-header{
  position:absolute!important;left:8px!important;right:6px!important;top:36px!important;height:18px!important;
  z-index:5!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
  color:#191919!important;font-family:Arimo,sans-serif!important;font-size:10px!important;
  font-weight:700!important;line-height:18px!important;white-space:nowrap!important;pointer-events:none!important;
}
.touch-source-utility[data-page="events"] .touch-event-list{
  position:absolute!important;left:8px!important;right:6px!important;top:56px!important;height:123px!important;
  z-index:5!important;margin:0!important;padding:0!important;overflow:hidden!important;background:transparent!important;
  color:#f9f919!important;font-family:Arimo,sans-serif!important;font-size:10px!important;
  font-weight:400!important;line-height:17px!important;pointer-events:none!important;
}
.touch-source-utility[data-page="events"] .touch-event-list .touch-list-row{
  display:block!important;height:17px!important;min-height:17px!important;box-sizing:border-box!important;
  margin:0!important;padding:0 1px!important;border:0!important;border-radius:0!important;background:transparent!important;
  color:#f9f919!important;font:400 10px/17px Arimo,sans-serif!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;
}
.touch-source-utility[data-page="events"] .touch-page-footer,
.touch-source-utility[data-page="events"] .touch-source-clock-icon,
.touch-source-utility[data-page="events"] .touch-source-date,
.touch-source-utility[data-page="events"] .touch-source-data-overlay{
  display:none!important;
}

/* v1.4.7 — source-faithful TouchCenter utility pages + armed-state pass. */
.touch-armed-status-bg{display:none;position:absolute;z-index:2;left:13.125%;top:0;width:73.75%;height:12.5%;background:#f10c0c;border-radius:15px;pointer-events:none}
.touch-screen.is-armed-state .touch-armed-status-bg{display:block}
.touch-screen.is-armed-state .touch-source-status{color:#fff!important}
.touch-source-security.armed-state .touch-security-disarmed-bg,
.touch-source-security.armed-state .touch-security-disarmed-controls{display:none!important}
.touch-security-armed-panel{display:none;position:absolute;inset:0;z-index:3;background:#23639d}
.touch-source-security.armed-state .touch-security-armed-panel{display:block}
.touch-security-armed-panel .touch-source-positioned{z-index:5!important}
.touch-armed-copy{position:absolute;left:44%;top:24%;width:48%;z-index:4;color:#050505;font-family:Arimo,sans-serif;font-size:10px;line-height:1.2;display:flex;flex-direction:column;gap:2px}
.touch-lock-glyph{position:absolute;left:8.5%;top:27%;width:9px;height:10px;background:#626a6e;border:1px solid #1d272d;border-radius:1px;z-index:4;box-sizing:border-box}
.touch-lock-glyph:before{content:"";position:absolute;left:1px;top:-7px;width:5px;height:7px;border:2px solid #92999d;border-bottom:0;border-radius:5px 5px 0 0;box-sizing:border-box}

/* Console Mode is the original SWF console face, not a browser-generated keypad. */
.touch-console-page .touch-page-bg{z-index:1}
.touch-console-hotspots{position:absolute;inset:0;z-index:5}
.touch-console-hotspot{position:absolute!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;cursor:pointer!important}
.touch-console-hotspot:focus-visible{outline:1px dashed rgba(255,255,255,.8)!important;outline-offset:-2px}

/* Message Center uses the native SWF frame. Only dynamic message text is overlaid. */
.touch-message-center .touch-page-bg{z-index:1}
.touch-message-center .touch-source-status{z-index:4}
.touch-message-count{position:absolute;left:1.3%;top:17.5%;width:97%;height:8%;z-index:4;color:#fff;font:700 8px Arimo,sans-serif;text-align:center;line-height:18px;pointer-events:none}
.touch-message-center .touch-message-list{position:absolute!important;left:16%!important;top:28%!important;width:81%!important;height:28%!important;right:auto!important;bottom:auto!important;z-index:4!important;margin:0!important;padding:4px 3px!important;overflow:hidden!important;background:transparent!important;border:0!important;color:#fff!important;box-sizing:border-box!important}
.touch-message-entry{font:8px Arimo,sans-serif;line-height:1.2;white-space:nowrap;color:#fff}
.touch-transparent-hotspot{position:absolute;z-index:6;margin:0;padding:0;border:0;background:transparent;box-shadow:none;cursor:pointer}
.touch-transparent-hotspot:focus-visible{outline:1px dashed rgba(255,255,255,.85);outline-offset:-2px}

/* Lighting screen reconstructed from the SWF layout shown by the real 6271CV. */
.touch-lighting-page .touch-source-flat-bg{background:#08477b!important}
.touch-light-grid{position:absolute;left:2%;right:2%;top:27%;bottom:17%;z-index:4;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);gap:1px;font-family:Arimo,sans-serif;color:#fff16e}
.light-cell{position:relative;border:1px solid #e3de91;display:flex;align-items:center;gap:2px;padding:1px 3px;box-sizing:border-box;font-size:7px;font-weight:700;overflow:hidden}
.light-cell.garage{grid-column:1;grid-row:1}.light-cell.basement{grid-column:2;grid-row:1}.light-cell.porch{grid-column:1;grid-row:2}.light-cell.backyard{grid-column:1;grid-row:3}
.light-cell span{margin-left:auto;margin-right:2px;text-align:center;line-height:1.05}
.light-cell .touch-img-action{position:relative!important;width:auto!important;height:31px!important;flex:0 0 auto!important;border:0!important;background:transparent!important;padding:0!important}
.light-cell .touch-img-action img{width:auto!important;height:100%!important;object-fit:contain!important}
.light-cell.garage .touch-img-action{order:-1;width:66px!important}
.light-cell.basement .touch-img-action,.light-cell.porch .touch-img-action,.light-cell.backyard .touch-img-action{order:-1;width:31px!important}

/* Remove the giant invented utility-page HOME button/footer. */
.touch-source-utility[data-page="modes"] .touch-page-footer,
.touch-source-utility[data-page="setup"] .touch-page-footer{display:none!important}
.touch-source-utility[data-page="zones"] .touch-zones-footer{left:auto!important;right:4%!important;width:38%!important}

/* The source UI uses a restrained header font; prevent the browser from scaling it into billboard text. */
.kp6271cv .touch-source-status{font-family:Arimo,sans-serif!important;font-size:16px!important;line-height:30px!important}


/* v1.4.8 — touch auth flow + UtilitarianWave pass. */
button,input,select,textarea,.start-card,.jonny-card,.status-panel,.aux-card,.toolbar-select select,.changelog,.modal-card{
  border-radius:0 !important;
}
button,input,select,textarea,.start-card,.jonny-card,.status-panel,.aux-card{
  background-image:none !important;
}
.touch-armed-status-bg{border-radius:0 !important}
.touch-console-caption{
  position:absolute;left:31.875%;top:2%;width:50.625%;height:19%;z-index:6;
  display:flex;align-items:center;justify-content:center;padding:0 3px;
  background:#171717;color:#35f35d;border:0;border-radius:0;
  font:700 7px/1.05 Arimo,sans-serif;text-align:center;
  pointer-events:none;text-transform:uppercase;letter-spacing:.01em;overflow:hidden;
}
.touch-console-caption:empty{display:none}
.touch-message-count{
  font:700 8px Arimo,sans-serif !important;
}
.touch-message-entry{
  display:block;background:#0c4e88;border:1px solid #2c6798;padding:2px 6px;
  color:#fff16e;font:8px/1.2 Arimo,sans-serif;
}
.touch-message-entry + .touch-message-entry{margin-top:2px}
.touch-message-empty{color:#fff16e}
.touch-light-grid{font-family:Arimo,sans-serif !important}
.touch-armed-copy{font-family:Arimo,sans-serif !important}
.kp6271cv .touch-source-status,.kp6270 .touch-source-status{
  font-family:Arimo,sans-serif !important;
}

/* v1.4.9 — finish UtilitarianWave flattening. */
.start-card,.jonny-card,.status-panel,.manager-panel,.keypad-workspace-scroll,.aux-card,.device-card,.device-art,.changelog-dialog,.function-label-row,.monitoring-summary,.monitoring-empty,.monitoring-event,.monitoring-chip,.monitoring-online,.focus-status,.toolbar button,.device-form button,.device-card button,.aux-card button,.toolbar-select select,.device-form input,.device-form select{background-image:none!important;border-radius:0!important}


/* v1.4.10 — strict 6270/6271CV isolation + inline touch authorization. */
.touch-auth-overlay{display:none;position:absolute;inset:13% 4% 5% 4%;z-index:20;background:#f2f2f2;border:1px solid #777;color:#111;padding:7px;box-sizing:border-box;font-family:Arimo,sans-serif}
.touch-auth-overlay.is-active{display:block}
.kp6271cv .touch-auth-overlay{background:#23639d;border-color:#7fa7c7;color:#fff16e}
.touch-auth-title{height:14%;display:flex;align-items:center;justify-content:center;text-align:center;font-size:10px;font-weight:700;text-transform:uppercase}
.touch-auth-digits{height:12%;display:flex;align-items:center;justify-content:center;letter-spacing:.45em;font-size:15px;font-weight:700}
.touch-auth-keypad{height:74%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:3px;align-items:stretch;justify-items:stretch}
.touch-auth-keypad .touch-source-key{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:100%!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.touch-auth-keypad .touch-source-key img{width:100%!important;height:100%!important;object-fit:contain!important}
.touch-auth-cancel,.touch-auth-quick{border:1px solid #777;background:#ddd;color:#111;padding:0 2px;font-size:8px;font-weight:700}
.kp6271cv .touch-auth-cancel,.kp6271cv .touch-auth-quick{border-color:#7fa7c7;background:#0b568e;color:#fff16e}
.touch-auth-quick[hidden]{display:block!important;visibility:hidden!important;pointer-events:none!important}

/* The 6270 is the monochrome/non-color TouchCenter. Do not reuse 6271CV color chrome. */
.kp6270 .touch-security-armed-panel{background:#efefed!important}
.kp6270 .touch-armed-copy{color:#111!important}
.kp6270 .touch-armed-status-bg{background:#d8d8d6!important;border:1px solid #777!important}
.kp6270 .touch-screen.is-armed-state .touch-source-status{color:#111!important}
.kp6270 .touch-lighting-page .touch-source-flat-bg{background:#f3f3f1!important}
.kp6270 .touch-light-grid{color:#111!important}
.kp6270 .light-cell{border-color:#777!important;background:#f0f0ee!important;color:#111!important}
.kp6270 .touch-message-count{color:#111!important}
.kp6270 .touch-message-entry{background:transparent!important;border-color:#777!important;color:#111!important}
.kp6270 .touch-event-list,.kp6270 .touch-event-list .touch-list-row{color:#111!important}
.kp6270 .touch-mono-console-bg{position:absolute;inset:0;background:#f3f3f1;color:#111;padding:7px;box-sizing:border-box}
.kp6270 .touch-mono-console-title{text-align:center;font-size:11px;font-weight:700;height:12%;line-height:20px;border-bottom:1px solid #888}
.kp6270 .touch-mono-console-status{text-align:center;font-size:10px;height:12%;line-height:22px;color:#111}
.kp6270 .touch-mono-console-keypad{position:absolute;left:18%;right:18%;top:26%;bottom:6%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:4px}
.kp6270 .touch-mono-console-keypad .touch-source-key{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:100%!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.kp6270 .touch-mono-console-keypad .touch-source-key img{width:100%!important;height:100%!important;object-fit:contain!important}

/* 6271CV retains the color-only lighting/message/event treatment. */
.kp6271cv .touch-lighting-page .touch-source-flat-bg{background:#08477b!important}
.kp6271cv .touch-light-grid{color:#fff16e!important}
.kp6271cv .light-cell{border-color:#e3de91!important;background:transparent!important;color:#fff16e!important}
.kp6271cv .touch-message-count{color:#fff!important}
.kp6271cv .touch-message-entry{background:#0c4e88!important;border-color:#2c6798!important;color:#fff16e!important}