/* One persistent scope entry for both account and original business conversations. */
.workspace-modes { display:flex; align-items:center; gap:3px; padding:3px; border:1px solid #dfe6ee; border-radius:8px; background:#f2f6f9; }
.workspace-modes button { flex:1; min-width:78px; min-height:32px; padding:6px 12px; border:1px solid transparent; border-radius:6px; font:600 11px/1.4 Inter,"PingFang SC",sans-serif; white-space:nowrap; color:#718097; background:transparent; cursor:pointer; transition:background .18s,color .18s,box-shadow .18s; }
.workspace-modes button:hover:not(:disabled) { color:#244b68; background:#e9f2f6; }
.workspace-modes button[aria-current=page] { color:#173150; background:#fff; border-color:#e1e7ee; box-shadow:0 2px 5px rgba(25,59,83,.045); }
.workspace-modes button:focus-visible { outline:2px solid #53c0d6; outline-offset:1px; }
.workspace-modes button:disabled { cursor:wait; opacity:.55; }
#accountWorkspaceButton[hidden] { display:none!important; }
.workbench-scope.scope-workspace-button { position:relative; order:-1; width:100%; height:auto; min-height:68px; padding:9px 11px; background:linear-gradient(112deg,#f4fbfc,#faf9fd); border-color:#dce6ef; text-align:left; cursor:pointer; font-family:inherit; white-space:normal; box-shadow:0 4px 12px rgba(35,59,89,.035); }
.workbench-scope.scope-workspace-button:hover:not(:disabled),.workbench-scope.scope-workspace-button[aria-expanded=true] { border-color:#9ccbd6; background:linear-gradient(112deg,#ebf8fa,#f5f2fb); }
.workbench-scope.scope-workspace-button:focus-visible { outline:2px solid #53c0d6; outline-offset:2px; }
.workbench-scope.scope-workspace-button:disabled { opacity:.6; cursor:wait; }
.workbench-scope .workbench-shop-copy { flex:1; }
.workbench-scope .workbench-shop-copy small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media(min-width:921px) {
  .workbench-scope.scope-workspace-button { height:70px; min-height:70px; max-height:70px; }
}
.workbench-shop-switch { display:flex; align-items:center; flex:none; gap:3px; color:#39798b; font-size:10px; white-space:nowrap; }
@media(max-width:920px) {
  #workbench > .workbench-scope { position:relative; grid-column:1 / -1; width:calc(100% - 24px); margin:12px; }
}
@media(max-width:1500px) {
  #app .topbar { flex:0 0 auto; height:auto; min-height:64px; flex-wrap:wrap; gap:8px; padding-top:8px; padding-bottom:8px; }
  #app .topbar .global-navigation { flex:1 0 100%; justify-content:space-between; }
  #app .topbar > .scope-controls { flex:1 1 100%; width:100%; max-width:100%; justify-content:flex-end; }
}
@media(max-width:640px) {
  #app .topbar .global-navigation { gap:8px; }
  .workspace-modes { flex:1; }
  .workspace-modes button { min-width:0; padding:6px 8px; }
  #app .topbar .topbar-brand { display:flex; }
  #app .topbar > .scope-controls { flex-wrap:wrap; gap:6px; }
  #app .scope-controls .scope-workspace-button { max-width:min(210px,calc(100vw - 130px)); }
  #app .scope-controls .device-picker { flex:1 1 100%; }
  #app .scope-controls .device-picker .hy-select { width:100%; max-width:none; }
}
@media(prefers-reduced-motion:reduce) { .workspace-modes button { transition:none; } }
.scope-controls .legacy-scope-controls { display:none !important; }
.scope-controls .scope-workspace-button { display:flex; align-items:center; justify-content:flex-start; min-width:180px; max-width:320px; height:44px; min-height:44px; padding:6px 11px; gap:10px; text-align:left; border:1px solid #dce3ec; border-radius:8px; background:#fff; box-shadow:none; line-height:1.3; transition:background .18s,border-color .18s; }
.scope-controls .scope-workspace-button:hover:not(:disabled),.scope-controls .scope-workspace-button[aria-expanded=true] { border-color:#b9c8d6; background:#f1f7fa; }
.scope-controls .scope-workspace-button:focus-visible { outline:2px solid #53c0d6; outline-offset:2px; }
.scope-controls .scope-workspace-button:disabled { opacity:.55; cursor:not-allowed; }
.device-picker:has(.hy-select) > label { display:none; }
.scope-controls .device-picker .hy-select { width:200px; min-width:0; max-width:200px; }
.scope-controls .device-picker .scope-workspace-button { width:100%; min-width:0; max-width:200px; height:36px; min-height:36px; padding:3px 8px; gap:7px; background:#fff; box-shadow:none; }
.scope-controls .device-picker .scope-workspace-button strong { font-size:11px; line-height:1.3; }
.scope-controls .device-picker .scope-workspace-button small { font-size:9px; line-height:1.3; }
.scope-controls .device-picker .scope-workspace-button > svg:not(.scope-caret) { width:16px; height:16px; }
.scope-controls .scope-device-menu { width:360px; max-width:calc(100vw - 28px); padding:6px; border-radius:12px; animation:scope-menu-in .18s ease-out; }
.scope-controls .scope-device-menu button { display:flex; align-items:center; gap:8px; min-height:40px; padding:5px 8px; border:1px solid transparent; font:12px/1.4 Inter,"PingFang SC",sans-serif; transition:background .18s,border-color .18s; }
.scope-device-menu button > svg { flex:none; color:#4e8393; }
.scope-device-menu button > span { min-width:0; flex:1; white-space:normal; }
.scope-device-menu button strong,.scope-device-menu button small { display:block; overflow-wrap:anywhere; }
.scope-device-menu button strong { font-weight:600; }
.scope-device-menu button small { font-size:10px; color:#758196; }
.scope-device-menu button > i { flex:none; width:20px; }
.scope-controls .scope-device-menu button:hover { border-color:#dce5ed; }
.scope-controls .scope-device-menu button:focus-visible { outline:2px solid #53c0d6; outline-offset:-1px; }
.scope-workspace-button > svg { flex:none; color:#4e8393; }
.scope-workspace-button > span { min-width:0; }
.scope-workspace-button strong,.scope-workspace-button small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.scope-workspace-button strong { font-size:12px; font-weight:600; color:#173150; }
.scope-workspace-button small { font-size:10px; line-height:1.5; color:#758196; }
.scope-workspace-button .scope-caret { margin-left:auto; transition:transform .18s ease; }
.scope-workspace-button[aria-expanded=true] .scope-caret { transform:rotate(180deg); }
.scope-popover { position:fixed; inset:auto; margin:0; padding:6px; width:360px; box-sizing:border-box; border:1px solid #dce5ed; border-radius:12px; color:#132342; background:#fff; box-shadow:0 16px 40px rgba(17,40,71,.14); overflow:auto; font:12px/1.4 Inter,"PingFang SC",sans-serif; }
.scope-popover:popover-open { display:flex; flex-direction:column; animation:scope-menu-in .18s ease-out; }
.scope-popover:not(:popover-open) { display:none; }
.scope-popover header { padding:4px 6px 6px; }
.scope-popover header label { display:block; color:#758196; font-size:11px; margin-bottom:4px; }
/* Compact topbar label hiding must not hide popover choices or their names. */
.scope-controls .scope-popover header label { display:block; }
.scope-controls .scope-popover .scope-multi-choice { display:flex; }
.scope-controls .scope-popover .scope-multi-choice > span { display:block; white-space:normal; }
.scope-popover header input { box-sizing:border-box; display:block; width:100%; padding:7px 9px; border:1px solid #dfe6f0; border-radius:8px; font:inherit; color:#132342; background:#f8fafc; }
.scope-popover [data-scope-list] { min-height:0; overflow:auto; max-height:350px; overscroll-behavior:contain; }
.scope-popover button { display:flex; width:100%; align-items:center; gap:8px; min-height:40px; border:1px solid transparent; border-radius:8px; background:transparent; color:#435269; padding:5px 8px; font:inherit; text-align:left; cursor:pointer; transition:background .18s,border-color .18s; }
.scope-popover button > span:nth-child(2) { min-width:0; flex:1; }
.scope-popover button strong,.scope-popover button small { display:block; overflow-wrap:anywhere; }
.scope-popover button strong { font-weight:600; }
.scope-popover button small { color:#758196; font-size:10px; }
.scope-popover button[aria-current=page] { color:#256d68; background:#eaf7f4; }
.scope-option-icon,.scope-option-check { flex:none; width:20px; color:#4e8393; }
.scope-popover button[data-scope-key=account] { margin-bottom:4px; }
.scope-popover footer { flex:none; padding-top:4px; margin-top:4px; border-top:1px solid #e7edf3; }
.scope-popover footer button { color:#244b68; }
.scope-popover button:hover { background:#f1f7fa; border-color:#dce5ed; }
.scope-popover :is(button,input):focus-visible { outline:2px solid #53c0d6; outline-offset:-1px; }
.scope-empty,[data-scope-status] { color:#758196; padding:10px; margin:0; }
@keyframes scope-menu-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:720px) {
  .scope-controls .scope-workspace-button { min-width:0; max-width:min(260px,calc(100vw - 110px)); }
  .scope-controls .scope-workspace-button > svg:first-child { display:none; }
  .scope-controls { min-width:0; }
}
@media(prefers-reduced-motion:reduce) { .scope-popover:popover-open,.scope-controls .scope-device-menu { animation:none; } .scope-popover button,.scope-caret,.scope-controls .scope-workspace-button,.scope-controls .scope-device-menu button { transition:none; } }

/* Keep the current shop distinct from work and configuration cards. */
.workbench-scope.scope-workspace-button { background:#193a59; border-color:#284d6c; color:#fff; }
.workbench-scope.scope-workspace-button:hover:not(:disabled), .workbench-scope.scope-workspace-button[aria-expanded=true] { background:#214969; border-color:#65bdd2; }
.workbench-scope.scope-workspace-button strong { color:#fff; }
.workbench-scope.scope-workspace-button :is(small,.workbench-shop-label) { color:#bfcede; }
.workbench-scope.scope-workspace-button :is(.workbench-shop-switch,.scope-caret) { color:#c2edf5; }
.workbench-scope.scope-workspace-button .workbench-shop-icon { background:rgba(128,215,227,.14); color:#a7e0e7; }