/* ==========================================================================
   应用壳样式：1:1 取自原 V1.38 shared/wb.css + shared/wb.theme.css（壳相关规则）
   作用域：demo-bar / layout / side / top —— 与 Vue 内容页样式互不干扰
   说明：本文件由 _compare/gen_shell_css.py 生成，请勿手改；改抽取逻辑后重跑脚本
   ========================================================================== */

/* ---------- 壳层令牌（取值同原 wb.theme.css :root；仅作用于壳容器，避免污染内容页） ---------- */
.demo-bar, .layout > .side, .layout > .main > .top {
  --font: "Inter", "Noto Sans SC", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  --bg: #FFFFFF;
  --bg-page: #FAFBFE;
  --bg-2: #F5F7FA;
  --card: #FFFFFF;
  --glass: rgba(255, 255, 255, .86);
  --line: #E6EAF2;
  --line-2: #EFF2F8;
  --ink: #0B1220;
  --ink-1: #0B1220;
  --ink-2: #3A4457;
  --ink-3: #8A93A6;
  --gray-300: #D9DFE9;
  --gray-600: #3A4457;
  --gray-700: #222B3D;
  --gray-800: #0B1220;
  --primary: #1D4ED8;
  --primary-dark: #1E3A8A;
  --primary-light: #EFF4FF;
  --primary-lite: #466EDF;
  --accent: #1D4ED8;
  --accent-soft: rgba(29, 78, 216, .08);
  --sh-md: 0 12px 30px rgba(11, 18, 32, .07);
  --shadow: 0 12px 30px rgba(11, 18, 32, .07);
  --shadow-soft: 0 2px 10px rgba(11, 18, 32, .05);
  --shadow-hover: 0 12px 30px rgba(11, 18, 32, .10);
  --ease: cubic-bezier(.22, 1, .36, 1);
}
body.end-hospital .demo-bar,
body.end-hospital .layout > .side,
body.end-hospital .layout > .main > .top {
  --primary: #4F46E5;
  --primary-dark: #3730A3;
  --primary-light: #F4F4FF;
  --primary-lite: #6F67EA;
  --accent: #4F46E5;
  --accent-soft: rgba(79, 70, 229, .08);
}

/* wb.css */
.layout {position:relative;z-index:1;display:flex;height:100vh}
/* wb.css */
/* ===== 侧边栏（二级导航） ===== */
  .side {
    width:236px;flex:none;
    display:flex;flex-direction:column;
    padding:22px 14px 18px;
    background:var(--glass);
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
    border-right:1px solid rgba(255,255,255,.8);
  }
/* wb.css */
.logo {display:flex;align-items:center;gap:12px;padding:2px 10px 20px}
/* wb.css */
.logo-mark {
    width:40px;height:40px;border-radius:13px;flex:none;
    background:var(--ink);color:#fff;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 20px rgba(41,40,38,.16);
  }
