.l7-hb-demo{--hb-demo-grid:minmax(0, 1fr) clamp(28px, 8vw, 116px) minmax(0, 1fr);color:#1b2e25;background:radial-gradient(at 50% 10%,#e9eee8,#0000 75%),linear-gradient(155deg,#dae2db,#a9b9ae);border:1px solid #bccac2;border-radius:clamp(16px,3vw,28px);gap:clamp(10px,2vw,22px);max-width:1040px;margin:28px auto 0;padding:clamp(12px,4vw,56px);display:grid}.l7-hb-stage,.l7-hb-demo-labels{grid-template-columns:var(--hb-demo-grid);align-items:center;display:grid}.l7-hb-panel{filter:drop-shadow(0 10px 14px #17291f38);justify-self:end;width:min(78%,216px);position:relative}.l7-hb-panel[data-format=us]{width:min(57%,151px)}.l7-hb-key-photo{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.l7-hb-key{cursor:pointer;background:0 0;border:0;border-radius:6px;min-width:44px;height:max(44px,17%);position:absolute;transform:translate(-50%,-50%)}.l7-hb-key:focus-visible,.l7-hb-key:active{outline-offset:3px;outline:2px solid #156b57}@media (hover:hover){.l7-hb-key:hover{box-shadow:0 0 0 2px #156b5780}}.l7-hb-signal{border-top:2px dashed #61786c;margin:0 clamp(4px,1.2vw,15px);position:relative}.l7-hb-signal:after{content:"";border:2px solid #61786c;border-width:2px 2px 0 0;width:8px;height:8px;position:absolute;top:-5px;right:0;transform:rotate(45deg)}.l7-hb-demo[data-power=on] .l7-hb-signal{border-color:#14654f;border-top-style:solid}.l7-hb-demo[data-power=on] .l7-hb-signal:after{border-color:#14654f}.l7-hb-heater{isolation:isolate;width:min(95%,218px);position:relative}.l7-hb-heater:before{z-index:-1;opacity:0;content:"";background:radial-gradient(#ccffe0 10%,#c7f7da88 42%,#0000 73%);border-radius:45%;transition:opacity .18s;position:absolute;inset:14% -4%}.l7-hb-demo[data-power=on] .l7-hb-heater:before{opacity:1}.l7-hb-demo[data-power=on] .l7-hb-heater:after{aspect-ratio:1;content:"";background:#148457;border-radius:50%;width:2%;min-width:3px;position:absolute;top:80.55%;left:50.1%;transform:translate(-50%,-50%);box-shadow:0 0 9px #13bb79}.l7-hb-heater img{filter:drop-shadow(6px 13px 12px #17291f4d);width:100%;height:auto;display:block}.l7-hb-demo-labels{align-items:stretch}.l7-hb-demo-labels>div{background:#f5f8f4e6;border:1px solid #ebf0ec;border-radius:12px;align-content:center;gap:4px;padding:clamp(8px,2vw,15px);display:grid}.l7-hb-demo-labels>div:last-child{grid-column:3}.l7-hb-demo-labels strong{font-size:clamp(14px,2.2vw,21px)}.l7-hb-demo-labels span{color:#405b50;font-size:clamp(12px,1.5vw,15px)}.l7-hb-demo-labels [role=status]:before{vertical-align:.13em;content:"";background:#64776d;border-radius:50%;width:.55em;height:.55em;margin-inline-end:.36em;display:inline-block}.l7-hb-demo[data-mode="30-min"] [role=status]:before{background:#137450}.l7-hb-demo[data-mode="60-min"] [role=status]:before{background:#166dc3}.l7-hb-demo[data-mode=always-on] [role=status]:before{background:#cb3137}.l7-hb-poles{color:#f3f7f3;background:#152824;padding:clamp(46px,7vw,96px) 0}.l7-hb-poles-heading{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:22px 36px;margin-bottom:24px;display:flex}.l7-hb-poles-heading h2{color:inherit;margin:8px 0 12px;font-size:clamp(30px,4.1vw,55px);line-height:1.12}.l7-hb-poles-heading>div:first-child{flex:510px}.l7-hb-poles-heading .gold-kicker{color:#b8e98e}.l7-hb-poles-heading p:not(.gold-kicker){color:#ccd9d2;max-width:67ch}.l7-hb-poles-control{flex-wrap:wrap;gap:8px;display:flex}.l7-hb-poles-control button{min-height:44px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:1px solid #83998e;border-radius:24px;padding:8px 16px;font-weight:600}.l7-hb-poles-control button[aria-pressed=true]{color:#183226;background:#cdecae;border-color:#cdecae}.l7-hb-poles-control button:focus-visible{outline-offset:3px;outline:2px solid #edfacf}.l7-hb-circuits{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,22px);display:grid}.l7-hb-circuit{background:#203730;border:1px solid #4a675b;border-radius:16px;padding:clamp(14px,2.8vw,32px)}.l7-hb-circuit[data-double=true]{border-color:#a4cc99}.l7-hb-circuit h3{color:inherit;margin:0 0 14px;font-size:clamp(17px,2vw,23px)}.l7-hb-circuit-row{color:#c2cdc6;grid-template-columns:minmax(76px,max-content) minmax(44px,1fr) minmax(60px,max-content);align-items:center;gap:8px;min-height:44px;font-size:clamp(13px,1.6vw,16px);display:grid}.l7-hb-circuit-row[data-closed=true]{color:#ccedb6}.l7-hb-circuit-row strong{text-align:right}.l7-hb-circuit-row b{margin-inline-end:3px;font-family:monospace}.l7-hb-circuit-line{align-items:center;display:flex}.l7-hb-circuit-line:before,.l7-hb-circuit-line:after{content:"";background:currentColor;flex:1;height:2px}.l7-hb-circuit-line i{border-inline:2px solid;border-radius:3px;width:30px;height:9px;position:relative}.l7-hb-circuit-line i:before{transform-origin:0;content:"";background:currentColor;width:100%;height:2px;position:absolute;top:3px;left:0;transform:rotate(-31deg)}.l7-hb-circuit-row[data-closed=true] i:before{transform:none}.l7-hb-circuit[data-double=false] [data-wire=N] i{display:none}.l7-hb-poles-note{color:#c9d8d0;max-width:86ch;margin-top:18px;font-size:14px}@media (width<=690px){.l7-hb-panel{width:min(92%,185px)}.l7-hb-panel[data-format=us]{width:min(69%,128px)}.l7-hb-circuits{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.l7-hb-heater:before{transition:none}}
