@someray-ui/components 0.0.1 → 0.0.2

package/README.md

@@ -1,6 +1,7 @@
 # @someray-ui/components
 
 Someray 内部 Vue3 通用组件库。当前导出：`SrAppHeader`、`SrResourceTree`、`SrVideoWall`，
+布局组件 `SrContent`、`SrWorkspace`、`SrMonitorLayout`、`SrContentArea`、`SrSidePanel`、`SrToolbar`，
 以及顶栏类型与默认配置（`NavItem` / `MenuItem` / `Weather` / `DEFAULT_MENUS` / `DEFAULT_USER_MENUS`）。
 
 ## 依赖（peer，由你的工程提供）
@@ -52,16 +53,69 @@ app.use(SrUI)     // 注册 SrAppHeader / SrResourceTree / SrVideoWall
 
 ### SrAppHeader 主要 props / slots / events
 
-- props：`logo` `title` `subtitle` `menus` `activeKey` `showWeather` `weather` `showDivider` `showClock` `showBell` `bellCount` `userName` `userMenus`
+- props：`logo` `title` `subtitle` `menus` `activeKey` `showWeather` `weather` `showDivider` `bellCount` `userName` `userMenus`
 - slots：`#bell`（铃铛弹窗内容）、`#brand`（整体替换左侧品牌）
 - events：`@menu-select(key)`、`@bell-click`、`@nav-select(item)`
 
+> 时钟、铃铛、用户菜单按钮为**固定常驻**元素，不受配置控制（无 `showClock`/`showBell` 开关）；`showWeather`/`showDivider` 仍可配置。
+
 > 菜单/用户菜单的 `icon` 可传 Arco 图标名（`'icon-home'`）或原始 SVG 字符串（`'<svg…>'`）。
 > 本库已去除对 `/assets` 的硬依赖：logo 经 `logo` prop 或 `#brand` 插槽提供，"更多"按钮为内联图标。
 
+## 布局组件
+
+分两层：
+
+- **应用骨架层**：`SrContent`（顶栏下方的内容区，高 = `100% - var(--header-h)`，不内置底色）
+- **页面骨架层**：`SrWorkspace`（高阶页面壳）/ `SrMonitorLayout`（三列骨架）/ `SrContentArea`（中间卡片）/ `SrSidePanel`（可拖拽改宽面板）/ `SrToolbar`（底部工具栏）
+
+### 最常用：SrWorkspace（一行搞定左中右 + 工具栏）
+
+```vue
+<sr-app-header ... />
+<sr-content>
+  <sr-workspace left-title="资源树" right-title="详情">
+    <template #left>左面板</template>
+    <main>中间内容</main>
+    <template #toolbar>底部工具栏</template>
+    <template #right>右面板</template>
+  </sr-workspace>
+</sr-content>
+```
+
+未传的列/工具栏插槽不渲染。还有 `#left-footer` / `#right-footer`（左/右面板底栏）、`#toolbar-left` / `#toolbar-right`（工具栏左右段）等可选插槽。
+
+### SrWorkspace props
+
+| prop | 类型 | 默认 | 说明 |
+|---|---|---|---|
+| leftTitle / rightTitle | string | `''` | 左/右面板标题 |
+| leftWidth / rightWidth | string \| number | `''` | 左/右面板宽度（空则用 `--sider-w` / `--rpanel-w`） |
+| leftResizable / rightResizable | boolean | `true` | 是否可拖拽改宽 |
+| flush | boolean | `false` | 贴边模式：去掉外层 padding/gap 与面板边框/圆角/阴影，布局贴满父容器（flush 面板左右各保留一条分隔线） |
+
+### 单独使用子组件
+
+- `<sr-monitor-layout :flush>`：仅三列骨架，中间不自动包卡片。
+- `<sr-content-area :flush>`：带边框圆角阴影的中间卡片（`flush` 去掉边框/圆角/阴影），含 `#toolbar` 插槽。
+- `<sr-side-panel side="left|right" :width :min-width :max-width :resizable :flush title @resize>`：可拖拽改宽面板（`flush` 去掉边框/圆角/阴影，左右各保留分隔线），含 `#header` / `#footer` 插槽。
+- `<sr-toolbar :height>`：底部工具栏，含 `#left` / `#right` 插槽（默认插槽为中间）。
+
+> `flush` 会从 `SrWorkspace` 自动透传到内部的 `SrMonitorLayout` / `SrSidePanel` / `SrContentArea`，也可在各子组件单独使用时传入。
+
+> `SrContent` 不内置底色，消费方可自行加 `background: var(--app)` 或自定义。
+
 ## 构建
 
 ```bash
 npm install
 npm run build   # 产出 dist/sr-ui.js、dist/sr-ui.css、dist/*.d.ts
 ```
+
+## 本地预览（playground）
+
+```bash
+npm run dev   # 启动库内 playground，浏览器预览全部布局组件
+```
+
+`dev/` 目录不发布（`package.json` 的 `files` 仅含 `dist`）。

package/dist/components/SrAppHeader.vue.d.ts

@@ -13,8 +13,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     showWeather?: boolean;
     weather?: Weather;
     showDivider?: boolean;
-    showClock?: boolean;
-    showBell?: boolean;
     bellCount?: number;
     userName?: string;
     userMenus?: MenuItem[];
@@ -32,8 +30,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         windLevel: string;
     };
     showDivider: boolean;
-    showClock: boolean;
-    showBell: boolean;
     bellCount: number;
     userName: string;
     userMenus: () => MenuItem[];