/* wb.css */
.logo-name {font-size:15px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
/* wb.css */
.logo-sub {font-size:10.5px;color:var(--ink-3);margin-top:3px;letter-spacing:.6px;white-space:nowrap}
/* wb.css */
.nav {flex:1;display:flex;flex-direction:column;gap:3px;overflow-y:auto}
/* wb.css */
.nav-item {
    display:flex;align-items:center;gap:11px;
    padding:10px 13px;border-radius:13px;
    color:var(--gray-600);font-size:13.5px;font-weight:500;
    cursor:pointer;transition:all .2s ease;white-space:nowrap;
  }
/* wb.css */
.nav-item svg {width:17px;height:17px;flex:none}
/* wb.css */
.nav-item:hover {background:rgba(255,255,255,.8);color:var(--ink)}
/* wb.css */
.nav-item.active {background:var(--card);color:var(--ink);box-shadow:var(--shadow-soft);font-weight:600}
/* wb.css */
.nav-item.active::before {content:"";width:3px;height:15px;border-radius:99px;background:var(--ink);margin-right:-4px}
/* wb.css */
.nav-badge {margin-left:auto;font-size:10.5px;font-weight:600;padding:1px 8px;border-radius:999px;background:var(--bg-2);color:var(--ink-2)}
/* wb.css */
.side-user {
    margin-top:10px;padding:12px 13px;border-radius:16px;
    background:var(--card);border:1px solid var(--line);
    display:flex;align-items:center;gap:11px;cursor:pointer;
    transition:box-shadow .2s ease;position:relative;
  }
/* wb.css */
.side-user:hover {box-shadow:var(--shadow-soft)}
/* wb.css */
.user-menu {position:absolute;left:0;right:0;bottom:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;display:none;z-index:60;}
/* wb.css */
.user-menu.open {display:block;}
/* wb.css */
.user-menu .um-head {font-size:11px;color:var(--ink-3);padding:8px 10px 6px;white-space:nowrap;letter-spacing:.4px;}
/* wb.css */
.user-menu .um-item {display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:9px;font-size:12.5px;color:var(--gray-700);cursor:pointer;white-space:nowrap;transition:background .15s;}
/* wb.css */
.user-menu .um-item:hover {background:var(--bg-2);}
/* wb.css */
.avatar {
    width:36px;height:36px;border-radius:11px;flex:none;
    background:var(--bg-2);color:var(--ink);
    display:flex;align-items:center;justify-content:center;
    font-size:14px;font-weight:700;
  }
/* wb.css */
.side-user b {font-size:13px;font-weight:600;display:block;white-space:nowrap}
/* wb.css */
.side-user span {font-size:11px;color:var(--ink-3);display:block;white-space:nowrap}
/* wb.css */
/* ===== 主区 ===== */
  .main {flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}
/* wb.css */
/* 顶栏第一行 */
  .top {
    flex:none;display:flex;align-items:center;gap:14px;
    padding:14px 30px 10px;
  }
/* wb.css */
.crumb {font-size:13.5px;color:var(--ink-3);white-space:nowrap}
/* wb.css */
.crumb b {color:var(--ink);font-weight:600}
/* wb.css */
.crumb .sep {margin:0 8px;color:var(--line-2)}
/* wb.css */
.top-right {margin-left:auto;display:flex;align-items:center;gap:10px}
/* wb.css */
.ai-btn {
    display:flex;align-items:center;gap:7px;
    padding:9px 16px;border-radius:12px;border:none;cursor:pointer;
    background:var(--ink);color:#fff;font-size:13px;font-weight:600;
    transition:all .2s ease;white-space:nowrap;
  }
/* wb.css */
.ai-btn:hover {transform:translateY(-1px);box-shadow:0 8px 20px rgba(41,40,38,.20)}
/* wb.css */
.ai-btn svg {width:15px;height:15px}
/* wb.css */
/* ===== 顶部标签带 ===== */
  .tabs {
    flex:none;position:relative;
    display:flex;align-items:center;gap:4px;
    padding:4px 30px 0;
    overflow-x:auto;scrollbar-width:none;
  }
/* wb.css */
.tabs::-webkit-scrollbar {display:none}
/* wb.css */
/* ===== 内容区 ===== */
  .content {flex:1;overflow-y:auto;padding:26px 30px 44px;scrollbar-width:thin;color:var(--gray-800)}
/* wb.css */
@keyframes viewIn {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* wb.css */
.nav-item.dim {opacity:.5;}
/* wb.css */
.nav-item.dim:hover {opacity:1;}
/* wb.css */
@keyframes pageSlideR {from{opacity:0;transform:translateX(56px)}to{opacity:1;transform:translateX(0)}}
/* wb.css */
@keyframes pageSlideL {from{opacity:0;transform:translateX(-56px)}to{opacity:1;transform:translateX(0)}}
/* wb.css */
.content.anim-r {animation:pageSlideR .42s cubic-bezier(.2,.8,.2,1);}
/* wb.css */
.content.anim-l {animation:pageSlideL .42s cubic-bezier(.2,.8,.2,1);}
/* wb.css */
.ai-act {font-size:11.5px;padding:5px 12px;border-radius:999px;cursor:pointer;border:1px solid var(--line-2);background:#fff;color:var(--gray-700);font-family:inherit;transition:all .15s;}
/* wb.css */
.ai-act:hover {border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
/* wb.css */
#dashBig.open {display:block;animation:dashIn .45s ease-out both;}
/* wb.css */
#dashBig.open {display:block}
/* wb.css */
.nav-item.dim {opacity:.5}
/* wb.css */
.nav-item.dim:hover {opacity:1}
/* wb.css */
/* ---------- ⑦ 壳层细节补充 ---------- */
.logo-mark svg { width: 20px; height: 20px; display: block; }
/* wb.css */
.nav-item { position: relative; }
/* wb.theme.css */
body, .content, .content *, .side, .side *, .top, .top * {
    font-family: var(--font);
}
/* wb.theme.css */
/* ==========================================================================
   三、应用壳（参照 App Shell）
   ========================================================================== */
.layout { background: var(--bg-page); }
/* wb.theme.css */
/* ---------- 侧栏 ---------- */
.side {
    width: 238px;
    flex: 0 0 238px;
    padding: 0;
    background: #fff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-right: 1px solid var(--line);
}
/* wb.theme.css */
.logo {
    gap: 12px;
    height: 78px;
    padding: 0 20px;
    border-bottom: 1px solid var(--line);
    flex: none;
}
/* wb.theme.css */
.logo-mark {
    width: 38px; height: 38px;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    box-shadow: 0 6px 16px var(--accent-soft);
    transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
/* wb.theme.css */
.logo:hover .logo-mark { transform: translateY(-1px) scale(1.03); box-shadow: 0 10px 22px var(--accent-soft); }
/* wb.theme.css */
.logo-mark svg { width: 19px; height: 19px; }
/* wb.theme.css */
.logo-name { font-size: 15px; font-weight: 800; letter-spacing: .01em; color: var(--gray-800); }
/* wb.theme.css */
.logo-sub { font-size: 10px; color: var(--ink-3); letter-spacing: .8px; margin-top: 3px; }
/* wb.theme.css */
.nav {
    flex: 1;
    gap: 2px;
    padding: 0 12px 14px;
    overflow-y: auto;
}
/* wb.theme.css */
.nav-item svg { width: 17px; height: 17px; opacity: .85; }
/* wb.theme.css */
@media (hover: hover) and (pointer: fine) {
  .nav-item:hover svg { opacity: 1; }
}
/* wb.theme.css */
.nav-item.active::before { display: none; }
/* wb.theme.css */
.nav-item.dim { opacity: .45; }
/* wb.theme.css */
.nav-item.dim:hover { opacity: 1; }
/* wb.theme.css */
.nav-badge {
    margin-left: auto;
    font-size: 11px; font-weight: 700;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--primary-light);
    color: var(--primary-dark);
}
/* wb.theme.css */
.nav-item.active .nav-badge { background: rgba(255, 255, 255, .24); color: #fff; }
/* wb.theme.css */
/* 侧栏底部用户 */
.side-user {
    margin: 0;
    padding: 14px;
    border-radius: 0;
    background: #fff;
    border: none;
    border-top: 1px solid var(--line);
    align-items: center;
    gap: 10px;
    transition: background .2s var(--ease);
}
/* wb.theme.css */
.side-user:hover { background: var(--bg-2); box-shadow: none; }
/* wb.theme.css */
.side-user .avatar, .avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary-dark);
    font-size: 13px; font-weight: 800;
    border: none;
}
/* wb.theme.css */
.side-user b, .side-user b { font-size: 13.5px; font-weight: 700; color: var(--gray-800); }
/* wb.theme.css */
.side-user span { font-size: 11.5px; color: var(--ink-3); }
/* wb.theme.css */
.user-menu {
    border-radius: 14px;
    border: 1px solid var(--line);
    box-shadow: var(--sh-md);
    padding: 6px;
    bottom: calc(100% - 4px);
    left: 12px; right: 12px;
    animation: wbPop .2s var(--ease);
}
/* wb.theme.css */
@keyframes wbPop { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
/* wb.theme.css */
.user-menu .um-head { color: var(--ink-3); padding: 8px 10px 6px; }
/* wb.theme.css */
.user-menu .um-item { border-radius: 8px; color: var(--ink-2); transition: background .15s, color .15s; }
/* wb.theme.css */
.user-menu .um-item:hover { background: var(--bg-2); color: var(--gray-800); }
/* wb.theme.css */
/* ---------- 顶栏：sticky 毛玻璃 ---------- */
.top {
    height: 78px;
    padding: 0 32px;
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 20;
    flex: none;
}
/* wb.theme.css */
.crumb { font-size: 13px; color: var(--ink-3); }
/* wb.theme.css */
.crumb b { color: var(--gray-800); font-weight: 700; font-size: 15px; }
/* wb.theme.css */
.crumb .sep { color: var(--gray-300); margin: 0 8px; }
/* wb.theme.css */
.top-right { gap: 12px; }
/* wb.theme.css */
/* 主按钮（顶栏 AI） */
.ai-btn {
    padding: 10px 18px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    color: #fff;
    font-size: 13.5px; font-weight: 600;
    box-shadow: 0 6px 18px var(--accent-soft);
    transition: all .25s var(--ease);
}
/* wb.theme.css */
.ai-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 26px var(--accent-soft); filter: brightness(1.04); }
/* wb.theme.css */
.ai-btn svg { width: 15px; height: 15px; }
/* wb.theme.css */
/* ---------- 顶端标签：参照 tabs ---------- */
.tabs {
    padding: 0 32px;
    gap: 2px;
    background: #fff;
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 78px;
    z-index: 19;
    flex: none;
}
/* wb.theme.css */
/* ==========================================================================
   四、内容画布
   ========================================================================== */
.content {
    padding: 26px 32px 48px;
    background: var(--bg-page);
    color: var(--gray-700);
}
/* wb.theme.css */
@media (max-width: 900px) {
  .side { display: none; }
}
/* wb.theme.css */
/* ==========================================================================
   十六、演示系统顶端条（返回首页 + 平台标识；从介绍页进入后常驻）
   ========================================================================== */
.demo-bar {
    box-sizing: border-box;
    position: fixed;
    top: 0; left: 0; right: 0;
    /* 层级：在应用壳之上、弹层遮罩（600）/抽屉（610）/弹窗（620）/AI 面板（500）之下 */
    z-index: 449;
    height: 46px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 14px;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--line);
    /* 统一字体：与系统内部一致 */
    font-family: var(--font);
}
/* wb.theme.css */
.demo-bar .db-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink-1);
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 2px 8px var(--accent-soft);
    text-decoration: none;
    transition: all .2s var(--ease);
}
/* wb.theme.css */
.demo-bar .db-back:hover {
    transform: translateY(-1px);
    color: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 6px 16px var(--accent-soft);
}
/* wb.theme.css */
.demo-bar .db-back svg { width: 13px; height: 13px; stroke: currentColor; stroke-width: 2.2; fill: none; }
/* wb.theme.css */
.demo-bar .db-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    flex: none;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
}
/* wb.theme.css */
.demo-bar .db-title { font-size: 13px; font-weight: 700; color: var(--ink-2); letter-spacing: .01em; }
/* wb.theme.css */
/* 系统页：应用壳整体下移，视口高度扣除顶端条 */
.demo-bar + .layout { height: calc(100vh - 46px); margin-top: 46px; }
/* wb.theme.css */
#bigScreenWrap.on { opacity: 1; visibility: visible; }
/* wb.theme.css */
/* ==========================================================================
   侧栏一级/二级结构（顶部页签并入侧栏）
   ========================================================================== */
