.system-map{display:block;width:100%;height:auto;max-height:140px;margin:0 0 16px;color:#819f91}.system-map .map-shell{fill:#90b59e0d;stroke:#8fada1;stroke-width:1.3}.system-map .map-node{fill:#63857533;stroke:#789384;stroke-width:1.5}.system-map text{font:8px Roboto,sans-serif;fill:#a3b8ab}.map-heat,.map-air,.map-robot-route,.map-garden,.map-window{fill:none;stroke:#759888;stroke-width:1.5;opacity:.25}.map-robot{fill:#dcebdd;opacity:0}.system-light .map-light{fill:#ecd19088;stroke:#ffe6af}.system-heat .map-heat{stroke:#e3ab7a;opacity:1}.system-air .map-air{stroke:#aae4e6;opacity:1;stroke-dasharray:10 6;animation:flow-system 2s linear infinite}.system-media .map-media{fill:#aad6be55;stroke:#b3efd4}.system-water .map-water{fill:#ecb57e55;stroke:#efbb85}.system-garden .map-garden{stroke:#8bdbb1;opacity:1}.system-robot .map-robot-route{opacity:1;stroke:#add1cd;stroke-dasharray:4 4}.system-robot .map-robot{opacity:1;animation:map-clean 6s linear infinite}.system-gate .map-gate{stroke:#bceab8;stroke-width:4}.system-window .map-window{stroke:#abdce5;opacity:1;stroke-width:4}.system-alarm .map-shell{stroke:#e9ad89}.system-group-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:18px}.system-group-tabs button{background:#809b8320;padding:8px 4px;font-size:10px;border-radius:7px;min-height:34px}.system-group-tabs button[aria-pressed=true]{background:#cee1d0;color:#18362c}.system-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid #a2ba9d2c;padding:10px 0;line-height:1.4}.system-toggle-row>span{font-size:11px;max-width:175px}.system-toggle-row button{background:#5e7f6533;border:1px solid #8eaa9255;border-radius:20px;min-height:35px;min-width:76px;padding:7px 10px;font-size:10px;flex-shrink:0}.system-toggle-row button[aria-pressed=true]{background:#b5d6bf;color:#183529}.sensor-status,.system-summary,.system-hint{font-size:10px;line-height:1.55;color:#bcd0bd;margin:14px 0}.system-summary{border-top:1px solid #a2ba9d2c;padding-top:12px}.all-off{background:#385b4b;border:1px solid #b2ccb26b;width:100%;padding:12px;border-radius:8px;font-size:11px;line-height:1.4;min-height:44px;margin-top:12px}.device-effects{position:absolute;inset:0;z-index:5;pointer-events:none}.air-ribbons{position:absolute;left:48%;top:23%;width:22%;opacity:0}.air-ribbons i{display:block;height:12px;border-top:2px solid #b4e8e5;border-radius:50%;margin:12px;filter:drop-shadow(0 0 7px #bae9e7)}.device-ventilation .air-ribbons{opacity:.7;animation:air-breathe 4s ease-in-out infinite}.floor-warmth{position:absolute;inset:64% 12% 5%;background:repeating-linear-gradient(0deg,transparent 0 22px,#e6a27644 24px 26px);transform:perspective(500px) rotateX(40deg);opacity:0;transition:opacity .7s}.device-floor .floor-warmth{opacity:.8}.audio-rings{position:absolute;left:40%;top:40%;width:140px;height:140px;opacity:0}.audio-rings i{position:absolute;inset:0;border:1px solid #b8e7c7;border-radius:50%;animation:audio-wave 3s ease-out infinite}.audio-rings i:nth-child(2){animation-delay:1s}.audio-rings i:nth-child(3){animation-delay:2s}.device-music .audio-rings{opacity:calc(.3 + var(--volume,.35)*.6)}.robot-visual{position:absolute;left:32%;top:83%;width:30px;height:19px;border-radius:50%;border:2px solid #acbeba;background:#233b39;box-shadow:0 4px 9px #0008;opacity:0}.device-robot .robot-visual{opacity:1;animation:room-clean 10s ease-in-out infinite}.water-alert{position:absolute;left:34%;top:52%;background:#523c29e0;color:#ffe1b3;padding:12px 18px;border:1px solid #b98f58;border-radius:25px;font-size:12px;opacity:0}.device-leak .water-alert,.device-smoke .water-alert{opacity:1}.garden-particles{position:absolute;right:6%;top:36%;width:130px;height:100px;background:repeating-linear-gradient(105deg,transparent 0 15px,#a5e9d244 16px 18px,transparent 19px 30px);mask-image:radial-gradient(ellipse,black,transparent 70%);opacity:0}.device-irrigation .garden-particles{opacity:.7;animation:air-breathe 2s ease-in-out infinite}.story-sticky[data-stage="4"].device-biodynamic .visual-light{background:#ffd790;opacity:.3}.device-presence .map-light{animation:presence-glow 5s ease-in-out infinite}.mobile-control-sheet .system-map{max-height:155px}.mobile-control-sheet .system-group-tabs button{min-height:44px;font-size:12px}.mobile-control-sheet .system-toggle-row>span{font-size:13px}.mobile-control-sheet .system-toggle-row button{font-size:11px;min-height:44px;min-width:86px}.mobile-control-sheet .system-summary,.mobile-control-sheet .sensor-status{font-size:12px}.mobile-control-sheet .system-hint{font-size:11px}.mobile-control-sheet .all-off{font-size:12px}.mobile-control-sheet{scrollbar-width:thin;scrollbar-color:#89a790 transparent}
@keyframes flow-system{to{stroke-dashoffset:-32}}@keyframes map-clean{0%,100%{transform:translate(0,0)}25%{transform:translate(59px,0)}50%{transform:translate(59px,16px)}75%{transform:translate(0,16px)}}@keyframes air-breathe{50%{transform:translateY(13px);opacity:.35}}@keyframes audio-wave{0%{transform:scale(.2);opacity:.8}100%{transform:scale(1.4);opacity:0}}@keyframes room-clean{50%{transform:translate(180px,-12px)}}@keyframes presence-glow{50%{opacity:.25}}
@media(max-width:700px){.water-alert{left:20px;top:29%;font-size:11px;max-width:calc(100% - 40px)}.audio-rings{left:25%;top:25%;width:100px;height:100px}.air-ribbons{left:45%;top:26%;width:35%}.robot-visual{top:53%;left:20%}.floor-warmth{inset:40% 5% 33%}.device-effects .garden-particles{top:26%}}
@media(prefers-reduced-motion:reduce){.device-effects *,.system-map *{animation:none!important;transition:none!important}}
.device-gas .water-alert{opacity:1}
.map-lock{fill:none;stroke:#7d9c8a;stroke-width:1.5;opacity:.4}.system-lock .map-lock{stroke:#cee8c8;opacity:1}.system-gate .map-gate{transform:rotate(-25deg);transform-origin:260px 135px;transition:transform .6s}
/* Photographic scene preview, without abstract geometry. */
.scene-preview{position:relative;height:210px;overflow:hidden;border:1px solid #92b8a84a;border-radius:12px;margin-bottom:18px;background:#10231f;isolation:isolate}
.scene-photo{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(var(--scene-light,1));transition:filter .6s,background-image .6s}
.scene-readout{position:absolute;bottom:10px;left:12px;right:12px;padding:8px 10px;background:#102b28df;color:#e1eadf;font-size:11px;line-height:1.4;border-radius:6px}
.device-effects .scene-photo{display:none}.device-effects .scene-readout{left:42%;right:27%;bottom:19%}
.scene-biodynamic .scene-photo{filter:brightness(var(--scene-light)) sepia(.3)}
@media(max-width:700px){.device-effects .scene-readout{left:10px;right:10px;bottom:0;font-size:10px;padding:5px 8px}.scene-preview{height:190px;position:sticky;top:0;z-index:2}.mobile-control-sheet .scene-preview{background:#10231f}}
@media(prefers-reduced-motion:reduce){.scene-preview *{animation:none!important;transition:none!important}}
/* No colored frame or filter on the empty area around a contained photograph. */
.story-sticky[data-stage="4"]{background:#08151d}
.story-sticky[data-stage="4"] .stage-visual{background:transparent;filter:none;transition:transform 1s,top 1s,height 1s}
.story-sticky[data-stage="4"] .visual-image{filter:brightness(var(--light));transition:filter .6s}
.story-sticky[data-stage="4"] .visual-light{display:none}
.scene-preview{height:auto;aspect-ratio:3/2;border:0;border-radius:0;background:transparent}
.mobile-control-sheet .scene-preview{background:transparent}
.scene-photo{background-size:contain;background-repeat:no-repeat}
.system-summary>div{margin:5px 0}
.story-sticky[data-stage="4"][data-control-group="light"].device-biodynamic .visual-image{filter:brightness(var(--light)) sepia(.22)}
@media(max-width:700px){.scene-preview{height:auto;aspect-ratio:3/2}}