/* Controller shell. Existing desktop geometry and all hidden states remain authoritative. */
:root{--accent:#3774f6;--line:#e9edf3;--muted:#8792a5;color:#28364d;background:#f6f8fc;font-family:"Segoe UI","Microsoft YaHei",sans-serif}
body{display:grid;grid-template-columns:196px minmax(0,1fr);grid-template-rows:auto auto auto auto minmax(0,1fr);padding-left:0;height:100dvh;overflow:hidden}
button{border-color:var(--line);border-radius:9px;color:#42506a;background:#fff;transition:background .15s,border-color .15s;min-height:38px}
button:hover:not(:disabled){color:var(--accent);background:#f1f5ff;border-color:#b7c9ff}
button.primary,.primary-link{background:var(--accent);border-color:var(--accent);color:#fff;border-radius:9px;padding:10px 22px;text-decoration:none;font-weight:600}
button.primary:hover:not(:disabled),.primary-link:hover{background:#2854ca;border-color:#2854ca;color:#fff}
button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #a5baff;outline-offset:3px}
.app-rail{grid-column:1;grid-row:1/-1;background:#fff;border-right:1px solid var(--line);padding:30px 15px 20px;display:flex;flex-direction:column;min-height:0}
.brand{min-width:0;gap:9px;padding:0 8px 34px}.brand img{width:35px;height:35px}.brand b{font-size:22px;color:#202e46}.brand small{display:none}
.app-nav{display:flex;flex-direction:column;gap:9px;width:100%}.nav-item{display:flex;align-items:center;gap:13px;width:100%;text-align:left;border:0;background:transparent;padding:13px 16px;min-height:48px;font-size:14px}.nav-item[aria-current=page]{background:#edf2ff;color:var(--accent);font-weight:600}.nav-icon{font-size:22px;width:24px;text-align:center;font-weight:400}
.rail-footer{margin-top:auto;padding:20px 9px 0;font-size:12px;color:#78869c;line-height:2;white-space:nowrap}.rail-footer small{display:block;font-size:10px;color:#9ba5b5}.rail-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#6b88d1;margin-right:7px}
.page-heading{grid-column:2;padding:30px 32px 16px;position:relative}.eyebrow{font-size:11px;letter-spacing:2px;color:#8a97ab;margin-bottom:7px}.page-heading h1{font-size:25px;line-height:1.35;font-weight:650;margin:0;color:#25334e}.page-heading p{font-size:13px;color:#7f8ba0;margin:7px 0 0}
.account{grid-column:2;grid-row:1;position:absolute;right:32px;top:31px;padding:0;background:transparent;border:0;z-index:4;max-width:65%;justify-content:flex-end}.account.authenticated #status{font-size:12px;color:#7b899d}.account #logout{border:0;background:transparent;color:#8490a3;min-height:28px;padding:4px 7px;font-size:12px;order:2}#login{padding:12px;background:#fff;border:1px solid var(--line);border-radius:12px}#login input{width:120px}
.channel-shelf{grid-column:2;display:flex;align-items:center;gap:20px;margin:0 32px 18px;min-height:48px}.channel-caption{font-size:12px;color:#8a95a8;white-space:nowrap}.channel-shelf [role=tablist]{display:flex;gap:8px;min-width:0;flex-wrap:wrap}.channel-shelf button{background:#eef1f7;border-color:transparent;font-size:12px;color:#8390a5;padding:8px 15px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.channel-shelf button[aria-selected=true]{background:#e7edff;color:var(--accent);border-color:#cedbff}
.topbar{grid-column:2;position:static;margin:0 32px 16px;padding:15px 20px;border:1px solid var(--line);border-radius:12px;gap:18px;z-index:2;box-shadow:0 3px 12px #263b6703;background:#fff}.target{min-width:0}.target strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar nav{width:auto;flex-shrink:0;gap:8px}.badge{border-radius:20px;padding:5px 10px;flex-shrink:0;font-size:11px}.badge.ready{background:#e9f7f0;color:#36946a}.badge.offline{background:#f0f2f6;color:#929bad}
.connection-guide{grid-column:2;margin:0 32px 12px;padding:10px 16px;border:1px solid #dce6ff;border-radius:10px;background:#edf3ff;font-size:12px;gap:9px}.connection-guide strong{font-size:12px}.connection-guide span{min-width:100px}.connection-guide[data-state=offline],.connection-guide[data-state=waiting]{background:#fff8ed;border-color:#f0dfc1}
.layout,.layout.hide-side{grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;padding:0 32px 24px;min-height:0;overflow:hidden}.layout.hide-side{grid-template-columns:minmax(0,1fr)}
.stations{padding:22px;border:1px solid var(--line);border-radius:15px;overflow:auto;background:#fff;grid-column:1/-1}.section-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}.section-title h2{font-size:16px;color:#33425d;font-weight:600}.section-title>span:first-of-type{display:none}.device-summary{color:#97a0b0;font-size:12px}.device-search{margin-left:auto;width:245px;max-width:100%;background:#f7f9fc!important;border-color:#ecf0f5!important;border-radius:8px!important;font-size:12px;padding:10px 12px!important}
#devices{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.device{position:relative;min-height:158px;display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:1fr 1fr;column-gap:13px;align-content:center;padding:28px 18px 32px;border:1px solid var(--line);border-radius:13px;box-shadow:none;transition:box-shadow .15s,background .15s}.device:hover:not(:disabled){background:#fafbff;box-shadow:0 5px 16px #3151a00b}.device.selected{background:#f7f9ff;border-color:#9fb9ff;box-shadow:0 0 0 1px #e9efff}.device-icon{grid-column:1;grid-row:1/3;width:44px;height:44px;border:1px solid #e4eafd;border-radius:12px;background:#f0f4ff;color:#6e8dd5;display:flex;align-items:center;justify-content:center;font-size:25px;align-self:center}.device strong{grid-column:2;grid-row:1;align-self:end;font-size:14px;color:#374660;font-weight:600;overflow-wrap:anywhere}.device small{grid-column:2;grid-row:2;margin-top:7px;font-size:11px;color:#a1aaba}.device small:before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#bdc5d2;margin:0 6px 2px 0}.device small.ready{color:#469776}.device small.ready:before{background:#48b489}.station-number{position:absolute;bottom:12px;right:15px;color:#a7afbd;font-size:10px}.search-empty{padding:60px 20px;text-align:center;color:#8a97ac}
.workspace,.sidepanel{border:1px solid var(--line);border-radius:12px;min-height:0}.workspace{grid-column:1;grid-row:1;overflow:auto}.sidepanel{grid-column:2;grid-row:1;background:#fff;overflow:auto}.channelbar{padding:10px 12px;gap:10px;justify-content:flex-start;border-color:var(--line)}.desktop-toolbar{display:flex;gap:6px;flex-wrap:wrap}.channelbar button,.more-tools summary{font-size:12px;min-height:32px;padding:6px 10px}.channelbar label{font-size:12px;color:#6a7991;white-space:nowrap}.channelbar #side-toggle{margin-left:auto}.more-tools{position:relative}.more-tools summary{cursor:pointer;list-style:none;border:1px solid var(--line);border-radius:8px;color:#6a7991}.more-tools summary::-webkit-details-marker{display:none}.more-tools[open]>summary{color:var(--accent);background:#edf2ff}.more-tools .safety-tools{position:absolute;right:0;top:40px;z-index:10;min-width:185px;padding:8px;display:flex;flex-direction:column;align-items:stretch;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px #1d335422}.more-tools .safety-tools button{margin:0;text-align:left;border:0;background:white}.more-tools .safety-tools button:hover{background:#f1f5ff}
#screen{background:#eaf0f6;min-height:220px;flex:1 0 220px}#empty{font-size:13px;line-height:1.9;max-width:640px;color:#8a97ab}#notice{font-size:12px;border-color:var(--line);background:#fafbfd;color:#7d8aa0;padding:10px 15px}#console-panel,#clipboard-panel{background:#fff;border-color:var(--line);flex-shrink:0}#console-panel small{font-size:11px}.tool-tabs{display:flex;gap:4px;position:sticky;top:0;background:#fff;z-index:2;padding:12px;border-bottom:1px solid var(--line)}.tool-tabs button{flex:1;border:0;font-size:12px;min-height:32px}.tool-tabs [aria-pressed=true]{color:var(--accent);background:#edf2ff}.sidepanel>section{padding:18px;border-bottom:0}.sidepanel h2{font-size:14px}.sidepanel input,.sidepanel select{max-width:100%}
.standalone-page{grid-column:1/-1;background:#fff;border:1px solid var(--line);border-radius:15px;padding:70px 32px;text-align:center;overflow:auto}.feature-symbol{display:inline-flex;align-items:center;justify-content:center;background:#f0f4ff;color:#7392e6;font-size:44px;border-radius:24px;width:88px;height:88px;margin-bottom:24px}.standalone-page h2{font-size:20px;font-weight:600;color:#34435e}.standalone-page p{font-size:13px;line-height:1.9;color:#8b97aa;max-width:480px;margin:15px auto 32px}.primary-link{display:inline-block;min-height:40px;font-size:13px}.settings-page{padding:6px 28px;text-align:left}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:22px;border-bottom:1px solid #eef1f6;padding:27px 0}.setting-row:last-child{border-bottom:0}.setting-row h2{font-size:14px;margin:0}.setting-row p{margin:6px 0 0;font-size:12px;max-width:540px}.setting-value{color:#6d83b3;font-size:12px;white-space:nowrap}.setting-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.setting-actions button{font-size:12px}.about-logo{width:36px;height:36px;object-fit:contain}
body[data-page=devices] .layout{grid-template-columns:minmax(0,1fr)}
.page-heading{grid-row:1}.channel-shelf{grid-row:2}.topbar{grid-row:3}.connection-guide{grid-row:4}.layout{grid-row:5}.layout>.stations{display:block}
body[data-page=assistance] .layout,body[data-page=settings] .layout{grid-template-columns:minmax(0,1fr)}
/* Make the desktop the focus without losing its explicit control/stop tools. */
:fullscreen body{display:flex;padding:0;height:100dvh}:fullscreen .app-rail,:fullscreen .page-heading,:fullscreen .channel-shelf,:fullscreen .account{display:none!important}:fullscreen .topbar{margin:5px;padding:7px 12px}:fullscreen .layout,:fullscreen .layout.hide-side{display:flex;padding:0 5px 5px;flex:1;min-height:0}:fullscreen .workspace{width:100%;flex:1}:fullscreen #screen{min-height:0;flex:1}:fullscreen .channelbar{padding:5px 8px}
@media(min-width:1600px){#devices{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.device{min-height:178px;padding-left:25px}.stations{padding:28px}}
@media(max-width:1200px){body{grid-template-columns:168px minmax(0,1fr)}.app-rail{padding-left:10px;padding-right:10px}.page-heading{padding:24px 22px 16px}.topbar{margin:0 22px 14px;flex-wrap:nowrap}.channel-shelf{margin:0 22px 14px}.connection-guide{margin:0 22px 10px}.layout,.layout.hide-side{padding:0 22px 20px}.layout{grid-template-columns:minmax(0,1fr) 290px}.account{right:22px;top:26px}.device{grid-template-columns:36px minmax(0,1fr);padding:23px 12px 28px;column-gap:9px;min-height:146px}.device-icon{width:34px;height:36px;font-size:21px}.device strong{font-size:13px}.target{flex-wrap:wrap;gap:6px}.rail-footer{font-size:11px}.section-title{gap:9px}}
@media(max-width:1000px){#devices{grid-template-columns:repeat(2,minmax(0,1fr))}.layout{grid-template-columns:minmax(0,1fr)}.sidepanel{grid-column:1;grid-row:2;max-height:420px}.layout:not(.hide-side){overflow:auto;grid-template-rows:minmax(380px,1fr) auto}.setting-row{align-items:flex-start;flex-wrap:wrap}.setting-actions{justify-content:flex-start}.account #status{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
@media(max-width:650px){body{height:100dvh;min-height:0;grid-template-columns:68px minmax(0,1fr)}.app-rail{padding:20px 7px 12px}.brand{padding:0 9px 24px;gap:0}.brand img{width:32px;height:32px}.brand>div,.rail-footer{display:none}.nav-item{font-size:0;justify-content:center;padding:12px 6px}.nav-icon{font-size:23px}.page-heading{padding:21px 15px 12px}.eyebrow{font-size:9px}.page-heading h1{font-size:22px}.page-heading p{font-size:11px}.account{position:static;grid-row:auto;padding:0 15px 10px;max-width:none;justify-content:flex-start}.account #status{font-size:10px!important;max-width:145px}.channel-shelf{margin:0 15px 12px;gap:6px;align-items:flex-start;flex-direction:column}.channel-shelf [role=tablist]{gap:4px;width:100%}.channel-shelf button{font-size:10px;padding:7px;min-height:30px}.topbar{margin:0 15px 12px;padding:12px;flex-wrap:wrap;gap:10px}.target strong{font-size:12px}.topbar nav{width:100%}.topbar nav button{flex:1}.layout,.layout.hide-side{padding:0 15px 15px}.stations{padding:14px;border-radius:12px}#devices{grid-template-columns:minmax(0,1fr);gap:10px}.device{min-height:115px;padding:17px 15px 28px}.section-title{margin-bottom:14px}.section-title h2{font-size:14px}.device-search{width:100%;margin-left:0}.device-summary{font-size:10px}.connection-guide{margin:0 15px 10px;padding:10px;font-size:11px}.channelbar{gap:7px}.channelbar #side-toggle{margin-left:0}.channelbar label{font-size:11px}.settings-page{padding:0 18px}.standalone-page{padding:35px 18px}.settings-page{padding-top:0}.setting-row{padding:22px 0;gap:14px}.setting-value{font-size:11px}.standalone-page h2{font-size:17px}#login{flex-wrap:wrap}#login label{font-size:12px}#login input{width:110px}.more-tools .safety-tools{right:auto;left:0}}
@media(max-width:650px){body{grid-template-rows:auto auto auto auto auto minmax(0,1fr)}.page-heading{grid-row:1}.account{grid-row:2}.channel-shelf{grid-row:3}.topbar{grid-row:4}.connection-guide{grid-row:5}.layout{grid-row:6}.layout>.stations{display:block}}
@media(max-width:650px){.layout.focus-view>.stations{display:block}}
:fullscreen .channel-shelf{display:flex!important;margin:0;padding:4px 12px;min-height:36px;background:#fff}:fullscreen .channel-shelf button{min-height:28px;padding:5px 10px}:fullscreen .channel-caption{font-size:11px}

/* Second visual pass: one icon family, clearer channel hierarchy, quieter surfaces. */
button { transition:background .16s,border-color .16s,box-shadow .16s; }
.app-rail { padding:32px 14px 20px; background:#fff; }
.brand { padding:0 12px 37px; gap:10px; }
.brand b { font-size:21px; letter-spacing:1px; font-weight:650; }
.brand img { width:34px; height:34px; }
.app-nav { gap:8px; }
.nav-item { min-height:48px; border-radius:10px; padding:13px 17px; font-size:13px; color:#758198; }
.nav-item[aria-current=page] { background:#edf3ff; color:var(--accent); }
.nav-icon { display:flex; width:21px; height:21px; flex-shrink:0; }
.nav-icon svg { width:21px; height:21px; }
.nav-item:hover:not(:disabled) { background:#f5f7fb; color:#45628d; }
.nav-item[aria-current=page]:hover { color:var(--accent); background:#eaf1ff; }
.page-heading { padding:32px 34px 20px; }
.eyebrow { font-size:10px; letter-spacing:2px; color:#a0a9b9; margin-bottom:8px; }
.page-heading h1 { font-size:25px; font-weight:650; letter-spacing:.3px; }
.page-heading p { color:#939daf; font-size:12px; margin-top:8px; }
.account.authenticated { top:38px; gap:10px; }
.account.authenticated #status { color:#8692a5; font-size:11px; }
.account.authenticated #status:before { content:""; display:inline-block; width:6px; height:6px; margin:0 7px 1px 0; border-radius:50%; background:#4eb68f; }
.account #logout { font-size:11px; border-left:1px solid #e9edf3; border-radius:0; padding-left:12px; }
.channel-shelf { gap:15px; margin:0 34px 16px; min-height:48px; }
.channel-caption { font-size:11px; color:#9aa4b5; }
.channel-shelf [role=tablist] { gap:8px; }
.channel-shelf button { min-height:40px; min-width:122px; padding:7px 14px 7px 8px; display:flex; align-items:center; gap:9px; background:#fff; color:#9aa6b8; border:1px solid #e9edf4; border-radius:9px; font-size:11px; }
.channel-shelf button:before { content:"A"; display:inline-flex; justify-content:center; align-items:center; width:25px; height:25px; flex-shrink:0; border-radius:6px; background:#f0f3f9; color:#94a2b7; font-size:11px; font-weight:650; }
.channel-shelf button[data-channel="1"]:before { content:"B"; }
.channel-shelf button[data-channel="2"]:before { content:"C"; }
.channel-shelf button[data-bound=true] { color:#647c9e; }
.channel-shelf button[aria-selected=true] { background:#f2f6ff; border-color:#c7d9ff; color:var(--accent); }
.channel-shelf button[aria-selected=true]:before { background:#deeaff; color:var(--accent); }
.topbar { margin:0 34px 18px; padding:14px 20px; border-radius:12px; border-color:#eaf0f7; box-shadow:0 3px 14px #263b6702; }
.topbar .target:before { content:"当前工位"; font-size:10px; color:#9aa5b6; padding-right:3px; white-space:nowrap; }
.target strong { color:#35465e; font-size:13px; font-weight:600; }
.topbar .primary { min-width:92px; box-shadow:0 3px 8px #3774f61a; font-size:12px; }
.topbar #disconnect { font-size:12px; border-color:#edf0f5; color:#8592a7; }
.badge { font-size:10px; padding:4px 9px; }
.layout,.layout.hide-side { padding:0 34px 26px; }
.stations { padding:23px; border-color:#eaf0f6; border-radius:15px; box-shadow:0 4px 20px #243a6302; }
.section-title { gap:13px; margin-bottom:23px; }
.section-title h2 { font-size:14px; font-weight:600; }
.device-summary { color:#9ba5b5; font-size:11px; }
.device-searchbox { margin-left:auto; display:flex; align-items:center; gap:8px; padding:0 11px; border:1px solid #edf0f6; border-radius:8px; background:#f8fafd; width:240px; max-width:100%; }
.device-searchbox>span { width:15px; height:15px; color:#abb6c7; flex-shrink:0; }
.device-searchbox svg { width:15px; height:15px; }
.device-searchbox:focus-within { border-color:#a9c5ff; box-shadow:0 0 0 3px #3774f60a; }
.device-search { margin:0; width:100%; padding:10px 0!important; border:0!important; border-radius:0!important; background:transparent!important; font-size:11px; }
.device-search:focus-visible { outline:0; }
.device-search::placeholder { color:#aab3c1; }
#devices { gap:16px; }
.device { min-height:156px; padding:29px 22px 36px; grid-template-columns:50px minmax(0,1fr); gap:0 14px; border-radius:12px; border-color:#e9eef5; background:#fff; }
.device:hover:not(:disabled) { background:#fcfdff; border-color:#c6d8fb; box-shadow:0 5px 14px #2f5ba00a; }
.device.selected { background:#f8faff; border-color:#a8c5ff; box-shadow:0 0 0 1px #edf3ff; }
.device.selected:after { content:"✓"; position:absolute; right:13px; top:12px; width:16px; height:16px; border-radius:50%; color:white; background:#6995f3; display:flex; align-items:center; justify-content:center; font-size:10px; }
.device-icon { border:0; width:49px; height:49px; background:#edf4ff; border-radius:13px; color:#76a0e4; }
.device-icon svg { width:29px; height:29px; }
.device[data-online=false] .device-icon { background:#f3f5f9; color:#b3bece; }
.device strong { font-size:13px; font-weight:600; color:#43526a; }
.device small { color:#a6afbd; margin-top:7px; font-size:10px; }
.device small.ready { color:#6b9f8c; }
.device small:before { width:4px; height:4px; margin-right:5px; }
.device-caption { position:absolute; left:22px; bottom:13px; font-size:10px; color:#8eaae0; }
.station-number { bottom:13px; right:17px; color:#b3bdcb; font-size:10px; }
.connection-guide { border-radius:9px; border-color:#e1eafb; background:#f0f5ff; margin:0 34px 12px; padding:10px 14px; font-size:11px; }
.connection-guide strong { font-size:11px; color:#5372a5; }
#connection-help { color:#8395b0; }
.channelbar { padding:9px 11px; background:#fff; border-color:#edf1f7; }
.channelbar button,.more-tools summary { font-size:11px; border-color:#edf0f6; }
.channelbar label { color:#94a0b2; font-size:11px; }
#screen { background:#f0f3f8; }
#notice { background:#fbfcfe; color:#8a99b0; font-size:11px; }
#empty { font-size:12px; line-height:1.9; color:#98a4b6; }
.tool-tabs { padding:9px; }
.tool-tabs button { font-size:11px; }
.settings-page { padding:4px 28px; }
.standalone-page { border-color:#eaf0f6; }
.standalone-page h2 { font-size:19px; }
.standalone-page p { color:#96a1b3; font-size:12px; }
.feature-symbol { border-radius:22px; width:82px; height:82px; }
.feature-symbol svg { width:34px; height:34px; }
.setting-row h2 { font-size:13px; }.setting-row p { font-size:11px; margin-bottom:0; }
.setting-value { font-size:11px; color:#8ba0c4; }
.connection-source { font-size:11px; max-width:480px; color:#90a0b8; line-height:1.9; }
.connection-source summary { cursor:pointer; color:#6489ca; }
.connection-source>section { margin-top:12px; padding:12px; border:1px solid var(--line); border-radius:8px; background:#fafcff; overflow-wrap:anywhere; }
#machine-session-guide { position:fixed; top:8px; left:50%; transform:translateX(-50%); z-index:30; border:1px solid #dbe7ff; border-radius:8px; background:#f2f6ff; box-shadow:0 4px 15px #263b6712; font-size:12px; }
#dashboard,#management,#audit-panel { padding:20px; margin:12px; border:1px solid #e5ebf5; border-radius:10px; background:#fafcff; font-size:12px; }
#audit-panel label { display:block; margin:10px 0; }#audit-panel pre { white-space:pre-wrap; overflow-wrap:anywhere; }
dialog { border:1px solid #e8d4b9; border-top:3px solid #ddad67; border-radius:13px; box-shadow:0 24px 90px #1c2d4533; padding:24px; color:#4f5c70; font-size:13px; line-height:1.8; }
dialog h2 { color:#5c4f3d; font-size:16px; }dialog::backdrop { background:#19294366; }
dialog button { font-size:12px; border-color:#e5e9f0; }
@media(max-width:1200px) {
 .app-rail { padding:28px 10px 18px; }.brand { padding:0 7px 32px; }.nav-item { padding:13px 12px; }
 .page-heading { padding:25px 22px 17px; }.channel-shelf { margin:0 22px 14px; }.topbar { margin:0 22px 15px; }.layout,.layout.hide-side { padding:0 22px 20px; }
 .connection-guide { margin:0 22px 10px; }.device { padding:25px 15px 34px; grid-template-columns:40px minmax(0,1fr); gap:0 11px; min-height:148px; }
 .device-icon { width:39px; height:42px; }.device-icon svg { width:25px; height:25px; }.device strong { font-size:12px; }.device-caption { left:15px; }.device-searchbox { width:220px; }.account.authenticated { top:30px; }
}
@media(max-width:1000px) { .channel-shelf button { min-width:100px; }.topbar .target:before { display:none; } }
@media(max-width:650px) {
 .app-rail { padding:23px 7px 14px; }.brand { padding:0 9px 28px; }.nav-item { font-size:0; padding:13px 6px; }.nav-icon,.nav-icon svg { width:21px; height:21px; }
 .page-heading { padding:23px 15px 12px; }.page-heading h1 { font-size:22px; }.page-heading p { font-size:11px; }
 .account.authenticated { top:auto; padding:0 15px 12px; }.account.authenticated #status { font-size:10px; }.account #logout { font-size:10px; }
 .channel-shelf { margin:0 15px 13px; gap:8px; }.channel-shelf [role=tablist] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; gap:5px; }
 .channel-shelf button { min-width:0; min-height:36px; padding:5px; gap:5px; font-size:9px; }.channel-shelf button:before { width:20px; height:22px; border-radius:5px; font-size:10px; }
 .topbar { margin:0 15px 13px; padding:12px; }.topbar nav button { min-width:0; }.topbar .target:before { display:none; }.layout,.layout.hide-side { padding:0 15px 16px; }
 .stations { padding:16px; }.section-title { margin-bottom:18px; gap:9px; }.section-title h2 { font-size:13px; }.device-summary { font-size:10px; }
 .device-searchbox { width:100%; margin-left:0; }.device { min-height:123px; padding:20px 16px 32px; grid-template-columns:44px minmax(0,1fr); gap:0 13px; }
 .device-icon { width:43px; height:44px; }.device strong { font-size:12px; }.device-caption { left:16px; font-size:9px; }.station-number { font-size:9px; }
 .connection-guide { margin:0 15px 10px; padding:10px; font-size:10px; }.settings-page { padding:0 17px; }.standalone-page h2 { font-size:17px; }
 .more-tools .safety-tools { right:0; left:auto; }.setting-row p { line-height:1.8; }
}
:fullscreen .channel-shelf button { min-width:100px; min-height:28px; padding:3px 7px; }:fullscreen .channel-shelf button:before { width:22px; height:22px; }
@media(prefers-reduced-motion:reduce) { button,.device { transition:none; } }
@media(min-width:1001px) and (max-height:850px) {
 .page-heading { padding-top:22px; padding-bottom:14px; }.page-heading h1 { font-size:23px; }.eyebrow { margin-bottom:6px; }.page-heading p { margin-top:6px; }
 .account.authenticated { top:28px; }.channel-shelf { min-height:40px; margin-bottom:10px; }.topbar { padding-top:10px; padding-bottom:10px; margin-bottom:12px; }
 .layout,.layout.hide-side { padding-bottom:18px; }.stations { padding:18px; }.section-title { margin-bottom:18px; }#devices { gap:12px; }
 .device { min-height:112px; padding:18px 18px 30px; grid-template-columns:40px minmax(0,1fr); }.device-icon { width:40px; height:41px; }.device-icon svg { width:25px; height:25px; }.device-caption { left:18px; }
}

/* UU reference alignment, 2026.10.25.1: device rail and desktop-first workspace. */
:root{--accent:#3478f6;--line:#e0e4e8;--muted:#68717b;color:#20242a;background:#f5f7f9;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}
body{grid-template-columns:242px minmax(0,1fr);background:#f7f9fb}
.app-rail{padding:24px 10px 16px;background:#edf1f4;border-color:#dce1e6;overflow:auto}
.brand{padding:0 14px 26px}.brand b{font-size:20px;color:#20242a;letter-spacing:0}
.app-nav{gap:3px}.nav-item{font-size:14px;min-height:44px;border-radius:6px;color:#333a43;padding:11px 14px}
.nav-item[aria-current=page]{background:#e0e6eb;color:#20242a}
.rail-devices{display:flex;flex-direction:column;gap:3px;margin:12px 0;padding-top:12px;border-top:1px solid #dce2e7}
.rail-device{position:relative;display:flex;align-items:center;gap:12px;background:transparent;border:0;text-align:left;padding:11px 14px 11px 25px;min-height:46px;border-radius:5px;font-size:13px;color:#626a74;white-space:normal}
.rail-device .nav-icon{color:#a7adb6;width:22px;height:22px}.rail-device-name{overflow-wrap:anywhere}
.rail-device[data-online=true]{color:#242a32}.rail-device[data-online=true] .nav-icon{color:#3480fb}
.rail-device:before{content:"";position:absolute;left:10px;width:5px;height:5px;border-radius:50%;background:#b5bcc5}
.rail-device[data-online=true]:before{background:#26c44f}
.rail-device[aria-current=true]{background:#dfe5ea;color:#20242a}
.rail-device[aria-current=true]:after{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;background:#367bfa;border-radius:3px}
.page-heading{padding:26px 32px 18px;min-height:100px}.page-heading h1{font-size:25px;color:#20242a}.page-heading p{font-size:12px;color:#727982}
.channel-shelf{margin:0 32px 15px;min-height:40px}.channel-shelf button{border-radius:6px;font-size:12px;color:#697583;min-width:130px;background:#f9fafb}
.channel-shelf button:before{border-radius:4px}.channel-caption{font-size:12px;color:#6b7480}
.topbar{margin:0 32px 12px;padding:12px 0;border:0;border-radius:0;box-shadow:none;background:transparent}.target strong{font-size:14px;color:#252c35}.topbar .target:before{display:none}
.badge{font-size:12px;border-radius:5px}.badge.ready{background:#20242a;color:white}.badge.offline{background:#e4e8ec;color:#69717c}
button.primary{border-radius:6px;box-shadow:none}.topbar #disconnect{color:#5a626c;border-color:#dce2e8;font-size:12px}
.connection-guide{margin:0 32px 12px;border:0;background:#edf3fc;border-radius:5px;font-size:12px}.connection-guide strong{font-size:12px}.connection-guide #connection-help{color:#596c85}
.layout,.layout.hide-side{padding:0 32px 24px;gap:12px}.workspace,.sidepanel,.stations,.standalone-page{border-radius:7px;border-color:#dce2e8;box-shadow:none}
.workspace{display:flex;flex-direction:column}#screen{order:0;background:#e8edf2;min-height:220px;flex:1 0 220px}.channelbar{order:1;border-top:1px solid #dce2e8;border-bottom:0;min-height:53px;padding:10px 14px}.channelbar label{color:#596571;font-size:12px}.channelbar button,.more-tools summary{font-size:12px;color:#394450}
#notice{order:4;font-size:12px;color:#5d6b79}#console-panel,#clipboard-panel{order:2}#empty{font-size:14px;color:#687583;max-width:520px;padding:32px;line-height:2}
body[data-connection=connecting] #empty:before,body[data-connection=reconnecting] #empty:before,body[data-connection=retrying] #empty:before{content:"";display:block;width:26px;height:26px;border:3px solid #cbd6e4;border-top-color:#3478f6;border-radius:50%;margin:0 auto 20px;animation:connection-spin 1s linear infinite}
@keyframes connection-spin{to{transform:rotate(360deg)}}
.device strong{color:#303945;font-size:14px}.device small,.device-caption,.station-number{font-size:12px;color:#76818e}.device.selected:after{display:none}.device{border-radius:7px}.device-search{font-size:12px}.section-title h2{font-size:15px}.device-summary{font-size:12px;color:#737e8c}
.more-tools .safety-tools{top:auto;bottom:40px}.account.authenticated #status{font-size:12px;color:#687582}.rail-footer{color:#637180}.rail-footer small{font-size:11px;color:#77818c}
@media(max-width:1100px){body{grid-template-columns:205px minmax(0,1fr)}.page-heading{padding:22px 22px 16px}.layout,.layout.hide-side{padding:0 22px 18px}.topbar,.channel-shelf,.connection-guide{margin-left:22px;margin-right:22px}.account{position:static;grid-column:2;grid-row:2;max-width:none;padding:0 22px 12px;justify-content:flex-start}body{grid-template-rows:auto auto auto auto auto minmax(0,1fr)}.channel-shelf{grid-row:3}.topbar{grid-row:4}.connection-guide{grid-row:5}.layout{grid-row:6}.channel-shelf button{min-width:100px}.rail-device{font-size:12px}}
@media(max-width:650px){body{grid-template-columns:62px minmax(0,1fr);overflow:auto;height:auto;min-height:100dvh}.app-rail{padding:22px 5px}.brand{padding:0 9px 20px}.nav-item{font-size:0;padding:12px 6px}.rail-devices{display:none}.page-heading{padding:22px 14px 12px;min-height:84px}.page-heading h1{font-size:21px}.layout,.layout.hide-side{padding:0 12px 16px;min-height:450px}.topbar,.channel-shelf,.connection-guide{margin-left:12px;margin-right:12px}.account{padding:0 12px 10px}.channel-shelf button{min-width:0;font-size:10px}.channel-shelf [role=tablist]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.topbar{flex-wrap:wrap}.target{flex-wrap:wrap}.topbar nav{width:100%}.device{min-height:120px}#empty{padding:20px;font-size:13px}.channelbar{padding:9px;gap:8px}#login{max-width:100%}.account #status{max-width:100%}.workspace{min-height:440px}.connection-guide{flex-wrap:wrap}.more-tools .safety-tools{right:0;left:auto}.rail-footer{display:none}.brand>div{display:none}}
@media(prefers-reduced-motion:reduce){#empty:before{animation:none!important}}

/* Visual refinement 2026.10.25.2: strong hierarchy, comfortable contrast. */
:root{--accent:#2464df;--line:#dbe3ed;color:#1e2d43;background:#f3f6fa}
body{grid-template-columns:254px minmax(0,1fr);background:#f3f6fa}
.app-rail{background:#192c46;border-right:0;padding:26px 12px 18px}
.brand{gap:12px;padding:0 12px 28px}.brand b{font-size:24px;font-weight:750;color:#fff;letter-spacing:1px}.brand img{width:38px;height:38px}
.app-nav{gap:5px}.nav-item{font-size:15px;font-weight:600;color:#c6d2e2;min-height:47px;border-radius:8px}
.nav-item:hover:not(:disabled){background:#253e5d;color:#fff}
.nav-item[aria-current=page],.nav-item[aria-current=page]:hover{background:#2d62b9;color:#fff}
.rail-devices{border-color:#34475f;gap:4px;padding-top:16px;margin-top:20px}
.rail-device{font-size:14px;line-height:1.5;font-weight:550;color:#c4cfde;min-height:47px;border-radius:7px;padding:10px 12px 10px 26px}
.rail-device .nav-icon{color:#9eafc5}.rail-device:before{background:#8495aa}
.rail-device:hover:not(:disabled){background:#263e5a;color:#fff;border-color:transparent}
.rail-device[aria-current=true]{background:#2a4261;color:#fff;font-weight:650}
.rail-device[aria-current=true]:after{background:#72acff;width:4px;top:10px;bottom:10px}
.rail-device[aria-current=true] .nav-icon{color:#a6c9ff}
.rail-device[data-online=true]{color:#f4f8ff}.rail-device[data-online=true] .nav-icon{color:#83b4ff}
.rail-footer{color:#b8c8db;font-size:12px}.rail-footer small{color:#9dafc6;font-size:11px}.rail-dot{background:#75aaff}
.page-heading{padding-top:25px;padding-bottom:20px}.page-heading h1{font-size:29px;font-weight:750;letter-spacing:-.4px;line-height:1.35;color:#172a43}.page-heading p{font-size:14px;line-height:1.6;color:#63738a;margin-top:9px}
.account.authenticated #status{font-size:12px;color:#53657c}
.channel-caption{font-size:13px;font-weight:650;color:#5c6d83}
.channel-shelf button{min-height:44px;font-size:13px;font-weight:600;border-color:#d5deea;color:#5d6d82;background:#fff;border-radius:8px;min-width:140px}
.channel-shelf button:before{width:28px;height:28px;font-size:12px;font-weight:750;background:#eaf0f7;color:#61758f}
.channel-shelf button[aria-selected=true]{background:#e7efff;border-color:#9bb8ee;color:#174fae}.channel-shelf button[aria-selected=true]:before{background:#2464df;color:#fff}
.target strong{font-size:16px;font-weight:700;color:#20344f}.badge{font-size:12px;font-weight:600;padding:5px 10px}.badge.offline{background:#e2e8f0;color:#56677c}
button{font-weight:550}.topbar .primary,.primary-link{background:#2464df;border-color:#2464df;min-height:44px;min-width:108px;font-size:14px;font-weight:700;border-radius:8px;box-shadow:0 3px 8px #2464df20}
.topbar .primary:hover:not(:disabled){background:#194fb9;border-color:#194fb9;box-shadow:0 4px 12px #2464df28}
.topbar #disconnect{min-height:44px;padding:9px 18px;font-size:14px;font-weight:600;color:#465b76;background:#fff;border-color:#cfd9e5;border-radius:8px}
.topbar #disconnect:disabled{color:#8795a7;background:#edf1f6;border-color:#dde4ed}
.connection-guide{font-size:13px;line-height:1.65;padding:12px 16px;border-radius:8px}.connection-guide strong{font-size:13px;font-weight:700;color:#355885}.connection-guide #connection-help{color:#50637d}
.connection-guide[data-state=offline],.connection-guide[data-state=waiting]{background:#f5efe3;border:1px solid #e9dfc9}
.workspace,.sidepanel,.stations,.standalone-page{border:1px solid #d4dfea;border-radius:10px;background:#fff;box-shadow:0 4px 16px #203c5c05}
#screen{background:#e8eef5}#empty{font-size:15px;color:#5d7089;line-height:1.95;max-width:580px}
.channelbar{padding:11px 14px;gap:10px;min-height:58px}.channelbar button,.more-tools summary{min-height:35px;font-size:13px;font-weight:600;border-color:#d5deea;color:#304966;border-radius:7px}.channelbar label{font-size:13px;color:#4d617b;font-weight:550}
#notice{font-size:12px;color:#576c86;padding:11px 15px;background:#f8fafc}
.section-title h2{font-size:17px;font-weight:700;color:#223a57}.device-summary{font-size:13px;color:#63758e}.device-search{font-size:13px}
.device{border-color:#d7e1ed;border-radius:10px}.device strong{font-size:15px;font-weight:700;color:#233c5d}.device small,.device-caption,.station-number{font-size:12px;color:#667b96}.device.selected{background:#eff5ff;border-color:#88ade8;box-shadow:inset 0 0 0 1px #bfd2f1}
.device-icon{background:#e7f0ff;color:#437ac7}.device[data-online=false] .device-icon{background:#edf1f6;color:#8699b1}.device small.ready{color:#297655}
.setting-row{padding:25px 0}.setting-row h2{font-size:16px;font-weight:700;color:#243b58}.setting-row p{font-size:14px;color:#63758c;line-height:1.8}.setting-value{font-size:13px;font-weight:600;color:#325c99}.setting-actions button{font-size:13px}.standalone-page p{font-size:14px;color:#60748e}
.sidepanel h2{font-size:16px}.sidepanel p,.sidepanel small{font-size:13px;color:#5b708b}.tool-tabs button{font-size:13px}
@media(max-width:1200px){.page-heading h1{font-size:25px}.channel-shelf button{min-width:116px}.rail-device{font-size:13px}}
@media(max-width:1100px){body{grid-template-columns:222px minmax(0,1fr)}.account.authenticated{padding-bottom:12px}.page-heading{min-height:90px}.channel-shelf button{min-width:105px}.channelbar{gap:8px}}
@media(max-width:650px){body{grid-template-columns:64px minmax(0,1fr)}.app-rail{padding:23px 6px}.brand{padding:0 6px 24px}.brand img{width:36px;height:36px}.nav-item{font-size:0;min-height:46px}.page-heading h1{font-size:23px}.page-heading p{font-size:13px}.channel-shelf button{min-width:0;font-size:10px;padding:5px;gap:5px;min-height:38px}.channel-shelf button:before{width:21px;height:24px;font-size:11px}.channel-caption{font-size:12px}.target strong{font-size:14px;white-space:normal}.topbar .primary,.topbar #disconnect{font-size:13px;min-width:0}.connection-guide,.connection-guide strong{font-size:12px}.device strong{font-size:14px}.device small,.device-caption,.station-number{font-size:11px}.channelbar button,.more-tools summary,.channelbar label{font-size:12px}.setting-row p{font-size:13px}#empty{font-size:14px}#notice{font-size:12px}}
/* Keep long device names and compact windows inside their own layout tracks. */
.app-rail{overflow:hidden}.rail-devices{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#526780 transparent}.rail-footer{flex-shrink:0;padding-top:12px}.app-nav,.brand{flex-shrink:0}
.page-heading,.account,.topbar,.channel-shelf,.connection-guide,.layout{min-width:0}
@media(max-width:650px){.topbar .target{flex-basis:100%;max-width:100%}.channel-shelf [role=tablist]{min-width:0}.channel-shelf button{overflow:hidden}.stations{min-width:0}.section-title{min-width:0}.device-searchbox{min-width:0}.device-summary{white-space:normal}.target strong{overflow-wrap:anywhere}}

/* Internal fleet: clear readiness and one-click actions. */
.internal-readiness{display:flex;flex-direction:column;gap:8px;padding:22px 24px;margin-bottom:24px;border:1px solid #dce5f6;border-radius:14px;background:#f0f5ff;color:#244576}.internal-readiness strong{font-size:18px}.internal-readiness span{font-size:13px;line-height:1.7;color:#596c86}.device-filter{font-size:12px;padding:8px 12px;white-space:nowrap}.device .device-caption{display:block!important;margin-top:16px;padding:9px 12px;border-radius:7px;background:#eef1f5;color:#67758a;text-align:center;font-size:13px!important;font-weight:600}.device[data-online="true"] .device-caption{background:#3465dd;color:white}.device[hidden],.rail-device[hidden]{display:none!important}.section-title{flex-wrap:wrap}.section-title .device-searchbox{margin-left:auto}@media(max-width:650px){.internal-readiness{padding:16px}.internal-readiness strong{font-size:16px}.device-filter{font-size:11px}.section-title .device-searchbox{width:100%;margin-left:0}}

/* Give device actions their own row, away from status text. */
.device{grid-template-rows:auto auto auto;row-gap:5px;min-height:176px;padding:20px 18px 30px}.device .device-icon{grid-row:1/3}.device strong{align-self:center}.device small{margin-top:0}.device .device-caption{position:static;grid-column:1/-1;grid-row:3;margin-top:12px;padding:8px 12px}.station-number{bottom:8px;font-size:10px}@media(max-width:650px){.device{min-height:166px}}

.internal-readiness{padding:16px 20px;margin-bottom:16px}.device{min-height:142px;padding:14px 16px 24px}.device .device-caption{margin-top:8px;padding:6px 10px}.device .station-number{bottom:6px}#device-station-2{order:0}#device-station-1{order:1}#device-station-3{order:2}#device-station-5{order:3}#device-station-4{order:4}#device-station-6{order:5}#device-station-7{order:6}#device-station-8{order:7}#device-station-9{order:8}@media(max-width:650px){.device{min-height:146px}}

body{grid-template-rows:auto auto auto auto minmax(0,1fr) auto}.site-filing{grid-column:2;grid-row:6}