.ss-demo-app,.ss-demo-modal{--demo-bg:#080a0f;--demo-surface:#ffffff09;--demo-surface-strong:#fff1;--demo-line:#ffffff21;--demo-text:#f5f7f6;--demo-muted:#858b91;--demo-faint:#929a97;--demo-accent:#55d69a;--demo-accent-bright:#79f2b8;--demo-cyan:#39d7ed;--demo-amber:#f4c44e;--demo-danger:#ff7d88;color:var(--demo-text);font-family:var(--font-body)}.ss-demo-app *,.ss-demo-app :before,.ss-demo-app :after,.ss-demo-modal *,.ss-demo-modal :before,.ss-demo-modal :after{box-sizing:border-box}.ss-demo-app button,.ss-demo-modal button,.ss-demo-modal input{font:inherit}.ss-demo-app button,.ss-demo-modal button{-webkit-tap-highlight-color:transparent}.ss-demo-app{isolation:isolate;background:radial-gradient(circle at 85% 0%, #55d69a14, transparent 28%), linear-gradient(180deg, #0a0c12 0%, var(--demo-bg) 48%, #07090e 100%);border:1px solid #ffffff1a;border-radius:clamp(1.25rem,3vw,2rem);width:min(100%,48rem);margin-inline:auto;padding:clamp(.75rem,2.4vw,1.25rem);position:relative;overflow:hidden;box-shadow:0 38px 90px -48px #000000f2,inset 0 1px #ffffff0f;container:smartspaces-demo/inline-size}.ss-demo-app:before{content:"";z-index:-1;pointer-events:none;opacity:.2;background-image:radial-gradient(#ffffff0b .6px,#0000 .6px);background-size:9px 9px;position:absolute;inset:0;mask-image:linear-gradient(#000,#0000 45%)}.demo-glass{background:var(--glass-fill,linear-gradient(180deg, #ffffff12, #ffffff06));box-shadow:var(--glass-shadow,inset 0 1px 0 #ffffff1c, 0 14px 28px -22px #000000f2);border:0;position:relative}.demo-glass:before,.demo-glass:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0}.demo-glass:before{padding:var(--glass-edge,1px);background:linear-gradient(155deg, var(--edge-top,#ffffff73), #ffffff0b 48%, var(--edge-bottom,#ffffff29));-webkit-mask-composite:xor;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.demo-glass:after{background:radial-gradient(120% 85% at 24% -20%,#ffffff1a,#0000 58%)}.demo-nav{--glass-fill:#ffffff06;--glass-shadow:inset 0 1px 0 #ffffff12, 0 6px 14px -10px #000000e6;border-radius:999px}.demo-card{--glass-fill:linear-gradient(180deg, #ffffff12, #ffffff05);--glass-shadow:inset 0 1px 0 #ffffff1f, inset 0 -10px 24px -20px #000000bf, 0 20px 36px -28px #000000f2;border-radius:1.35rem}.demo-tile{--glass-fill:linear-gradient(180deg, #fff1, #ffffff05);--glass-shadow:inset 0 1px 0 #ffffff1a, 0 8px 18px -14px #000000f2;border-radius:1rem}.demo-lens{--glass-edge:2px;--edge-top:#ffffffd1;--edge-bottom:#ffffff59;--glass-fill:radial-gradient(circle at 50% 48%, #000000ad, #04080a4d 58%, #ffffff14);--glass-shadow:inset 0 1.5px 1px #ffffff57, inset 0 -4px 9px #0000007a, 0 4px 14px #0000008c;backdrop-filter:blur(12px)saturate(150%)brightness(.86);border-radius:999px}.demo-plaque{--glass-edge:2px;--edge-top:#ffffffa6;--edge-bottom:#ffffff4d;border-radius:clamp(1.1rem,4vw,1.85rem);box-shadow:0 30px 65px -34px #000000fa,inset 0 0 0 1px #ffffff0d}.demo-panel{--glass-fill:#0a0d12d6;--glass-shadow:inset 0 1px 0 #ffffff1a, inset 0 -18px 34px -26px #000c, 0 36px 84px -28px #000000f2;backdrop-filter:blur(38px)saturate(160%);border-radius:1.75rem}.ss-demo-app-header{justify-content:space-between;align-items:center;gap:.75rem;min-width:0;margin-bottom:.9rem;display:flex}.ss-demo-app-header>div:first-child{min-width:0}.ss-demo-app-kicker{color:var(--demo-muted);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.15rem;font-size:.66rem;font-weight:650;line-height:1.2;display:block}.ss-demo-app-header>div:first-child>strong{overflow-wrap:anywhere;letter-spacing:-.025em;font-size:clamp(1rem,4vw,1.2rem);display:block}.ss-demo-app-actions{justify-content:flex-end;align-items:center;gap:.55rem;min-width:0;display:flex}.ss-demo-live{min-width:0;color:var(--demo-muted);white-space:nowrap;align-items:center;gap:.38rem;font-size:.68rem;display:inline-flex}.ss-demo-live i{background:var(--demo-accent-bright);border-radius:50%;flex:none;width:.42rem;height:.42rem;box-shadow:0 0 10px #55d69ad9}.ss-demo-reset,.ss-demo-icon-button{color:#c8cdcb;cursor:pointer;border:0;justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.ss-demo-reset{background:#ffffff09;border-radius:999px;gap:.38rem;padding:.45rem .7rem;font-size:.72rem;box-shadow:inset 0 0 0 1px #ffffff1a}.ss-demo-reset:active,.ss-demo-icon-button:active{transform:scale(.94)}.ss-demo-nav-wrap{margin-bottom:1rem}.ss-demo-tabs{overscroll-behavior-x:contain;scrollbar-width:none;gap:.38rem;max-width:100%;display:flex;position:relative;overflow-x:auto}.ss-demo-tabs::-webkit-scrollbar{display:none}.ss-demo-tabs button{z-index:2;color:#a7abb0;cursor:pointer;border:0;border-radius:999px;flex:none;min-width:max-content;min-height:44px;padding:.58rem .95rem;font-size:.86rem;line-height:1;position:relative}.ss-demo-tabs button.is-active{color:#102019;background:0 0;font-weight:750}.ss-demo-tab-capsule{z-index:1;background:linear-gradient(#f6fff9,#bcf1d2);border-radius:999px;transition:width .38s cubic-bezier(.3,1.35,.4,1),transform .38s cubic-bezier(.3,1.35,.4,1);position:absolute;top:0;left:0;box-shadow:0 8px 20px -10px #000000e6,inset 0 1px #fffffff2,inset 0 -2px 4px #0049272e}.ss-demo-progress{justify-content:center;align-items:center;gap:.28rem;min-height:.9rem;padding-top:.48rem;display:flex}.ss-demo-progress i{background:#ffffff24;border-radius:99px;width:.23rem;height:.23rem;transition:width .22s,background-color .22s}.ss-demo-progress i.is-active{background:var(--demo-accent);width:1.15rem}.ss-demo-stage{touch-action:pan-y}.ss-demo-screen{flex-direction:column;gap:1.15rem;display:flex}.ss-demo-overview-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr));gap:.65rem;display:grid}.ss-demo-overview-card{min-width:0;min-height:6.25rem;color:var(--demo-text);text-align:left;flex-direction:column;justify-content:center;align-items:flex-start;padding:.88rem;display:flex;overflow:hidden}button.ss-demo-overview-card{cursor:pointer;border:0;width:100%}.ss-demo-overview-card>:not(.ss-demo-cubes){z-index:2;position:relative}.ss-demo-overline{overflow-wrap:anywhere;width:100%;min-width:0;color:var(--demo-muted);letter-spacing:.07em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:.35rem;font-size:.62rem;font-weight:650;line-height:1.25;display:flex}.ss-demo-overview-card>strong{overflow-wrap:anywhere;align-items:center;gap:.35rem;max-width:100%;margin-top:.28rem;font-size:clamp(1.22rem,6.3vw,1.65rem);line-height:1.05;display:flex}.ss-demo-overview-card>strong.is-accent{color:var(--demo-cyan)}.ss-demo-overview-card>strong em{color:var(--demo-muted);font-size:.72em;font-style:normal;font-weight:450}.ss-demo-overview-card>small{overflow-wrap:anywhere;color:var(--demo-faint);margin-top:.35rem;font-size:.7rem;line-height:1.3}.ss-demo-overview-card.is-weather{--edge-top:#55d69a80;box-shadow:inset 0 1px #ffffff1a,0 0 28px -16px #55d69a80}.ss-demo-overview-card.is-scenes strong{overflow-wrap:normal;word-break:normal;max-width:calc(100% - 1rem)}.ss-demo-cubes{z-index:1;pointer-events:none;opacity:.8;width:5.2rem;height:3.1rem;position:absolute;bottom:-.2rem;right:-.5rem;mask-image:linear-gradient(75deg,#0000,#000 42%)}.ss-demo-cubes>span{--scene-tone:hsl(calc(var(--cube-index) * 31deg + 145deg) 70% 62%);left:calc(var(--cube-column) * .78rem + var(--cube-row) * .36rem);top:calc(var(--cube-column) * .23rem + var(--cube-row) * .9rem);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:conic-gradient(from -60deg, color-mix(in srgb, var(--scene-tone) 85%, white) 0 33%, color-mix(in srgb, var(--scene-tone) 42%, transparent) 0 66%, color-mix(in srgb, var(--scene-tone) 18%, transparent) 0);width:1.15rem;height:1.32rem;animation:3s ease-in-out infinite ss-demo-cube-wave;animation-delay:calc(var(--cube-index) * 90ms);position:absolute}@keyframes ss-demo-cube-wave{0%,46%,to{opacity:.18;transform:translateY(0)}16%{opacity:1;transform:translateY(-.4rem)}}.ss-demo-shutters{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr));gap:.65rem;display:grid}.ss-demo-shutter-card{min-width:0;min-height:44px;color:var(--demo-text);cursor:pointer;text-align:left;border:0;padding:.78rem;display:block}.ss-demo-shutter-card>strong,.ss-demo-shutter-card>small{overflow-wrap:anywhere;min-width:0;display:block}.ss-demo-shutter-card>strong{margin-top:.55rem;font-size:.88rem}.ss-demo-shutter-card>small{color:var(--demo-faint);margin-top:.16rem;font-size:.7rem}.ss-demo-shutter-visual,.ss-demo-cover-preview{border-radius:.65rem;height:3.6rem;margin-top:.55rem;display:block;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1a,inset 0 2px 5px #0000008c}.ss-demo-cover-sky{background:linear-gradient(#5da2ba,#b7d9cd 62%,#dbe7d8);position:absolute;inset:0}.ss-demo-cover-blind{transform:translateY(calc(var(--cover-position) * -1%));background:linear-gradient(#ffffff1f,#0000 40%,#00000040),repeating-linear-gradient(#4c5260 0 3px,#353a45 3px 6px,#20242b 6px 7px);transition:transform .52s cubic-bezier(.22,1,.36,1);position:absolute;inset:0;box-shadow:0 3px 8px #0000008c}.ss-demo-section{flex-direction:column;gap:.55rem;min-width:0;display:flex}.ss-demo-section>h3{color:var(--demo-muted);letter-spacing:.15em;text-transform:uppercase;align-items:center;gap:.45rem;margin:0;padding-inline:.28rem;font-size:.66rem;font-weight:700;line-height:1.25;display:flex}.ss-demo-status-strip{flex-wrap:wrap;gap:.45rem;padding:.68rem;display:flex}.ss-demo-status-strip>span{overflow-wrap:anywhere;color:#c8f4dc;background:#55d69a18;border-radius:999px;align-items:center;gap:.35rem;min-height:2rem;padding:.35rem .7rem;font-size:.68rem;display:inline-flex;box-shadow:inset 0 0 0 1px #55d69a59}.ss-demo-consumption-list,.ss-demo-device-list,.ss-demo-device-consumption{overflow:hidden}.ss-demo-consumption-list>button{width:100%;min-height:48px;color:var(--demo-text);cursor:pointer;text-align:left;background:0 0;border:0;grid-template-columns:minmax(0,.8fr) minmax(2.2rem,1.7fr) auto auto;align-items:center;gap:clamp(.35rem,2vw,.8rem);padding:.65rem .8rem;display:grid}.ss-demo-consumption-list>button+button,.ss-demo-device-list>button+button,.ss-demo-device-consumption>div+div,.ss-demo-consumption-detail>button+button{border-top:1px solid #ffffff12}.ss-demo-consumption-list>button>span:first-child{overflow-wrap:anywhere;min-width:0;font-size:.8rem}.ss-demo-meter{background:#00000075;border-radius:99px;min-width:0;height:.34rem;display:block;overflow:hidden;box-shadow:inset 0 1px 2px #000000bf,0 1px #ffffff0a}.ss-demo-meter i{border-radius:inherit;background:linear-gradient(90deg, #289db1, var(--demo-cyan));height:100%;transition:width .42s cubic-bezier(.22,1,.36,1);display:block;box-shadow:0 0 8px #39d7ed8c}.ss-demo-consumption-list strong{color:#e9ebeb;font-variant-numeric:tabular-nums;text-align:right;min-width:3.8rem;font-size:.78rem}.ss-demo-consumption-list strong small,.ss-demo-device-consumption strong small{color:var(--demo-muted);font-size:.78em;font-weight:450}.ss-demo-consumption-list em{min-width:1rem;color:var(--demo-faint);text-align:right;font-size:.68rem;font-style:normal}.ss-demo-room-plan{aspect-ratio:3/2;background:#15181a;position:relative;overflow:hidden}.ss-demo-room-plan>img{object-fit:cover;user-select:none;width:100%;height:100%;display:block}.ss-demo-room-temperature{color:#f7fffa;font-variant-numeric:tabular-nums;place-items:center;min-width:3.1rem;min-height:2.6rem;padding:.35rem .65rem;font-size:.95rem;font-weight:720;display:grid;position:absolute;top:.65rem;left:.65rem}.ss-demo-device-lens{color:#f2f5f4;cursor:pointer;border:0;place-items:center;width:clamp(48px,8.5%,62px);min-width:48px;height:clamp(48px,8.5%,62px);min-height:48px;padding:0;transition:transform .22s cubic-bezier(.22,1.28,.35,1),box-shadow .26s,background-color .26s;display:grid;position:absolute;transform:translate(-50%,-50%)}.ss-demo-device-lens small{background:var(--demo-accent);color:#062415;border-radius:999px;min-width:1.1rem;padding:.12rem .25rem;font-size:.55rem;font-weight:800;line-height:1.1;position:absolute;bottom:-.18rem;right:-.18rem;box-shadow:0 3px 8px #00000073}.ss-demo-device-lens-name{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.ss-demo-device-lens.is-active{--edge-top:#b5ffdae0;--edge-bottom:#55d69a94;--glass-fill:radial-gradient(circle, #55d69a70, #05221747 62%, #ffffff14);color:#e8fff2;box-shadow:inset 0 1.5px 1px #ffffff57,inset 0 -4px 9px #00000073,0 0 0 3px #55d69a30,0 0 24px #55d69a6b}.ss-demo-device-lens.is-pending{animation:.9s ease-in-out infinite ss-demo-pending}@keyframes ss-demo-pending{50%{opacity:.6;box-shadow:0 0 0 7px #39d7ed00,0 0 28px #39d7ed80}}.ss-demo-device-lens:active{transform:translate(-50%,-50%)scale(.9)}.ss-demo-room-hint{color:var(--demo-faint);margin:-.75rem 0 0;padding-inline:.28rem;font-size:.68rem}.ss-demo-device-list>button{color:#d9dcdb;cursor:pointer;text-align:left;background:0 0;border:0;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:.65rem;width:100%;min-height:52px;padding:.68rem .8rem;display:grid}.ss-demo-device-list>button>span:nth-of-type(2){overflow-wrap:anywhere;min-width:0;font-size:.8rem}.ss-demo-device-list em{color:#b8bcba;text-align:right;white-space:nowrap;background:#ffffff0a;border-radius:.65rem;min-width:fit-content;max-width:min(45%,12rem);padding:.32rem .55rem;font-size:.68rem;font-style:normal;box-shadow:inset 0 0 0 1px #ffffff1a}.ss-demo-state-dot{background:#34383d;border-radius:50%;width:.48rem;height:.48rem}.ss-demo-state-dot.is-active{background:var(--demo-cyan);box-shadow:0 0 9px #39d7ede6}.ss-demo-measures{grid-template-columns:repeat(auto-fit,minmax(min(100%,8.8rem),1fr));gap:.6rem;display:grid}.ss-demo-measures article{min-width:0;padding:.72rem}.ss-demo-measures small,.ss-demo-measures span,.ss-demo-measures strong{display:block}.ss-demo-measures small{color:var(--demo-muted);font-size:.64rem}.ss-demo-measures strong{overflow-wrap:anywhere;color:#f0f2f1;font-variant-numeric:tabular-nums;margin-top:.28rem;font-size:clamp(1.05rem,4vw,1.28rem)}.ss-demo-measures strong em{color:var(--demo-muted);font-size:.62em;font-style:normal;font-weight:450}.ss-demo-measures span{color:var(--demo-faint);margin-top:.24rem;font-size:.61rem}.ss-demo-device-consumption>div{justify-content:space-between;align-items:center;gap:.75rem;min-height:44px;padding:.62rem .8rem;display:flex}.ss-demo-device-consumption span{overflow-wrap:anywhere;color:#aeb2b5;min-width:0;font-size:.78rem}.ss-demo-device-consumption strong{color:#e7e9e8;font-variant-numeric:tabular-nums;flex:none;font-size:.76rem}.ss-demo-simulation-note{color:var(--demo-faint);text-align:center;justify-content:center;align-items:flex-start;gap:.38rem;margin:1rem 0 0;padding-inline:.5rem;font-size:.66rem;line-height:1.45;display:flex}.ss-demo-simulation-note svg{color:var(--demo-accent);flex:none;margin-top:.12rem}.ss-demo-modal-backdrop{z-index:1000;padding:max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));backdrop-filter:blur(9px);background:#000000b8;grid-template-columns:minmax(0,1fr);place-items:center;animation:.17s ease-out ss-demo-backdrop-in;display:grid;position:fixed;inset:0}.ss-demo-modal{flex-direction:column;width:min(100%,28rem);min-width:0;max-height:min(86dvh,46rem);animation:.34s cubic-bezier(.2,1.1,.3,1) ss-demo-panel-in;display:flex;overflow:hidden}@keyframes ss-demo-backdrop-in{0%{opacity:0}}@keyframes ss-demo-panel-in{0%{opacity:0;transform:translateY(1rem)scale(.94)}}.ss-demo-modal-header{flex:none;justify-content:space-between;align-items:flex-start;gap:.75rem;padding:1.1rem 1.1rem .9rem;display:flex}.ss-demo-modal-header>div{min-width:0}.ss-demo-modal-header h2,.ss-demo-modal-header p{overflow-wrap:anywhere;margin:0}.ss-demo-modal-header h2{letter-spacing:-.02em;font-size:1.08rem}.ss-demo-modal-header p{color:var(--demo-muted);margin-top:.24rem;font-size:.72rem;line-height:1.4}.ss-demo-icon-button{border-radius:50%;flex:0 0 44px}.ss-demo-modal-body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:auto;min-height:0;padding:0 1.1rem 1.1rem;overflow-y:auto}.ss-demo-controls{flex-direction:column;gap:1rem;display:flex}.ss-demo-control-lead{flex-wrap:wrap;align-items:center;gap:.75rem;min-width:0;display:flex}.ss-demo-light-orb{background:#282d31;border-radius:50%;flex:0 0 2.75rem;width:2.75rem;height:2.75rem;transition:background-color .24s,box-shadow .24s;box-shadow:inset 0 2px 3px #ffffff1f,inset 0 -3px 5px #00000061}.ss-demo-light-orb.is-on{background:#ffd98a;box-shadow:inset 0 2px 3px #ffffff8c,0 0 22px #ffc64e8c}.ss-demo-primary-control,.ss-demo-danger{background:linear-gradient(180deg, var(--demo-accent-bright), var(--demo-accent));color:#062415;cursor:pointer;border:0;border-radius:.9rem;min-height:48px;padding:.7rem 1rem;font-size:.82rem;font-weight:750;box-shadow:inset 0 1px #fff6,0 10px 24px -16px #55d69acc}.ss-demo-primary-control{overflow-wrap:anywhere;flex:10rem;min-width:min(100%,10rem)}.ss-demo-primary-control:not(.is-on){color:#e4e7e5;background:linear-gradient(#ffffff14,#ffffff08);box-shadow:inset 0 0 0 1px #ffffff1f}.ss-demo-primary-control:disabled,.ss-demo-modal button:disabled{cursor:wait;opacity:.56}.ss-demo-range{min-width:0;display:block}.ss-demo-range-copy{color:#a9aeae;justify-content:space-between;align-items:baseline;gap:.8rem;min-width:0;margin-bottom:.34rem;font-size:.7rem;display:flex}.ss-demo-range-copy>span{overflow-wrap:anywhere;min-width:0}.ss-demo-range-copy output{color:#e5e8e7;font-variant-numeric:tabular-nums;flex:none}.ss-demo-range input[type=range]{appearance:none;cursor:pointer;touch-action:pan-y;background:0 0;width:100%;min-width:0;height:44px;margin:0}.ss-demo-range input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--demo-accent) 0 var(--range-progress), #00000075 var(--range-progress));border-radius:999px;height:.78rem;box-shadow:inset 0 1.5px 3px #000000c7,0 1px #ffffff0d}.ss-demo-range input[type=range]::-moz-range-track{background:linear-gradient(90deg, var(--demo-accent) 0 var(--range-progress), #00000075 var(--range-progress));border-radius:999px;height:.78rem;box-shadow:inset 0 1.5px 3px #000000c7,0 1px #ffffff0d}.ss-demo-range input[type=range]::-webkit-slider-thumb{appearance:none;background:linear-gradient(#fff,#d8dedb);border:0;border-radius:50%;width:1.5rem;height:1.5rem;margin-top:-.36rem;box-shadow:0 3px 9px #000000a6,inset 0 -2px 3px #00000026}.ss-demo-range input[type=range]::-moz-range-thumb{background:linear-gradient(#fff,#d8dedb);border:0;border-radius:50%;width:1.5rem;height:1.5rem;box-shadow:0 3px 9px #000000a6,inset 0 -2px 3px #00000026}.ss-demo-presets,.ss-demo-cover-actions,.ss-demo-mode-grid,.ss-demo-confirm-actions{grid-template-columns:repeat(auto-fit,minmax(min(100%,5.5rem),1fr));gap:.55rem;display:grid}.ss-demo-presets button,.ss-demo-cover-actions button,.ss-demo-mode-grid button,.ss-demo-confirm-actions button{color:#cdd1cf;cursor:pointer;overflow-wrap:anywhere;border:0;min-width:0;min-height:44px;padding:.6rem;font-size:.74rem}.ss-demo-mode-grid button.is-selected{--edge-top:#aeffd7a6;--glass-fill:#55d69a26;color:#d6f9e6}.ss-demo-cover-preview{height:7rem;margin:0}.ss-demo-thermostat-readout{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;padding:.8rem;display:grid}.ss-demo-thermostat-readout>span{color:#eef1ef;font-variant-numeric:tabular-nums;min-width:0;font-size:1.2rem;font-weight:720}.ss-demo-thermostat-readout small{color:var(--demo-muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.2rem;font-size:.58rem;font-weight:650;display:block}.ss-demo-scenes-panel{flex-direction:column;gap:.65rem;padding-top:2.3rem;display:flex;position:relative}.ss-demo-scenes-panel>.ss-demo-cubes{width:10rem;top:-.35rem;bottom:auto;right:50%;transform:translate(50%);mask-image:linear-gradient(90deg,#0000,#000 20% 80%,#0000)}.ss-demo-scene-entry{flex-direction:column;gap:.45rem;display:flex}.ss-demo-scene-entry>div{grid-template-columns:minmax(0,1fr) 48px;gap:.5rem;display:grid}.ss-demo-scene-action{color:#e7eae8;cursor:pointer;text-align:left;border:0;align-items:center;gap:.7rem;min-width:0;min-height:58px;padding:.58rem .7rem;display:flex}.ss-demo-scene-action>span:first-child{background:color-mix(in srgb, var(--scene-tone) 16%, transparent);width:2.35rem;height:2.35rem;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--scene-tone) 42%, transparent);color:color-mix(in srgb, var(--scene-tone) 80%, white);border-radius:.75rem;flex:0 0 2.35rem;place-items:center;display:grid}.ss-demo-scene-action>span:last-child{min-width:0}.ss-demo-scene-action strong,.ss-demo-scene-action small{overflow-wrap:anywhere;display:block}.ss-demo-scene-action strong{color:color-mix(in srgb, var(--scene-tone) 34%, white);font-size:.82rem}.ss-demo-scene-action small{color:#9ca1a2;margin-top:.15rem;font-size:.63rem;line-height:1.35}.ss-demo-scene-action.is-selected{--edge-top:color-mix(in srgb, var(--scene-tone) 70%, transparent);--glass-fill:color-mix(in srgb, var(--scene-tone) 12%, transparent)}.ss-demo-scene-info{color:#adb1b2;cursor:pointer;border:0;place-items:center;width:48px;min-height:48px;padding:0;display:grid}.ss-demo-scene-entry>p{color:#aeb3b1;background:#ffffff09;border-radius:.8rem;margin:0;padding:.65rem .75rem;font-size:.68rem;line-height:1.5}.ss-demo-consumption-panel{flex-direction:column;gap:1rem;display:flex}.ss-demo-consumption-ring{--ring-value:calc(var(--consumption) * 1%);background:conic-gradient(var(--demo-cyan) 0 var(--ring-value), #ffffff0e var(--ring-value));border-radius:50%;place-items:center;width:9rem;height:9rem;margin-inline:auto;display:grid;box-shadow:0 0 32px -18px #39d7edcc}.ss-demo-consumption-ring:before{content:"";background:#0b0e13;border-radius:50%;width:6.5rem;height:6.5rem;position:absolute;box-shadow:inset 0 1px #ffffff12}.ss-demo-consumption-ring>span{z-index:1;text-align:center;position:relative}.ss-demo-consumption-ring strong,.ss-demo-consumption-ring small{display:block}.ss-demo-consumption-ring strong{color:var(--demo-cyan);font-variant-numeric:tabular-nums;font-size:1.75rem}.ss-demo-consumption-ring small{color:var(--demo-muted);font-size:.65rem}.ss-demo-consumption-detail{overflow:hidden}.ss-demo-consumption-detail>button{color:#cfd3d1;cursor:pointer;background:0 0;border:0;justify-content:space-between;align-items:center;gap:.75rem;width:100%;min-height:46px;padding:.65rem .8rem;font-size:.78rem;display:flex}.ss-demo-consumption-detail strong{font-variant-numeric:tabular-nums;flex:none}.ss-demo-confirm-actions .ss-demo-danger{background:linear-gradient(180deg, #ff9da5, var(--demo-danger));color:#3b090f;box-shadow:inset 0 1px #ffffff59,0 10px 24px -16px #ff7d88cc}.ss-demo-app button:focus-visible,.ss-demo-modal button:focus-visible,.ss-demo-modal input:focus-visible{outline:3px solid var(--demo-accent-bright);outline-offset:3px}.ss-demo-app button:not(:disabled):active,.ss-demo-modal button:not(:disabled):active{transform:scale(.97)}.ss-demo-app button.ss-demo-device-lens:not(:disabled):active{transform:translate(-50%,-50%)scale(.9)}@media (hover:hover) and (pointer:fine){.ss-demo-app button:not(:disabled):hover,.ss-demo-modal button:not(:disabled):hover{filter:brightness(1.08)}}@container smartspaces-demo (width<=31rem){.ss-demo-app-actions{gap:.3rem}.ss-demo-reset span{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.ss-demo-reset{width:44px;padding:0}}@container smartspaces-demo (width<=22rem){.ss-demo-tabs{grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:visible}.ss-demo-tabs button{overflow-wrap:anywhere;min-width:0;padding-inline:.3rem;line-height:1.2}}@container smartspaces-demo (width<=18rem){.ss-demo-live{white-space:normal;max-width:6.4rem}.ss-demo-overview-grid,.ss-demo-shutters,.ss-demo-measures{grid-template-columns:minmax(0,1fr)}.ss-demo-consumption-list>button{grid-template-columns:minmax(0,1fr) auto}.ss-demo-consumption-list .ss-demo-meter{grid-area:2/1/auto/-1}.ss-demo-consumption-list em{display:none}.ss-demo-device-list>button{grid-template-columns:auto auto minmax(0,1fr)}.ss-demo-device-list em{overflow-wrap:anywhere;text-align:left;white-space:normal;grid-column:2/-1;justify-self:start;min-width:0;max-width:100%}.ss-demo-overview-card.is-scenes strong{white-space:normal}.ss-demo-room .ss-demo-room-plan{aspect-ratio:auto;grid-template-columns:minmax(0,1fr);gap:.5rem;padding:.5rem;display:grid}.ss-demo-room-plan>img{aspect-ratio:4/3;border-radius:.95rem;height:auto}.ss-demo-room-temperature{top:1rem;left:1rem}.ss-demo-device-lens{text-align:left;border-radius:.9rem;grid-template-columns:auto minmax(0,1fr) auto;gap:.55rem;width:100%;height:auto;min-height:52px;padding:.55rem .7rem;display:grid;position:static;transform:none}.ss-demo-device-lens-name{clip:auto;width:auto;min-width:0;height:auto;color:var(--demo-text);white-space:normal;font-size:.72rem;line-height:1.25;position:static;overflow:visible}.ss-demo-device-lens small{justify-self:end;position:static}.ss-demo-app button.ss-demo-device-lens:not(:disabled):active{transform:scale(.97)}}@media (width<=520px){.ss-demo-modal-backdrop{padding-inline:max(.5rem, env(safe-area-inset-left));padding-bottom:max(.5rem, env(safe-area-inset-bottom));place-items:end center}.ss-demo-modal{border-radius:1.5rem;width:100%;max-height:min(88dvh,46rem);animation-name:ss-demo-sheet-in}@keyframes ss-demo-sheet-in{0%{opacity:0;transform:translateY(2rem)}}.ss-demo-room-plan{aspect-ratio:4/3}.ss-demo-room-plan>img{object-position:center}}@media (orientation:landscape) and (height<=560px){.ss-demo-modal-backdrop{padding-block:.4rem}.ss-demo-modal{max-height:94dvh}.ss-demo-modal-header{padding-top:.75rem;padding-bottom:.55rem}}@media (prefers-reduced-motion:reduce){.ss-demo-app *,.ss-demo-app :before,.ss-demo-app :after,.ss-demo-modal *,.ss-demo-modal :before,.ss-demo-modal :after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.ss-demo-page[data-astro-cid-5ppevbp6]{padding-block:clamp(3.5rem,8vw,7.5rem) clamp(4rem,8vw,7rem)}.ss-demo-intro[data-astro-cid-5ppevbp6]{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);align-items:end;gap:clamp(1rem,4vw,3rem);width:min(100%,58rem);margin:0 auto clamp(1.5rem,4vw,2.75rem);display:grid}.ss-demo-intro[data-astro-cid-5ppevbp6]>div[data-astro-cid-5ppevbp6]:last-child{min-width:0}.ss-demo-intro[data-astro-cid-5ppevbp6] h1[data-astro-cid-5ppevbp6]{overflow-wrap:anywhere;max-width:13ch;color:var(--ink);letter-spacing:-.045em;margin:0;font-size:clamp(2.25rem,6vw,4.8rem);font-weight:500;line-height:.98}.ss-demo-intro[data-astro-cid-5ppevbp6] p[data-astro-cid-5ppevbp6]{max-width:38rem;color:var(--ink-soft);margin:.85rem 0 0;font-size:clamp(.95rem,1.5vw,1.08rem);line-height:1.65}.ss-demo-next[data-astro-cid-5ppevbp6]{border-top:1px solid color-mix(in srgb, var(--accent) 24%, transparent);justify-content:space-between;align-items:center;gap:1rem;width:min(100%,48rem);min-width:0;margin:clamp(1.5rem,4vw,2.5rem) auto 0;padding-top:1.25rem;display:flex}.ss-demo-next[data-astro-cid-5ppevbp6] p[data-astro-cid-5ppevbp6]{max-width:34rem;color:var(--ink-soft);margin:0;font-size:.88rem;line-height:1.55}.ss-demo-next[data-astro-cid-5ppevbp6] strong[data-astro-cid-5ppevbp6]{color:var(--ink)}.ss-demo-next[data-astro-cid-5ppevbp6] .btn[data-astro-cid-5ppevbp6]{flex:none}@media (width<=720px){.ss-demo-page[data-astro-cid-5ppevbp6]{padding-top:3.25rem}.ss-demo-intro[data-astro-cid-5ppevbp6]{grid-template-columns:minmax(0,1fr);align-items:start}.ss-demo-intro[data-astro-cid-5ppevbp6] h1[data-astro-cid-5ppevbp6]{font-size:clamp(2.1rem,12vw,3.6rem)}.ss-demo-next[data-astro-cid-5ppevbp6]{flex-direction:column;align-items:flex-start}}@media (orientation:landscape) and (height<=560px){.ss-demo-page[data-astro-cid-5ppevbp6]{padding-top:3rem}}