/* ============================================================
   JoySpeech 桌面壳专属布局层（desktop layer）
   仅当 <html> 带 .desktop-shell 类时生效——该类由 static/desktop.js
   检测 UA（JoySpeech/x.y.z + Electron）挂载，浏览器用户零影响。
   例外：文末两段不按 UA、按指针类型圈定（见各自注释）——
     ① 「网页桌面尺寸标定」（鼠标 + ≥769px，派总 2026-11-01）
     ② 「窄屏桌面窗口」（鼠标 + ≤768px，派总 2026-10-31）
   两段都只对鼠标设备生效，手机 / 平板触控零影响。

   设计目标（派总 2026-10-30）：内容平铺一屏，不要整页滚轮浏览。
   框架：body 变 100dvh 纵向 flex —— 顶部导航静态、main 弹性滚动、
   footer 常驻底部；各页在此骨架上做面板化平铺。
   禁区提示：styles.css 为受保护文件，本层只做 .desktop-shell 作用域
   的覆盖，绝不直接修改 styles.css。
   ============================================================ */

/* ---------- 框架：应用壳三段式 ---------- */
html.desktop-shell,
html.desktop-shell body {
  height: 100%;
}

html.desktop-shell body {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overscroll-behavior: none;
}

/* 顶部导航：fixed → 静态 flex 子项，压扁到 52px */
html.desktop-shell .site-header {
  position: static;
  height: 52px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
  backdrop-filter: none;
}

html.desktop-shell .nav {
  height: 52px;
  max-width: min(1680px, calc(100% - 32px));
}

/* 「选择界面风格」那颗钮（.theme-palette）：2026-11-09 起坐进页头 .nav-actions，
   紧挨「夜览模式」左侧，不再是 fixed 悬浮球 ⇒ 壳里顶栏压扁到 52px 也不会和「退出」打架，
   原来这条 top:60px 的下移补丁随之作废。 */

/* 主内容区：唯一滚动容器 */
html.desktop-shell main {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

/* ---------- 页脚：整块收进「关于 JoySpeech」弹窗（派总 2026-11-04 项8）----------
   原话：「每个独立页面底部的 Footer 内容，都参照『个人中心』底部的『关于 JoySpeech』按钮，
   打包隐藏起来」⇒ 11-03 只做在个人中心，这轮推广到全站每一页。
   入口按钮 + 弹窗清单都由 desktop.js 在运行时从页面里那份 .footer 现抓现建：
   壳里不复制第二份链接清单，以后网页版加一条页脚链接，桌面版自动跟着有。
   ⚠️ 藏整块页脚之后，「哪些链接算裁掉」不能再只看链接自己的 display
   （display 不继承，祖先 none 时链接仍然算 inline）——
   desktop.js 改成连祖先一起判，所以下面这些 a[href*=...] / li 的隐藏规则
   同时就是弹窗清单的过滤器：学习 / 社区 / 言值 / 兑换 一条都不会溜进弹窗。 */
html.desktop-shell .footer {
  display: none;
}

/* 弹层/公告条照常浮在最上 */
html.desktop-shell .modal { position: fixed; }

/* 容器放宽：吃满桌面视口 */
html.desktop-shell .container {
  max-width: min(1680px, calc(100% - 48px));
}

/* info 类页面原为整页滚动 + padding-top:64px（给 fixed header 让位），
   桌面壳 header 已静态，去掉让位 */
html.desktop-shell .info-page {
  padding-top: 0;
}

/* 滚动条：细而收敛 */
html.desktop-shell ::-webkit-scrollbar { width: 9px; height: 9px; }
html.desktop-shell ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: content-box;
}
html.desktop-shell ::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, 0.3); }
html.desktop-shell ::-webkit-scrollbar-track { background: transparent; }

/* 夜览下的滚动条 */
html.desktop-shell[data-night="true"] ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.22); background-clip: content-box; }

