.scroll-hold{margin-top:64px;position:relative}.scroll-hold-frame{display:flow-root;position:sticky;top:100px;overflow:clip}.scroll-hold-content{display:flow-root}.demo.demo-slow{overflow:clip}.scroll-hold .demo-layout,.scroll-hold .comparison-box,.scroll-hold .installation-grid{margin-top:0}.installation-hold .scroll-hold-content{padding:6px}.installation-hold{margin-top:0}.installation-hold .installation-wrap{margin-top:60px}.installation-hold .installation-grid>div{transition:opacity .25s}.installation-hold .installation-grid>div[data-reached=false]{opacity:.5}.installation-hold .installation-grid>div[data-reached=false]:after{background:var(--gray);box-shadow:none}.scroll-hold.hold-reduced{height:auto}.hold-reduced .scroll-hold-frame{height:auto;position:static;overflow:visible}@media (max-width:760px){.scroll-hold .comparison-box{padding:12px}.scroll-hold .comparison-top h3{font-size:21px}.scroll-hold .comparison-top .state-label{margin-top:6px;font-size:9px}.scroll-hold .comparison-environment{padding:8px 0 0}.scroll-hold .comparison-panel{padding:8px}.scroll-hold .panel-modules{width:75px;height:68px;transform:scale(.45)}.scroll-hold .comparison-link{height:14px}.scroll-hold .comparison-console{padding:14px}.scroll-hold .console-heading{gap:8px;margin-bottom:8px}.scroll-hold .console-data{margin:10px 0}.scroll-hold .console-data>div{gap:6px}.scroll-hold .comparison-example{margin-top:6px}.scroll-hold .comparison-features{gap:10px;padding:10px 0}.scroll-hold .comparison-features>div{padding-top:8px}.scroll-hold .range-labels{letter-spacing:.02em;gap:8px;margin-top:4px;font-size:8px}.demo.demo-slow .demo-layout{grid-template-columns:minmax(0,1fr) 12px minmax(70px,.46fr);gap:6px;padding:5px 0}.demo.demo-slow .phone{border-radius:28px;width:100%;min-height:470px;padding:15px 12px}.demo.demo-slow .phone-top{padding:0 2px;font-size:9px}.demo.demo-slow .phone-island{width:44px;height:13px}.demo.demo-slow .phone-brand{margin-top:26px;font-size:19px}.demo.demo-slow .phone-brand>span{display:none}.demo.demo-slow .phone-tabs{margin-top:22px}.demo.demo-slow .phone-tabs button{letter-spacing:0;min-height:44px;font-size:9px}.demo.demo-slow .phone-panel{min-height:285px;padding-top:20px}.demo.demo-slow .phone-panel h3{font-size:21px}.demo.demo-slow .phone-panel>p.small{font-size:12px;line-height:1.5}.demo.demo-slow .energy-live{font-size:40px}.demo.demo-slow .energy-mini{gap:6px;font-size:11px}.demo.demo-slow .connection-line{width:100%;height:2px;margin:0}.demo.demo-slow .connection-line:before{transform-origin:0;transform:scaleX(0)}.demo.demo-slow .connection-line.connected:before{transform:scaleX(1)}.demo.demo-slow .connection-line:after{content:"";padding:0}.demo.demo-slow .command-pulse{animation-name:command-arrive}.demo.demo-slow .demo-device .product-scene{height:330px}.demo.demo-slow .demo-device .state-label{letter-spacing:.03em;flex-wrap:wrap;gap:4px;margin-top:8px;font-size:9px}.demo.demo-slow .lever-direction{letter-spacing:.02em;font-size:9px;line-height:1.5}.demo.demo-slow .phone .state-label{letter-spacing:.02em;font-size:9px}}@media (prefers-reduced-motion:reduce){.scroll-hold{height:auto!important}.scroll-hold-frame{position:static;overflow:visible;height:auto!important}.scroll-hold-content{margin-top:0!important;transform:none!important}}@media (max-width:760px) and (max-height:650px){.demo.demo-slow .phone{min-height:450px;padding-top:12px;padding-bottom:12px}.demo.demo-slow .phone-panel{min-height:270px}.demo.demo-slow .phone-brand{margin-top:22px}.demo.demo-slow .phone-tabs{margin-top:18px}}