/* PC financial scope and recoverable feedback; no table padding changes. */
#page-finance :is(.fin-context-strip,.fin-date-error)[hidden],#finEmptyClear[hidden] { display:none; }
.fin-context-strip { display:flex;align-items:center;gap:12px;margin:8px 0;color:var(--text,#193248);font-size:13px; }
.fin-selection-strip { padding:8px 12px;border:1px solid var(--border,#d6e0eb);border-radius:8px;background:var(--surface,#fff); }
.fin-date-error { margin:8px 0;color:var(--danger,#b42318);font-size:13px; }
.finance-export-scope { display:flex;flex-wrap:wrap;gap:12px;border:0;padding:0;margin:0 0 12px; }
.finance-export-scope legend { padding:0;margin-bottom:8px;font-weight:600; }
.finance-export-scope label { display:flex;align-items:center;gap:6px; }
#financeExportCount { margin:0 0 16px;color:var(--muted,#687d91); }
.order-log-pager { display:flex;align-items:center;gap:8px;margin-bottom:12px; }
.order-log-pager > span { margin-right:auto; }
#finOrdersEmpty #finEmptyClear { margin-top:12px; }
@media (min-width:1101px) {
  #page-finance .fin-date-group { display:flex;align-items:center;gap:8px;flex:0 0 auto; }
  #page-finance .fin-date-group .fin-date-filter { display:flex;align-items:center;gap:8px; }
  #page-finance .fin-date-group .fin-date-filter > label { margin:0;white-space:nowrap; }
  #page-finance .fin-date-group .dash-date-field { min-width:0; }
  #page-finance .fin-date-group .dash-date-field input { width:116px;min-width:0;flex:0 0 116px; }
  #page-finance .fin-date-group .dash-date-range { display:flex;align-items:center;gap:6px; }
  #page-finance .fin-summary-card[aria-pressed="true"] { border-color:var(--primary,#2864a8);box-shadow:0 0 0 1px var(--primary,#2864a8); }
}
/* Session initialization is not an empty business page. */
.session-init-page[hidden] { display:none; }
.session-init-page { position:fixed;inset:0;z-index:12000;display:grid;place-items:center;background:var(--bg,#edf3f7); }
.session-init-card { width:380px;max-width:calc(100vw - 48px);padding:32px;border:1px solid var(--border,#d6e0eb);border-radius:12px;background:var(--surface,#fff);box-shadow:0 8px 32px rgba(30,55,80,.06); }
.session-init-card h2 { margin:16px 0 8px;font-size:20px;color:var(--text,#193248); }
.session-init-card p { margin:0;color:var(--muted,#687d91);line-height:1.6; }
.session-init-actions { display:flex;gap:8px;margin-top:24px; }
.session-init-actions [hidden] { display:none; }
/* Desktop-only interaction polish for existing navigation and choice rails. */
@media (min-width: 1101px) {
  .ui-interaction-container { position: relative; }
  .ui-motion-marker {
    position: absolute; z-index: 0; top: 0; left: 0; visibility: hidden;
    pointer-events: none; border-radius: 7px; background: var(--accent-soft, #eaf2fc);
    transform-origin: 0 0; opacity: .96;
  }
  #sidebarNav.ui-interaction-container .nav-item,
  #sidebarNav.ui-interaction-container .nav-sub-item,
  .ui-interaction-container > button,
  .ui-interaction-container > [role="tab"],
  .ui-interaction-container > [role="button"],
  .ui-interaction-container > .fin-tab,
  .ui-interaction-container > .workspace-tab,
  .ui-interaction-container > .btn { position: relative; z-index: 1; }
  .ui-interaction-container.ui-marker-ready .ui-selected-target { background-color: transparent !important; }
  .ui-interaction-container .ui-motion-marker.ui-marker-primary { background: var(--accent,#2467ae); }
  #lnRegionTabs.ui-marker-ready .ui-motion-marker { background: var(--accent,#2467ae); }
  #workspaceTabs.ui-marker-ready .workspace-tab.ui-selected-target { color: var(--accent-dark,#194f87) !important; }
  #workspaceTabs.ui-marker-ready .workspace-tab.ui-selected-target .workspace-tab-close { color: inherit; }
  #sidebarNav.ui-interaction-container .nav-item.ui-selected-target,
  #sidebarNav.ui-interaction-container .nav-sub-item.ui-selected-target {
    border-left-color: transparent !important; box-shadow: none !important;
  }
  #sidebarNav.ui-marker-ready .nav-item.active,
  #sidebarNav.ui-marker-ready .nav-sub-item.active { background: transparent !important; box-shadow: none !important; }
  #sidebarNav .nav-sub { position: relative; }
  #sidebarNav .nav-sub::before {
    content:""; position:absolute; left:0; top:3px; bottom:3px; width:1px;
    background:var(--line,#d0deee); pointer-events:none;
  }
  #sidebarNav .nav-item[aria-expanded] .arrow svg {
    transform: rotate(-90deg); transform-origin: 50% 50%;
    transition: transform 180ms cubic-bezier(.2,.8,.2,1);
  }
  #sidebarNav .nav-item[aria-expanded="true"] .arrow svg { transform: rotate(0deg); }
  #sidebarNav .nav-sub-item.ui-subnav-enter {
    animation: ui-subnav-arrive 170ms cubic-bezier(.2,.8,.2,1) both;
    animation-delay: var(--ui-stagger, 0ms);
  }
  #sidebarNav .nav-item.ui-reminder-updated::after {
    content: ""; position: absolute; top: 5px; right: 7px; width: 6px; height: 6px;
    border-radius: 50%; background: var(--accent, #2467ae);
    box-shadow: 0 0 0 2px var(--surface, #fff); pointer-events: none;
    animation: ui-reminder-pulse 900ms ease-in-out 3;
  }
  details.account-menu[open] .account-panel,
  details.workspace-tab-menu[open] .workspace-tab-menu-panel,
  details.toolbar-menu[open] .toolbar-menu-panel,
  details.finance-export-menu[open] .toolbar-menu-panel {
    animation: ui-menu-arrive 140ms cubic-bezier(.2,.8,.2,1) both; transform-origin: top right;
  }
  .ui-quicknav-trigger { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; }
  .ui-quicknav-trigger[hidden] { display:none !important; }
  .ui-quicknav-shortcut { color:var(--muted,#718096); font-size:11px; font-weight:500; white-space:nowrap; }
  dialog.ui-command-dialog {
    position:fixed; inset:50% auto auto 50%; width:min(540px,calc(100vw - 48px));
    max-width:min(540px,calc(100vw - 48px)); max-height:min(620px,calc(100vh - 64px));
    margin:0; padding:0; overflow:hidden; border:1px solid var(--line,#dce5ee);
    border-radius:12px; background:var(--surface,#fff); color:var(--ink,#172b3f);
    box-shadow:0 18px 56px rgba(20,42,64,.2); transform:translate(-50%,-50%);
  }
  dialog.ui-command-dialog::backdrop { background:rgba(18,38,58,.25); backdrop-filter:blur(3px); }
  .ui-command-shell { display:flex; flex-direction:column; max-height:min(620px,calc(100vh - 64px)); }
  .ui-command-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 22px 14px; }
  .ui-command-title { margin:0; color:var(--ink,#172b3f); font-size:17px; line-height:1.35; font-weight:700; }
  .ui-command-close {
    display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; flex:0 0 30px;
    border:1px solid var(--line,#dce5ee); border-radius:7px; background:var(--surface,#fff);
    color:var(--muted,#718096); font:inherit; cursor:pointer;
  }
  .ui-command-close:hover { background:var(--surface-muted,#f3f6fa); color:var(--ink,#172b3f); }
  .ui-command-close:focus-visible,.ui-command-input:focus-visible { outline:2px solid var(--accent,#2467ae); outline-offset:2px; }
  .ui-command-search { display:flex; flex-direction:column; gap:6px; padding:0 22px 16px; }
  .ui-command-label { color:var(--muted,#586e83); font-size:12px; font-weight:600; }
  .ui-command-input {
    width:100%; min-height:42px; padding:9px 12px; border:1px solid var(--line,#dce5ee);
    border-radius:8px; background:var(--surface,#fff); color:var(--ink,#172b3f); font:inherit; font-size:14px;
  }
  .ui-command-input::placeholder { color:var(--muted,#8797a7); }
  .ui-command-results {
    display:flex; flex-direction:column; gap:3px; min-height:72px; max-height:min(360px,calc(100vh - 250px));
    margin:0 8px; padding:8px 4px 4px; overflow:auto; border-top:1px solid var(--line,#dce5ee); scrollbar-width:thin;
  }
  .ui-command-option {
    display:flex; align-items:center; min-height:38px; padding:8px 12px; border-radius:7px;
    color:var(--ink,#172b3f); font-size:13px; cursor:pointer; user-select:none;
  }
  .ui-command-option[aria-selected="true"],.ui-command-option:hover { background:var(--accent-soft,#eaf2fc); color:var(--accent,#2467ae); }
  .ui-command-match { border-radius:2px; background:rgba(247,193,74,.28); color:inherit; font-weight:700; }
  .ui-command-empty { display:flex; align-items:center; min-height:60px; padding:10px 12px; color:var(--muted,#718096); font-size:13px; }
  .ui-command-foot {
    display:flex; justify-content:flex-end; gap:12px; padding:12px 22px 15px;
    border-top:1px solid var(--line,#dce5ee); color:var(--muted,#718096); font-size:11px;
  }
  .ui-command-foot kbd { padding:2px 5px; border:1px solid var(--line,#dce5ee); border-radius:4px; background:var(--surface-muted,#f6f8fa); color:var(--text,#334a60); font:inherit; }
  .ui-sr-only {
    position:absolute !important; width:1px !important; height:1px !important; padding:0 !important;
    margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important;
    white-space:nowrap !important; border:0 !important;
  }
  @keyframes ui-subnav-arrive { from {opacity:0;transform:translateY(-4px)} to {opacity:1;transform:translateY(0)} }
  @keyframes ui-reminder-pulse { 0%,100% {box-shadow:0 0 0 0 rgba(36,103,174,0)} 50% {box-shadow:0 0 0 4px rgba(36,103,174,.15)} }
  @keyframes ui-menu-arrive { from {opacity:0;transform:translateY(-3px) scale(.99)} to {opacity:1;transform:translateY(0) scale(1)} }
}

@media (prefers-reduced-motion: reduce) {
  .ui-motion-marker,.ui-reminder-updated::after,
  #sidebarNav .nav-item[aria-expanded] .arrow svg,
  details.account-menu[open] .account-panel,
  details.workspace-tab-menu[open] .workspace-tab-menu-panel,
  details.toolbar-menu[open] .toolbar-menu-panel,
  details.finance-export-menu[open] .toolbar-menu-panel,
  #sidebarNav .nav-sub-item.ui-subnav-enter { animation:none !important; transition:none !important; }
}

@media (max-width: 1100px) {
  .ui-quicknav-trigger,dialog.ui-command-dialog { display:none !important; }
}

/* =====================================================================
   ===== 2026-10-08 顶栏页签胶囊化 + 侧边栏精修（负责人拍板执行）=====
   内容：A 顶栏页签改悬浮胶囊（图2风格）；B 侧边栏选中底色浅蓝→中性浅灰；
        C1 删除侧边栏分组标题；C2 顶栏 54→58px 与品牌区基线对齐；
        C3 侧边栏 182→210px、菜单字号 12→14px。
   范围：纯视觉。不动 app.js/index.html/server.js，不动任何交互逻辑。
   生效原理：本文件是最后加载的样式表，同特异性下后加载取胜；
        需压过的旧规则最高 (1,3,0)（style.css:3067），此处同选择器同分取胜。
   回滚：删除本段即恢复 2026-10-08 前外观。
   ===================================================================== */

/* ---- C2. 顶栏 54→58px：与侧边栏品牌区(.v4-brand 58px)底边对齐 ---- */
.header.v4-topbar{
  height:58px;
  min-height:58px;
}

/* ---- A1. 页签轨道：灰色圆角底框容器（图2 核心），随内容宽收缩、垂直居中 ----
   style.css:1240 原为 flex:1 1 auto 通栏拉伸贴底；此处改为 0 1 auto 包裹页签，
   灰底 #f1f3f6 + 圆角 10px + 内边距 4px，白色胶囊滑块在灰框内滑动。 */
/* 第二批：沿用现有工作区浮层，提供可达页面列表与事件驱动脏标记。 */
@media (min-width:1101px) {
  #workspaceTabs .workspace-dirty-dot { width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--accent); }
  #workspaceTabs .workspace-dirty-dot[hidden] { display:none; }
  #workspaceTabMenu .workspace-tab-menu-panel { min-width:220px;max-width:320px; }
  #workspaceTabMenu .workspace-open-heading { padding:8px 12px 4px;font-size:12px;color:var(--muted); }
  #workspaceTabMenu .workspace-open-pages { max-height:300px;overflow-y:auto;overscroll-behavior:contain; }
  #workspaceTabMenu [data-workspace-open] { display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px;width:100%;text-align:left; }
  #workspaceTabMenu [data-workspace-open][aria-current] { color:var(--accent-dark);background:var(--accent-soft);font-weight:600; }
  #workspaceTabMenu .workspace-open-state { color:var(--muted);font-size:11px;white-space:nowrap; }
  #workspaceTabMenu [role="menuitem"]:focus-visible { outline:2px solid var(--accent);outline-offset:-2px; }
  #workspaceTabMenu .workspace-menu-divider { margin:4px 8px;border-top:1px solid var(--line); }
}
#workspaceTabs.workspace-tabs{
  flex:0 1 auto;
  width:auto;
  align-self:center;
  height:38px;
  align-items:center;
  gap:4px;
  padding:4px;
  background:#f1f3f6;
  border-radius:10px;
  box-sizing:border-box;
  max-width:100%;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
#workspaceTabs.workspace-tabs::-webkit-scrollbar{display:none;width:0;height:0}

/* ---- A2. 页签本体：30px 高胶囊 ---- */
#workspaceTabs .workspace-tab{
  height:30px;
  min-width:0;
  max-width:200px;
  padding:0 8px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--subtle,#7b8794);
  font-weight:500;
  transition:background-color .16s ease,border-color .16s ease,
             box-shadow .16s ease,color .16s ease;
}

/* ---- A3. 未选中 hover：半透明白胶囊（在灰底框上可辨，又不与选中态纯白混淆）---- */
#workspaceTabs .workspace-tab:hover:not([aria-selected="true"]){
  background:rgba(255,255,255,.72);
  color:var(--ink,#10243b);
}

/* ---- A4. 选中：粗体字。胶囊视觉（白底/边框/阴影）由下方 A6 的滑块渲染 ----
   压掉 style.css:3063 的 2px 主色下边与 3061 蓝底（蓝底另被本文件上方
   第 17 行压为透明，此处补 border-bottom 归零；PC 固定透明边框见下方专用规则）。 */
#workspaceTabs .workspace-tab[aria-selected="true"]{
  border-bottom:0;
  font-weight:700;
}
/* 压掉本文件上方第 20 行的 accent-dark 字色（同分 !important 后加载取胜）*/
#workspaceTabs.ui-marker-ready .workspace-tab[aria-selected="true"]{
  color:#1a2b3c !important;
}

/* ---- A6. 页签滑块 = 白色悬浮胶囊（图2 核心视觉，滑动动效保留）---- */
#workspaceTabs .ui-motion-marker{
  background:#fff;
  border:1px solid #dfe6ee;
  border-radius:8px;
  box-shadow:0 1px 2px rgba(16,42,66,.06),0 0 0 1px rgba(16,42,66,.02);
}

/* ---- A5. 选中态关闭按钮：白底上 × 灰色、hover 变红（压掉旧白字×）---- */
#workspaceTabs .workspace-tab[aria-selected="true"] .workspace-tab-close{
  color:var(--muted,#5b6b7c);
}
#workspaceTabs .workspace-tab[aria-selected="true"] .workspace-tab-close:hover{
  background:#f0f3f7;
  color:var(--danger,#c3483b);
}

/* ---- C1. 删除侧边栏分组标题（工作台/协同/业务运营/客户供应链/财务与风控/系统管理）----
   #sidebarNav (1,1,0) 压过 style.css:1549 展开态 display:block (0,3,0)。 */
#sidebarNav .nav-section-label{
  display:none;
}

/* ---- C3. 侧边栏加宽 182→210px（折叠态 64px 不受影响，其特异性更高）---- */
.sidebar.v4-sidebar{
  width:210px;
  min-width:210px;
}
.sidebar.v4-sidebar .v4-brand{
  width:210px;
  min-width:210px;
}

/* ---- C3. 菜单字号 12→14px、项高 35→40px；子菜单 13px 协调 ---- */
.sidebar.v4-sidebar .nav-item{
  min-height:40px;
  padding:0 12px;
  font-size:14px;
  line-height:1.35;
  border-radius:8px;
}
.sidebar.v4-sidebar .nav-sub-item{
  font-size:13px;
}

/* ---- B1. 侧边栏选中：字色加深。底色由 B3 滑块渲染 ----
   （本文件上方第 26-27 行将 .active 自身背景压为透明，属动效层设计，保留） */
.sidebar.v4-sidebar .nav-item.active{
  color:#1a2b3c;
}
.sidebar.v4-sidebar .nav-sub-item.active{
  color:#1a2b3c;
}

/* ---- B3. 侧边栏滑块 = 中性浅灰胶囊（图1 选中底），滑动动效保留 ---- */
#sidebarNav .ui-motion-marker{
  background:#f1f3f6;
  border-radius:8px;
}

/* ---- B2. 图标点亮维持系统主色（显式声明防漂移）---- */
.sidebar.v4-sidebar .nav-item.active .icon,
.sidebar.v4-sidebar .nav-item.active svg{
  color:var(--accent,#2463a6);
}

/* ---- A7. 窄屏兜底（≤1100px 滑块动效不启用时，页签/侧边栏自身渲染胶囊）----
   桌面宽屏下本块被滑块层接管（背景被上方第 17 行压透明），不冲突。 */
@media (max-width:1100px){
  #workspaceTabs .workspace-tab[aria-selected="true"]{
    background:#fff;
    border:1px solid #dfe6ee;
    box-shadow:0 1px 2px rgba(16,42,66,.06),0 0 0 1px rgba(16,42,66,.02);
    color:#1a2b3c !important;
  }
  #workspaceTabs .workspace-tab[aria-selected="true"] .workspace-tab-close{
    color:var(--muted,#5b6b7c);
  }
  #workspaceTabs .workspace-tab[aria-selected="true"] .workspace-tab-close:hover{
    background:#f0f3f7;
    color:var(--danger,#c3483b);
  }
  .sidebar.v4-sidebar .nav-item.active{
    background:#f1f3f6;
    color:#1a2b3c;
  }
  .sidebar.v4-sidebar .nav-sub-item.active{
    background:#f1f3f6;
    color:#1a2b3c;
  }
}

/* ---- D1. 彻底移除点击蓝闪（2026-10-08 第二轮，负责人报障）----
   根因①：style-v4.css:95 给下列元素的 :focus-visible 加蓝色 box-shadow 环
   （var(--v4-focus)=0 0 0 3px rgba(36,99,166,.2)）；页签是 div[tabindex]，
   鼠标点击即触发 focus-visible → 点击瞬间闪一圈蓝。此处同分 (0,3,0)
   后加载压掉。选中态本身已有灰/白胶囊表达，焦点环冗余。
   根因②：快速点击/轻微拖动把菜单文字选中成蓝色选区 → user-select:none。
   根因③：触屏 tap highlight → 全局置透明（桌面无影响，纯保险）。 */
.v4-shell .nav-item:focus-visible,
.v4-shell .nav-sub-item:focus-visible,
.v4-tab-rail .workspace-tab:focus-visible,
.v4-topbar .account-trigger:focus-visible,
.v4-topbar .workspace-tab-menu-trigger:focus-visible{
  outline:none;
  box-shadow:none;
}
*,*::before,*::after{
  -webkit-tap-highlight-color:transparent;
}
.sidebar.v4-sidebar .v4-brand,
.sidebar.v4-sidebar .nav-item,
.sidebar.v4-sidebar .nav-sub-item,
#workspaceTabs .workspace-tab{
  -webkit-user-select:none;
  user-select:none;
}

/* ---- D2. 页签选中态一帧蓝闪补丁（2026-10-08 第三轮，负责人报障截图确认）----
   根因：app.js 点击即同步写入 aria-selected="true"，而 interaction-ui.js 靠
   MutationObserver→rAF 才补 ui-selected-target 类（第 17 行才把它压透明）。
   两帧之间 style.css:3060 的 background:var(--accent) 蓝底会绘制一帧 = 蓝闪。
   修法：宽屏下容器一旦 ui-marker-ready（页面加载后恒成立），选中页签背景
   恒透明——白胶囊始终由滑块渲染，不再依赖 ui-selected-target 的时序。
   特异性 (1,3,0) 压 style.css:3060 (1,2,0)；窄屏兜底在 ≤1100px 块内不受影响。 */
@media (min-width:1101px){
  #workspaceTabs.ui-marker-ready .workspace-tab[aria-selected="true"]{
    background-color:transparent !important;
  }
}

/* ===== 2026-10-08 段落结束 ===== */

/* PC horizontal workspace tabs: compact labels, stable bounds, contextual close. */
@media (min-width:1101px){
  /* One desktop header baseline; the legacy sidebar top border added a 1px offset. */
  .v4-shell{--desktop-header-height:64px}
  .sidebar.v4-sidebar{border-top:0}
  .sidebar.v4-sidebar .v4-brand,
  .header.v4-topbar{
    height:var(--desktop-header-height);
    min-height:var(--desktop-header-height);
    flex-shrink:0;
    box-sizing:border-box;
    border-bottom:1px solid var(--line);
  }
  .header.v4-topbar{box-shadow:none}
  #workspaceTabs.workspace-tabs{height:42px}
  #workspaceTabs .workspace-tab{
    height:34px;
    min-width:55px;
    max-width:180px;
    gap:0;
    font-size:13px;
    flex:0 0 auto;
    box-sizing:border-box;
    transition:background-color .16s ease,color .16s ease;
  }
  /* Keep border geometry/color constant through selection; never interpolate currentColor. */
  #workspaceTabs .workspace-tab[aria-selected="true"]{border-bottom:1px solid transparent}
  #workspaceTabs .workspace-tab:has(.workspace-tab-close){
    min-width:94px;
    width:calc(var(--workspace-label-count,4) * 1em + 42px);
  }
  #workspaceTabs .workspace-tab-label{
    display:block;
    flex:1 1 auto;
    min-width:0;
    text-align:center;
    box-sizing:border-box;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #workspaceTabs .workspace-tab .workspace-tab-close{
    position:absolute;
    top:50%;
    right:4px;
    transform:translateY(-50%);
    width:24px;
    height:24px;
    min-height:24px;
    margin:0;
    border-radius:5px;
    opacity:0;
    pointer-events:none;
    font-size:16px;
    background:#f1f3f6;
    transition:opacity 100ms ease,background-color 100ms ease,color 100ms ease;
  }
  #workspaceTabs .workspace-tab:hover .workspace-tab-close,
  #workspaceTabs .workspace-tab:focus-visible .workspace-tab-close,
  #workspaceTabs .workspace-tab .workspace-tab-close:focus-visible{
    opacity:1;
    pointer-events:auto;
  }
  #workspaceTabs .workspace-tab[aria-selected="true"] .workspace-tab-close{background:#fff}
  #workspaceTabs .workspace-dirty-dot{
    position:absolute;
    left:4px;
    top:50%;
    transform:translateY(-50%);
  }
  #workspaceTabs .workspace-tab:has(.workspace-dirty-dot:not([hidden])) .workspace-tab-label{padding-left:10px}
  #workspaceTabs .workspace-tab:focus-visible,
  #workspaceTabs .workspace-tab-close:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;box-shadow:none}
}
@media (prefers-reduced-motion:reduce){
  #workspaceTabs .workspace-tab,
  #workspaceTabs .workspace-tab-close{transition:none}
}

/* 2026-10-09: compact business-local filter/tab rails. Keep the 2026-10-08
   top bar and sidebar refinements above intact; scope this to the four approved pages. */
@media (min-width:1101px){
  .business-tab-rail{
    position:relative;
    display:inline-flex;
    flex:0 1 auto;
    align-items:center;
    flex-wrap:nowrap;
    gap:4px;
    width:max-content;
    max-width:100%;
    min-width:0;
    min-height:0;
    padding:4px;
    overflow-x:auto;
    overflow-y:hidden;
    border:0;
    border-radius:10px;
    background:#f1f3f6;
    scrollbar-width:thin;
    box-sizing:border-box;
  }
  .v4-work-canvas .page#page-finance .fin-tabs.business-tab-rail{
    gap:4px;
    flex-wrap:nowrap;
  }
  .v4-work-canvas .page#page-finance .business-tab-rail > .fin-tab,
  .v4-work-canvas .page#page-warehouse .business-tab-rail > .fin-tab,
  .v4-work-canvas .page#page-settings .business-tab-rail > .fin-tab,
  .v4-work-canvas .page#page-accounts .business-tab-rail > .fin-tab{
    position:relative;
    z-index:1;
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;
    height:30px;
    min-height:30px;
    padding:0 14px;
    border:1px solid transparent;
    border-radius:8px;
    background:transparent;
    color:#5b6b7c;
    font:inherit;
    font-size:13px;
    font-weight:500;
    line-height:1;
    white-space:nowrap;
    cursor:pointer;
    transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
  }
  .v4-work-canvas .page#page-finance .business-tab-rail > .fin-tab:hover:not(.active),
  .v4-work-canvas .page#page-warehouse .business-tab-rail > .fin-tab:hover:not(.active),
  .v4-work-canvas .page#page-settings .business-tab-rail > .fin-tab:hover:not(.active),
  .v4-work-canvas .page#page-accounts .business-tab-rail > .fin-tab:hover:not(.active){
    background:rgba(255,255,255,.72);
    color:#1a2b3c;
  }
  .v4-work-canvas .page#page-finance .business-tab-rail > .fin-tab.active,
  .v4-work-canvas .page#page-finance .business-tab-rail > .fin-tab[aria-pressed="true"],
  .v4-work-canvas .page#page-settings .business-tab-rail > .fin-tab.active,
  .v4-work-canvas .page#page-settings .business-tab-rail > .fin-tab[aria-selected="true"],
  .v4-work-canvas .page#page-settings .business-tab-rail > .fin-tab[aria-pressed="true"],
  .v4-work-canvas .page#page-warehouse .business-tab-rail > .fin-tab.active,
  .v4-work-canvas .page#page-warehouse .business-tab-rail > .fin-tab[aria-pressed="true"],
  .v4-work-canvas .page#page-accounts .business-tab-rail > .fin-tab.active,
  .v4-work-canvas .page#page-accounts .business-tab-rail > .fin-tab[aria-selected="true"]{
    border-color:#dfe6ee;
    background:#fff;
    box-shadow:0 1px 2px rgba(16,42,66,.06),0 0 0 1px rgba(16,42,66,.02);
    color:#1a2b3c;
    font-weight:700;
  }
  .business-tab-rail.ui-interaction-container > .ui-motion-marker{
    z-index:0;
    border:1px solid #dfe6ee;
    border-radius:8px;
    background:#fff;
    box-shadow:0 1px 2px rgba(16,42,66,.06),0 0 0 1px rgba(16,42,66,.02);
  }
  .business-tab-rail.ui-marker-ready > .ui-selected-target,
  .business-tab-rail.ui-marker-ready > .fin-tab.active,
  .business-tab-rail.ui-marker-ready > .fin-tab[aria-selected="true"],
  .business-tab-rail.ui-marker-ready > .fin-tab[aria-pressed="true"]{
    border-color:transparent !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#1a2b3c !important;
    transition:none !important;
  }
  #page-finance .business-tab-rail.ui-marker-ready > .fin-tab.active,
  #page-finance .business-tab-rail.ui-marker-ready > .fin-tab[aria-pressed="true"]{
    border-color:transparent !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#1a2b3c !important;
  }
  .business-tab-rail > .fin-tab:focus-visible{
    outline:2px solid #2467ae;
    outline-offset:2px;
  }
  #page-accounts #accountSectionTabs[hidden]{display:none !important;}
  #page-accounts #accountOrgPanel[hidden],
  #page-accounts #accountListPanel[hidden]{display:none !important;}
  #page-warehouse .warehouse-filter-row{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    gap:12px;
    min-width:0;
  }
  #page-warehouse .warehouse-tab-group{
    display:flex;
    flex:0 1 auto;
    align-items:center;
    gap:6px;
    min-width:0;
  }
  #page-warehouse .warehouse-country-tabs,
  #page-warehouse .warehouse-view-tabs{flex:0 1 auto;}
  #page-warehouse .warehouse-search-field{
    flex:0 1 260px;
    width:260px;
    max-width:260px;
    min-width:140px;
  }
}

@media (prefers-reduced-motion:reduce){
  .business-tab-rail > .fin-tab,
  .business-tab-rail .ui-motion-marker{transition:none !important;}
}
/* PC order editor website query layer; no global layout or finance rules. */
@media (min-width:1101px){
  #orderModalCard{position:relative}
  #orderModalCard .order-vessel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
  #orderModalCard .order-vessel-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
  #orderModalCard .order-vessel-actions .btn{height:30px;min-height:30px;font-size:12px;padding:0 10px;margin:0}
  #orderModalCard.is-vessel-track-open>.modal-footer{display:none}
  #orderModalCard.is-vessel-track-open>.modal-body{overflow:hidden}
  #orderModalCard.is-vessel-track-open>.modal-body>.ot-tab{visibility:hidden}
  #orderModalCard .order-vessel-track[hidden],#orderModalCard .order-vessel-track [hidden]{display:none!important}
  #orderModalCard .order-vessel-track{position:absolute;left:0;right:0;bottom:0;z-index:8;display:flex;flex-direction:column;min-height:0;background:var(--surface,#fff);border-top:1px solid var(--line,#dfe6ed);animation:ovt-arrive 160ms ease-out}
  #orderModalCard .ovt-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:0 18px;border-bottom:1px solid var(--line);flex-shrink:0}
  #orderModalCard .ovt-header>div{display:flex;align-items:center;gap:10px}
  #orderModalCard .ovt-header h4{margin:0;font-size:15px;font-weight:700;color:var(--ink)}
  #orderModalCard .ovt-icon{width:30px;height:30px;min-height:30px;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;border-radius:5px;color:var(--muted);cursor:pointer}
  #orderModalCard .ovt-icon:hover{background:var(--surface-muted)}
  #orderModalCard .ovt-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  #orderModalCard .ovt-source-label{font-size:11px;color:var(--muted);padding:3px 7px;background:var(--surface-muted);border:1px solid var(--line);border-radius:5px}
  #orderModalCard .ovt-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:6px 18px;flex-shrink:0}
  #orderModalCard .ovt-tabs{display:inline-flex;gap:3px;padding:3px;background:#f1f3f6;border-radius:8px}
  #orderModalCard .ovt-tabs .fin-tab{height:30px;min-height:30px;margin:0;padding:0 13px;border:1px solid transparent;background:transparent;border-radius:6px;font-size:12px;color:var(--muted);cursor:pointer}
  #orderModalCard .ovt-tabs .fin-tab[aria-selected=true]{background:var(--surface);border-color:var(--line);color:var(--ink);font-weight:600}
  #orderModalCard .ovt-layout{display:grid;grid-template-columns:minmax(0,1fr);flex:1;min-height:0;border-top:1px solid var(--line)}
  #orderModalCard .ovt-details-open .ovt-layout{grid-template-columns:minmax(0,1fr) 248px}
  #orderModalCard .ovt-query{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;background:var(--surface-muted)}
  #orderModalCard .ovt-status{padding:8px 12px;background:#fff8e9;border-bottom:1px solid #ecdfc4;color:#72562d;font-size:12px;line-height:1.5;flex-shrink:0}
  #orderModalCard .ovt-frame-host{flex:1;min-height:0;min-width:0;overflow:hidden;position:relative}
  #orderModalCard .ovt-frame-host iframe{display:block;width:100%;height:100%;border:0;background:white}
  #orderModalCard .ovt-empty{margin:auto;max-width:380px;padding:28px 20px;text-align:center}
  #orderModalCard .ovt-empty>svg{width:36px;height:36px;margin:0 auto;fill:none;stroke:var(--muted);stroke-width:1.4}
  #orderModalCard .ovt-empty h5{font-size:15px;margin:14px 0 7px;color:var(--ink)}
  #orderModalCard .ovt-empty p{font-size:12px;margin:0 0 16px;line-height:1.7;color:var(--muted)}
  #orderModalCard .ovt-details{border-left:1px solid var(--line);padding:16px 18px;overflow:auto;min-width:0}
  #orderModalCard .ovt-detail-title{font-size:12px;color:var(--muted);font-weight:600}
  #orderModalCard .ovt-details h5{font-size:16px;line-height:1.4;margin:7px 0 4px;overflow-wrap:anywhere;color:var(--ink)}
  #orderModalCard .ovt-secondary{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
  #orderModalCard .ovt-details dl{margin:18px 0}
  #orderModalCard .ovt-details dl>div{margin-bottom:12px}
  #orderModalCard .ovt-details dt{font-size:12px;color:var(--muted)}
  #orderModalCard .ovt-details dd{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:3px 0 0;font-size:12px;color:var(--text)}
  #orderModalCard .ovt-details dd span{overflow-wrap:anywhere;min-width:0;user-select:text}
  #orderModalCard .ovt-details dd button{font-size:11px;min-height:24px;padding:0 4px;border:0;background:transparent;color:var(--accent);cursor:pointer;flex-shrink:0}
  #orderModalCard .ovt-description{font-size:12px;line-height:1.7;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}
  #orderModalCard .ovt-recovery{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
  #orderModalCard .ovt-recovery .btn{font-size:11px;padding:0 8px;min-height:28px;height:28px}
  #orderModalCard .ovt-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 18px;min-height:46px;border-top:1px solid var(--line);flex-shrink:0}
  #orderModalCard .ovt-footer span{font-size:12px;color:var(--muted)}
  #orderModalCard .order-vessel-track button:focus-visible,#orderModalCard .order-vessel-track a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  @keyframes ovt-arrive{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){#orderModalCard .order-vessel-track{animation:none}}
}

/* Only the read-only query uses the desktop viewport; normal editors retain their sizes. */
@media(min-width:1101px){
  #orderModalCard.is-vessel-track-open,
  #orderModal.order-drawer-mode #orderModalCard.is-vessel-track-open{
    position:fixed;left:16px;top:16px;right:16px;bottom:16px;
    width:calc(100vw - 32px)!important;height:calc(100vh - 32px)!important;
    max-width:none!important;max-height:calc(100vh - 32px)!important;
    margin:0!important;border:1px solid var(--line)!important;border-radius:10px!important;
    transform:none!important;
  }
  #orderModalCard.is-vessel-track-open>.modal-header{visibility:hidden}
  #orderModalCard .ovt-order-label{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:320px}
  #orderModalCard .ovt-header>div:first-child{min-width:0}
  #orderModalCard .ovt-toolbar-actions,#orderModalCard .ovt-zoom-controls,#orderModalCard .ovt-footer-actions{display:flex;align-items:center;gap:8px}
  #orderModalCard .ovt-zoom-controls{gap:4px;border-right:1px solid var(--line);padding-right:12px}
  #orderModalCard .ovt-zoom-controls>.btn{height:28px;min-height:28px;padding:0 9px}
  #orderModalCard #ovtZoomValue{min-width:42px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;color:var(--text)}
  #orderModalCard #ovtFit[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-dark)}
}
/* Finance prerequisites are visible explanations, not disabled fake actions. */
@media(min-width:1101px){
  #page-finance .fin-action-hint{display:block;max-width:220px;white-space:normal;overflow-wrap:anywhere;font-size:12px;line-height:1.5;color:var(--text,#334a60)}
  #page-finance .fin-action-hint.is-blocking{color:var(--warning,#b45309)}
  #page-finance .btn+.fin-action-hint{margin-top:4px}
  #page-finance .fin-action-hint+.fin-action-hint{margin-top:2px}
}