/* ---------- 会议翻译页：一屏平铺 ---------- */
/* 原：fixed header 64 + sticky 工具条 + main min-height calc(100vh-64-60-80) + fixed 底栏 */
html.desktop-shell .meeting-full-toolbar {
  position: static;
  margin-top: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* 空态指引（派总 2026-11-03 项1）：这里**不再**用 visibility:hidden + ::after 换文案。
   那套做法有两处硬伤：①「音视频选项卡 / 窗口 / 整个屏幕」三项释义整块被藏掉 ⇒ 桌面版信息缺失；
   ②::after 只带 font-weight，字号/行高/色/字体族是另起一段样式 ⇒ 与网页版字体不一致。
   现在文案由 meeting.js 的 transcriptEmptyHtml() 按 JOY_DESKTOP 分支给出，
   用的是同一套 class（.transcript-start-hint / .pickup-guide-*）⇒ 版式与网页版天然同源。 */

html.desktop-shell .meeting-toolbar-inner {
  width: min(1760px, calc(100% - 32px));
  padding: 8px 0;
}

html.desktop-shell main.meeting-page {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  width: min(1760px, calc(100% - 32px));
  padding: 10px 0 12px;
  margin: 0 auto;
  margin-bottom: 0;
  overflow: hidden;
}

/* 底部功能条：fixed → 静态 flex 子项，收成圆角悬浮条。
   纵向节奏与浏览器版**同一组数值**（min-height 48 + 上下 4.5px），
   壳里只额外加圆角/描边/投影与左右 16px 让位 —— 派总 2026-11-04 项1：
   按钮的高度、留白、位置都要和网页版一样，壳不参与二次设计。 */
html.desktop-shell .meeting-bottom-bar {
  position: static;
  margin: 0 16px 10px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 14px;
  min-height: 48px;
  padding: 4.5px 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

/* ---------- 底栏排布：壳里不再自造一套（派总 2026-11-04 项1）----------
   2026-11-03 项4 曾在壳里把底栏改成 flex + space-between，用来躲开
   meeting.html 那版 grid `1fr auto 1fr` 的静默溢出（右区自然宽 567.2 压不进
   527/484 的轨道 ⇒ 「清空聊天」盖在「错词」输入框上，实测 1352 重叠 14px）。
   但那让中区偏离几何中心 89.6px —— 与浏览器版长得不是一回事。
   现在根因在源头修掉（meeting.html：四个术语/纠词输入框由刚体 flex:0 0 60px
   改成 0 1 60px、可缩到 40px），右区装得下轨道，grid 不再溢出 ⇒
   壳直接沿用浏览器版的 grid：中区居中、左右贴边、任何宽度不重叠，两版逐像素同源。
   下面「按序隐藏」闸门留着当兜底（字体缩放 / 以后组件变宽时先让次要组件让位）。 */

/* 底栏四按钮（麦克风 / 开始·暂停翻译 / 停止⏹ / 清空聊天）在壳里不另做版式
   —— 派总 2026-11-04 项1「默认完整显示（不要默认缩略显示），样式务必 100% 与浏览器版相同」。
   这里曾把「开始翻译 / 清空聊天」压成 font-size:0 的 36px 图标块、把 ⏹ 改成自绘描边小方，
   那是壳独有的一套：浏览器版能看到的文字在壳里消失了，正是被否掉的「缩略显示」。
   删干净后这四个按钮完全走 meeting.html + styles.css 的浏览器原样式，
   壳里连「自己的那一套底栏排布」都不留（见上面那段），两版同一份版式。 */

/* 按序隐藏闸门（顺序照派总指定：纠词 → 词条术语 → 历史对话 → Speaker → 子组织）。
   兜底用：底栏 ≥1280 走浏览器版 grid，四个纠词/术语输入框可缩到 40px，
   正常窗口（壳最小 1280）全部展开且不重叠；只有字号被系统放大、
   或以后组件变宽、缩输入框也不够时，才由这几档把次要组件收掉。 */
@media (hover: hover) and (pointer: fine) and (max-width: 1192px) {
  html.desktop-shell #meetingBottomBar .bottom-correction-group { display: none; }
}

@media (hover: hover) and (pointer: fine) and (max-width: 995px) {
  html.desktop-shell #meetingBottomBar .bottom-terminology-group { display: none; }
}

@media (hover: hover) and (pointer: fine) and (max-width: 619px) {
  html.desktop-shell #meetingBottomBar #historyBtn { display: none; }
}

@media (hover: hover) and (pointer: fine) and (max-width: 548px) {
  html.desktop-shell #meetingBottomBar #speakerBtn { display: none; }
}

@media (hover: hover) and (pointer: fine) and (max-width: 477px) {
  html.desktop-shell #meetingBottomBar #subOrgBtn { display: none; }
}

/* ---------- 营销页/内容页：压缩纵向节奏，首屏平铺 ---------- */
/* 原 .section 纵向 padding 为 --joy-s-10（96px），桌面视口里太浪费 */
html.desktop-shell .section {
  padding: 40px 0;
}

html.desktop-shell .section-header {
  margin-bottom: 28px;
}

/* hero：header 已静态，去掉 fixed 让位；高度收敛为「首屏 - 头尾」 */
html.desktop-shell .hero {
  min-height: calc(100dvh - 100px);
  padding-top: var(--joy-s-6);
}

/* ---------- 学习中心：放宽容器、压实 hero ---------- */
html.desktop-shell .learning-app {
  max-width: min(1400px, calc(100% - 48px));
}

html.desktop-shell .learning-hero {
  padding: 28px 0 18px;
}

/* ---------- 社区：压实 hero ---------- */
html.desktop-shell .info-page .community-hero {
  padding: 22px 0 18px;
}

/* ---------- 桌面版不进应用的板块：入口一律藏掉 ----------
   与 desktop/main.js 的 DENIED_PATH_PREFIXES 同一份口径：那边拦「跳转」，这边连入口都不给看见。
   用 /learning、/community 通配（不是精确路径）：页面里既有 /learning/ 也有 ?tab= 之类带尾参数的链接。
   派总 2026-11-04 项7/9 补两条：言值体系（/points-guide）与兑换商城（/exchange）
   属社区激励，与「翻译 + 使用介绍 + 账号设置 + 套餐购买」无关 ⇒ 同样连入口都不给。
   这两条同时是「关于」弹窗的过滤器：desktop.js 抓页脚清单时按「自己和祖先的 display」判，
   被这里藏掉的链接不会溜进弹窗（页脚整块 display:none 之后，只看链接自己会一条不剩地全漏进去）。 */
html.desktop-shell a[href*="/learning"],
html.desktop-shell a[href*="/community"],
html.desktop-shell a[href*="/points-guide"],
html.desktop-shell a[href*="/exchange"],
html.desktop-shell a[href*="/s/"] {
  display: none !important;
}

/* ---------- 顶栏菜单：壳里只给三类入口（派总 2026-11-04 项7 定四类，2026-11-07 项4 删掉「个人中心」）----------
   「exe 只保留纯粹的翻译功能、使用介绍、以及账号设置、套餐购买相关的页面内容」
   ⇒ 菜单 = 会议翻译 / 使用介绍 / 常见问题 / 下载 / 套餐购买（desktop.js 插的 .js-desktop-nav-item），
   网页版那份（能力 / 应用 / 工作流 / 价格 / 学习 / 社区）在壳里让位，内容页一个没删，
   入口收在菜单最右侧那颗「关于 JoySpeech」弹窗里（2026-11-11 从页面底部挪上来）。
   「个人中心」不占菜单位：右上角 .nav-actions 的 #navProfile 一直是全站账号入口的位置，
   菜单里再放一颗就变成同一屏两个同名按钮（派总 11-07 项4 点名的就是这一处）。
   用「藏」不用「删」，而且**不许**清 .nav-links 的内容：会议页那颗 #navFeedbackBtn
   的点击是 meeting.js 绑的，重建 DOM 就把绑定一起清掉 ⇒ 又一颗点了没反应的按钮。
   :not(#navFeedbackBtn) 放过「反馈」：它是会议页自己的动作（弹本页反馈面板），
   不是页面入口，菜单口径管不着它；把它藏了才是真的少入口（11-03「exe 偷工减料」同款事故）。
   🔴 :not(.js-desktop-about-trigger) 必须一起放过：这颗是 button 不是 a，
   少了它「关于」会被下面这条规则整个藏掉，变成「挪了但看不见」的假上线。 */
html.desktop-shell .nav-links > :not(.js-desktop-nav-item):not(#navFeedbackBtn):not(.js-desktop-about-trigger) {
  display: none;
}

html.desktop-shell .js-desktop-nav-item.is-current {
  color: var(--joy-primary, #009999);
  font-weight: 600;
}

/* ---------- 桌面版收掉的控件 ----------
   ① 「痛点·爽点」右侧竖标签：基线 fixed right:0 top:50%，网页版整页滚动时它压在正文右缘；
      桌面版是面板平铺一屏，它正好盖在「内容总结」面板身上（派总 2026-11-03 截图里那条绿块）。
      反馈入口不丢：会议页顶栏有「反馈」，其它页页脚有「在线客服 / 提交反馈」。
   ② 「浮窗」= Document PiP。Electron 33 只挂了 API 没有实现，requestWindow 实测必报
      "Internal error: no window"（取证：.workbuddy/tmp/func_shell_1103.json 的 err 字段），
      还会先把正在工作的原生置顶字幕窗收掉。
      派总 2026-11-03 项6：按钮不该因此消失 ⇒ 壳自己给一颗置顶小窗（desktop/main.js 的
      createPipWindow，加载 ?joy_pip=1 宿主页面），版式仍由 meeting.js 的 buildPipContent 独家渲染。
      这颗开关只在探到 `joyDesktop.pip` 时才亮：desktop.js 给 <html> 挂 `js-desktop-has-pip`。
      老版壳（1.1.2 及以前）没有这条通道 ⇒ 按钮继续藏着，不会摆一颗点了没反应的开关。
      层级：浮窗用 'floating'，置顶字幕窗用 'screen-saver' ⇒ 字幕永远压得住浮窗。 */
html.desktop-shell .feedback-tab {
  display: none !important;
}

html.desktop-shell:not(.js-desktop-has-pip) #floatWindowBtn {
  display: none !important;
}

/* ---------- 个人中心：两列仪表盘（派总 2026-11-03 项7「不适配应用界面」）----------
   真壳实测（vw 1352）：.pc-grid 只有两个子节点 —— 左列（头像 + 签到 + 个人信息 +
   账号信息 + 账号安全，自然高 1945）与右列（套餐余量 / 升级 / 内容资产 / 使用记录，1287）。
   上一版按「三列」写栅格 ⇒ 第三列永远是空的，右侧 1/3 屏幕整片白，
   同时把右列压到 408px 宽（网页版是 812px），套餐卡片里的表格被挤得换行。
   正解：照 DOM 的真实结构排两列，右列吃满剩余宽度。 */
html.desktop-shell .pc-container .pc-grid {
  grid-template-columns: minmax(300px, 340px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

html.desktop-shell .pc-container .pc-card {
  padding: 18px;
}

/* hero：网页版那 160px 高的渐变带在应用窗口里太浪费（内容可视高只剩 436px）⇒ 压成一条 */
html.desktop-shell .pc-container .pc-header {
  padding: 18px 24px;
  margin-bottom: 16px;
}

html.desktop-shell .pc-container .pc-header h1 {
  font-size: 26px;
  margin: 0 0 4px;
}

html.desktop-shell .pc-container .pc-header p {
  margin: 0;
  font-size: 13px;
}

/* ---------- 项9：个人中心里与会议翻译无关的板块藏掉（派总 2026-11-04）----------
   「个人中心与会议翻译无关的内容，请隐藏，暂时不需要（将来若需要上线学习、社区功能时再使用）」
   ⇒ 言值体系那一套（每日签到 + 顶部「言值 N」徽章，徽章一点就跳 /exchange/）整块收掉；
     账号信息 / 账号安全 / 套餐余量 / 套餐升级 / 内容资产 / 术语导入 / 使用记录 全部照常。
   只藏不删：DOM 与 personal-center.js 的签到逻辑都在，将来放开只需删这两条规则。 */
html.desktop-shell .pc-container .checkin-section,
html.desktop-shell .pc-container .user-info-badge-points {
  display: none;
}

/* ---------- 页脚收进「关于」（派总 2026-11-03 项8，11-04 项8 推广到全站）----------
   整块页脚在应用窗口里吃掉 291px（占 864 高屏幕的 37%）。藏页脚本身已经并到文首
   那条全站规则（`html.desktop-shell .footer{display:none}`），这里只留「关于」入口与弹窗的版式。
   2026-11-11：入口从页面底部挪到顶部菜单最右侧，外观改成与 .nav-links a 同源。 */

/* 「关于」入口 + 弹窗（desktop.js 运行时从 .footer 现抓清单建出来）
   基础样式只在「没有 .nav-links 的纯文档页」兜底时生效（此时仍是一颗胶囊按钮）；
   坐进菜单后由下面那条 .nav-links > 的高特异性规则覆盖成菜单项外观。 */
html.desktop-shell .js-desktop-about-trigger {
  display: block;
  margin: 18px auto 6px;
  padding: 7px 18px;
  font-size: 13px;
  font-family: inherit;
  color: var(--joy-text-secondary, #63636a);
  background: #fff;
  border: 0.8px solid #e4e4e7;
  border-radius: 999px;
  cursor: pointer;
}

html.desktop-shell .js-desktop-about-trigger:hover {
  color: var(--joy-primary, #009999);
  border-color: var(--joy-primary, #009999);
}

/* 菜单里的「关于 JoySpeech」：逐项对齐 styles.css:273 的 .nav-links a。
   button 默认不继承字体族/行高、自带背景与边框 ⇒ 必须显式归零，
   否则菜单最右侧会冒出一颗与旁边文字链接不搭的圆角胶囊。 */
html.desktop-shell .nav-links > .js-desktop-about-trigger {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  white-space: nowrap;
  margin: 0;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  line-height: inherit;
  color: var(--joy-neutral-600);
  background: none;
  border: 0;
  border-radius: var(--joy-radius);
  transition: all var(--joy-transition-fast);
}

html.desktop-shell .nav-links > .js-desktop-about-trigger:hover {
  color: var(--joy-primary);
  background: var(--joy-primary-soft);
}

html.desktop-shell .js-desktop-about {
  position: fixed;
  inset: 0;
  z-index: 9500;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, .42);
}

html.desktop-shell .js-desktop-about.is-open { display: flex; }

html.desktop-shell .js-desktop-about-card {
  width: min(760px, 100%);
  max-height: min(80vh, 620px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
}

html.desktop-shell .js-desktop-about-head {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, .06);
}

html.desktop-shell .js-desktop-about-head h3 { margin: 0; font-size: 17px; }

html.desktop-shell .js-desktop-about-close {
  width: 30px;
  height: 30px;
  font-size: 20px;
  line-height: 1;
  color: #86868b;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

html.desktop-shell .js-desktop-about-close:hover { background: rgba(0, 0, 0, .05); color: #1d1d1f; }

html.desktop-shell .js-desktop-about-body {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 18px 24px;
  padding: 18px 20px 8px;
}

html.desktop-shell .js-desktop-about-body h4 { margin: 0 0 8px; font-size: 13px; }

html.desktop-shell .js-desktop-about-body ul { margin: 0; padding: 0; list-style: none; }

html.desktop-shell .js-desktop-about-body li { margin-bottom: 6px; }

/* 2026-11-09：「关于 → 检查更新」。body 是 auto-fit 网格，这一块独占整行。 */
html.desktop-shell .js-desktop-about-update {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  margin-bottom: 4px;
  background: #f2faf9;
  border: 1px solid #d7e5e7;
  border-radius: 10px;
  box-sizing: border-box;
}

html.desktop-shell .js-desktop-about-update-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
  color: var(--joy-text-secondary, #63636a);
}

html.desktop-shell .js-desktop-about-update-btn {
  min-height: 32px;
  padding: 6px 14px;
  border: 1px solid var(--joy-primary, #009999);
  border-radius: 8px;
  background: var(--joy-primary, #009999);
  color: #fff;
  font-size: 13px;
  cursor: pointer;
}

html.desktop-shell .js-desktop-about-update-btn:hover { background: #008080; border-color: #008080; }
html.desktop-shell .js-desktop-about-update-btn:disabled { opacity: .6; cursor: default; }
html.desktop-shell .js-desktop-about-update-btn:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }

html.desktop-shell .js-desktop-about-update-msg {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--joy-text-secondary, #63636a);
}

/* 特异性要压过上面 .js-desktop-about-body a (0,2,2)，不用 !important */
html.desktop-shell .js-desktop-about-body a.js-desktop-about-update-link {
  color: #0b8f8f;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

html.desktop-shell[data-night="true"] .js-desktop-about-update { background: #1f2c31; border-color: #3d666a; }

html.desktop-shell[data-night="true"] .js-desktop-about-update-head,
html.desktop-shell[data-night="true"] .js-desktop-about-update-msg { color: #c9dadd; }

html.desktop-shell[data-night="true"] .js-desktop-about-body a.js-desktop-about-update-link { color: #7fd8d2; }

html.desktop-shell .js-desktop-about-body a,
html.desktop-shell .js-desktop-about-foot a {
  font-size: 13px;
  color: var(--joy-text-secondary, #63636a);
  text-decoration: none;
}

html.desktop-shell .js-desktop-about-body a:hover,
html.desktop-shell .js-desktop-about-foot a:hover {
  color: var(--joy-primary, #009999);
  text-decoration: underline;
}

html.desktop-shell .js-desktop-about-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  padding: 12px 20px 16px;
  margin-top: 8px;
  border-top: 1px solid rgba(0, 0, 0, .06);
}

html.desktop-shell .js-desktop-about-foot p {
  flex: 1 1 100%;
  margin: 2px 0 0;
  font-size: 12px;
  color: #a1a1aa;
}

/* 备案号紧跟版权句尾，不留间距会连成「…障碍苏ICP备…」一坨 */
html.desktop-shell .js-desktop-about-foot p a {
  margin-left: 8px;
  color: inherit;
  text-decoration: none;
}

html.desktop-shell .js-desktop-about-foot p a:hover {
  text-decoration: underline;
}

/* 夜览：菜单里的「关于」是文字链接形态，颜色全走主题变量
   （--joy-neutral-600 / --joy-primary / --joy-primary-soft 夜览下会自动变浅），
   不能再给它加深色底，否则菜单最右侧又变回一颗黑疙瘩。
   深底只留给没有 .nav-links 的兜底胶囊（其父节点是 .pc-container / main）。 */
html.desktop-shell[data-night="true"] .js-desktop-about-card,
html.desktop-shell[data-night="true"] .js-desktop-about-head {
  background: #17181c;
  border-color: rgba(255, 255, 255, .1);
}

html.desktop-shell[data-night="true"] .pc-container > .js-desktop-about-trigger,
html.desktop-shell[data-night="true"] main > .js-desktop-about-trigger {
  background: #17181c;
  border-color: rgba(255, 255, 255, .1);
}

html.desktop-shell[data-night="true"] .js-desktop-about-head,
html.desktop-shell[data-night="true"] .js-desktop-about-foot {
  border-color: rgba(255, 255, 255, .1);
}

html.desktop-shell[data-night="true"] .js-desktop-about-body a,
html.desktop-shell[data-night="true"] .js-desktop-about-foot a {
  color: #b8b8c0;
}

html.desktop-shell[data-night="true"] .js-desktop-about-close:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

/* ---------- 夜览微调 ---------- */
html.desktop-shell[data-night="true"] .site-header {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* ============================================================
   网页桌面尺寸标定（派总 2026-11-01）
   ------------------------------------------------------------
   本段与文末「窄屏桌面窗口」段是仅有的两处不按 .desktop-shell 圈定的
   规则。圈定条件：鼠标设备（hover:hover + pointer:fine）+ ≥769px 视口，
   即「正常人用电脑浏览器看网页」的场景；手机 / 平板（触控）与 ≤768px
   窄窗都走 mobile*.css 原样，零影响。

   数值来源（1920×1080 实测基线 → 本次目标）：
     · 全站顶栏 .site-header      64      → 51.2  （80%）
     · 会议工具栏 .meeting-full-toolbar 67 → 52   （2026-11-01 二轮：胶囊 36
       + 上下内边距 7.5×2 = 15 + 1px 分隔线；须同时压掉 min-height:58，见下）
     · 底部功能栏 .meeting-bottom-bar 60  → 48    （80%）
     · 工具条三个胶囊（系统音频 / 本机麦克风 / 剩余时长）40 / 40.4 → 统一 36
     · 会议主体 .meeting-page 高度 = 100vh - 51.2 - 52 - 48 = 100vh - 151.2
       （原 100vh - 64 - 58 - 60 = 898px → 928.8px；两块面板各 908.8px）

   ⚠️ 顶栏是 fixed，全站各页都靠 padding / margin-top 让位 64px，
   所以「减 12.8px」必须跟着一起减，否则顶栏变矮后下方会露出 12.8px 空白。
   ============================================================ */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) {
  /* ---------- 1) 全站顶栏：64 → 51.2（80%） ---------- */
  .site-header { height: 51.2px; }
  .brand-logo { height: 25.6px; }           /* 原 32px（80%） */
  /* mobile.css 第 50 行把 .nav 写死 64px（全局、无媒体查询），顶栏压矮后
     它会多出 12.8px，导致 logo 与右侧链接的垂直中心错开（实测 logo 中心
     25.1 / 链接中心 32）。这里跟着顶栏一起钉到 51.2，三者在 25.59 完全对齐。
     会议页原先由 mobile-app.css 撑到 50.19（顶栏 51.19 减去 1px 下边框），
     也会被这一行统一到 51.2（+1px，不改变任何内容的位置）。 */
  .nav { height: 51.2px; }

  /* 顶栏让位同步收 80%（64 → 51.2） */
  .hero {
    min-height: calc(100vh - 51.2px);
    padding-top: calc(51.2px + var(--joy-s-8));
  }
  .info-page { padding-top: 51.2px; }
  .pc-container { padding-top: calc(51.2px + 40px); }
  .points-page { padding-top: calc(51.2px + 40px); }

  /* ---------- 2) 会议页：状态栏 90%、底栏 80% ---------- */
  /* 工具条是 sticky 在顶栏下方，top / margin-top 跟着顶栏走 */
  .meeting-full-toolbar {
    top: 51.2px;
    margin-top: 51.2px;
  }
  /* 状态栏 52：内容最高的胶囊已收到 36，上下 7.5×2 = 15，再加 1px 分隔线。
     ⚠️ 必须同时把 styles.css 4602 的 min-height:58px 压成 0 —— 36 + 15 = 51，
     不压的话会被 min-height 顶在 58，总高变 59，52 根本达不到（实测确认）。 */
  .meeting-toolbar-inner {
    padding: 7.5px 0;
    min-height: 0;
  }

  /* 三个胶囊统一 36px（原「系统音频/本机麦克风」40、「剩余时长」40.4）。
     胶囊内设备下拉在登录态是 28px 高（styles.css 11519），
     上下内边距 3px → 3+3+28+2(边框) = 36，正好装得下且居中；
     原 6px 内边距配 36 会让 28px 的下拉溢出胶囊边 3px。 */
  .meeting-toolbar-center .toolbar-audio-source {
    height: 36px;
    min-height: 36px;
    padding: 3px 14px;
  }

  /* 剩余时长：内容行高 22.4，钉死 36 + 去掉纵向内边距，由 flex 居中，
     不再随文案/登录态涨落（原 8px 内边距下为 40.4） */
  body #meetingToolbarInner .trial-timer {
    height: 36px;
    min-height: 36px;
    padding-block: 0;
  }

  /* 底栏 80%：60 → 48（内容最高 38 的纠词/术语输入框 + 上下 4.5px + 1px 上边框） */
  .meeting-bottom-bar {
    min-height: 48px;
    padding: 4.5px 20px;
  }

  /* 主体跟着三个横条的总高走：顶栏 51.2 + 状态栏 52 + 底栏 48 = 151.2。
     上下留白 16/20 → 10/10，省下的 16px 一并给面板（转写 / 总结内容区
     是 flex:1，自动把多出来的高度吃满，无需再单独设） */
  .meeting-page {
    min-height: calc(100vh - 151.2px);
    height: calc(100vh - 151.2px);
    padding-block: 10px;
  }

  /* 内容总结底部操作条（菜单/生成/保持/发送）：49 → 47。
     原 6+6 内边距 + 1px 上边框 + 36px 按钮 = 49；压到 5+5 → 47。
     省下的 2px 由 #summaryBody（flex:1）自动吸收 */
  body #summaryPanel .summary-footer-actions {
    padding-block: 5px;
  }
}

/* ============================================================
   窄桌面组件收缩：769–1439px（鼠标设备）
   ------------------------------------------------------------
   派总 2026-11-01：「若遇到较窄桌面，请全局缩小所有组件的宽度，
   确保底部功能栏不会折成两排！（顶部状态栏同理）」

   为什么必须缩：底栏是 flex-wrap:wrap，各组件自然总宽 1339.9
   + 左右内边距 40 = 1379.9，只有 ≥1440 才放得下：
     · 1366 缺 13.9   · 1280 缺 99.9
     · 1180 缺 199.9  · 1024 缺 355.9
   顶栏（会议工具栏）自然总宽 1002.4 @1024 vs 内容区 984 → 缺 18.4，
   1280 起恰好占满（左侧 / 右侧两块被 flex 拉伸），所以顶部只需补窄档。

   做法＝只缩「宽度类」尺寸（内边距 / 输入框宽 / 下拉宽 / 胶囊列宽 / 间距），
   **不动字号、不动垂直内边距**。原因：字号一动行高跟着变，底栏组高会从
   38 涨到 41.2（实测 1366 组高 41.2 → 底栏 51.2、1024 组高 39.6 → 底栏
   49.6），而 .meeting-page 的高度公式是按「三横条 151.2」写死的，
   差额会直接变成「面板底部被底栏压住」；垂直内边距同理会影响工具条
   52 与底栏 48 的高度。只缩宽度既保证单行放得下，又让三条横条的
   高度、字号、可读性全部保持原样。

   五档递减（A 1439 → B 1199 → C 1079 → D 959 → E 842），越窄缩得越紧
   （B ～ E 档只改下面这组变量）：

   ⚠️ 提权方式用 body + #id（= 1,x,1），不靠 .desktop-shell：
   `.desktop-shell` 只由 desktop.js 给 Electron 壳（UA 含 JoySpeech/… + Electron）
   挂上，普通浏览器用户根本没有这个类 —— 用它会整段失效（本段初版就踩过）。
   而 meeting.html 的 <style> 排在 desktop.css 之后，里面的
   #meetingBottomBar 规则是 (1,x,0)，同 ID 数时它赢；body + #id 多一个类型
   选择器才能压过去。
   ============================================================ */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 1439px) {
  :root {
    /* --- 底部功能栏（原值 → A 档） --- */
    --nb-pad-x: 12px;        /* 底栏左右内边距   原 20px */
    --nb-bar-gap: 8px;       /* 组间距           原 12px */
    --nb-group-gap: 4px;     /* 组内间距         原 6px  */
    --nb-btn-pad: 8px;       /* 按钮左右内边距   原 10px */
    --nb-input-w: 60px;      /* 纠词/术语输入框上限  照派总 2026-11-01 需求2 的 60px */
    --nb-lang-w: 6.2em;      /* 语言下拉宽       原 7em  */
    --nb-mute-w: 32px;       /* 麦克风按钮宽     原 36px */
    /* --- 顶部状态栏（原值 → A 档） --- */
    --nb-tb-col1: 64px;      /* 胶囊标签列       原 76px */
    --nb-tb-col3: 40px;      /* 电平条列         原 48px */
    --nb-tb-col4: 70px;      /* 过滤/媒体名列    原 80px */
    --nb-tb-gap: 8px;        /* 胶囊内列间距     原 10px */
    --nb-tb-pad-x: 10px;     /* 胶囊水平内边距   原 14px */
    --nb-tb-sel: 104px;      /* 主设备下拉最大宽 原 120px */
    --nb-tb-meter: 40px;     /* 电平条宽         原 44px */
    --nb-tb-outer-gap: 10px; /* 工具栏三段间距   原 16px */
  }
}

/* B 档：≤1199（1180 还差 ~200px，再压一档） */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 1199px) {
  :root {
    --nb-pad-x: 8px; --nb-bar-gap: 6px; --nb-group-gap: 3px; --nb-btn-pad: 6px;
    --nb-input-w: 56px; --nb-lang-w: 5.8em; --nb-mute-w: 30px;
    --nb-tb-col1: 58px; --nb-tb-col3: 36px; --nb-tb-col4: 64px;
    --nb-tb-gap: 7px; --nb-tb-pad-x: 8px;
    --nb-tb-sel: 92px; --nb-tb-meter: 36px; --nb-tb-outer-gap: 8px;
  }
}

/* C 档：≤1079（1024 实测自然总宽 969.5，刚好放得下） */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 1079px) {
  :root {
    --nb-pad-x: 6px; --nb-bar-gap: 4px; --nb-group-gap: 2px; --nb-btn-pad: 5px;
    --nb-input-w: 52px; --nb-lang-w: 5.4em; --nb-mute-w: 28px;
    --nb-tb-col1: 54px; --nb-tb-col3: 32px; --nb-tb-col4: 58px;
    --nb-tb-gap: 6px; --nb-tb-pad-x: 7px;
    --nb-tb-sel: 86px; --nb-tb-meter: 32px; --nb-tb-outer-gap: 6px;
  }
}

/* D 档：≤969（C 档自然总宽 969.6 → 970 以下放不下；半屏 / 分屏窗口）
   实测自然总宽 843.2，可一路稳到 844，实际只用到 ≥970 → 余量充足 */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 969px) {
  :root {
    --nb-pad-x: 4px; --nb-bar-gap: 3px; --nb-group-gap: 3px; --nb-btn-pad: 4px;
    --nb-input-w: 46px; --nb-lang-w: 4.8em; --nb-mute-w: 26px;
    --nb-tb-col1: 50px; --nb-tb-col3: 30px; --nb-tb-col4: 54px;
    --nb-tb-gap: 5px; --nb-tb-pad-x: 6px;
    --nb-tb-sel: 80px; --nb-tb-meter: 30px; --nb-tb-outer-gap: 5px;
  }
}

/* E 档：≤859（最小可用的鼠标桌面宽度 769 也要单排；D 档自然总宽 843.2
   在 843 处会折行，所以 E 档一路覆盖到 859，D 档从 860 起有 17px 余量）
   实测自然总宽 728 ≤ 769 可用宽度 757，留 29px 余量 */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 859px) {
  :root {
    --nb-pad-x: 4px; --nb-bar-gap: 2px; --nb-group-gap: 2px; --nb-btn-pad: 3px;
    --nb-input-w: 38px; --nb-lang-w: 4.4em; --nb-mute-w: 22px;
    --nb-tb-col1: 48px; --nb-tb-col3: 28px; --nb-tb-col4: 50px;
    --nb-tb-gap: 4px; --nb-tb-pad-x: 5px;
    --nb-tb-sel: 74px; --nb-tb-meter: 26px; --nb-tb-outer-gap: 4px;
  }
}

/* 五档共用同一套应用规则：只引用变量，档位差异全在上面 */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (max-width: 1439px) {
  /* ---------- 底部功能栏：全部组件收窄（垂直尺寸一律保持原值） ----------
     一律用 padding-inline（只改左右），绝不用 padding 简写：
     实测把某个组件的纵向内边距写成 6px 会让「纠词/添加/批量导入」按钮
     从 28 长到 29.6（原纵向内边距其实是 4px + min-height 28），底栏随之
     从 48 涨到 49.6，又压回主体 1.6px。只改左右才是真正「只缩宽度」。 */
  body #meetingBottomBar {
    padding-inline: var(--nb-pad-x);
    gap: var(--nb-bar-gap);
  }
  body #meetingBottomBar > .bottom-group,
  body #meetingBottomBar > .bottom-center-wrapper {
    gap: var(--nb-group-gap);
  }
  body #meetingBottomBar .bottom-dual-input-box {
    gap: var(--nb-group-gap);
  }
  body #meetingBottomBar .meeting-btn {
    padding-inline: var(--nb-btn-pad);
  }
  body #meetingBottomBar .meeting-lang-select {
    width: var(--nb-lang-w);
    min-width: var(--nb-lang-w);
    max-width: var(--nb-lang-w);
  }
  /* 纠词/术语四个输入框：档位给「上限宽度」，min-width 固定 36px 让它能继续缩。
     🔴 这两件事必须同时做（2026-11-04 项1 复查出的真缺陷）：
     旧写法把 min 与 max 都钉成 --nb-input-w ⇒ 输入框是刚体，底栏 grid `1fr auto 1fr`
     的侧轨压不进就静默往左溢出，「清空聊天」盖在「错词」框上（1352 实测重叠 30.8px）。
     基准也从 120 修正为 60：派总 2026-11-01 需求2 要求四个框 120→60，
     旧 A 档 96 会把那条需求在 1280~1439 之间悄悄改回去（≥1440 才落到 60）。 */
  body #meetingBottomBar .bottom-dual-input-box .terminology-input {
    width: var(--nb-input-w);
    min-width: 36px;
    max-width: var(--nb-input-w);
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: var(--nb-input-w);
  }
  body #meetingBottomBar .terminology-save-btn.compact-btn {
    padding-inline: var(--nb-btn-pad);
  }
  body #meetingBottomBar .mute-btn.compact {
    width: var(--nb-mute-w);
    min-width: var(--nb-mute-w);
  }

  /* ---------- 顶部状态栏：胶囊列宽 / 下拉 / 水平内边距一起收 ---------- */
  body #meetingToolbarInner { column-gap: var(--nb-tb-outer-gap); }
  body #meetingToolbarInner .meeting-toolbar-center { gap: var(--nb-tb-outer-gap); }
  body #meetingToolbarInner .toolbar-audio-source {
    grid-template-columns:
      var(--nb-tb-col1) minmax(0, 1fr) var(--nb-tb-col3) var(--nb-tb-col4);
    column-gap: var(--nb-tb-gap);
    padding-inline: var(--nb-tb-pad-x);  /* 纵向 3px 不动：胶囊仍是 36px 高 */
  }
  /* 特异性必须 ≥ meeting.html 内联的 #meetingToolbarInner .toolbar-audio-source #micSelect
     （2,1,0），所以这里也带上 .toolbar-audio-source 成为 (2,1,1) */
  body #meetingToolbarInner .toolbar-audio-source #micSelect,
  body #meetingToolbarInner .toolbar-audio-source #sysAudioModeSelect,
  body #meetingToolbarInner .toolbar-audio-source .sys-audio-device-select {
    max-width: var(--nb-tb-sel);
  }
  body #meetingToolbarInner .volume-meter { width: var(--nb-tb-meter); }
  body #meetingToolbarInner .trial-timer {
    padding-inline: var(--nb-tb-pad-x);  /* 纵向不动：计时器仍 36px 高 */
  }
  body #meetingToolbarInner #m15DesktopShare {
    padding-inline: var(--nb-btn-pad);
  }
}