@@ -50,8 +46,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     showWeather?: boolean;
     weather?: Weather;
     showDivider?: boolean;
-    showClock?: boolean;
-    showBell?: boolean;
     bellCount?: number;
     userName?: string;
     userMenus?: MenuItem[];
@@ -69,8 +63,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         windLevel: string;
     };
     showDivider: boolean;
-    showClock: boolean;
-    showBell: boolean;
     bellCount: number;
     userName: string;
     userMenus: () => MenuItem[];
@@ -87,8 +79,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     showWeather: boolean;
     weather: Weather;
     showDivider: boolean;
-    showClock: boolean;
-    showBell: boolean;
     bellCount: number;
     userName: string;
     userMenus: MenuItem[];

package/dist/components/SrContent.vue.d.ts

@@ -0,0 +1,11 @@
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SrContentArea.vue.d.ts

@@ -0,0 +1,39 @@
+declare function __VLS_template(): {
+    default?(_: {}): any;
+    toolbar?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    flush?: boolean;
+}>, {
+    flush: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    flush?: boolean;
+}>, {
+    flush: boolean;
+}>>> & Readonly<{}>, {
+    flush: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SrMonitorLayout.vue.d.ts

@@ -0,0 +1,41 @@
+declare function __VLS_template(): {
+    left?(_: {}): any;
+    default?(_: {}): any;
+    toolbar?(_: {}): any;
+    right?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    flush?: boolean;
+}>, {
+    flush: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    flush?: boolean;
+}>, {
+    flush: boolean;
+}>>> & Readonly<{}>, {
+    flush: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SrSidePanel.vue.d.ts

@@ -0,0 +1,74 @@
+declare function __VLS_template(): {
+    header?(_: {}): any;
+    default?(_: {}): any;
+    footer?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    side?: "left" | "right";
+    width?: string | number;
+    title?: string;
+    resizable?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
+    flush?: boolean;
+}>, {
+    side: string;
+    width: string;
+    title: string;
+    resizable: boolean;
+    minWidth: number;
+    maxWidth: number;
+    flush: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    resize: (width: number) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    side?: "left" | "right";
+    width?: string | number;
+    title?: string;
+    resizable?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
+    flush?: boolean;
+}>, {
+    side: string;
+    width: string;
+    title: string;
+    resizable: boolean;
+    minWidth: number;
+    maxWidth: number;
+    flush: boolean;
+}>>> & Readonly<{
+    onResize?: ((width: number) => any) | undefined;
+}>, {
+    title: string;
+    width: string | number;
+    flush: boolean;
+    side: "left" | "right";
+    resizable: boolean;
+    minWidth: number;
+    maxWidth: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SrToolbar.vue.d.ts

@@ -0,0 +1,40 @@
+declare function __VLS_template(): {
+    left?(_: {}): any;
+    default?(_: {}): any;
+    right?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    height?: string | number;
+}>, {
+    height: number;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    height?: string | number;
+}>, {
+    height: number;
+}>>> & Readonly<{}>, {
+    height: string | number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SrWorkspace.vue.d.ts

@@ -0,0 +1,75 @@
+declare function __VLS_template(): {
+    left?(_: {}): any;
+    "left-footer"?(_: {}): any;
+    default?(_: {}): any;
+    "toolbar-left"?(_: {}): any;
+    toolbar?(_: {}): any;
+    "toolbar-right"?(_: {}): any;
+    right?(_: {}): any;
+    "right-footer"?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    leftTitle?: string;
+    rightTitle?: string;
+    leftWidth?: string | number;
+    rightWidth?: string | number;
+    leftResizable?: boolean;
+    rightResizable?: boolean;
+    flush?: boolean;
+}>, {
+    leftTitle: string;
+    rightTitle: string;
+    leftWidth: string;
+    rightWidth: string;
+    leftResizable: boolean;
+    rightResizable: boolean;
+    flush: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    leftTitle?: string;
+    rightTitle?: string;
+    leftWidth?: string | number;
+    rightWidth?: string | number;
+    leftResizable?: boolean;
+    rightResizable?: boolean;
+    flush?: boolean;
+}>, {
+    leftTitle: string;
+    rightTitle: string;
+    leftWidth: string;
+    rightWidth: string;
+    leftResizable: boolean;
+    rightResizable: boolean;
+    flush: boolean;
+}>>> & Readonly<{}>, {
+    flush: boolean;
+    leftTitle: string;
+    rightTitle: string;
+    leftWidth: string | number;
+    rightWidth: string | number;
+    leftResizable: boolean;
+    rightResizable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/index.d.ts

@@ -2,8 +2,14 @@ import { App } from 'vue';
 import { default as SrAppHeader } from './components/SrAppHeader.vue';
 import { default as SrResourceTree } from './components/SrResourceTree.vue';
 import { default as SrVideoWall } from './components/SrVideoWall.vue';
+import { default as SrContent } from './components/SrContent.vue';
+import { default as SrMonitorLayout } from './components/SrMonitorLayout.vue';
+import { default as SrContentArea } from './components/SrContentArea.vue';
+import { default as SrSidePanel } from './components/SrSidePanel.vue';
+import { default as SrToolbar } from './components/SrToolbar.vue';
+import { default as SrWorkspace } from './components/SrWorkspace.vue';
 
-export { SrAppHeader, SrResourceTree, SrVideoWall };
+export { SrAppHeader, SrResourceTree, SrVideoWall, SrContent, SrMonitorLayout, SrContentArea, SrSidePanel, SrToolbar, SrWorkspace };
 export * from './components/headerConfig';
 /** Vue 插件：app.use(SrUI) 一次性注册全部 Sr* 组件 */
 declare const _default: {

package/dist/sr-ui.css

@@ -1 +1 @@
-body{--app: var(--color-fill-1);--panel: var(--color-bg-1);--panel2: var(--color-fill-2);--panel3: var(--color-fill-1);--line: var(--color-border-2);--line2: var(--color-border-1);--txt: var(--color-text-1);--txt2: var(--color-text-2);--sub: var(--color-text-3);--mute: var(--color-text-4);--accent: rgb(var(--primary-6));--accent-soft: rgb(var(--primary-1));--accent-deep: rgb(var(--primary-7));--success: rgb(var(--green-6));--warning: rgb(var(--orange-6));--danger: rgb(var(--red-6));--topbar: rgb(var(--primary-6));--video: var(--color-fill-2);--video-line: var(--color-border-1);--scroll: var(--color-border-3);--header-h: 76px;--header-pad: 28px;--sider-w: 256px;--rpanel-w: 272px;--ops-side-w: 200px;--nav-min-w: 240px}.cv6h[data-v-9d23d618]{flex:none;width:100%;height:var(--header-h);z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 var(--header-pad);background:var(--topbar)}.cv6h__left[data-v-9d23d618]{flex:0 0 auto;display:flex;align-items:center;gap:12px}.cv6h__logo[data-v-9d23d618]{display:inline-flex;align-items:center;line-height:0}.cv6h__logo img[data-v-9d23d618]{display:block;height:32px;width:auto}.cv6h__brand[data-v-9d23d618]{display:flex;flex-direction:column;justify-content:center}.cv6h__title[data-v-9d23d618]{margin:0;font-size:26px;font-weight:700;letter-spacing:.04em;color:#fff;line-height:1.1;white-space:nowrap}.cv6h__sub[data-v-9d23d618]{margin:4px 0 0;font-size:8px;font-weight:400;letter-spacing:.2em;color:#ffffffbf;text-transform:uppercase;white-space:nowrap}.cv6h__nav[data-v-9d23d618]{flex:1 1 auto;display:flex;justify-content:center;align-items:center;min-width:var(--nav-min-w);overflow:hidden}.cv6h__navframe[data-v-9d23d618]{display:flex;align-items:center;gap:6px;flex:none}.cv6h__item[data-v-9d23d618]{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:7px 15px;border-radius:8px;background:transparent;color:#fff;font-size:14px;font-weight:500;line-height:1.6;letter-spacing:.02em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}.cv6h__item[data-v-9d23d618]:hover{background:#ffffff1a;color:#fff}.cv6h__item.router-link-active[data-v-9d23d618],.cv6h__item.is-active[data-v-9d23d618]{background:var(--accent-deep);color:#fff}.cv6h__ico[data-v-9d23d618]{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.cv6h__ico[data-v-9d23d618] svg{display:block;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.cv6h__ico[data-v-9d23d618] .pl{fill:currentColor;stroke:none}.cv6h__right[data-v-9d23d618]{flex:0 0 auto;display:flex;align-items:center;gap:14px}.cv6h__weather[data-v-9d23d618]{display:flex;align-items:center;gap:8px;color:#fff}.cv6h__wico svg[data-v-9d23d618]{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.cv6h__wtext[data-v-9d23d618]{display:flex;flex-direction:column;gap:2px;line-height:1.15}.cv6h__temp[data-v-9d23d618]{font-size:18px;color:#fff;white-space:nowrap}.cv6h__cond[data-v-9d23d618]{font-size:14px;color:#ffffffeb;white-space:nowrap}.cv6h__wind[data-v-9d23d618]{display:flex;flex-direction:column;gap:2px;line-height:1.15;color:#fff}.cv6h__wdir[data-v-9d23d618]{font-size:14px;color:#fff;white-space:nowrap}.cv6h__wlvl[data-v-9d23d618]{font-size:14px;color:#ffffffeb;white-space:nowrap}.cv6h__div[data-v-9d23d618]{width:1px;height:36px;background:#ffffff59;flex-shrink:0}.cv6h__clock[data-v-9d23d618]{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;color:#fff}.cv6h__time[data-v-9d23d618]{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;color:#fff;letter-spacing:.03em}.cv6h__date[data-v-9d23d618]{margin-top:2px;font-size:9px;color:#ffffffd9;letter-spacing:.03em}.cv6h__bellwrap[data-v-9d23d618]{position:relative;display:inline-flex;align-items:center}.cv6h__bell[data-v-9d23d618]{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}.cv6h__bell svg[data-v-9d23d618]{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.cv6h__bellwrap[data-v-9d23d618] .arco-badge-number,.cv6h__bellwrap[data-v-9d23d618] .arco-badge-text{min-width:20px;height:14px;padding:0 6px;color:var(--color-white);font-weight:500;font-size:10px;line-height:14px;background-color:rgb(var(--danger-6));box-shadow:0 0 0 2px var(--color-bg-2)}.cv6h__bellpop[data-v-9d23d618]{position:absolute;top:calc(100% + 12px);right:-8px;min-width:320px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 40px #0f2e592e;overflow:hidden;z-index:40}.cv6h__bell-empty[data-v-9d23d618]{padding:40px 16px;text-align:center;color:var(--mute);font-size:13px}.cv6h__tools[data-v-9d23d618]{position:relative;display:flex;align-items:center}.cv6h__menubtn[data-v-9d23d618]{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:none;background:transparent;cursor:pointer;border-radius:6px;transition:background .15s}.cv6h__menubtn[data-v-9d23d618]:hover{background:#ffffff1f}.cv6h__menubtn img[data-v-9d23d618]{display:block;width:24px;height:24px;object-fit:contain}.cv6h__menubtn svg[data-v-9d23d618]{width:30px;height:30px;fill:#fff}.cv6h__menu[data-v-9d23d618]{position:absolute;top:calc(100% + 10px);right:0;min-width:176px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0f2e5926;padding:6px;z-index:40}.cv6h__mhead[data-v-9d23d618]{padding:8px 12px 6px;font-size:12px;color:var(--sub)}.cv6h__msep[data-v-9d23d618]{height:1px;background:var(--line2);margin:5px 8px}.cv6h__mitem[data-v-9d23d618]{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:7px;font-size:13.5px;color:var(--txt2);cursor:pointer;white-space:nowrap}.cv6h__mitem[data-v-9d23d618]:hover{background:var(--accent-soft);color:var(--accent)}.cv6h__mitem.danger[data-v-9d23d618]{color:var(--danger)}.cv6h__mitem.danger[data-v-9d23d618]:hover{background:rgb(var(--red-1));color:var(--danger)}.cv6h__mico[data-v-9d23d618]{display:inline-flex}.cv6h__mico[data-v-9d23d618] svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.res[data-v-05bca26c]{flex:none;width:256px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.res-tabs[data-v-05bca26c]{flex:none;display:flex;border-bottom:1px solid var(--line)}.res-tabs a[data-v-05bca26c]{flex:1;text-align:center;padding:13px 0;font-size:13.5px;color:var(--sub);cursor:pointer;position:relative}.res-tabs a.active[data-v-05bca26c]{color:var(--accent);font-weight:600}.res-tabs a.active[data-v-05bca26c]:after{content:"";position:absolute;left:50%;bottom:-1px;transform:translate(-50%);width:26px;height:2px;border-radius:2px;background:var(--accent)}.res-pad[data-v-05bca26c]{padding:12px 12px 4px;display:flex;flex-direction:column;gap:10px}.res-listhead[data-v-05bca26c]{display:flex;align-items:center;padding:6px 12px 8px;font-size:13px;color:var(--sub)}.res-listhead b[data-v-05bca26c]{font-weight:600}.res-acts[data-v-05bca26c]{margin-left:auto;display:flex;gap:12px;color:var(--mute);font-size:15px}.res-acts[data-v-05bca26c] svg{cursor:pointer}.res-acts[data-v-05bca26c] svg:hover{color:var(--accent)}.res-tree[data-v-05bca26c]{flex:1;overflow-y:auto;padding:0 6px 8px}.res-cnt[data-v-05bca26c]{color:var(--mute);font-size:12px}.ptz[data-v-05bca26c]{flex:none;border-top:1px solid var(--line);padding:12px 14px 16px}.ptz-head[data-v-05bca26c]{display:flex;align-items:center;font-size:13px;color:var(--sub);margin-bottom:12px}.ptz-chev[data-v-05bca26c]{margin-left:auto}.joy[data-v-05bca26c]{width:120px;height:120px;margin:0 auto;border-radius:50%;background:var(--panel2);border:1px solid var(--line);position:relative;display:flex;align-items:center;justify-content:center}.joy[data-v-05bca26c]:before{content:"";position:absolute;top:14px;right:14px;bottom:14px;left:14px;border-radius:50%;border:1px dashed var(--line)}.joy .knob[data-v-05bca26c]{width:46px;height:46px;border-radius:50%;background:var(--panel);border:1px solid var(--line);box-shadow:0 2px 8px #1432641f}.joy .ar[data-v-05bca26c]{position:absolute;color:var(--mute);display:flex;cursor:pointer}.joy .ar[data-v-05bca26c]:hover{color:var(--accent)}.joy .up[data-v-05bca26c]{top:7px;left:50%;transform:translate(-50%)}.joy .dn[data-v-05bca26c]{bottom:7px;left:50%;transform:translate(-50%)}.joy .lf[data-v-05bca26c]{left:8px;top:50%;transform:translateY(-50%)}.joy .rt[data-v-05bca26c]{right:8px;top:50%;transform:translateY(-50%)}.speed[data-v-05bca26c]{margin-top:14px;font-size:12px;color:var(--sub);display:flex;align-items:center;gap:10px}.speed b[data-v-05bca26c]{color:var(--accent);font-weight:600}.zoom[data-v-05bca26c]{margin-top:12px;display:flex;gap:10px}.wall[data-v-6ebd5cbf]{width:100%;height:100%;display:grid;gap:0;background:var(--app)}.cell[data-v-6ebd5cbf]{background:var(--video);border:1px solid var(--video-line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--sub);position:relative;overflow:hidden;cursor:pointer}.cell.active[data-v-6ebd5cbf]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.nosrc[data-v-6ebd5cbf]{width:55%;max-width:170px;aspect-ratio:24 / 15;background:center / contain no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNDAgMTUwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIj4KICA8cGF0aCBkPSJNIDMwIDgwIEwgMzIgODUgTCAzNyA4NyBMIDMyIDg5IEwgMzAgOTQgTCAyOCA4OSBMIDIzIDg3IEwgMjggODUgWiIgZmlsbD0iIzliYzFmZiIgb3BhY2l0eT0iMC42Ii8+CiAgPHBhdGggZD0iTSAxNzAgNTAgTCAxNzEuNSA1NCBMIDE3NS41IDU1LjUgTCAxNzEuNSA1NyBMIDE3MCA2MSBMIDE2OC41IDU3IEwgMTY0LjUgNTUuNSBMIDE2OC41IDU0IFoiIGZpbGw9IiM5YmMxZmYiIG9wYWNpdHk9IjAuNiIvPgoKICA8ZWxsaXBzZSBjeD0iOTAiIGN5PSIxMjUiIHJ4PSI0NSIgcnk9IjUiIGZpbGw9IiNkMmRhZjAiIG9wYWNpdHk9IjAuNCIgLz4KCiAgPGcgaWQ9ImNhbWVyYSI+CiAgICA8cGF0aCBkPSJNIDYwIDEyMCBDIDYwIDExNSwgMTIwIDExNSwgMTIwIDEyMCBaIiBmaWxsPSIjYTliYWQ2IiAvPgogICAgPHJlY3QgeD0iNjUiIHk9IjEyMCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjQiIHJ4PSIyIiBmaWxsPSIjOGNhMmM0IiAvPgogICAgPHJlY3QgeD0iODUiIHk9IjEwMCIgd2lkdGg9IjEwIiBoZWlnaHQ9IjE2IiBmaWxsPSIjOGNhMmM0IiAvPgogICAgPGNpcmNsZSBjeD0iOTAiIGN5PSI2NSIgcj0iNDAiIGZpbGw9IiNjYmQ3ZWIiIC8+CiAgICA8Y2lyY2xlIGN4PSI5MCIgY3k9IjY1IiByPSIzMiIgZmlsbD0iIzRhNjE4NSIgLz4KICAgIDxjaXJjbGUgY3g9IjkwIiBjeT0iNjUiIHI9IjIwIiBmaWxsPSIjOWJjMWZmIiAvPgogICAgPGNpcmNsZSBjeD0iOTAiIGN5PSI2NSIgcj0iMTAiIGZpbGw9IiMxYzRjZGUiIC8+CiAgICA8Y2lyY2xlIGN4PSI4NyIgY3k9IjYyIiByPSI0IiBmaWxsPSIjZmZmZmZmIiBvcGFjaXR5PSIwLjgiIC8+CiAgPC9nPgoKICA8ZyBpZD0iY2FibGUtYW5kLXBsdWciPgogICAgPHBhdGggZD0iTSAxMTUgMTIwIFEgMTQwIDEyMCwgMTUwIDk1IFQgMTk1IDk1IiBmaWxsPSJub25lIiBzdHJva2U9IiNhOWJhZDYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAvPgogICAgPHJlY3QgeD0iMTk1IiB5PSI5MiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgZmlsbD0iIzhjYTJjNCIgLz4KICAgIDxyZWN0IHg9IjIwMSIgeT0iODciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgcng9IjIiIGZpbGw9IiNjYmQ3ZWIiIC8+CiAgICA8cmVjdCB4PSIyMTciIHk9IjkwIiB3aWR0aD0iNiIgaGVpZ2h0PSIzIiBmaWxsPSIjNjA3OTlmIiAvPgogICAgPHJlY3QgeD0iMjE3IiB5PSIxMDAiIHdpZHRoPSI2IiBoZWlnaHQ9IjMiIGZpbGw9IiM2MDc5OWYiIC8+CiAgPC9nPgoKICA8ZyBpZD0iZXJyb3Itc3RhdHVzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOTUsIDEwMCkiPgogICAgPGNpcmNsZSBjeD0iMCIgY3k9IjAiIHI9IjEyIiBmaWxsPSIjZmZmZmZmIiBvcGFjaXR5PSIwLjMiLz4KICAgIDxjaXJjbGUgY3g9IjAiIGN5PSIwIiByPSIxMSIgZmlsbD0iIzFjNGNkZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIC8+CiAgICA8Y2lyY2xlIGN4PSIwIiBjeT0iMCIgcj0iOCIgZmlsbD0iIzJmN2RmZiIgLz4KICAgIDxwYXRoIGQ9Ik0gLTQgLTQgTCA0IDQgTSA0IC00IEwgLTQgNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgLz4KICA8L2c+Cjwvc3ZnPgo=)}.cap[data-v-6ebd5cbf]{font-size:13px;color:var(--sub)}
+body{--app: var(--color-fill-1);--panel: var(--color-bg-1);--panel2: var(--color-fill-2);--panel3: var(--color-fill-1);--line: var(--color-border-2);--line2: var(--color-border-1);--txt: var(--color-text-1);--txt2: var(--color-text-2);--sub: var(--color-text-3);--mute: var(--color-text-4);--accent: rgb(var(--primary-6));--accent-soft: rgb(var(--primary-1));--accent-deep: rgb(var(--primary-7));--success: rgb(var(--green-6));--warning: rgb(var(--orange-6));--danger: rgb(var(--red-6));--topbar: rgb(var(--primary-6));--video: var(--color-fill-2);--video-line: var(--color-border-1);--scroll: var(--color-border-3);--header-h: 76px;--header-pad: 28px;--sider-w: 256px;--rpanel-w: 272px;--ops-side-w: 200px;--nav-min-w: 240px}.sr-h[data-v-39ec7a9e]{flex:none;width:100%;height:var(--header-h);z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 var(--header-pad);background:var(--topbar)}.sr-h__left[data-v-39ec7a9e]{flex:0 0 auto;display:flex;align-items:center;gap:12px}.sr-h__logo[data-v-39ec7a9e]{display:inline-flex;align-items:center;line-height:0}.sr-h__logo img[data-v-39ec7a9e]{display:block;height:32px;width:auto}.sr-h__brand[data-v-39ec7a9e]{display:flex;flex-direction:column;justify-content:center}.sr-h__title[data-v-39ec7a9e]{margin:0;font-size:26px;font-weight:700;letter-spacing:.04em;color:#fff;line-height:1.1;white-space:nowrap}.sr-h__sub[data-v-39ec7a9e]{margin:4px 0 0;font-size:8px;font-weight:400;letter-spacing:.2em;color:#ffffffbf;text-transform:uppercase;white-space:nowrap}.sr-h__nav[data-v-39ec7a9e]{flex:1 1 auto;display:flex;justify-content:center;align-items:center;min-width:var(--nav-min-w);overflow:hidden}.sr-h__navframe[data-v-39ec7a9e]{display:flex;align-items:center;gap:6px;flex:none}.sr-h__item[data-v-39ec7a9e]{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:7px 15px;border-radius:8px;background:transparent;color:#fff;font-size:14px;font-weight:500;line-height:1.6;letter-spacing:.02em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}.sr-h__item[data-v-39ec7a9e]:hover{background:#ffffff1a;color:#fff}.sr-h__item.router-link-active[data-v-39ec7a9e],.sr-h__item.is-active[data-v-39ec7a9e]{background:var(--accent-deep);color:#fff}.sr-h__ico[data-v-39ec7a9e]{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.sr-h__ico[data-v-39ec7a9e] svg{display:block;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.sr-h__ico[data-v-39ec7a9e] .pl{fill:currentColor;stroke:none}.sr-h__right[data-v-39ec7a9e]{flex:0 0 auto;display:flex;align-items:center;gap:14px}.sr-h__weather[data-v-39ec7a9e]{display:flex;align-items:center;gap:8px;color:#fff}.sr-h__wico svg[data-v-39ec7a9e]{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.sr-h__wtext[data-v-39ec7a9e]{display:flex;flex-direction:column;gap:2px;line-height:1.15}.sr-h__temp[data-v-39ec7a9e]{font-size:18px;color:#fff;white-space:nowrap}.sr-h__cond[data-v-39ec7a9e]{font-size:14px;color:#ffffffeb;white-space:nowrap}.sr-h__wind[data-v-39ec7a9e]{display:flex;flex-direction:column;gap:2px;line-height:1.15;color:#fff}.sr-h__wdir[data-v-39ec7a9e]{font-size:14px;color:#fff;white-space:nowrap}.sr-h__wlvl[data-v-39ec7a9e]{font-size:14px;color:#ffffffeb;white-space:nowrap}.sr-h__div[data-v-39ec7a9e]{width:1px;height:36px;background:#ffffff59;flex-shrink:0}.sr-h__clock[data-v-39ec7a9e]{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;color:#fff}.sr-h__time[data-v-39ec7a9e]{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;color:#fff;letter-spacing:.03em}.sr-h__date[data-v-39ec7a9e]{margin-top:2px;font-size:9px;color:#ffffffd9;letter-spacing:.03em}.sr-h__bellwrap[data-v-39ec7a9e]{position:relative;display:inline-flex;align-items:center}.sr-h__bell[data-v-39ec7a9e]{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}.sr-h__bell svg[data-v-39ec7a9e]{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.sr-h__bellwrap[data-v-39ec7a9e] .arco-badge-number,.sr-h__bellwrap[data-v-39ec7a9e] .arco-badge-text{min-width:20px;height:14px;padding:0 6px;color:var(--color-white);font-weight:500;font-size:10px;line-height:14px;background-color:rgb(var(--danger-6));box-shadow:0 0 0 2px var(--color-bg-2)}.sr-h__bellpop[data-v-39ec7a9e]{position:absolute;top:calc(100% + 12px);right:-8px;min-width:320px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 40px #0f2e592e;overflow:hidden;z-index:40}.sr-h__bell-empty[data-v-39ec7a9e]{padding:40px 16px;text-align:center;color:var(--mute);font-size:13px}.sr-h__tools[data-v-39ec7a9e]{position:relative;display:flex;align-items:center}.sr-h__menubtn[data-v-39ec7a9e]{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:none;background:transparent;cursor:pointer;border-radius:6px;transition:background .15s}.sr-h__menubtn[data-v-39ec7a9e]:hover{background:#ffffff1f}.sr-h__menubtn img[data-v-39ec7a9e]{display:block;width:24px;height:24px;object-fit:contain}.sr-h__menubtn svg[data-v-39ec7a9e]{width:30px;height:30px;fill:#fff}.sr-h__menu[data-v-39ec7a9e]{position:absolute;top:calc(100% + 10px);right:0;min-width:176px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0f2e5926;padding:6px;z-index:40}.sr-h__mhead[data-v-39ec7a9e]{padding:8px 12px 6px;font-size:12px;color:var(--sub)}.sr-h__msep[data-v-39ec7a9e]{height:1px;background:var(--line2);margin:5px 8px}.sr-h__mitem[data-v-39ec7a9e]{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:7px;font-size:13.5px;color:var(--txt2);cursor:pointer;white-space:nowrap}.sr-h__mitem[data-v-39ec7a9e]:hover{background:var(--accent-soft);color:var(--accent)}.sr-h__mitem.danger[data-v-39ec7a9e]{color:var(--danger)}.sr-h__mitem.danger[data-v-39ec7a9e]:hover{background:rgb(var(--red-1));color:var(--danger)}.sr-h__mico[data-v-39ec7a9e]{display:inline-flex}.sr-h__mico[data-v-39ec7a9e] svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.res[data-v-05bca26c]{flex:none;width:256px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.res-tabs[data-v-05bca26c]{flex:none;display:flex;border-bottom:1px solid var(--line)}.res-tabs a[data-v-05bca26c]{flex:1;text-align:center;padding:13px 0;font-size:13.5px;color:var(--sub);cursor:pointer;position:relative}.res-tabs a.active[data-v-05bca26c]{color:var(--accent);font-weight:600}.res-tabs a.active[data-v-05bca26c]:after{content:"";position:absolute;left:50%;bottom:-1px;transform:translate(-50%);width:26px;height:2px;border-radius:2px;background:var(--accent)}.res-pad[data-v-05bca26c]{padding:12px 12px 4px;display:flex;flex-direction:column;gap:10px}.res-listhead[data-v-05bca26c]{display:flex;align-items:center;padding:6px 12px 8px;font-size:13px;color:var(--sub)}.res-listhead b[data-v-05bca26c]{font-weight:600}.res-acts[data-v-05bca26c]{margin-left:auto;display:flex;gap:12px;color:var(--mute);font-size:15px}.res-acts[data-v-05bca26c] svg{cursor:pointer}.res-acts[data-v-05bca26c] svg:hover{color:var(--accent)}.res-tree[data-v-05bca26c]{flex:1;overflow-y:auto;padding:0 6px 8px}.res-cnt[data-v-05bca26c]{color:var(--mute);font-size:12px}.ptz[data-v-05bca26c]{flex:none;border-top:1px solid var(--line);padding:12px 14px 16px}.ptz-head[data-v-05bca26c]{display:flex;align-items:center;font-size:13px;color:var(--sub);margin-bottom:12px}.ptz-chev[data-v-05bca26c]{margin-left:auto}.joy[data-v-05bca26c]{width:120px;height:120px;margin:0 auto;border-radius:50%;background:var(--panel2);border:1px solid var(--line);position:relative;display:flex;align-items:center;justify-content:center}.joy[data-v-05bca26c]:before{content:"";position:absolute;top:14px;right:14px;bottom:14px;left:14px;border-radius:50%;border:1px dashed var(--line)}.joy .knob[data-v-05bca26c]{width:46px;height:46px;border-radius:50%;background:var(--panel);border:1px solid var(--line);box-shadow:0 2px 8px #1432641f}.joy .ar[data-v-05bca26c]{position:absolute;color:var(--mute);display:flex;cursor:pointer}.joy .ar[data-v-05bca26c]:hover{color:var(--accent)}.joy .up[data-v-05bca26c]{top:7px;left:50%;transform:translate(-50%)}.joy .dn[data-v-05bca26c]{bottom:7px;left:50%;transform:translate(-50%)}.joy .lf[data-v-05bca26c]{left:8px;top:50%;transform:translateY(-50%)}.joy .rt[data-v-05bca26c]{right:8px;top:50%;transform:translateY(-50%)}.speed[data-v-05bca26c]{margin-top:14px;font-size:12px;color:var(--sub);display:flex;align-items:center;gap:10px}.speed b[data-v-05bca26c]{color:var(--accent);font-weight:600}.zoom[data-v-05bca26c]{margin-top:12px;display:flex;gap:10px}.wall[data-v-6ebd5cbf]{width:100%;height:100%;display:grid;gap:0;background:var(--app)}.cell[data-v-6ebd5cbf]{background:var(--video);border:1px solid var(--video-line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--sub);position:relative;overflow:hidden;cursor:pointer}.cell.active[data-v-6ebd5cbf]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.nosrc[data-v-6ebd5cbf]{width:55%;max-width:170px;aspect-ratio:24 / 15;background:center / contain no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNDAgMTUwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIj4KICA8cGF0aCBkPSJNIDMwIDgwIEwgMzIgODUgTCAzNyA4NyBMIDMyIDg5IEwgMzAgOTQgTCAyOCA4OSBMIDIzIDg3IEwgMjggODUgWiIgZmlsbD0iIzliYzFmZiIgb3BhY2l0eT0iMC42Ii8+CiAgPHBhdGggZD0iTSAxNzAgNTAgTCAxNzEuNSA1NCBMIDE3NS41IDU1LjUgTCAxNzEuNSA1NyBMIDE3MCA2MSBMIDE2OC41IDU3IEwgMTY0LjUgNTUuNSBMIDE2OC41IDU0IFoiIGZpbGw9IiM5YmMxZmYiIG9wYWNpdHk9IjAuNiIvPgoKICA8ZWxsaXBzZSBjeD0iOTAiIGN5PSIxMjUiIHJ4PSI0NSIgcnk9IjUiIGZpbGw9IiNkMmRhZjAiIG9wYWNpdHk9IjAuNCIgLz4KCiAgPGcgaWQ9ImNhbWVyYSI+CiAgICA8cGF0aCBkPSJNIDYwIDEyMCBDIDYwIDExNSwgMTIwIDExNSwgMTIwIDEyMCBaIiBmaWxsPSIjYTliYWQ2IiAvPgogICAgPHJlY3QgeD0iNjUiIHk9IjEyMCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjQiIHJ4PSIyIiBmaWxsPSIjOGNhMmM0IiAvPgogICAgPHJlY3QgeD0iODUiIHk9IjEwMCIgd2lkdGg9IjEwIiBoZWlnaHQ9IjE2IiBmaWxsPSIjOGNhMmM0IiAvPgogICAgPGNpcmNsZSBjeD0iOTAiIGN5PSI2NSIgcj0iNDAiIGZpbGw9IiNjYmQ3ZWIiIC8+CiAgICA8Y2lyY2xlIGN4PSI5MCIgY3k9IjY1IiByPSIzMiIgZmlsbD0iIzRhNjE4NSIgLz4KICAgIDxjaXJjbGUgY3g9IjkwIiBjeT0iNjUiIHI9IjIwIiBmaWxsPSIjOWJjMWZmIiAvPgogICAgPGNpcmNsZSBjeD0iOTAiIGN5PSI2NSIgcj0iMTAiIGZpbGw9IiMxYzRjZGUiIC8+CiAgICA8Y2lyY2xlIGN4PSI4NyIgY3k9IjYyIiByPSI0IiBmaWxsPSIjZmZmZmZmIiBvcGFjaXR5PSIwLjgiIC8+CiAgPC9nPgoKICA8ZyBpZD0iY2FibGUtYW5kLXBsdWciPgogICAgPHBhdGggZD0iTSAxMTUgMTIwIFEgMTQwIDEyMCwgMTUwIDk1IFQgMTk1IDk1IiBmaWxsPSJub25lIiBzdHJva2U9IiNhOWJhZDYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAvPgogICAgPHJlY3QgeD0iMTk1IiB5PSI5MiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgZmlsbD0iIzhjYTJjNCIgLz4KICAgIDxyZWN0IHg9IjIwMSIgeT0iODciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgcng9IjIiIGZpbGw9IiNjYmQ3ZWIiIC8+CiAgICA8cmVjdCB4PSIyMTciIHk9IjkwIiB3aWR0aD0iNiIgaGVpZ2h0PSIzIiBmaWxsPSIjNjA3OTlmIiAvPgogICAgPHJlY3QgeD0iMjE3IiB5PSIxMDAiIHdpZHRoPSI2IiBoZWlnaHQ9IjMiIGZpbGw9IiM2MDc5OWYiIC8+CiAgPC9nPgoKICA8ZyBpZD0iZXJyb3Itc3RhdHVzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOTUsIDEwMCkiPgogICAgPGNpcmNsZSBjeD0iMCIgY3k9IjAiIHI9IjEyIiBmaWxsPSIjZmZmZmZmIiBvcGFjaXR5PSIwLjMiLz4KICAgIDxjaXJjbGUgY3g9IjAiIGN5PSIwIiByPSIxMSIgZmlsbD0iIzFjNGNkZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIC8+CiAgICA8Y2lyY2xlIGN4PSIwIiBjeT0iMCIgcj0iOCIgZmlsbD0iIzJmN2RmZiIgLz4KICAgIDxwYXRoIGQ9Ik0gLTQgLTQgTCA0IDQgTSA0IC00IEwgLTQgNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgLz4KICA8L2c+Cjwvc3ZnPgo=)}.cap[data-v-6ebd5cbf]{font-size:13px;color:var(--sub)}.sr-content[data-v-a8cca886]{width:100%;height:calc(100% - var(--header-h));display:flex;min-height:0;overflow:hidden}.sr-content[data-v-a8cca886]>*{flex:1;min-width:0;min-height:0}.sr-content-area[data-v-e7160bcf]{flex:1;min-width:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 2px 12px #0f2e590f}.sr-content-area.flush[data-v-e7160bcf]{border:none;border-radius:0;box-shadow:none}.sr-content-area__body[data-v-e7160bcf]{flex:1;min-height:0}.sr-monitor[data-v-1419f1f1]{flex:1;display:flex;min-height:0;min-width:0;padding:8px;gap:8px}.sr-monitor.flush[data-v-1419f1f1]{padding:0;gap:0}.sr-side[data-v-b64f19e9]{position:relative;flex:none;display:flex;flex-direction:column;min-height:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 2px 12px #0f2e590f}.sr-side.flush[data-v-b64f19e9]{border:none;border-radius:0;box-shadow:none}.sr-side.flush.left[data-v-b64f19e9]{border-right:1px solid var(--line)}.sr-side.flush.right[data-v-b64f19e9]{border-left:1px solid var(--line)}.sr-side__head[data-v-b64f19e9]{flex:none;height:48px;display:flex;align-items:center;padding:0 16px;font-size:14px;font-weight:600;color:var(--txt);border-bottom:1px solid var(--line)}.sr-side__body[data-v-b64f19e9]{flex:1;min-height:0;display:flex;flex-direction:column}.sr-side__foot[data-v-b64f19e9]{flex:none;height:46px;display:flex;align-items:center;border-top:1px solid var(--line)}.sr-side__resizer[data-v-b64f19e9]{position:absolute;top:0;bottom:0;width:6px;cursor:col-resize;z-index:5}.sr-side__resizer.left[data-v-b64f19e9]{right:0}.sr-side__resizer.right[data-v-b64f19e9]{left:0}.sr-side__resizer[data-v-b64f19e9]:after{content:"";position:absolute;top:0;bottom:0;width:2px;background:transparent;transition:background .15s}.sr-side__resizer.left[data-v-b64f19e9]:after{right:0}.sr-side__resizer.right[data-v-b64f19e9]:after{left:0}.sr-side__resizer[data-v-b64f19e9]:hover:after{background:rgb(var(--primary-5))}.sr-toolbar[data-v-21d717eb]{flex:none;display:flex;align-items:center;gap:6px;padding:0 12px;background:var(--panel);border-top:1px solid var(--line)}.sr-toolbar__seg[data-v-21d717eb]{display:flex;align-items:center;gap:6px}.sr-toolbar__left[data-v-21d717eb]{flex:1;justify-content:flex-start;min-width:0}.sr-toolbar__center[data-v-21d717eb]{flex:0 0 auto;justify-content:center}.sr-toolbar__right[data-v-21d717eb]{flex:1;justify-content:flex-end;min-width:0}