/* Shared component styling; all package-specific values are CSS tokens. */
:root{--scene-accent:#c1e99c;--scene-ink:#edf2e8;--scene-muted:#a8bfb3;--scene-panel:#102725e8;--scene-line:#d9eee233;--scene-surface:#ffffff08;--scene-selected:#c1e99c20;--scene-shadow:#04151240;--scene-radius:12px;--scene-railWidth:154px;--scene-panelWidth:332px;--scene-edge:24px;--scene-blur:18px;--scene-font:'Microsoft YaHei','Segoe UI',sans-serif;--three-accent:var(--scene-accent);--three-ink:var(--scene-ink);--three-muted:var(--scene-muted);--three-panel:var(--scene-panel);--three-line:var(--scene-line)}
.three-ui,.three-help{font-family:var(--scene-font);color:var(--scene-ink)}
.three-ui button,.three-help button{background:var(--scene-surface);border-color:var(--scene-line);color:var(--scene-ink);border-radius:calc(var(--scene-radius)*.6)}
.three-ui button:hover,.three-ui button[aria-pressed=true]{background:var(--scene-selected);border-color:var(--scene-accent);color:var(--scene-accent)}
.three-ui button:disabled{cursor:not-allowed}
.three-ui [hidden],.three-ui[hidden]{display:none!important}
.three-header,.three-playing .three-header{top:16px;left:var(--scene-edge);right:var(--scene-edge);min-height:60px;padding:0;gap:14px;border:0;background:transparent;backdrop-filter:none;z-index:91000;pointer-events:none}
.three-header>*{pointer-events:auto}
.three-mark{width:5px;height:44px;flex:none;border:0;padding:0;background:var(--scene-accent);border-radius:1px;font-size:0}
.three-mark:has(img){width:40px;background:none}.three-mark img{width:40px;height:40px;object-fit:contain}
.three-title{flex:none;min-width:186px;padding:4px 4px 4px 0;text-shadow:0 2px 8px var(--scene-shadow)}
.three-title h1{font-size:22px;letter-spacing:.04em;font-weight:600;color:var(--scene-ink);margin:0}
.three-title p{font-size:9px;letter-spacing:.2em;color:var(--scene-muted);margin-top:6px}
#scene-module-nav{display:flex;gap:8px;padding:5px;border:1px solid var(--scene-line);border-radius:var(--scene-radius);background:var(--scene-panel);backdrop-filter:blur(var(--scene-blur))}
.scene-command{display:flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap}
.scene-command svg{width:18px;height:18px;flex:none}
#scene-module-nav button{min-width:82px;min-height:38px;border-color:transparent;font-size:13px}
.three-status{margin-left:auto;background:var(--scene-panel);padding:9px 11px;border-radius:calc(var(--scene-radius)*.6);font-size:10px}
.three-status i{background:var(--scene-warning)}.three-status[data-ready=true] i{background:var(--scene-accent);box-shadow:none}
.three-header-actions{gap:6px;margin-left:0}
.three-header-actions button{background:var(--scene-panel);backdrop-filter:blur(var(--scene-blur));min-height:36px;font-size:11px}
#three-assets-toggle,#three-env-toggle{display:none}
.three-explore{top:100px;left:var(--scene-edge);width:var(--scene-railWidth);padding:8px;max-height:calc(100dvh - 222px);background:var(--scene-panel);border-color:var(--scene-line);border-radius:var(--scene-radius);backdrop-filter:blur(var(--scene-blur));box-shadow:0 8px 28px var(--scene-shadow);z-index:90000;scrollbar-color:var(--scene-line) transparent}
.three-explore>.three-eyebrow,.three-explore>h2,.three-explore>.three-description{display:none}
.three-tabs{gap:3px;margin:0 0 9px}.three-tabs button{font-size:10px;padding:4px;min-height:30px}
.three-view{display:grid;grid-template-columns:1fr auto;gap:6px;padding:8px!important;position:relative;overflow:hidden;text-align:left}
.three-view .number{position:absolute;top:12px;left:12px;padding:2px 4px;border-radius:3px;font-size:9px;color:var(--scene-ink);background:var(--scene-panel)}
.three-view .name{font-size:11px;line-height:1.6}.three-view .arrow{font-size:13px}
.three-view img{grid-column:1/-1;width:100%;height:60px;object-fit:cover;border-radius:calc(var(--scene-radius)*.4)}
[data-scene-view=text] .three-view img{display:none}[data-scene-view=text] .three-view .number{display:none}
.three-explore .three-section{padding-top:10px;margin-top:10px}.three-explore .three-section h3{font-size:10px;margin-bottom:7px}
.three-explore .three-tools{grid-template-columns:1fr;gap:5px}.three-explore .three-tools button{font-size:10px;min-height:30px;padding:6px}
.three-tour{background:var(--scene-selected)!important;color:var(--scene-accent)!important;border-color:var(--scene-line)!important;font-size:10px!important;min-height:31px!important;padding:6px!important}
.three-tour[aria-pressed=true]{background:var(--scene-selected)!important;color:var(--scene-accent)!important}
.three-explore:has([data-pane=layers]:not([hidden])),.three-explore:has([data-pane=saved]:not([hidden])){width:260px}
.three-layer{font-size:11px}.three-layer small{font-size:9px}
.scene-theme-picker{display:block;font-size:10px;color:var(--scene-muted);margin-top:12px}.scene-theme-picker select{width:100%;margin-top:6px;padding:6px;font-size:10px}
.three-assets,.three-environment{top:100px;right:var(--scene-edge);width:var(--scene-panelWidth);height:auto;max-height:calc(100dvh - 208px);padding:18px;background:var(--scene-panel);border:1px solid var(--scene-line);border-radius:var(--scene-radius);backdrop-filter:blur(var(--scene-blur));box-shadow:0 8px 28px var(--scene-shadow);z-index:90000;overflow:auto}
#three-environment{--three-environment-padding:18px}
.three-assets{height:calc(100dvh - 208px);overflow:hidden}
.three-assets h2{font-size:17px;font-weight:500;margin:4px 0 14px}.three-assets .three-eyebrow{font-size:9px;letter-spacing:.16em}
.three-asset-types{grid-template-columns:repeat(4,1fr);gap:4px}.three-asset-types button{font-size:11px;padding:7px 2px}
.three-assets input,.three-assets select,.three-environment select,.three-seq-speed select,.three-seq-display select,.scene-theme-picker select{background:var(--scene-surface);color:var(--scene-ink);border:1px solid var(--scene-line);border-radius:calc(var(--scene-radius)*.5)}
.three-assets input::placeholder{color:var(--scene-muted)}
.three-asset-row{background:var(--scene-surface)!important;border-color:var(--scene-line)!important;border-radius:calc(var(--scene-radius)*.6)!important;padding:12px!important}
.three-asset-row[aria-pressed=true],.three-asset-row:hover{background:var(--scene-selected)!important;border-color:var(--scene-accent)!important}
.three-asset-detail{background:var(--scene-selected);border-color:var(--scene-line);padding:14px;margin-top:12px;border-radius:calc(var(--scene-radius)*.6)}
.three-asset-detail h3{font-size:13px}.three-outline-preview{margin-top:9px;color:var(--scene-muted)}
#scene-business-data{border-top:1px solid var(--scene-line);margin-top:12px;padding-top:6px}.scene-asset-id{word-break:break-all}.scene-data-empty{padding:10px;background:var(--scene-surface);border-radius:6px}.scene-metrics{display:grid;grid-template-columns:1fr auto;gap:9px;margin:12px 0 0;font-size:11px;max-height:160px;overflow:auto}.scene-metrics dd{margin:0;text-align:right}.scene-metrics [data-quality=stale],.scene-metrics [data-quality=bad]{color:var(--scene-warning)}.scene-device-state[data-status=normal]{color:var(--scene-normal)!important}.scene-device-state[data-status=warning]{color:var(--scene-warning)!important}.scene-device-state[data-status=alarm]{color:var(--scene-alarm)!important}.scene-device-state[data-status=offline]{color:var(--scene-offline)!important}
.three-time{font-family:var(--scene-font);font-size:26px}.three-environment small{line-height:1.7}
#scene-utility-rail{right:var(--scene-edge);bottom:118px;display:grid;gap:5px;padding:7px;border:1px solid var(--scene-line);border-radius:var(--scene-radius);background:var(--scene-panel);backdrop-filter:blur(var(--scene-blur));z-index:89000}
#scene-utility-rail button{flex-direction:column;gap:5px;padding:9px 10px;font-size:10px;border-color:transparent}
#scene-catalog-summary{bottom:30px;left:var(--scene-edge);padding:12px 16px;border:1px solid var(--scene-line);border-radius:100px;background:var(--scene-panel);backdrop-filter:blur(var(--scene-blur));font-size:11px;color:var(--scene-ink);z-index:89000}
.three-footer{bottom:90px;left:var(--scene-edge);right:var(--scene-edge);font-size:9px;z-index:85000}.three-footer span{background:var(--scene-panel);color:var(--scene-muted);border-color:var(--scene-line);padding:5px 9px}.three-footer>span:first-child,.three-footer #three-count{display:none}
#scene-web-views{bottom:102px!important;background:var(--scene-panel)!important;border-color:var(--scene-line)!important;padding:5px!important;border-radius:var(--scene-radius)!important;max-width:calc(100vw - 390px);overflow-x:auto;z-index:88000!important;scrollbar-width:none;backdrop-filter:blur(var(--scene-blur))}
#scene-web-views button{color:var(--scene-ink)!important;font-family:var(--scene-font)!important;font-size:11px!important;border-color:transparent!important;background:var(--scene-surface)!important;min-height:33px;white-space:nowrap}
#scene-web-views button[aria-pressed=true]{background:var(--scene-selected)!important;color:var(--scene-accent)!important;border-color:var(--scene-accent)!important}
#three-playback-controls{display:block;bottom:24px!important;left:50%;width:min(660px,calc(100vw - 420px));padding:12px 16px!important;border-color:var(--scene-line);border-radius:100px;background:var(--scene-panel);backdrop-filter:blur(var(--scene-blur));z-index:92000;box-shadow:0 8px 26px var(--scene-shadow)}
#three-playback-controls .three-sequence{background:none;border:0;margin:0;padding:0}
#three-playback-controls button,#three-playback-controls select{background:var(--scene-surface);border-color:var(--scene-line);color:var(--scene-ink)}
#three-playback-controls #three-seq-play{background:var(--scene-selected);color:var(--scene-accent);min-width:70px}
#three-playback-controls input[type=range]::-webkit-slider-runnable-track{background:var(--scene-line)}
#three-playback-controls input[type=range]::-webkit-slider-thumb{background:var(--scene-accent);box-shadow:none}
#three-playback-controls .three-seq-audio{gap:5px}.three-seq-progress{color:var(--scene-muted)}
#three-playback-shield{inset:0;z-index:86000}
.three-playing #scene-module-nav,.three-playing #scene-utility-rail,.three-playing #scene-catalog-summary{display:none}
.three-playing #three-playback-controls{width:min(660px,calc(100vw - 32px))}
.three-toast{z-index:98000;background:var(--scene-panel);border-color:var(--scene-line);color:var(--scene-ink)}
.three-help{background:var(--scene-panel);border-color:var(--scene-line);border-radius:var(--scene-radius)}.three-help::backdrop{background:var(--scene-shadow)}
#swt-panel{z-index:95000!important;right:var(--scene-edge)!important;top:100px!important;background:var(--scene-panel);border-color:var(--scene-line)}
#scene-web-pois .scene-web-poi{color:var(--scene-ink);border-color:var(--scene-line);background:var(--scene-panel);font-family:var(--scene-font);border-radius:calc(var(--scene-radius)*.6);box-shadow:0 4px 14px var(--scene-shadow);backdrop-filter:blur(var(--scene-blur));font-size:11px;padding:7px 11px}
#scene-web-pois .scene-web-poi:after{border-color:var(--scene-accent)}
#scene-web-pois .scene-web-poi[aria-pressed=true]{border-color:var(--scene-accent);outline-color:var(--scene-accent);box-shadow:none}
#scene-web-pois button[data-poi^=device-],#scene-web-pois button[data-poi^=camera-]{background:var(--scene-panel);padding:0}
#scene-web-pois button[data-poi^=device-]>span:last-child,#scene-web-pois button[data-poi^=camera-]>span:last-child{background:var(--scene-panel);color:var(--scene-ink);border-color:var(--scene-line)}
#scene-web-labels .scene-web-label{background:var(--scene-panel);color:var(--scene-ink);border-color:var(--scene-line);font-family:var(--scene-font);box-shadow:0 5px 20px var(--scene-shadow)}
#scene-web-labels .swl-row,#scene-web-labels .swl-unit,#scene-web-labels .swl-status,#scene-web-labels .swl-updated{color:var(--scene-muted)}
#scene-web-labels .swl-row b,#scene-web-labels .swl-pump-name{color:var(--scene-ink)}
#scene-web-labels .swl-stem,#scene-web-labels .swl-dot,#scene-web-labels .swl-icon{border-color:var(--scene-accent)}
#scene-web-labels .swl-dot:after,#scene-web-labels .swl-icon:after{background:var(--scene-accent)}
#scene-web-labels .swl-water .swl-value{color:var(--scene-warning)}
[data-scene-layout=workbench] .three-header{top:0;left:0;right:0;padding:12px var(--scene-edge);background:var(--scene-panel);border-bottom:1px solid var(--scene-line)}
[data-scene-layout=workbench] .three-explore{width:220px}[data-scene-layout=workbench] #three-playback-controls{border-radius:var(--scene-radius)}
@media(max-width:1150px){.three-status{display:none}.three-title{min-width:160px}.three-title h1{font-size:19px}#scene-module-nav button{min-width:66px;font-size:11px;gap:6px}.three-header-actions{margin-left:auto}#scene-catalog-summary{font-size:9px;padding:10px}#three-playback-controls{width:min(620px,calc(100vw - 320px))}.three-header{gap:9px}}
@media(max-width:800px){.three-header{top:10px;left:12px;right:12px;flex-wrap:wrap;gap:7px}.three-title{min-width:0;flex:1}.three-title h1{font-size:17px}.three-title p{display:none}.three-header-actions{margin-left:0}.three-header-actions button{font-size:10px;padding:5px 8px}#scene-module-nav{order:5;width:100%;padding:3px;justify-content:space-between}#scene-module-nav button{flex:1;min-height:32px;min-width:0;font-size:11px}.three-explore{top:108px;left:12px;width:132px;max-height:calc(100dvh - 225px)}.three-view img{height:50px}.three-assets,.three-environment{top:108px;right:12px;width:min(320px,calc(100vw - 165px));max-height:calc(100dvh - 232px)}.three-assets{height:calc(100dvh - 232px);padding:12px}.three-asset-types button{font-size:10px}.three-asset-detail{padding:9px}#scene-catalog-summary{bottom:91px;left:12px;font-size:9px;padding:8px 11px}#scene-web-views{display:none!important}#three-playback-controls{width:calc(100vw - 24px);bottom:12px!important;padding:9px 12px!important;border-radius:var(--scene-radius)}#scene-utility-rail{right:12px;bottom:91px;display:flex;gap:2px;padding:3px}#scene-utility-rail button{font-size:9px;padding:7px;flex-direction:row}#scene-utility-rail svg{width:13px;height:13px}.three-footer{display:none}#swt-panel{top:108px!important;right:12px!important;width:calc(100vw - 24px)!important}}
@media(max-width:480px){.three-explore{width:120px;top:108px;bottom:auto}.three-explore .three-section{display:none}.three-assets,.three-environment{width:calc(100vw - 151px);padding:10px}.three-assets h2{font-size:13px}.three-assets .three-eyebrow,.three-assets-hint,.three-asset-search>span{display:none}.three-assets input{font-size:10px;padding:7px}.three-asset-types{grid-template-columns:repeat(2,1fr)}.three-asset-row>span{font-size:10px}.three-asset-detail p{font-size:9px}.three-header-actions #three-help-open{display:none}#scene-utility-rail button{font-size:0;gap:0;padding:8px}#scene-utility-rail svg{width:17px;height:17px}.three-title h1{font-size:15px}#three-playback-controls .three-seq-display select{width:70px}#three-playback-controls .three-seq-audio input{width:28px}#three-playback-controls button{font-size:9px;padding:4px 5px}}
@media(max-height:650px){.three-view img{height:40px}.three-view{padding:5px!important}.three-explore .three-section{display:none}.three-assets-detail .three-eyebrow{display:none}}
@media(prefers-reduced-transparency:reduce){.three-ui{backdrop-filter:none}}
/* Environment settings overlay the rail on small screens so all controls remain usable. */
@media(max-width:800px){#three-environment{width:min(var(--scene-panelWidth),calc(100vw - 24px));right:12px;max-height:calc(100dvh - 132px);--three-environment-padding:12px}}
@media(max-height:650px){#three-environment{top:12px;max-height:calc(100dvh - 24px);z-index:93000}}