/* Compact fixed-ratio showroom, decoded WebP photographs and finite client-side motion. */
.cases{padding-top:30px;padding-bottom:35px;scroll-margin-top:0}
.case-heading{margin-bottom:25px;gap:36px}.case-heading h2{font-size:clamp(30px,3vw,46px);line-height:1.2;letter-spacing:-.045em}.case-heading .eyebrow{margin-bottom:12px}
.scene-lab{padding-bottom:0}.scene-lab-top{margin-bottom:12px;font-size:12px}.scene-tabs button{padding:11px;font-size:15px}
.scene-workspace{grid-template-columns:190px minmax(0,1fr)}
.scene-controls{padding:20px}.scene-number{margin-bottom:9px;font-size:10px}.scene-controls h3{font-size:27px;margin-bottom:12px}.scene-controls>p:not(.scene-number){font-size:13px;line-height:1.7}.scene-time{margin:18px 0}.scene-time legend{font-size:12px;margin-bottom:8px}.scene-time label{font-size:13px;margin-right:6px}.scene-run{padding:11px 8px;font-size:14px}.scene-run-status{min-height:40px}
.scene-diagram{min-width:0;padding:14px;display:grid;grid-template-columns:minmax(0,1fr) 130px;gap:12px;align-items:start}
.scene-view{width:100%;max-width:min(450px,60svh);margin:0;justify-self:center;min-width:0;border:1px solid #344764;background:#10182b}
.scene-photo-frame{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;isolation:isolate;background:#171921}
.scene-photo-frame>img{width:100%;height:100%;object-fit:contain;display:block}.scene-photo-frame>img[hidden]{display:none}
.scene-photo-frame>.scene-device-photo{position:absolute;inset:0;pointer-events:none}
.scene-media-photo{clip-path:inset(31.8% 21.3% 48.8% 54.6%)}.scene-audio-photo{clip-path:inset(52% 25.2% 46.3% 58.3%)}
/* Full-height photo panels hang from the recessed ceiling box; foreground sofa occludes the hem. */
.scene-curtain-window{position:absolute;left:5.069444%;top:18.333333%;width:41.736111%;height:44.479167%;overflow:hidden;pointer-events:none;clip-path:polygon(0.0000% 0.0000%,100.0000% 0.0000%,100.0000% 100.0000%,45.5907% 100.0000%,45.0915% 96.9555%,44.4260% 94.1452%,43.4276% 92.2717%,42.0965% 91.1007%,40.2662% 90.6323%,37.9368% 90.6323%,35.2745% 91.1007%,32.4459% 92.0375%,29.4509% 93.2084%,25.9567% 94.6136%,22.7953% 96.0187%,19.4676% 97.4239%,16.1398% 98.8290%,13.1448% 100.0000%,0.0000% 100.0000%)}
.scene-curtain-panel{position:absolute;top:0;width:50%;height:100%;overflow:hidden;will-change:transform;backface-visibility:hidden}
.curtain-left{left:0;transform:translateX(-100%)}.curtain-right{left:50%;transform:translateX(100%)}
/* Sample only curtain fabric (source y176..552), never the baked-in sofa below it.
   Foreground occlusion belongs to the stationary window, not the translating panels. */
.scene-curtain-panel img{position:absolute;top:-46.808511%;width:479.201331%;height:255.319149%;max-width:none;object-fit:fill}
.curtain-left img{left:-24.292845%}.curtain-right img{left:-124.292845%}
.scene-transition-snapshot{position:absolute;inset:0;pointer-events:none;z-index:1}.scene-transition-snapshot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.scene-photo-shade,.scene-view-top,.scene-live-tags,.scene-photo-frame figcaption{z-index:2}
.scene-photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,#02091720,transparent 18%,transparent 80%,#040a1780);pointer-events:none}
.scene-photo-frame[aria-busy=true]:not([data-motion=running]):after,.scene-photo-frame[data-failed=true]:after{content:'正在准备画面';position:absolute;left:50%;top:75%;transform:translateX(-50%);background:#091221e8;color:#e4ebf8;padding:7px 10px;font-size:12px;z-index:3}.scene-photo-frame[data-failed=true]:after{content:'画面未同步，请重置重试'}
.scene-view-top{position:absolute;left:10px;right:10px;top:9px;display:flex;justify-content:space-between;gap:10px;color:#f0f5ff;font-size:11px}.scene-view-top>span{padding:4px 7px;background:#091221aa}.scene-view-top #visualPhase{color:#ffd0a0}
.scene-live-tags{position:absolute;inset:0;pointer-events:none}
.scene-pin{position:absolute;left:var(--pin-x);top:var(--pin-y);display:flex;align-items:center;gap:4px;border:0;background:transparent;color:#eff7ff;pointer-events:auto;padding:6px;cursor:pointer;font:inherit;text-align:left;transform:translate(-50%,-50%);min-height:36px;min-width:36px}
.pin-number{border:1px solid #e0d6c5;background:#101a29d9;width:24px;height:24px;display:grid;place-items:center;font-size:11px;flex-shrink:0;border-radius:50%}
.pin-label{display:none;position:absolute;left:34px;top:4px;font-size:11px;line-height:1.4;background:#081220ee;padding:4px 6px;white-space:nowrap;border-left:1px solid #cfb18c}.pin-label small{display:block;font-size:10px;color:#c5d2e2}
.scene-pin:focus-visible{outline:2px solid #88d7ff;outline-offset:1px}.scene-pin:focus-visible .pin-label,.scene-pin.selected .pin-label{display:block}.scene-pin.selected{z-index:4}.scene-pin.selected .pin-number,.scene-pin.changed .pin-number{border-color:#ffd0a0;color:#ffd0a0}
@media(hover:hover){.scene-pin:hover{z-index:4}.scene-pin:hover .pin-label{display:block}}
.pin-lighting{--pin-x:48%;--pin-y:10%}.pin-shading{--pin-x:27%;--pin-y:38%}.pin-climate{--pin-x:68%;--pin-y:14%}.pin-media{--pin-x:67%;--pin-y:43%}.pin-security{--pin-x:88%;--pin-y:45%}.pin-network{--pin-x:81%;--pin-y:56%}.pin-network .pin-label,.pin-security .pin-label{left:auto;right:34px}
.scene-photo-frame figcaption{position:absolute;left:12px;right:12px;bottom:10px;display:grid;gap:3px;pointer-events:none}.scene-photo-frame figcaption strong{font-size:15px;font-weight:500;line-height:1.4;color:#f4f7fc}.scene-photo-frame figcaption>span{font-size:10px;color:#c5c9d1}
.scene-view-foot{padding:9px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.scene-view-foot>span{color:#e5bd8c;font-size:11px;white-space:nowrap}.scene-view-foot p{flex:1;font-size:12px;line-height:1.5;color:#b4c2d8;margin:0;min-width:120px}.scene-view-foot button{background:transparent;border:1px solid #50617d;padding:6px;font:11px inherit;color:#d3e1f3;cursor:pointer}
.scene-flow{grid-column:1/-1;grid-row:3;display:flex;gap:12px;margin:0}.scene-flow li{flex:1;min-height:0;padding:8px 10px;gap:3px;background:transparent;border:0;border-top:1px solid #344764}.scene-flow span{font-size:10px}.scene-flow b{font-size:11px}.scene-flow li:not(:last-child):after{display:none}
.scene-devices{grid-column:2;grid-row:1;display:grid;grid-template-columns:1fr;gap:6px}.scene-device{padding:6px 9px;gap:2px;min-height:44px}.scene-device>b{font-size:14px;line-height:1.25;font-weight:500}.scene-device small{font-size:10px;line-height:1.2;color:#a7b7cd}.scene-device.selected{border-color:#d9b186;background:#1e2532}
.scene-device-detail{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0;border-top:1px solid #344764}.scene-device-detail span{font-size:10px;color:#c3a885;margin-right:9px}.scene-device-detail strong{font-size:14px;font-weight:500}.scene-device-detail p{font-size:12px;line-height:1.5;color:#a7b7cd;margin:5px 0 0;max-width:450px}.scene-device-actions{display:flex;gap:7px;flex-shrink:0}.scene-device-actions button{border:1px solid #a88a69;background:#202634;color:#f1dfc7;font:12px inherit;padding:10px;cursor:pointer}.scene-device-actions button:disabled{opacity:.5;cursor:wait}.scene-demo-note{grid-column:1/-1;font-size:10px;line-height:1.5;margin:0;color:#8494ae}
/* Small explanatory signals only; no continuous canvas or video decoder. */
.scene-airflow{position:absolute;left:54%;top:15%;width:28%;height:12%;display:flex;justify-content:space-around;opacity:0;pointer-events:none}.scene-airflow i{height:70%;width:1px;background:linear-gradient(#bce2fbcc,transparent);transform-origin:top;transform:rotate(-9deg)}.scene-photo-frame[data-climate=on] .scene-airflow{opacity:1}.scene-photo-frame[data-climate=on] .scene-airflow i{animation:scene-air 1s ease-out 3}
.scene-sound{position:absolute;left:65%;top:52.5%;display:flex;align-items:center;gap:3px;opacity:0;pointer-events:none}.scene-sound i{width:2px;height:9px;background:#ffd1a0}.scene-photo-frame[data-media=on] .scene-sound{opacity:.9}.scene-photo-frame[data-media=on] .scene-sound i{animation:scene-sound .65s ease-in-out 4}.scene-sound i:nth-child(2n){animation-delay:.15s!important;height:14px}
.scene-security-signal{position:absolute;left:97%;top:16%;width:10px;height:10px;border:1px solid #efcba1;border-radius:50%;pointer-events:none;opacity:0}.scene-photo-frame[data-security=armed] .scene-security-signal{opacity:.9}
.scene-network-signal{position:absolute;left:79.5%;top:52.5%;width:22px;height:22px;border:1px solid #b9ddf6;border-radius:50%;pointer-events:none;opacity:0}
@keyframes scene-air{from{transform:translateY(-4px) rotate(-9deg);opacity:0}50%{opacity:1}to{transform:translateY(6px) rotate(-9deg);opacity:0}}
@keyframes scene-sound{50%{transform:scaleY(.3)}}
@media(max-width:1100px) and (min-width:761px){.section-shell.scene-lab,.case-heading{padding-left:4vw;padding-right:4vw}.scene-workspace{grid-template-columns:175px minmax(0,1fr)}.scene-controls{padding:15px}.scene-diagram{grid-template-columns:minmax(0,1fr) 110px;gap:10px}.scene-device-detail{gap:12px}.scene-device-actions{flex-direction:column}.scene-device-actions button{padding:7px}}
@media(max-width:760px){
  .cases{padding:22px 0 25px}.case-heading{margin-bottom:14px}.case-heading h2{font-size:24px}.case-heading p:last-child{display:none}.case-heading .eyebrow{margin-bottom:8px}
  .scene-lab-top{flex-direction:row;gap:8px;font-size:10px;margin-bottom:8px}.scene-lab-top small{font-size:10px}.scene-tabs button{padding:9px 4px;font-size:14px}.scene-workspace{grid-template-columns:1fr}
  .scene-controls{padding:12px;display:grid;grid-template-columns:1fr auto;gap:0 10px}.scene-number{display:none}.scene-controls h3{font-size:21px;margin:0}.scene-controls>p:not(.scene-number){font-size:12px;line-height:1.5;margin:7px 0}.scene-controls #demoSceneDescription{grid-column:1/-1}.scene-time{grid-column:2;grid-row:1;margin:0;align-self:center}.scene-time legend{display:none}.scene-time label{font-size:12px;margin-right:3px}.scene-run{grid-column:2;grid-row:3;width:auto;padding:8px 10px;font-size:12px}.scene-controls .scene-run-status{grid-column:1;grid-row:3;margin:0!important;min-height:0;align-self:center;font-size:11px!important}
  .scene-diagram{display:grid;padding:10px;grid-template-columns:1fr;gap:9px}.scene-view{max-width:510px;grid-column:1;grid-row:1;order:initial}.scene-photo-frame figcaption{left:9px;bottom:7px}.scene-photo-frame figcaption strong{font-size:12px}.scene-photo-frame figcaption>span{font-size:9px}.scene-view-top{font-size:9px;top:6px;left:7px;right:7px}.scene-view-top>span{padding:3px 4px}
  .scene-pin{min-height:32px;min-width:32px;padding:5px}.pin-number{width:20px;height:20px;font-size:10px}.pin-label{left:29px;font-size:10px}.pin-label small{display:none}.pin-security .pin-label,.pin-network .pin-label{right:29px}.pin-lighting{--pin-y:16%}.pin-climate{--pin-y:22%}
  .scene-view-foot{padding:7px;gap:6px}.scene-view-foot p{font-size:10px;min-width:90px}.scene-view-foot>span{font-size:10px}.scene-view-foot button{padding:5px;font-size:10px}
  .scene-devices{grid-column:1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:0}.scene-device{min-height:40px;padding:6px 7px;gap:2px}.scene-device>b{font-size:12px}.scene-device small{font-size:9px}
  .scene-device small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.scene-controls>p:not(.scene-number){font-size:11px;line-height:1.4}
  .scene-device-detail{grid-column:1;grid-row:3;gap:9px;padding:8px 0;align-items:flex-start}.scene-device-detail strong{font-size:12px}.scene-device-detail span{display:none}.scene-device-detail p{font-size:10px;margin-top:4px}.scene-device-actions{flex-direction:column;gap:5px}.scene-device-actions button{padding:6px 8px;font-size:10px;min-height:30px}
  .scene-flow{display:none}.scene-demo-note{margin:0;font-size:9px;grid-row:4}
}
/* Size the whole desktop composition together. Never stretch an ultrawide shell around a fixed thumbnail. */
@media(min-width:761px){
  .cases .scene-lab,.cases .case-heading{width:min(1440px,calc(100vw - 64px),calc(150svh - 160px));max-width:100%;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
  .case-heading{margin-bottom:18px;gap:28px}.case-heading h2{font-size:clamp(30px,2.5vw,44px)}.case-heading p:last-child{font-size:14px;max-width:300px}.case-heading .eyebrow{font-size:12px;margin-bottom:10px}
  .scene-lab-top{font-size:12px;margin-bottom:10px}.scene-lab-top small{font-size:12px}.scene-tabs button{font-size:16px;padding:10px}
  .scene-workspace{grid-template-columns:clamp(180px,15vw,220px) minmax(0,1fr)}
  .scene-controls{padding:20px}.scene-controls h3{font-size:28px}.scene-controls>p:not(.scene-number){font-size:14px}.scene-number{font-size:12px}.scene-time label,.scene-time legend{font-size:14px}.scene-run{font-size:14px;min-height:44px}.scene-run-status{font-size:13px!important}
  .scene-diagram{padding:16px;grid-template-columns:minmax(0,1fr) clamp(168px,12vw,200px);gap:12px 16px;align-items:start}
  .scene-view{max-width:none;width:100%;grid-column:1;grid-row:1/3;align-self:start;justify-self:stretch}
  .scene-devices{grid-column:2;grid-row:1;gap:6px}.scene-device{min-height:46px;padding:6px 10px}.scene-device>b{font-size:16px}.scene-device small{font-size:12px;line-height:1.3}
  .scene-device-detail{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px;padding:12px 0 0}
  .scene-device-detail span{display:block;font-size:12px;margin:0 0 7px}.scene-device-detail strong{font-size:16px}.scene-device-detail p{font-size:13px;line-height:1.6;margin-top:7px;max-width:none}
  .scene-device-actions{flex-direction:row;flex-wrap:wrap;gap:6px}.scene-device-actions button{flex:1;min-height:40px;font-size:13px;padding:8px;white-space:nowrap}
  .scene-view-top{font-size:12px}.pin-number{width:28px;height:28px;font-size:12px}.pin-label{font-size:13px;left:38px}.pin-label small{font-size:12px}.pin-security .pin-label,.pin-network .pin-label{right:38px}
  .scene-photo-frame figcaption{left:16px;bottom:13px}.scene-photo-frame figcaption strong{font-size:18px}.scene-photo-frame figcaption>span{font-size:12px}
  .scene-view-foot{padding:10px 12px;gap:9px}.scene-view-foot>span,.scene-view-foot button{font-size:12px}.scene-view-foot p{font-size:13px}.scene-view-foot button{min-height:34px}
  .scene-flow{grid-column:1/-1;grid-row:3;gap:12px}.scene-flow span{font-size:12px}.scene-flow b{font-size:13px}.scene-flow li{padding:8px 0}
  .scene-demo-note{grid-column:1/-1;grid-row:4;font-size:12px}
}
@media(min-width:761px) and (max-width:1100px){
  .scene-workspace{grid-template-columns:170px minmax(0,1fr)}.scene-controls{padding:14px}.scene-diagram{padding:12px;gap:10px;grid-template-columns:minmax(0,1fr) 160px}.scene-device-detail{gap:9px}.scene-photo-frame figcaption strong{font-size:15px}
}
@media(min-width:761px) and (max-height:800px){
  .scene-device{min-height:44px;padding:5px 10px;gap:2px}.scene-device>b{font-size:15px;line-height:1.3}.scene-device small{font-size:11px}
  .cases{padding-top:22px;padding-bottom:22px}.case-heading h2{font-size:32px}.case-heading{margin-bottom:14px}.scene-controls>p:not(.scene-number){line-height:1.5}.scene-device-detail span{display:none}.scene-device-detail p{font-size:12px;line-height:1.5}.scene-device-detail{padding-top:8px;gap:8px}.scene-flow li{padding:6px 0}.scene-flow span{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.scene-airflow i,.scene-sound i{animation:none!important}.scene-curtain-panel{will-change:auto}}
/* Light photographs use a lighten composite: an ambient layer never hides an illuminated spotlight. */
/* Indoor light does not recolor the outdoor view. The fixed glass-pane cutout is independent of curtains. */
.scene-light-photo{opacity:0;mix-blend-mode:lighten;pointer-events:none;clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,10.763889% 20.3125%,41.388889% 20.3125%,41.388889% 59.583333%,10.763889% 59.583333%,10.763889% 20.3125%,0 0)}
.scene-tabs{overflow-x:auto;scrollbar-width:thin}.scene-tabs button{flex:1 0 85px;white-space:nowrap}
.scene-light-controls{border:0;border-top:1px solid #344764;padding:12px 0 0;margin:12px 0 0;min-width:0;display:grid;gap:6px;color:#bfcee2}
.scene-light-controls legend{font-size:14px;padding-top:12px;color:#f2e0cb}.scene-light-controls label{display:flex;justify-content:space-between;flex-wrap:wrap;gap:5px;font-size:13px;line-height:1.4}.scene-light-controls output{color:#f0c48c;font-variant-numeric:tabular-nums}
.scene-light-controls select{width:100%;background:#121e32;border:1px solid #425574;color:#e0eaff;padding:7px;font:inherit;min-width:0}
.scene-light-controls input[type=range]{width:100%;margin:0;height:26px;accent-color:#a4c9ed;cursor:pointer}.scene-light-controls #lightTemperature{accent-color:#f2c58d}.temperature-scale{display:flex;justify-content:space-between;font-size:12px}
.scene-narrator{margin-top:14px;padding-top:12px;border-top:1px solid #344764;display:grid;gap:6px}.scene-narrator>span{font-size:14px;color:#dce8fb}.scene-narrator button{min-height:36px;background:#14223a;border:1px solid #4a6588;color:#b9dcff;font:13px inherit;cursor:pointer}.scene-narrator small,.scene-narrator summary{font-size:12px;color:#a9bdd9;line-height:1.5}.scene-narrator summary{cursor:pointer}.scene-narrator p{font-size:13px;color:#c9d7ed;line-height:1.7;margin:8px 0 0}.scene-narrator[data-speaking=true]>span{color:#f0c48c}
.scene-controls .scene-run-status{min-height:0}.scene-controls>p:not(.scene-number){margin-bottom:10px}
@media(min-width:761px) and (max-height:800px){.scene-light-controls{gap:3px;margin-top:8px;padding-top:8px}.scene-light-controls legend{padding-top:8px}.scene-narrator{margin-top:8px;padding-top:8px;gap:4px}.scene-time{margin:12px 0}.scene-controls{padding-top:14px;padding-bottom:14px}}
@media(max-width:760px){.scene-tabs button{flex-basis:70px}.scene-light-controls{grid-column:1/-1;grid-row:4;grid-template-columns:1fr 1fr;column-gap:14px;row-gap:5px;margin-top:10px;padding-top:8px}.scene-light-controls legend{font-size:14px;padding-top:8px}.scene-light-controls label:first-of-type{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px}.scene-light-controls label[for=lightBrightness]{grid-column:1;grid-row:2}.scene-light-controls #lightBrightness{grid-column:1;grid-row:3}.scene-light-controls label[for=lightTemperature]{grid-column:2;grid-row:2}.scene-light-controls #lightTemperature{grid-column:2;grid-row:3}.temperature-scale{grid-column:2;grid-row:4}.scene-narrator{grid-column:1/-1;grid-row:5;grid-template-columns:1fr auto;margin-top:10px;padding-top:8px}.scene-narrator small,.scene-narrator details{grid-column:1/-1}.scene-narrator button{padding:5px 12px}.scene-narrator>span{align-self:center}}
.scene-lab-top{align-items:center;flex-wrap:wrap}.scene-narrator{position:relative;display:flex;align-items:center;gap:10px;margin:0;padding:0;border:0;font-family:inherit}.scene-narrator button{padding:5px 10px;min-height:32px}.scene-narrator>small{max-width:150px}.scene-narrator details{position:relative}.scene-narrator details p{position:absolute;z-index:10;top:24px;right:0;width:280px;max-width:80vw;background:#0e192b;border:1px solid #4a6588;padding:14px;box-shadow:0 8px 25px #0008}.scene-narrator summary{list-style:none;color:#c5dafa}.scene-narrator>span{font-size:13px;white-space:nowrap}
@media(max-width:760px){.scene-lab-top{display:grid;grid-template-columns:1fr auto;gap:8px}.scene-narrator{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:6px}.scene-narrator small{display:none}.scene-narrator details p{right:0}.scene-light-controls{margin-bottom:0}}
.scene-device-detail[data-empty=true]{display:none}
@media(min-width:761px) and (max-height:800px){.scene-diagram{padding:12px;gap:10px}.scene-light-controls{gap:3px}.scene-light-controls input[type=range]{height:20px}.scene-light-controls select{padding:5px}.scene-controls h3{margin-bottom:8px}.scene-controls>p:not(.scene-number){line-height:1.5}.scene-flow li{padding:5px 0}.scene-demo-note{font-size:12px}}