.temperature-demo .gauge{background:none!important;box-shadow:none;isolation:isolate}.dial-arc{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible}.dial-arc path{fill:none;stroke-width:14;stroke-linecap:round}.dial-track{stroke:#ffffff55}#dial-fill{stroke:url(#dial-colors);stroke-dasharray:50 100;transition:stroke-dasharray .25s}.gauge .demo-actions{position:absolute;inset:0;margin:0;width:100%;height:100%;display:block;pointer-events:none}.gauge .demo-actions button{position:absolute;top:79.514%;transform:translate(-50%,-50%);width:40px;height:40px;pointer-events:auto}.gauge .demo-actions button:hover:enabled{transform:translate(-50%,-50%) scale(1.06)}#temp-minus{left:20.486%}#temp-plus{left:79.514%}.gauge .demo-actions>span{position:absolute;top:84%;left:50%;transform:translateX(-50%);white-space:nowrap}.mode-buttons,.future-tabs,.cloud-periods,.climate-buttons{display:flex;gap:5px;flex-wrap:wrap;margin:22px 0 16px}.mode-buttons button,.future-tabs button,.cloud-periods button,.climate-buttons button{cursor:pointer;border:1px solid var(--line);background:var(--glass);color:var(--ink);border-radius:99px;padding:10px 12px;font:600 11px "Manrope",sans-serif;transition:background .25s,transform .25s}.mode-buttons button[aria-pressed=true],.future-tabs button[aria-pressed=true],.cloud-periods button[aria-pressed=true],.climate-buttons button[aria-pressed=true]{background:linear-gradient(110deg,#32ceda,#85e2c8);color:#12465a}.mode-scene{position:relative;height:145px;background:linear-gradient(135deg,#76d4e321,#b6def92b);border-radius:18px;overflow:hidden}.scene-house{position:absolute;left:35px;top:48px;width:65px;height:56px;background:#7db4c5;border-radius:3px}.house-roof{position:absolute;width:49px;height:49px;background:#558da4;rotate:45deg;left:8px;top:-24px;z-index:0}.house-window{position:absolute;width:16px;height:16px;background:#e2fbff;top:8px;left:10px;box-shadow:0 0 15px #f1fbff55}.house-door{position:absolute;bottom:0;right:10px;width:16px;height:30px;background:#b4dde4}.scene-pump{position:absolute;right:20px;top:59px;width:40px;height:45px;border-radius:6px;background:#c6d7dd;display:grid;place-items:center}.scene-pump>i{width:27px;height:27px;border:3px dashed #538599;border-radius:50%;animation:demo-fan 2s linear infinite}.heat-flow{position:absolute;top:77px;left:112px;right:67px;display:flex;justify-content:space-between}.heat-flow i{width:5px;height:5px;border-radius:50%;background:#26c8dc;animation:demo-flow 2s linear infinite}.heat-flow i:nth-child(2){animation-delay:-.6s}.heat-flow i:nth-child(3){animation-delay:-1.2s}.scene-caption{position:absolute;bottom:10px;left:0;right:0;font-size:9px;text-align:center;color:var(--muted)}.scene-flame{display:none;position:absolute;left:20px;top:20px;color:#ff7d42;font-size:30px;line-height:1}.mode-scene[data-mode=holiday] .house-window{animation:holiday-window 7s ease-in-out infinite}.mode-scene[data-mode=holiday] .heat-flow{animation:holiday-flow 7s ease-in-out infinite}.mode-scene[data-mode=fireplace] .scene-flame{display:block;animation:flame-glow 1s ease-in-out infinite alternate}.mode-scene[data-mode=fireplace] .heat-flow{opacity:.16}.mode-scene[data-mode=fireplace] .scene-pump>i{animation-play-state:paused}.mode-scene[data-mode=quiet] .scene-pump>i{animation-duration:7s}.mode-scene[data-mode=quiet] .heat-flow i{animation-duration:5s}.sound-rings{position:absolute;inset:-10px;border:1px solid #75b5c266;border-radius:50%;animation:quiet-wave 3s infinite}.mode-scene:not([data-mode=quiet]) .sound-rings{display:none}.mode-explanation h4{margin:18px 0 8px;font-size:15px;font-weight:700}.mode-explanation p{font-size:12px!important;line-height:1.8}.future-demo{margin-top:45px;padding:40px;border:1px solid var(--line);border-radius:28px;background:var(--glass);box-shadow:0 20px 50px #23557715}.future-demo-heading{text-align:center}.future-demo-heading .eyebrow{margin-bottom:12px}.future-demo h3{font-size:clamp(26px,4vw,42px);margin:0;letter-spacing:-.04em}.future-demo-heading>p:last-child{color:var(--muted);font-size:13px}.future-tabs{justify-content:center;margin:25px 0 35px}.future-tabs button{padding:12px 25px;font-size:12px}.future-panel{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;min-height:430px}.future-panel[hidden]{display:none}.future-story h4{font-size:32px;line-height:1.15;letter-spacing:-.04em;margin:20px 0}.future-story p{color:var(--muted);font-size:14px;line-height:1.8;text-wrap:pretty}.concept-tag{font-size:10px;color:var(--cyan-dark)}.interaction-hint{border-left:2px solid #26cbd4;padding-left:15px;font-size:12px!important}.concept-phone{margin:auto;width:260px;padding:20px;background:linear-gradient(140deg,#e7f8ff,#c0e9f1);border:6px solid #20465a;border-radius:32px;color:#23455c;box-shadow:0 20px 40px #123e5d33}.concept-status{display:flex;justify-content:space-between;font-size:9px}.concept-phone h4{font-size:20px;margin:26px 0 6px}.concept-temp{width:170px;height:170px;border-radius:50%;border:10px solid #7edfd9;margin:20px auto;display:grid;align-content:center;text-align:center;gap:8px}.concept-temp output{font-size:30px;letter-spacing:-.04em}.concept-temp small{font-size:8px}.concept-stepper{display:flex;justify-content:center;gap:25px;margin:-10px 0 20px}.concept-stepper button{border:0;border-radius:50%;width:40px;height:40px;font-size:23px;background:#f0fdff;color:#1a829c;cursor:pointer}.concept-stepper button:disabled{opacity:.35;cursor:default}.concept-metrics{display:flex;gap:8px}.concept-metrics>span{flex:1;padding:12px;border-radius:12px;background:#50b8cb15;font-size:9px}.concept-metrics b{display:block;font-size:14px;margin-top:5px}.concept-bottom{font-size:9px;text-align:center;margin-top:22px;color:#527a8e}.concept-cloud{background:#e7f4fc;border:1px solid #fff;border-radius:16px;padding:20px;color:#23455c;box-shadow:0 20px 40px #123e5d22;min-width:0}.cloud-toolbar{display:flex;justify-content:space-between;font-size:10px;border-bottom:1px solid #7fbac733;padding-bottom:15px}.concept-cloud h4{font-size:19px}.cloud-periods button{color:#32637b;background:#fff8}.cloud-chart{width:100%;height:auto;display:block}.chart-grid{stroke:#81a9c333;fill:none;stroke-width:1}#cloud-line{stroke:#12b5c9;stroke-width:3;fill:none;stroke-linecap:round}.cloud-chart.chart-updated #cloud-line{animation:chart-draw .8s ease}.chart-axis{display:flex;justify-content:space-between;font-size:9px;color:#658497}.concept-climate{border-radius:22px;padding:25px;background:linear-gradient(130deg,#98d8fb44,#abeff14d);transition:background .5s;text-align:center}.climate-room{height:240px;position:relative;display:grid;place-items:center}.climate-room .ac-unit{width:min(260px,90%);transform:none;margin:0}.climate-room .air-lines{top:165px}.climate-room .air-lines i{height:60px}.concept-climate h4{font-size:16px;font-weight:600}.climate-buttons{justify-content:center}.concept-climate[data-climate=heat]{background:linear-gradient(130deg,#ffb66d55,#ffdbb62b)}.concept-climate[data-climate=heat] .air-lines i{border-color:#ee9755}.concept-climate[data-climate=off]{background:#829aae15}.concept-climate[data-climate=off] .air-lines{opacity:0}.future-demo .roadmap-note{margin-bottom:0}@keyframes demo-fan{to{rotate:360deg}}@keyframes demo-flow{0%{translate:10px 0;opacity:0}50%{opacity:1}100%{translate:-10px 0;opacity:0}}@keyframes holiday-window{0%,100%{background:#fff0b9;box-shadow:0 0 15px #ffd27e88}30%,65%{background:#8fb6c9;box-shadow:none}}@keyframes holiday-flow{30%,65%{opacity:.1}0%,100%{opacity:1}}@keyframes flame-glow{to{scale:1.12;filter:drop-shadow(0 0 5px #ff9d42)}}@keyframes quiet-wave{0%,100%{opacity:.1;scale:.9}50%{opacity:.5;scale:1.08}}@keyframes chart-draw{from{opacity:.2;translate:0 8px}to{opacity:1;translate:0 0}}
@media(max-width:900px){.future-panel{gap:30px}.future-demo{padding:28px}.future-story h4{font-size:28px}}
@media(max-width:600px){.future-demo{padding:22px 16px}.future-panel{grid-template-columns:1fr;gap:25px;min-height:0}.future-story{text-align:center}.future-story h4{font-size:27px}.future-story p{font-size:12px}.future-tabs{gap:5px}.future-tabs button{padding:11px 13px;font-size:11px}.concept-cloud{padding:14px}.concept-metrics>span{padding:10px 7px}.concept-metrics b{font-size:12px}.mode-buttons button{padding:10px;font-size:10px}.climate-room{height:220px}.climate-buttons button{font-size:10px}.gauge .demo-actions button{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.mode-scene[data-mode=holiday] .house-window{background:#8fb6c9}.mode-scene[data-mode=holiday] .heat-flow{opacity:.2}.future-panel *{animation:none!important;transition:none!important}}