.nav-grp { display: flex; flex-direction: column; }
/* wb.theme.css */
.nav-grp-h {
    display: flex; align-items: center; gap: 11px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 14px; font-weight: 700;
    color: #334155;                    /* 原为 near-black，稍浅一档 */
    cursor: pointer;
    transition: background .2s var(--ease), color .2s var(--ease);
}
/* wb.theme.css */
.nav-grp-h > svg { width: 17px; height: 17px; opacity: .9; }
/* wb.theme.css */
/* 一级组名过长时单行省略，避免「院内医械成果转化」等名称折成两行 */
.nav-grp-h > span:not(.nav-tail) { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* wb.theme.css */
/* 尾部：数字徽标 + 右箭头。数字靠右、与箭头保持固定 8px 间距 */
.nav-tail { margin-left: auto; display: flex; align-items: center; gap: 8px; }
/* wb.theme.css */
.nav-tail .nav-badge { margin-left: 0; }
/* wb.theme.css */
.nav-grp-h .grp-caret { width: 14px; height: 14px; margin-left: 0; opacity: .45; transition: transform .25s var(--ease); }
/* wb.theme.css */
.nav-grp.open > .nav-grp-h { color: var(--primary); background: var(--primary-light); }
/* wb.theme.css */
.nav-grp.open > .nav-grp-h .grp-caret { transform: rotate(90deg); opacity: .8; }
/* wb.theme.css */
@media (hover: hover) and (pointer: fine) {
  .nav-grp-h:hover { background: var(--primary-light); color: var(--primary); }
}
/* wb.theme.css */
.nav-grp.open > .nav-grp-h .nav-badge { background: var(--primary); color: #fff; }
/* wb.theme.css */
/* 二级容器：收展动画（max-height 由实测高度 --h 驱动；DOM 稳定时切换 open 类即产生过渡） */
.nav-sub {
    display: flex; flex-direction: column; gap: 2px;
    margin: 0 0 0 14px;
    padding-left: 9px;
    border-left: 1px solid var(--line);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: max-height .34s var(--ease), opacity .2s var(--ease), margin .34s var(--ease),
        visibility 0s linear .36s;
}
/* wb.theme.css */
.nav-grp.open > .nav-sub {
    max-height: calc(var(--h, 420px) + 2px);
    opacity: 1;
    visibility: visible;
    margin: 4px 0 8px 14px;
    transition: max-height .36s var(--ease), opacity .26s var(--ease) .04s, margin .36s var(--ease),
        visibility 0s;
}
/* wb.theme.css */
.nav.no-anim .nav-sub { transition: none !important; }
/* wb.theme.css */
.nav-sub-g { padding: 8px 12px 4px; font-size: 10.5px; font-weight: 700; color: var(--ink-3); letter-spacing: .1em; }
/* wb.theme.css */
.nav-sub .nav-item { font-size: 13.5px; padding: 9px 12px; }
/* wb.theme.css */
/* 顶栏「大屏」按钮（进入演示大屏） */
.screen-btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 10px 16px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid var(--line);
    color: var(--ink-2);
    font-size: 13.5px; font-weight: 600;
    cursor: pointer;
    transition: all .25s var(--ease);
}
/* wb.theme.css */
.screen-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px var(--accent-soft);
}
/* wb.theme.css */
.screen-btn svg { width: 15px; height: 15px; }

/* ---------- 顶栏「演示数据」芯片（原 wb.theme.css 七、芯片） ---------- */
.chip {
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11.5px; font-weight: 600;
  background: #FEF3E2;
  color: #B45309;
  border: 1px solid rgba(180, 83, 9, .16);
}
.chip.demo { background: #FEF3E2; color: #B45309; border-color: rgba(180, 83, 9, .16); }