/* ============================================================
   窄屏桌面窗口：顶栏保留「logo + 全部菜单」（派总 2026-10-31）
   ------------------------------------------------------------
   背景：styles.css / mobile*.css 在 ≤768px 把顶栏导航整体隐藏、
   交给底部 TabBar——手机上正确，但桌面把窗口拖窄 / 分屏时不是手机：
   顶栏只剩 logo，价格 / 关于 / 退出等入口全丢（TabBar 也没有它们）。
   所以这里按指针而非宽度圈定：hover:hover + pointer:fine = 鼠标设备；
   手机（触控）维持 64px + TabBar 原样，零影响。
   高度原标定 45px；2026-11-01 派总要求「全站顶栏 80%」，同步压到 36px
   （logo 也按 80% 由 24 → 19.2）。该宽度下 logo + 全部链接仍放得下，
   更窄的窗口顶栏可横向滚动兜底（滚动条隐藏）。
   会议页不受影响：mobile-app.css 对它的页头规则带 !important 且特异性更高，
   自然赢过本段，保持其 app 形态页头（logo + 齿轮 + 夜览）。
   ============================================================ */
@media (max-width: 768px) and (hover: hover) and (pointer: fine) {
  .site-header { height: 36px; }
  .nav {
    height: 36px;
    gap: 12px;
    padding: 0 12px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  /* 会议页工具条原按 64px 顶栏让位；顶栏压到 36 后同步，否则留 28px 空带 */
  .meeting-full-toolbar {
    top: 36px;
    margin-top: 36px;
  }

  /* 其它页面的让位同理同步到 36px（styles/mobile.css 里都按 64px 预留，
     45px 标定时已留 19px 空带，这里一并校正）。
     hero 只在 ≥641px 改：641 以下 mobile.css 本来用的就是更小的 --joy-s-4。 */
  .info-page { padding-top: 36px; }
  .pc-container { padding-top: calc(36px + 40px); }
  .points-page { padding-top: calc(36px + 40px); }
  @media (min-width: 641px) {
    .hero {
      padding-top: calc(36px + var(--sat) + var(--joy-s-8));
      min-height: calc(100vh - 36px);
    }
  }

  .nav::-webkit-scrollbar { display: none; }
  .brand-logo { height: 19.2px; }
  .nav-links { display: flex; gap: 0; }
  .nav-links a {
    padding: 6px 7px;
    font-size: 13px;
    white-space: nowrap;
  }
  /* 「关于 JoySpeech」是 button 不是 a，窄窗口径要单独补一条；
     选择器必须带 .desktop-shell 才压得住上方那条 8px/14px 的菜单规则。 */
  html.desktop-shell .nav-links > .js-desktop-about-trigger {
    padding: 6px 7px;
    font-size: 13px;
  }
  .nav-actions { display: flex; gap: 6px; }
  /* 中文可在任意字间断行：flex 子项一旦被压缩就竖排换行（实测「开始使用/退出」
     被挤成两行），所以子项一律不收缩 + 不换行，宽度不够时走顶栏横向滚动 */
  .nav-links a,
  .nav-actions > * {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .nav-actions .primary-button.small,
  .nav-actions .btn-start {
    padding: 6px 12px;
    font-size: 12px;
  }
  .nav-actions .text-button,
  .nav-actions .btn-login {
    padding: 6px 8px;
    font-size: 13px;
  }
  .nav-toggle { display: none; }
  /* 底部 TabBar 是手机导航；桌面窄窗不显示，并回收它预留的让位 */
  .mobile-tabbar { display: none; }
  body.has-mobile-tabbar { padding-bottom: 0; }
  body.has-mobile-tabbar .meeting-bottom-bar { bottom: 0; }
}