/* ARETEK site identity; orange selects, electrical states retain separate colors. */
:root{
  color-scheme:dark;
  --brand:#f5a31b;--brand-hover:#ffb638;--brand-ink:#19150c;
  --ink:#f5f5f3;--muted:#b0b6bc;--line:#394149;
  --surface:#181d23;--raised:#242b33;--hover:#303942;--field:#11161c;
  --selected:#3a3020;--normal:#7edcb2;--alarm:#ffaaa4;--warning:#f2ce83;--battery:#a3d6ff;
  --gutter:24px;--nav-width:148px;--panel-width:326px;--topbar-height:68px;
  font-family:"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif;
  color:var(--ink);background:#24282d;font-synthesis:none;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}
button,a,select,input{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;border:0;transition:background .18s,color .18s,border-color .18s,box-shadow .2s,transform .2s cubic-bezier(.2,.8,.2,1)}
button:not(:disabled):not(.scene-label):active{transform:scale(.975)}
button:disabled{opacity:.4;cursor:default}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
::selection{background:var(--brand);color:var(--brand-ink)}
#scenePanel,.scene-frame{position:absolute;inset:0}
#sceneCanvas{width:100%;height:100%;display:block;touch-action:none;outline:0}
.scene-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#08090a38,transparent 18%,transparent 82%,#08090a25)}

/* Perimeter controls leave the center to the product scene. */
.topbar{position:absolute;top:0;left:0;right:0;height:var(--topbar-height);padding:0 var(--gutter);display:flex;align-items:center;gap:28px;color:var(--ink);border-bottom:1px solid #303439;background:#08090a}
.brand{display:flex;align-items:center;gap:16px;flex-shrink:0}
.brand-logo{display:block;width:154px;height:auto;object-fit:contain}
.brand small{display:block;border-left:1px solid #42464b;padding-left:16px;font-size:11px;letter-spacing:.6px;line-height:1.7;color:#c1c6cc}
.topbar-caption{font-size:11px;letter-spacing:1px;color:var(--muted)}
.topbar-actions{display:flex;align-items:center;gap:6px;margin-left:auto}
.topbar-actions button{padding:9px 12px;border:1px solid transparent;border-radius:5px;color:#e6e9ed;background:#20262c;font-size:12px}
.topbar-actions button:hover{background:var(--hover);border-color:#535a62}
#tourProgress{font-size:11px;color:var(--muted);margin-right:8px}
.tour-timeline{position:absolute;inset:auto 0 -1px;height:2px;background:#f5a31b16;pointer-events:none;overflow:hidden}
.tour-timeline>span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#b77818,var(--brand),#ffe3aa);transform:scaleX(0);transform-origin:left;box-shadow:0 0 12px #f5a31b70}
.tour-timeline[data-status=paused]>span{background:#9e8a67;box-shadow:none}
#tourButton{border-color:#765624;color:var(--brand)}
#fullscreenButton{font-size:19px;padding:6px 10px}
.scene-header{position:absolute;left:calc(var(--gutter) + var(--nav-width) + 24px);top:92px;width:min(390px,calc(100vw - 585px));padding:15px 18px;border:1px solid #434a52;border-left:2px solid var(--brand);border-radius:5px;background:var(--surface);color:var(--ink);pointer-events:none;box-shadow:0 4px 16px #0000001a}
.eyebrow{display:block;font-size:10px;letter-spacing:1.7px;font-weight:600;color:var(--brand)}
.scene-header h1{font-size:clamp(20px,1.65vw,26px);font-weight:600;letter-spacing:.3px;margin:7px 0}
.scene-header p{font-size:12px;color:#c4cad0;line-height:1.7;margin:0}
.scene-header .launch{pointer-events:auto;margin-top:13px;width:184px;text-align:left}
.launch span{float:right}
.primary{background:var(--brand);color:var(--brand-ink);border-radius:4px;padding:10px 13px;font-size:12px;font-weight:600}
.primary:hover{background:var(--brand-hover)}
.step-rail{position:absolute;left:var(--gutter);top:92px;width:var(--nav-width);display:flex;flex-direction:column;gap:6px}
.nav-label{font-size:10px;letter-spacing:1.5px;color:#c1c6cc;display:block;margin-bottom:6px;background:var(--surface);padding:5px 8px;border-radius:3px;width:fit-content}
.step-rail button{position:relative;overflow:hidden;display:flex;align-items:center;gap:10px;min-height:60px;padding:11px;background:var(--surface);border:1px solid #414952;border-radius:5px;color:#e7ebef;text-align:left}
.step-rail button[data-tour-active=true]::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--brand);transform:scaleX(var(--tour-progress,0));transform-origin:left}
.step-rail button[data-tour-status=paused]::after{background:#9e8a67}
.step-rail button>b{font-size:11px;font-weight:500;color:#adb6bf;font-variant-numeric:tabular-nums}
.step-rail button>span{font-size:13px;font-weight:600}
.step-rail small{display:block;font-size:10px;font-weight:400;color:#bac1c8;margin-top:4px}
.step-rail button:hover{background:var(--hover)}
.step-rail button.active{background:var(--selected);border-color:#b47d2b;box-shadow:inset 2px 0 var(--brand);color:#fff3dc}
.step-rail button.active>b{color:var(--brand)}
.floor-dock{position:absolute;bottom:22px;left:var(--gutter);width:var(--nav-width)}
.floor-switcher{display:flex;gap:4px;flex-wrap:wrap}
.floor-switcher button{border:1px solid #4a535b;border-radius:4px;background:var(--surface);padding:9px 8px;color:#dce1e6;font-size:11px;font-variant-numeric:tabular-nums}
.floor-switcher button:hover{background:var(--hover)}
.floor-switcher button[aria-pressed=true]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
.scene-bottom{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);max-width:calc(100% - 390px);display:flex;align-items:center;flex-direction:column;gap:8px}
.scene-hint{font-size:11px;color:#d2d7dd;line-height:1.4;margin:0;padding:5px 10px;background:var(--surface);border-radius:4px;pointer-events:none}
.scene-hint i{font-style:normal;padding:0 6px;color:#828d97}
.power-status{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:11px;font-size:11px;color:#e5e9ed;background:var(--surface);padding:8px 13px;border-radius:5px;border:1px solid var(--line);max-width:100%}
.power-status i{width:6px;height:6px;border-radius:50%;background:var(--normal);flex-shrink:0}
.power-status strong{font-weight:500;color:var(--normal)}
.power-status[data-alert=true] #alarmCount{color:var(--alarm)}
.power-status[data-mode=ups] i{background:var(--battery)}
.view-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px;background:var(--surface);border:1px solid #48515a;border-radius:6px;padding:4px;box-shadow:0 4px 18px #00000026;white-space:nowrap;max-width:100%}
.view-actions button{background:transparent;border:1px solid transparent;border-radius:4px;padding:9px 12px;color:#e0e5ea;font-size:12px}
.view-actions button:hover{background:var(--hover)}
.view-actions button.active{color:var(--brand);background:var(--selected);border-color:#866029}
.view-actions>span{height:20px;width:1px;background:#46515b;margin:0 3px}
.selection-bar{position:absolute;top:82px;right:var(--gutter);background:var(--surface);color:#edf0f3;padding:9px 11px;border:1px solid var(--line);border-radius:5px;display:flex;gap:10px;align-items:center;font-size:11px;max-width:var(--panel-width)}
.selection-bar>span{color:var(--muted);font-size:10px;flex-shrink:0}
.selection-bar strong{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.selection-bar button{background:none;color:#d4dae1;font-size:18px;padding:0 2px;flex-shrink:0}
#scenePanel:has(#alarmDisplay:not([hidden])) .selection-bar{display:none}

/* The same material and type hierarchy continues through all product controls. */
.equipment-panel{position:absolute;right:var(--gutter);top:124px;width:var(--panel-width);bottom:22px;max-height:850px;background:var(--surface);border:1px solid #4a525b;border-radius:7px;box-shadow:0 10px 30px #00000030;display:flex;flex-direction:column;overflow:hidden}
.equipment-panel:not([hidden])>.card-heading,.equipment-panel:not([hidden])>.card-scroll,.alarm-display:not([hidden])>.alarm-housing{animation:panel-reveal .32s cubic-bezier(.16,1,.3,1) both}
@keyframes panel-reveal{from{opacity:0;transform:translate3d(18px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.card-heading{padding:18px 18px 14px;border-bottom:1px solid var(--line);position:relative;background:#13171c}
.card-heading .eyebrow{font-size:9px;letter-spacing:1.4px}
.card-heading h2{font-weight:600;font-size:20px;margin:9px 0 6px;letter-spacing:-.2px}
.card-heading p{font-size:11px;margin:0;color:var(--muted)}
.close{position:absolute;right:10px;top:8px;background:transparent;font-size:22px;color:#b4bec7;padding:3px 7px;border-radius:4px}
.close:hover{background:var(--hover);color:#fff}
.card-scroll{padding:13px 16px 20px;overflow:auto;scrollbar-width:thin;scrollbar-color:#58636e transparent;font-size:12px;overscroll-behavior:contain}
.room-pills{display:flex;gap:6px;margin-bottom:10px}
.room-pills button{padding:6px 12px;background:var(--raised);border:1px solid var(--line);border-radius:4px;color:#c4ccd4;font-size:11px}
.room-pills button.active{background:var(--selected);color:var(--brand);border-color:#96702e}
.product-view-controls{display:grid;grid-template-columns:1fr;border:1px solid var(--line);padding:3px;border-radius:5px;gap:3px;margin-bottom:12px}
.product-view-controls button{background:transparent;padding:9px 2px;border-radius:3px;font-size:11px;color:#cad2da}
.product-view-controls button:hover,.product-view-controls button.active{background:var(--raised);color:var(--brand)}
.product-module-browser{border:1px solid var(--line);border-radius:5px;background:#14191f;padding:10px;margin:5px 0 13px}
.product-module-browser .section-heading{margin:0 0 9px}
.product-module-browser .section-heading h3{font-size:12px}
.product-module-list{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.product-module-option{min-height:58px;padding:8px 9px;text-align:left;border:1px solid var(--line);border-radius:4px;background:var(--raised);color:#e5eaf0}
.product-module-option:hover,.product-module-option[aria-pressed=true]{border-color:#a47732;background:var(--selected)}
.product-module-option strong,.product-module-option small{display:block}
.product-module-option strong{font-size:11px;font-weight:600}
.product-module-option small{font-size:10px;color:#bac3cd;margin-top:4px;line-height:1.5}
.product-module-all{width:100%;padding:8px;margin-top:7px;border:1px solid var(--line);border-radius:4px;background:var(--raised);color:#d1d8e0;font-size:11px}
.product-module-all:hover,.product-module-all[aria-pressed=true]{background:var(--selected);border-color:#a47732;color:var(--brand)}
.product-module-browser .module-description{margin:8px 1px 0}
.screen-button{display:flex;align-items:center;gap:12px;padding:12px;background:var(--raised);border-radius:5px;width:100%;text-align:left;color:#e3e8ed}
.screen-button>span:first-child{font-size:22px}
.screen-button small{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.screen-button b{margin-left:auto}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:16px 0 10px}
.section-heading h3{font-weight:600;font-size:12px;margin:0}
.section-heading>span{font-size:10px;color:var(--muted)}
.scenario-options{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:13px}
.scenario-options button{padding:10px 2px;border-radius:4px;background:var(--raised);color:#cbd4dd;font-size:11px;border:1px solid var(--line)}
.scenario-options button.active{border-color:#b28339;background:var(--selected);color:#ffdd9e}
.scenario-options [data-scenario=alert].active{background:#44272b;border-color:#b66969;color:var(--alarm)}
label{display:block;font-size:11px;font-weight:500;color:#c1c9d2;margin:10px 0 7px}
select,input{width:100%;border:1px solid #56616d;border-radius:4px;padding:10px;background:var(--field);color:#e6ecf1;font-size:12px;min-width:0}
select{cursor:pointer}
.scenario-result{margin:13px 0;border-left:2px solid #4b967a;padding:3px 0 3px 12px}
.scenario-result strong{font-size:12px;color:var(--normal)}
.scenario-result p{font-size:11px;line-height:1.7;color:var(--muted);margin:5px 0}
.scenario-result[data-mode=alert]{border-color:#cc7774}
.scenario-result[data-mode=alert] strong{color:var(--alarm)}
.scenario-result[data-mode=ups]{border-color:#70a7cc}
.scenario-result[data-mode=ups] strong{color:var(--battery)}
.card-scroll>details{border-top:1px solid var(--line);padding:13px 0 7px}
summary{cursor:pointer;list-style:none;font-size:12px;font-weight:600;color:#dbe2e9;padding:3px 0}
summary::after{content:'＋';float:right;color:#a9b5c0}
details[open]>summary::after{content:'−'}
summary>span{font-size:10px;font-weight:400;color:var(--muted);margin-left:7px}
.numeric-row{display:grid;grid-template-columns:1.35fr 1fr;gap:8px}
.numeric-row label{margin-bottom:0}
.numeric-row select,.numeric-row input{display:block;margin-top:6px}
.threshold-note,.feedback,.module-description{font-size:11px;line-height:1.7;color:var(--muted);margin:9px 0}
.experiment-controls .primary{width:100%;font-size:12px}
.alarm-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:12px 0}
.alarm-grid button{text-align:left;padding:10px;background:var(--raised);border:1px solid var(--line);border-radius:4px;color:var(--normal)}
.alarm-grid small,.alarm-grid strong,.alarm-grid span{display:block}
.alarm-grid small{font-size:10px;line-height:1.6;color:#c5ced7}
.alarm-grid strong{font-size:12px;font-weight:500;margin:5px 0}
.alarm-grid span{font-size:10px;color:var(--muted);line-height:1.6}
.alarm-grid button[data-alert=true]{background:#44272b;border-color:#ad6263;color:var(--alarm)}
.repair-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.repair-actions button{font-size:11px;padding:9px 4px;border:1px solid #53616e;border-radius:4px;background:var(--raised);color:#dce4ec}
.repair-actions button:not(:disabled):hover{background:var(--hover);border-color:var(--brand)}
.travel-control{display:flex;gap:8px;align-items:center;margin:10px 0}
progress{width:60%;accent-color:var(--brand)}
.travel-control button,.sound-toggle{font-size:11px;padding:8px;border:1px solid var(--line);border-radius:4px;background:var(--raised);color:#d2dbe4}
.sound-toggle{width:100%;margin-top:9px}
.sound-toggle[aria-pressed=true]{background:var(--selected);color:var(--brand);border-color:#a47831}
.event-details{margin-top:12px}
.event-details summary{font-weight:400;font-size:11px}
#eventList{max-height:150px;overflow:auto;margin:10px 0 0;padding-left:19px;font-size:11px;line-height:1.8;color:var(--muted)}
.spec-row{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:12px 0}
.spec-row strong{display:block;font-size:14px}
.spec-row span{font-size:11px;color:var(--muted)}
.function-grid{font-size:11px;line-height:1.6;display:grid;grid-template-columns:1fr 1fr;gap:7px;color:#c4ced7}
.function-flow{display:flex;flex-wrap:wrap;gap:5px;margin:14px 0}
.flow-item{font-size:10px;background:var(--raised);padding:5px;border-radius:3px}
.source-link{font-size:11px;color:var(--brand);display:block;margin-top:10px}

/* ATK-SP886 / UnionSee SP86-inspired hardware and blue HMI. */
.alarm-display{position:absolute;z-index:12;right:var(--gutter);top:76px;width:min(650px,calc(100vw - 2 * var(--gutter)));bottom:18px;max-height:790px;overflow:auto;padding:0 0 6px;background:transparent;border:0;border-radius:0;color:#182d3b;box-shadow:none;scrollbar-width:thin;scrollbar-color:#71818c transparent}
.alarm-housing{position:relative;min-height:100%;padding:17px 20px 12px;border:1px solid #c4cbd0;border-radius:28px;background:linear-gradient(145deg,#fff 0%,#f3f5f6 70%,#e8ecee 100%);box-shadow:0 20px 46px #101b2460,inset 0 1px 3px #fff;}
.alarm-close{position:absolute;z-index:2;right:11px;top:9px;width:30px;height:30px;border:1px solid #bdc6cc;border-radius:50%;background:#f5f7f8;color:#344b59;font-size:21px;line-height:1;}
.alarm-screen-bezel{padding:10px;border:2px solid #8c969c;border-radius:7px;background:linear-gradient(135deg,#aab2b7,#69767d 45%,#aeb5b8);box-shadow:inset 0 1px 3px #fff,0 2px 5px #26333b50;}
.alarm-hmi-screen{padding:10px;border:2px solid #253c4e;border-radius:15px;background:linear-gradient(145deg,#70b5e8,#4098d7 48%,#287abd);color:#183448;box-shadow:inset 0 2px 10px #d8efff60;}
.alarm-screen-header{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center;min-height:62px;padding:2px 5px 8px;border-bottom:1px solid #124b7666;}
.alarm-hmi-identity{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap;}
.alarm-hmi-identity>strong{font-size:14px;letter-spacing:.2px;color:#102f48;}
.alarm-hmi-identity>span{font-size:11px;color:#143f5c;}
.alarm-hmi-identity img,.alarm-screen-header>img{width:118px;height:auto;object-fit:contain;filter:drop-shadow(0 1px 0 #fff8);}
.alarm-screen-tools{display:flex;gap:5px;margin-left:auto;}
.alarm-screen-tools button,.screen-lock-indicator{min-width:31px;height:30px;border:1px solid #23618c;border-radius:5px;background:linear-gradient(#d8efff,#83bee7);color:#173b56;font-size:16px;box-shadow:0 1px 2px #17426255;}
.alarm-screen-tools button[aria-pressed=true]{background:#f3c76f;color:#472d04;}
.screen-lock-indicator{display:grid;place-items:center;padding:0 6px;background:linear-gradient(#f4ce88,#e4aa49);}
.alarm-screen-title{grid-column:1 / -1;display:grid;grid-template-columns:9px auto auto 1fr;gap:7px;align-items:center;min-height:27px;}
.alarm-screen-title h2{margin:0;font-size:14px;font-weight:700;color:#153b58;}
.alarm-screen-title p{justify-self:end;overflow:hidden;margin:0;font-size:10px;color:#173e5b;text-overflow:ellipsis;white-space:nowrap;}
.screen-demo-mode{display:inline-flex;align-items:center;padding:2px 6px;border:1px solid #3f7190;border-radius:9px;background:#d6edfb;color:#245574;font-size:9px;font-weight:700;white-space:nowrap;}
.screen-live-dot{width:8px;height:8px;border-radius:50%;background:#43d9a0;box-shadow:0 0 8px #d0fff0;}
.screen-live-dot[data-level=alarm]{background:#c93436;box-shadow:0 0 8px #ffb0aa;animation:alarm-screen-pulse 1.05s ease-in-out infinite;}
.screen-live-dot[data-level=warning],.screen-live-dot[data-level=pending]{background:#d99a25;box-shadow:0 0 7px #ffe39b;}
.screen-live-dot[data-level=offline]{background:#6d7880;box-shadow:none;}
@keyframes alarm-screen-pulse{50%{opacity:.58;box-shadow:0 0 12px #ff8c82,0 0 20px #c9343666}}
.alarm-screen-settings{display:grid;gap:7px;padding:7px 9px;border:1px solid #246894;border-radius:5px;background:#d7efff88;font-size:10px;}
.alarm-screen-settings[hidden]{display:none;}
.alarm-comm-settings{display:flex;gap:8px;align-items:center;min-width:0;}
.alarm-screen-settings label{font-weight:700;}
.alarm-screen-settings select{padding:4px;border:1px solid #8ba9bd;border-radius:4px;background:#f4fbff;color:#17394f;font-size:10px;}
#alarmCommStatus{margin-left:auto;font-weight:700;}
.telemetry-editor{min-width:0;border-top:1px solid #4c89b2;padding-top:5px;}
.telemetry-editor summary{cursor:pointer;color:#173e58;font-weight:700;}
.telemetry-editor>p{margin:5px 0;color:#43667d;font-size:9px;}
.telemetry-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-height:190px;overflow:auto;padding:3px;}
.telemetry-fields label{display:grid;gap:2px;min-width:0;color:#355d77;font-size:9px;font-weight:500;}
.telemetry-fields input{width:100%;min-width:0;padding:4px 5px;border:1px solid #7ea4bd;border-radius:4px;background:#f4fbff;color:#173e58;font-size:11px;}
.telemetry-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:5px;color:#315c77;font-size:9px;}
.telemetry-actions button{padding:5px 8px;border:1px solid #39779f;border-radius:4px;background:#e3f3fc;color:#1a4967;font-size:10px;}
.floor-system-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:8px 0;}
.floor-system-list button{position:relative;min-width:0;min-height:43px;padding:6px 23px 5px 8px;text-align:left;border:1px solid #40779b;border-radius:6px;background:linear-gradient(#d4edff,#b7ddf7);color:#244963;box-shadow:0 1px 2px #153d5d38;}
.floor-system-list button:hover{filter:brightness(1.04);}
.floor-system-list button.selected,.floor-system-list button[aria-selected=true]{border-color:#155782;background:linear-gradient(#e7f6ff,#9fd0f2);box-shadow:inset 0 0 0 1px #fff9,0 2px 3px #1c4a6a44;}
.floor-system-list button[data-level=alarm]{border-color:#a42f30;background:linear-gradient(#ffe1dc,#f5a39b);color:#612122;}
.floor-system-list button[data-level=warning],.floor-system-list button[data-level=pending]{border-color:#a87921;background:linear-gradient(#fff2cb,#f1cf79);color:#563e10;}
.floor-system-list button[data-level=offline]{border-color:#64717b;background:linear-gradient(#e5e9ec,#bdc7cd);color:#37454e;}
.floor-system-list strong{display:block;font-size:13px;font-weight:700;}
.floor-system-list small{display:block;overflow:hidden;margin-top:2px;font-size:10px;text-overflow:ellipsis;white-space:nowrap;}
.floor-system-list button>span{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:9px;font-weight:700;writing-mode:vertical-rl;}
.alarm-hmi-grid{display:grid;grid-template-columns:1.03fr 1.1fr .9fr;grid-template-rows:minmax(145px,1fr) minmax(145px,1fr) minmax(102px,.72fr);grid-template-areas:"history it rms" "history ups rms" "history bms rms";gap:7px;min-height:450px;}
.alarm-screen-panel{min-width:0;overflow:hidden;border:1px solid #235d88;border-radius:9px;background:linear-gradient(145deg,#91c8efcc,#61a9e0bb);box-shadow:inset 0 1px 0 #e8f7ffb3,0 1px 2px #1b4c6c33;}
.alarm-screen-panel>header{display:flex;justify-content:space-between;align-items:center;gap:5px;min-height:30px;padding:6px 8px;border-bottom:1px solid #28628a88;background:#d7efff8c;color:#173d58;font-size:12px;}
.alarm-screen-panel>header strong{font-size:12px;}
.alarm-screen-panel>header span{color:#174466;font-size:10px;}
.alarm-history-panel{grid-area:history;display:flex;flex-direction:column;}
.alarm-history-list{display:grid;gap:3px;overflow:auto;flex:1;padding:5px;scrollbar-width:thin;}
.alarm-history-entry{display:grid;grid-template-columns:1fr;gap:1px;padding:4px 5px;border:1px solid #5c91b3;border-radius:4px;background:#d3ebf9a6;color:#203e52;font-size:9px;line-height:1.35;}
.alarm-history-entry time{color:#526b7d;font-size:8px;}
.alarm-history-entry span{overflow-wrap:anywhere;}
.alarm-history-panel>footer{display:flex;justify-content:space-between;gap:4px;padding:5px;border-top:1px solid #28628a66;color:#355b73;font-size:8px;}
.medical-it-panel{grid-area:it;}
.ups-panel{grid-area:ups;}
.bms-panel{grid-area:bms;}
.rms-panel{grid-area:rms;display:flex;flex-direction:column;}
.screen-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:7px;}
.screen-metric{min-width:0;padding:5px;border:1px solid #5287a8;border-radius:5px;background:#d8efff9c;text-align:center;}
.screen-metric span{display:block;color:#48677d;font-size:10px;}
.screen-metric strong{display:block;margin-top:2px;color:#183e58;font-size:15px;}
.screen-metric strong small{font-size:10px;font-weight:500;}
.screen-readout{display:flex;justify-content:space-between;gap:6px;margin:5px 7px;padding:5px 7px;border:1px solid #5488a8;border-radius:4px;background:#d5edfc99;font-size:10px;}
.screen-readout span{color:#4a677b;}
.screen-readout strong{color:#173e5b;font-size:11px;white-space:nowrap;}
.rms-meter{display:flex;justify-content:space-between;align-items:center;gap:3px;margin:7px 6px 4px;padding:6px;border:1px solid #35739c;border-radius:6px;background:#d7efffba;color:#163c56;font-size:10px;flex-wrap:wrap;}
.rms-meter>strong{font-size:12px;}
.rms-meter>span{font-weight:700;}
.rms-meter small{width:100%;text-align:center;font-size:9px;}
.rms-meter b{font-size:12px;}
.rms-channel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:0 6px 5px;}
.rms-channel-grid>span{display:flex;justify-content:space-between;gap:3px;min-width:0;padding:3px 4px;border:1px solid #5287a8;border-radius:4px;background:#d7efff9c;color:#315a73;font-size:9px;}
.rms-channel-grid b{color:#173e58;font-size:10px;}
.alarm-device-list{display:grid;align-content:start;gap:4px;overflow:auto;flex:1;min-height:40px;padding:0 6px 5px;scrollbar-width:thin;}
.alarm-device-list:empty::after{content:"当前系统无故障定位";padding:13px 3px;text-align:center;color:#365d76;font-size:9px;}
.alarm-device-list button{width:100%;min-width:0;padding:5px;text-align:left;border:1px solid #467b9d;border-radius:5px;background:linear-gradient(#e0f2fc,#b5dbf2);color:#193f59;box-shadow:0 1px 2px #18486733;}
.alarm-device-list button:hover{outline:1px solid #114d76;}
.alarm-device-list button[data-level=alarm]{border-color:#a63336;background:linear-gradient(#ffe3dc,#f3aaa0);color:#642528;}
.alarm-device-list button[data-level=warning],.alarm-device-list button[data-level=pending]{border-color:#a87921;background:linear-gradient(#fff1c8,#f0ce79);color:#594314;}
.alarm-device-list strong,.alarm-device-list small,.alarm-device-list span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.alarm-device-list strong{font-size:11px;}
.alarm-device-list small{margin-top:2px;color:#536d7e;font-size:9px;}
.alarm-device-list span{margin-top:2px;font-size:10px;font-weight:600;}
.rms-pagination{display:flex;justify-content:center;align-items:center;gap:9px;padding:4px 6px 2px;color:#244d67;font-size:9px;}
.rms-pagination button{width:23px;height:20px;border:1px solid #4b81a1;border-radius:4px;background:#d7efff;color:#254c65;}
.rms-pagination button:disabled{opacity:.45;}
.screen-bms-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:7px 8px;font-size:10px;color:#4d6b7e;}
.screen-bms-grid span{display:flex;justify-content:space-between;gap:3px;}
.screen-bms-grid b{color:#173e58;font-size:11px;font-weight:700;}
.screen-bms-footer{display:flex;justify-content:space-around;gap:4px;padding:4px;border-top:1px solid #28628a55;color:#315b74;font-size:8px;}
.alarm-housing-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 13px 2px;color:#394b56;}
.alarm-housing-footer>span{display:flex;align-items:baseline;gap:8px;}
.alarm-housing-footer strong{font-size:15px;letter-spacing:.5px;}
.alarm-housing-footer em{color:#566b77;font-size:10px;font-style:normal;}
.alarm-housing-footer img{width:142px;height:auto;object-fit:contain;}
.alarm-modules-button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin-top:13px;padding:10px 12px;border:1px solid #997131;border-radius:4px;background:var(--selected);color:#ffdd9e;font-size:11px;text-align:left}
.alarm-modules-button:hover{background:#4b3c25}
.alarm-modules-button span{font-size:15px}

.scene-labels{position:absolute;inset:0;pointer-events:none}
.scene-label{position:absolute;left:0;top:0;transform:translate(-50%,-50%);transition:background .18s,color .18s,border-color .18s;pointer-events:auto;border:1px solid #687580;border-radius:4px;padding:5px 9px;background:var(--surface);color:#eef2f5;font-size:11px;box-shadow:0 2px 7px #00000026;white-space:nowrap;-webkit-user-select:none;user-select:none}
.scene-label:hover{background:var(--hover);border-color:var(--brand)}
.scene-label[data-type=product-cabinet]{background:#292722;color:#ffe0a7;border-color:#a97c35}
.scene-fallback{position:absolute;inset:20% 20%;z-index:10;border-radius:7px;background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px}
.scene-fallback>span{letter-spacing:5px;color:var(--brand);margin-bottom:20px}
.scene-fallback strong{font-size:22px}
.scene-fallback p{font-size:12px;color:var(--muted);max-width:450px}
.scene-fallback button{margin-top:20px;padding:12px 20px;border-radius:4px;background:var(--brand);color:var(--brand-ink)}

/* Desktop and laptop widths retain the same interaction. */
@media(max-width:1320px){
  :root{--gutter:20px;--nav-width:136px;--panel-width:306px}
  .topbar-caption{display:none}
  .topbar{gap:16px}
  .scene-header{left:176px;top:90px;width:min(360px,calc(100vw - 536px))}
  .step-rail{top:90px}
  .step-rail button{padding:10px;gap:8px}
  .card-heading{padding:16px 16px 12px}
  .card-heading h2{font-size:19px}
  .card-scroll{padding:12px 14px}
  .topbar-actions button{padding:9px 10px}
  .scene-bottom{bottom:20px}
  .view-actions button{padding:9px 10px}
  .alarm-display{width:min(610px,calc(100vw - 2 * var(--gutter)))}
}
@media(max-width:1000px){
  :root{--gutter:14px;--nav-width:112px;--panel-width:284px}
  .topbar-actions #tourProgress,.topbar-caption,.brand small{display:none}
  .brand-logo{width:132px}
  .topbar-actions{gap:4px}
  .scene-header{left:144px;top:88px;width:min(314px,calc(100vw - 464px));padding:12px 14px}
  .scene-header h1{font-size:21px}
  .scene-header p{font-size:11px}
  .step-rail{top:88px}
  .step-rail button{gap:6px;padding:9px 7px;min-height:56px}
  .step-rail button>span{font-size:12px}
  .step-rail small{font-size:9px}
  .floor-switcher button{padding:7px}
  .equipment-panel{top:120px}
  .selection-bar{top:80px}
  .alarm-display{top:80px;width:min(500px,calc(100vw - 2 * var(--gutter)))}
  .alarm-housing{padding:13px 12px 10px;border-radius:20px}
  .alarm-screen-bezel{padding:7px}
  .alarm-hmi-screen{padding:7px}
  .alarm-hmi-grid{grid-template-columns:1fr 1fr .88fr;gap:5px;min-height:360px}
  .scene-hint{display:none}
  .view-actions button{font-size:11px;padding:9px}
}
@media(max-height:740px){
  .step-rail{gap:4px}
  .step-rail button{min-height:50px;padding-block:8px}
  .card-heading{padding-block:12px}
  .equipment-panel,.alarm-display{bottom:14px}
  .alarm-hmi-grid{min-height:330px;grid-template-rows:minmax(115px,1fr) minmax(110px,1fr) minmax(78px,.72fr)}
  .scene-header{padding-block:11px}
  .scene-header h1{font-size:22px;margin:5px 0}
  .scene-header .launch{margin-top:9px;padding-block:8px}
  .scene-bottom,.floor-dock{bottom:14px}
  .scene-hint{display:none}
  .power-status{padding-block:6px}
}
@media(max-width:640px){
  .alarm-display{left:8px;right:8px;top:70px;bottom:8px;width:auto;max-height:none;overflow-x:hidden;overflow-y:auto;padding-bottom:0}
  .alarm-housing{min-height:0;padding:10px 9px 9px;border-radius:18px}
  .alarm-close{right:7px;top:7px;width:28px;height:28px}
  .alarm-screen-bezel{padding:5px;border-width:1px}
  .alarm-hmi-screen{padding:8px;border-radius:10px}
  .alarm-screen-header{grid-template-columns:minmax(0,1fr);gap:6px;min-height:0;padding:2px 3px 7px}
  .alarm-screen-header>img{display:none}
  .alarm-hmi-identity{gap:6px;padding-right:27px}
  .alarm-hmi-identity>strong{font-size:13px}
  .alarm-hmi-identity>span{font-size:10px}
  .alarm-screen-tools{gap:3px;margin-left:auto}
  .alarm-screen-tools button,.screen-lock-indicator{min-width:26px;height:26px;font-size:13px}
  .alarm-screen-title{grid-template-columns:9px auto auto;gap:5px;min-height:0;padding-top:2px}
  .alarm-screen-title h2{font-size:12px}
  .alarm-screen-title p{grid-column:1 / -1;justify-self:start;max-width:100%;white-space:normal;font-size:9px;line-height:1.35}
  .screen-demo-mode{font-size:8px}
  .floor-system-list{gap:5px;margin:7px 0}
  .floor-system-list button{min-height:52px;padding:6px 21px 5px 7px}
  .floor-system-list strong{font-size:12px}
  .floor-system-list small{font-size:9px}
  .alarm-hmi-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"history" "it" "ups" "rms" "bms";gap:6px;min-height:0}
  .alarm-history-panel{min-height:156px}
  .medical-it-panel{min-height:142px}
  .ups-panel{min-height:188px}
  .rms-panel{min-height:248px}
  .bms-panel{min-height:120px}
  .screen-metric-grid{gap:6px;padding:8px}
  .screen-metric{padding:7px}
  .screen-metric span{font-size:10px}
  .screen-metric strong{font-size:15px}
  .screen-readout{font-size:10px}
  .screen-readout strong{font-size:11px}
  .alarm-device-list{max-height:300px}
  .alarm-housing-footer{padding:8px 5px 0}
  .alarm-housing-footer strong{font-size:12px}
  .alarm-housing-footer em{font-size:9px}
  .alarm-housing-footer img{width:112px}
  .telemetry-fields{grid-template-columns:repeat(2,minmax(0,1fr));max-height:260px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.screen-live-dot[data-level=alarm]{animation:none}}
