/* VanorOS 设计系统：深浅双主题「Calm Glass」桌面外壳。
   应用骨架在 app-chrome.css、通用控件在 app-base.css（document 与各应用 Shadow DOM 共同采纳，
   注入面由应用 frontmatter `css: full|minimal|none` 控制）；
   应用专属样式随各应用 js 的 styles 字段进入其 Shadow DOM。
   :root 设计令牌（CSS 变量）自动穿透 Shadow DOM，应用直接使用。
   规则：除品牌固定色（macOS 红绿灯、强调底上的白字）外，禁止写死黑/白叠加色——
   一律用下方语义令牌，否则浅色主题会破相。强调/状态色的透明变体用 rgba(var(--*-rgb), a) 派生。
   兼容契约：既有令牌名对第三方应用公开（vanor-app SKILL.md），只改值不删名；新令牌只增不改。 */

:root {
  /* 强调色：品牌青绿（与豌豆 logo 同族），--accent-2 为同族浅青（第三方渐变兼容） */
  --accent: #2ec8a2;
  --accent-2: #3fd0c0;
  --accent-rgb: 46, 200, 162;
  --accent-2-rgb: 63, 208, 192;
  --accent-soft: rgba(46, 200, 162, 0.14); /* 选中/悬停/强调背景 */
  --accent-contrast: #052e24; /* 青绿实底上的文字/图标色（深色主题下白字对比不足） */
  /* 中性底：冷灰石墨（去蓝紫偏色） */
  --bg-0: #0b0d11;
  /* 应用内两色：正文区 / 两侧栏（目录、对话面板）。不用半透明叠色，避免各区灰度不一。 */
  --surface-page: #0b0d11;
  --surface-panel: #12151a;
  --bg-glass: rgba(21, 24, 31, 0.88);
  --bg-glass-2: rgba(28, 32, 40, 0.66);
  --bg-glass-drop: rgba(21, 24, 31, 0.92);
  --bg-input: rgba(255, 255, 255, 0.055);
  --bg-soft: rgba(255, 255, 255, 0.04);   /* 轻微抬升的区块底（卡片、标题栏） */
  --bg-hover: rgba(255, 255, 255, 0.07);  /* 中性悬停背景 */
  --bg-strong: rgba(255, 255, 255, 0.12); /* 明显抬升（轨道、tab 容器、开关底、行内 code） */
  --bg-sunken: rgba(0, 0, 0, 0.22);       /* 凹陷衬底（预览区、内容井） */
  --bg-raise: rgba(255, 255, 255, 0.09);  /* 玻璃片（Dock/桌面图标底） */
  --bg-raise-2: rgba(255, 255, 255, 0.2); /* 玻璃片悬停/激活 */
  --brand-plate: #ececec; /* 深色品牌标浅底；两主题都保持浅色，避免透明 logo 溶进暗底 */
  --dicon-tile-bg: rgba(26, 29, 37, 0.85); /* 桌面图标底（壁纸上需更不透明） */
  --dicon-tile-hover: rgba(34, 38, 48, 0.92);
  /* 文件夹磁贴：扁平滑色 + accent 叠色（避免斜向渐变假立体） */
  --dicon-folder-bg: linear-gradient(0deg, rgba(var(--accent-rgb), 0.16), rgba(var(--accent-rgb), 0.16)), rgba(26, 29, 37, 0.92);
  --dicon-folder-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
  --code-bg: rgba(8, 10, 14, 0.72);       /* 代码块底 */
  --tip-bg: rgba(14, 16, 21, 0.94);       /* tooltip 底（两主题均深底配 #e9ecf1 白字） */
  --mask: rgba(6, 8, 11, 0.42);           /* 全屏遮罩 */
  --fg: #e9ecf1;
  --fg-dim: #99a1ad;
  --fg-faint: #5f6673;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.15);
  --danger: #ec6a5e;
  --ok: #58c97b;
  --warn: #e0a352;
  --danger-rgb: 236, 106, 94;
  --ok-rgb: 88, 201, 123;
  --warn-rgb: 224, 163, 82;
  /* 圆角体系：--radius 为既有契约（窗口），新增分级 */
  --radius: 14px;
  --radius-sm: 7px;
  --radius-md: 11px;
  --radius-lg: 16px;
  /* 桌面外壳高度（与 os.js MENUBAR_H / TITLEBAR_H 同步） */
  --menubar-h: 28px;
  --titlebar-h: 30px;
  /* 窗口标题栏材质（桌面外壳专用；近实色扁平 + 极淡 accent，随主题色联动）
     Medium Lift：比原 #2a2d35 更亮一档，贴近 macOS 深色标题栏 */
  --titlebar-bg: color-mix(in srgb, rgba(64, 68, 78, 0.96) 96%, var(--accent) 4%);
  --titlebar-bg-inactive: color-mix(in srgb, rgba(48, 51, 60, 0.94) 98%, var(--accent) 2%);
  /* 深度三档：1 小卡片 / 2 浮层菜单 / 3 焦点窗口与模态。--shadow/--shadow-sm 为兼容别名 */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.24), 0 3px 10px rgba(0, 0, 0, 0.22);
  --shadow-2: 0 2px 6px rgba(0, 0, 0, 0.26), 0 10px 28px rgba(0, 0, 0, 0.32);
  --shadow-3: 0 3px 10px rgba(0, 0, 0, 0.3), 0 28px 64px -8px rgba(0, 0, 0, 0.52);
  --shadow: var(--shadow-2);
  --shadow-sm: var(--shadow-1);
  --edge-light: inset 0 1px 0 rgba(255, 255, 255, 0.06); /* 玻璃面顶光 */
  --label-shadow: 0 1px 3px rgba(0, 0, 0, 0.7); /* 壁纸上的文字衬托 */
  /* 桌面图标层：纯色/渐变壁纸可由 os.js 按明暗覆写；预设/图片回退主题 */
  --desktop-label-fg: var(--fg);
  --desktop-label-shadow: var(--label-shadow);
  /* 动效令牌：快而不弹 */
  --dur-1: 120ms;
  --dur-2: 180ms;
  --dur-3: 260ms;
  --ease-out: cubic-bezier(0.25, 1, 0.4, 1);
  --ease-spring: cubic-bezier(0.34, 1.3, 0.4, 1);
  /* 焦点环（键盘可达性） */
  --ring: 0 0 0 3px rgba(var(--accent-rgb), 0.32);
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --mono: "SF Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  /* 代码高亮令牌（highlight.js，os.typeset）：类规则在 app-base.css 控件层，颜色在此随主题取值 */
  --hl-keyword: #c48fe8;
  --hl-string: #7ed3a7;
  --hl-number: #e2a94c;
  --hl-title: #7ba3f5;
  --hl-builtin: #56c2dd;
  --hl-attr: #8fc7ea;
  --hl-meta: #d98f5b;
  /* 毛玻璃滤镜令牌：关玻璃时设 none（blur(0) 仍可能建合成层） */
  --glass-filter: blur(16px) saturate(1.5);
}

/* 浅色主题：同一组设计令牌的亮色取值（应用经 Shadow DOM 自动跟随）。
   强调/状态色整体加深——深色版的亮色系在浅底上对比度不足。 */
:root[data-theme="light"] {
  --accent: #0e8a72;
  --accent-2: #0f948a;
  --accent-rgb: 14, 138, 114;
  --accent-2-rgb: 15, 148, 138;
  --accent-soft: rgba(14, 138, 114, 0.12);
  --accent-contrast: #ffffff;
  --bg-0: #eef0f4;
  --surface-page: #ffffff;
  --surface-panel: #f7f7f8;
  --bg-glass: rgba(255, 255, 255, 0.90);
  --bg-glass-2: rgba(255, 255, 255, 0.85);
  --bg-glass-drop: rgba(255, 255, 255, 0.94);
  /* 输入/按钮衬底走近白：浅底上再叠半透明深色会让输入框与默认按钮整体发灰，
     macOS 浅色是白面 + 细边（对比靠 --line-strong 而非底色压暗） */
  --bg-input: rgba(255, 255, 255, 0.92);
  --bg-soft: rgba(18, 25, 38, 0.035);
  --bg-hover: rgba(18, 25, 38, 0.06);
  --bg-strong: rgba(18, 25, 38, 0.1);
  --bg-sunken: rgba(18, 25, 38, 0.05);
  --bg-raise: rgba(255, 255, 255, 0.65);
  --bg-raise-2: rgba(255, 255, 255, 0.95);
  --dicon-tile-bg: rgba(255, 255, 255, 0.92);
  --dicon-tile-hover: rgba(255, 255, 255, 0.98);
  --dicon-folder-bg: linear-gradient(0deg, rgba(var(--accent-rgb), 0.1), rgba(var(--accent-rgb), 0.1)), rgba(255, 255, 255, 0.96);
  --dicon-folder-shadow: 0 1px 2px rgba(28, 36, 56, 0.1);
  --code-bg: rgba(18, 25, 38, 0.05);
  --tip-bg: rgba(32, 38, 48, 0.95);
  --mask: rgba(24, 30, 42, 0.32);
  --fg: #1b222e;
  --fg-dim: #566070;
  --fg-faint: #939cab;
  --line: rgba(18, 25, 38, 0.1);
  --line-strong: rgba(18, 25, 38, 0.18);
  --danger: #d64550;
  --ok: #178a52;
  --warn: #9a6b10;
  --danger-rgb: 214, 69, 80;
  --ok-rgb: 23, 138, 82;
  --warn-rgb: 154, 107, 16;
  --shadow-1: 0 1px 2px rgba(28, 36, 56, 0.08), 0 3px 10px rgba(28, 36, 56, 0.08);
  --shadow-2: 0 2px 6px rgba(28, 36, 56, 0.09), 0 10px 28px rgba(28, 36, 56, 0.13);
  --shadow-3: 0 3px 10px rgba(28, 36, 56, 0.1), 0 28px 64px -8px rgba(28, 36, 56, 0.22);
  --edge-light: inset 0 1px 0 rgba(255, 255, 255, 0.65);
  --label-shadow: 0 1px 3px rgba(255, 255, 255, 0.8);
  --titlebar-bg: color-mix(in srgb, rgba(248, 248, 250, 0.97) 96%, var(--accent) 4%);
  --titlebar-bg-inactive: color-mix(in srgb, rgba(236, 236, 238, 0.95) 98%, var(--accent) 2%);
  --hl-keyword: #8a3fc6;
  --hl-string: #1c7d4f;
  --hl-number: #9a6b10;
  --hl-title: #2456c6;
  --hl-builtin: #0e7490;
  --hl-attr: #1a6fa8;
  --hl-meta: #b45a1d;
}

/* 关掉毛玻璃：去掉 backdrop-filter 合成层（Windows Chromium 多窗口 GPU 主因），
   并提高玻璃令牌不透明度，避免「透但不糊」。blur(0) 仍可能建层，必须是 none。 */
:root[data-glass="off"] {
  --glass-filter: none;
  --bg-glass: #15181f;
  --bg-glass-2: #1c2028;
  --bg-glass-drop: #15181f;
  --titlebar-bg: color-mix(in srgb, #40444e 96%, var(--accent) 4%);
  --titlebar-bg-inactive: color-mix(in srgb, #30333c 98%, var(--accent) 2%);
}
/* 默认波浪壁纸令牌（#wp-default 内联 SVG 继承）。浅色对齐源 SVG fallback；深色暗化。
   自定义 accent 由 applyAppearance 覆写；空 accent 时走这里。 */
:root {
  --wallpaper-bg: #0b1214;
  --wallpaper-mist: #102226;
  --wallpaper-wave: #3aa8b0;
  --wallpaper-deep: #2a8a96;
  --wallpaper-light: #c8eef0;
  --wallpaper-logo: #42c8be;
}
:root[data-theme="light"] {
  --wallpaper-bg: #f6fcfc;
  --wallpaper-mist: #e5faf4;
  --wallpaper-wave: #76e2e9;
  --wallpaper-deep: #51cfe3;
  --wallpaper-light: #ffffff;
  --wallpaper-logo: #42c8be;
}

:root[data-theme="light"][data-glass="off"] {
  --bg-glass: #ffffff;
  --bg-glass-2: #ffffff;
  --bg-glass-drop: #ffffff;
  --titlebar-bg: color-mix(in srgb, #f8f8fa 96%, var(--accent) 4%);
  --titlebar-bg-inactive: color-mix(in srgb, #ececee 98%, var(--accent) 2%);
}
:root[data-glass="off"] * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
:root[data-glass="off"] .menubar {
  background: #15181f;
}
:root[data-theme="light"][data-glass="off"] .menubar {
  background: #ffffff;
}
:root[data-glass="off"] .dock {
  background: #161a22;
}
:root[data-theme="light"][data-glass="off"] .dock {
  background: #fafbfd;
}
:root[data-glass="off"][data-os="windows"] .dock {
  background: #161a22;
}
:root[data-theme="light"][data-glass="off"][data-os="windows"] .dock {
  background: #f4f6fa;
}

* { box-sizing: border-box; }
html, body { height: 100%; width: 100%; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--fg);
  /* 默认壁纸：内联 SVG（#wp-default）；此处仅 fetch 前底色，避免闪旧 mesh */
  background: var(--wallpaper-bg, #f6fcfc);
  overflow: hidden;
  overflow: clip; /* clip 不是滚动端口，避免锚点 / scrollIntoView 挪 body */
  -webkit-font-smoothing: antialiased;
  user-select: none;
}

#wp-default {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
#wp-default svg {
  width: 100%;
  height: 100%;
  display: block;
}
body[data-wallpaper]:not([data-wallpaper=""]) #wp-default { display: none; }

/* 原默认 mesh + logo 水印，现为预设 mesh */
body[data-wallpaper="mesh"] {
  background:
    radial-gradient(ellipse 55% 50% at 79% 8%, rgba(var(--accent-rgb), 0.3), transparent 68%),
    radial-gradient(ellipse 50% 45% at 8% 94%, color-mix(in srgb, var(--accent) 55%, #7dd3fc 45%) 18%, transparent 70%),
    radial-gradient(ellipse 40% 38% at 58% 78%, rgba(var(--accent-rgb), 0.16), transparent 72%),
    radial-gradient(ellipse 32% 28% at 34% 16%, color-mix(in srgb, var(--accent) 40%, white 60%) 10%, transparent 70%),
    linear-gradient(155deg, transparent 20%, rgba(var(--accent-rgb), 0.1) 48%, color-mix(in srgb, var(--accent) 50%, #67e8f9 50%) 62%, transparent 82%),
    linear-gradient(180deg, color-mix(in srgb, #0c1618 90%, var(--accent) 10%), color-mix(in srgb, #061012 94%, var(--accent) 6%) 70%),
    var(--bg-0);
}
body[data-wallpaper="mesh"]::before {
  content: "";
  position: fixed;
  right: -2%;
  bottom: -8%;
  width: min(52vw, 720px);
  height: min(68vh, 820px);
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(ellipse 55% 50% at 48% 48%, rgba(var(--accent-rgb), 0.22), transparent 70%),
    var(--accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22135%20132%20755%20755%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M%20257.0%20224.0%20C%20258.9%20224.2%20260.8%20224.4%20262.7%20224.6%20C%20307.3%20229.6%20351.7%20246.2%20384.0%20278.0%20C%20385.3%20279.1%20386.7%20280.3%20388.1%20281.4%20C%20405.8%20297.5%20418.1%20316.9%20429.0%20338.0%20C%20429.7%20339.4%20430.5%20340.8%20431.2%20342.3%20C%20458.9%20396.1%20470.2%20458.3%20480.8%20517.4%20C%20489.1%20563.0%20498.0%20609.9%20518.0%20652.0%20C%20518.7%20653.4%20519.3%20654.9%20520.0%20656.4%20C%20523.5%20663.6%20523.5%20663.6%20525.0%20666.0%20C%20526.0%20666.0%20527.0%20666.0%20528.0%20666.0%20C%20556.0%20619.2%20564.4%20557.0%20573.9%20504.3%20C%20583.2%20452.4%20592.8%20400.2%20615.0%20352.0%20C%20615.4%20351.1%20615.4%20351.1%20617.2%20346.9%20C%20625.4%20328.9%20635.8%20311.7%20649.0%20297.0%20C%20649.8%20296.1%20650.5%20295.3%20651.3%20294.4%20C%20652.8%20292.7%20654.3%20291.0%20655.9%20289.3%20C%20657.8%20287.2%20659.7%20285.0%20661.6%20282.8%20C%20665.1%20278.8%20668.9%20275.4%20673.0%20272.0%20C%20673.9%20271.2%20674.8%20270.5%20675.6%20269.7%20C%20706.7%20243.0%20743.1%20230.3%20783.0%20224.0%20C%20783.8%20223.9%20783.8%20223.9%20787.6%20223.2%20C%20822.3%20218.2%20822.3%20218.2%20833.6%20229.6%20C%20837.1%20234.5%20837.5%20236.9%20837.0%20243.0%20C%20833.3%20250.2%20827.0%20255.3%20820.7%20260.1%20C%20767.9%20302.9%20761.2%20403.4%20753.6%20465.7%20C%20741.2%20566.2%20723.7%20671.5%20652.0%20748.0%20C%20650.9%20749.2%20649.8%20750.4%20648.7%20751.6%20C%20627.6%20771.2%20601.5%20786.3%20574.0%20795.0%20C%20573.4%20795.2%20573.4%20795.2%20570.1%20796.3%20C%20527.5%20809.3%20477.6%20807.2%20436.0%20791.0%20C%20434.8%20790.6%20433.6%20790.1%20432.4%20789.7%20C%20415.3%20783.2%20400.2%20774.4%20386.0%20763.0%20C%20384.9%20762.2%20383.9%20761.3%20382.8%20760.5%20C%20374.7%20754.0%20367.8%20746.8%20361.0%20739.0%20C%20360.3%20738.3%20359.6%20737.6%20358.9%20736.8%20C%20352.0%20729.5%20346.6%20721.4%20341.0%20713.0%20C%20340.2%20711.9%20339.5%20710.8%20338.7%20709.6%20C%20289.4%20635.3%20278.7%20541.1%20268.2%20454.6%20C%20249.2%20297.5%20249.2%20297.5%20194.1%20252.8%20C%20188.6%20247.8%20187.2%20243.4%20188.0%20236.0%20C%20197.1%20213.1%20237.5%20222.0%20257.0%20224.0%20Z%22%2F%3E%3Ccircle%20cx%3D%22349.5%22%20cy%3D%22376%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%22385%22%20cy%3D%22522.5%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%22428%22%20cy%3D%22667%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E") center / 78% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22135%20132%20755%20755%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M%20257.0%20224.0%20C%20258.9%20224.2%20260.8%20224.4%20262.7%20224.6%20C%20307.3%20229.6%20351.7%20246.2%20384.0%20278.0%20C%20385.3%20279.1%20386.7%20280.3%20388.1%20281.4%20C%20405.8%20297.5%20418.1%20316.9%20429.0%20338.0%20C%20429.7%20339.4%20430.5%20340.8%20431.2%20342.3%20C%20458.9%20396.1%20470.2%20458.3%20480.8%20517.4%20C%20489.1%20563.0%20498.0%20609.9%20518.0%20652.0%20C%20518.7%20653.4%20519.3%20654.9%20520.0%20656.4%20C%20523.5%20663.6%20523.5%20663.6%20525.0%20666.0%20C%20526.0%20666.0%20527.0%20666.0%20528.0%20666.0%20C%20556.0%20619.2%20564.4%20557.0%20573.9%20504.3%20C%20583.2%20452.4%20592.8%20400.2%20615.0%20352.0%20C%20615.4%20351.1%20615.4%20351.1%20617.2%20346.9%20C%20625.4%20328.9%20635.8%20311.7%20649.0%20297.0%20C%20649.8%20296.1%20650.5%20295.3%20651.3%20294.4%20C%20652.8%20292.7%20654.3%20291.0%20655.9%20289.3%20C%20657.8%20287.2%20659.7%20285.0%20661.6%20282.8%20C%20665.1%20278.8%20668.9%20275.4%20673.0%20272.0%20C%20673.9%20271.2%20674.8%20270.5%20675.6%20269.7%20C%20706.7%20243.0%20743.1%20230.3%20783.0%20224.0%20C%20783.8%20223.9%20783.8%20223.9%20787.6%20223.2%20C%20822.3%20218.2%20822.3%20218.2%20833.6%20229.6%20C%20837.1%20234.5%20837.5%20236.9%20837.0%20243.0%20C%20833.3%20250.2%20827.0%20255.3%20820.7%20260.1%20C%20767.9%20302.9%20761.2%20403.4%20753.6%20465.7%20C%20741.2%20566.2%20723.7%20671.5%20652.0%20748.0%20C%20650.9%20749.2%20649.8%20750.4%20648.7%20751.6%20C%20627.6%20771.2%20601.5%20786.3%20574.0%20795.0%20C%20573.4%20795.2%20573.4%20795.2%20570.1%20796.3%20C%20527.5%20809.3%20477.6%20807.2%20436.0%20791.0%20C%20434.8%20790.6%20433.6%20790.1%20432.4%20789.7%20C%20415.3%20783.2%20400.2%20774.4%20386.0%20763.0%20C%20384.9%20762.2%20383.9%20761.3%20382.8%20760.5%20C%20374.7%20754.0%20367.8%20746.8%20361.0%20739.0%20C%20360.3%20738.3%20359.6%20737.6%20358.9%20736.8%20C%20352.0%20729.5%20346.6%20721.4%20341.0%20713.0%20C%20340.2%20711.9%20339.5%20710.8%20338.7%20709.6%20C%20289.4%20635.3%20278.7%20541.1%20268.2%20454.6%20C%20249.2%20297.5%20249.2%20297.5%20194.1%20252.8%20C%20188.6%20247.8%20187.2%20243.4%20188.0%20236.0%20C%20197.1%20213.1%20237.5%20222.0%20257.0%20224.0%20Z%22%2F%3E%3Ccircle%20cx%3D%22349.5%22%20cy%3D%22376%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%22385%22%20cy%3D%22522.5%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%22428%22%20cy%3D%22667%22%20r%3D%2254%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E") center / 78% no-repeat;
  opacity: 0.2;
}

/* 键盘可达性：统一焦点环（鼠标点击不出现） */
:focus-visible { outline: none; box-shadow: var(--ring); }

/* 壁纸预设（低饱和 mesh 渐变，克制的专业质感） */
body[data-wallpaper="aurora"] {
  background:
    radial-gradient(1100px 700px at 12% -8%, rgba(var(--accent-rgb), 0.14), transparent 58%),
    radial-gradient(1000px 800px at 96% 18%, rgba(78, 130, 156, 0.14), transparent 55%),
    radial-gradient(900px 620px at 50% 118%, rgba(52, 160, 148, 0.1), transparent 60%),
    linear-gradient(180deg, #0c1014, #090b0f 72%),
    var(--bg-0);
}
body[data-wallpaper="nebula"] {
  background:
    radial-gradient(1000px 750px at 80% 10%, rgba(168, 116, 130, 0.12), transparent 55%),
    radial-gradient(900px 700px at 6% 88%, rgba(104, 96, 150, 0.13), transparent 58%),
    linear-gradient(180deg, #0e0d13, #0a090f 75%),
    var(--bg-0);
}
body[data-wallpaper="forest"] {
  background:
    radial-gradient(1100px 750px at 86% -6%, rgba(74, 158, 122, 0.14), transparent 58%),
    radial-gradient(900px 650px at -2% 102%, rgba(44, 96, 78, 0.18), transparent 60%),
    linear-gradient(180deg, #0b100e, #090d0b 75%),
    var(--bg-0);
}
body[data-wallpaper="mono"] {
  background:
    radial-gradient(1400px 900px at 50% -20%, rgba(255, 255, 255, 0.03), transparent 60%),
    var(--bg-0);
}

:root[data-theme="light"] body {
  background: var(--wallpaper-bg, #f6fcfc);
}
:root[data-theme="light"] body[data-wallpaper="mesh"] {
  background:
    radial-gradient(ellipse 55% 50% at 79% 6%, rgba(var(--accent-rgb), 0.2), transparent 68%),
    radial-gradient(ellipse 50% 45% at 8% 94%, color-mix(in srgb, var(--accent) 50%, #7dd3fc 50%) 14%, transparent 70%),
    radial-gradient(ellipse 42% 40% at 56% 76%, rgba(var(--accent-rgb), 0.14), transparent 72%),
    radial-gradient(ellipse 34% 30% at 33% 14%, color-mix(in srgb, var(--accent) 35%, white 65%) 14%, transparent 70%),
    linear-gradient(155deg, transparent 20%, rgba(var(--accent-rgb), 0.08) 48%, color-mix(in srgb, var(--accent) 45%, #67e8f9 55%) 62%, transparent 82%),
    linear-gradient(180deg, color-mix(in srgb, #f7fcfa 88%, var(--accent) 12%), color-mix(in srgb, #e6f3f0 90%, var(--accent) 10%)),
    var(--bg-0);
}
:root[data-theme="light"] body[data-wallpaper="mesh"]::before {
  opacity: 0.14;
  background:
    radial-gradient(ellipse 55% 50% at 48% 48%, rgba(var(--accent-rgb), 0.16), transparent 70%),
    var(--accent);
}

:root[data-theme="light"] body[data-wallpaper="aurora"] {
  background:
    radial-gradient(1100px 700px at 12% -8%, rgba(var(--accent-rgb), 0.1), transparent 58%),
    radial-gradient(1000px 800px at 96% 18%, rgba(110, 150, 176, 0.12), transparent 55%),
    linear-gradient(180deg, #f2f6f6, #e8eef0),
    var(--bg-0);
}
:root[data-theme="light"] body[data-wallpaper="nebula"] {
  background:
    radial-gradient(1000px 750px at 80% 10%, rgba(196, 148, 160, 0.12), transparent 55%),
    radial-gradient(900px 700px at 6% 88%, rgba(142, 134, 186, 0.11), transparent 58%),
    linear-gradient(180deg, #f5f3f7, #edeaf1),
    var(--bg-0);
}
:root[data-theme="light"] body[data-wallpaper="forest"] {
  background:
    radial-gradient(1100px 750px at 86% -6%, rgba(96, 172, 138, 0.13), transparent 58%),
    radial-gradient(900px 650px at -2% 102%, rgba(120, 168, 148, 0.12), transparent 60%),
    linear-gradient(180deg, #f1f6f3, #e9f0ec),
    var(--bg-0);
}
:root[data-theme="light"] body[data-wallpaper="mono"] { background: var(--bg-0); }

::selection { background: rgba(var(--accent-rgb), 0.3); }
/* 滚动条：窄条 overlay 风格（透明轨道 + 内缩胶囊） */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb {
  background: var(--line-strong); border-radius: 5px;
  border: 3px solid transparent; background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--fg-faint); border-width: 2px; background-clip: content-box; }
::-webkit-scrollbar-corner { background: transparent; }

/* 装饰动效全局降级 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .desktop-icons.paging { scroll-behavior: auto; }
}

/* ---------- 开机画面 ---------- */
#boot {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: var(--bg-0); gap: 16px;
  transition: opacity 0.45s var(--ease-out), transform 0.45s var(--ease-out);
}
#boot.done { opacity: 0; transform: scale(1.02); pointer-events: none; }
.boot-logo { width: 60px; height: 60px; animation: bootPulse 2s var(--ease-out) infinite; }
.boot-name { font-size: 15px; font-weight: 600; letter-spacing: 0.32em; text-indent: 0.32em; color: var(--fg-dim); }
.boot-bar { width: 160px; height: 3px; border-radius: 2px; background: var(--bg-strong); overflow: hidden; }
.boot-bar i { display: block; width: 40%; height: 100%; border-radius: 2px;
  background: var(--accent);
  animation: bootSlide 1.1s var(--ease-out) infinite; }
@keyframes bootPulse { 50% { transform: scale(1.05); opacity: 0.88; } }
@keyframes bootSlide { 0% { margin-left: -40%; } 100% { margin-left: 100%; } }

/* ---------- 桌面布局 ---------- */
#os { position: fixed; inset: 0; z-index: 1; display: flex; flex-direction: column; overflow: hidden; overflow: clip; }
.desktop { position: relative; flex: 1; overflow: hidden; overflow: clip; }
/* 窗口的 z 只在这一层里比，涨多少都盖不到 Dock、文件夹、菜单和对话框 */
.win-layer { position: absolute; inset: 0; z-index: 3; isolation: isolate; pointer-events: none; }
.win-layer > .window { pointer-events: auto; }

/* 菜单栏 */
.menubar {
  height: var(--menubar-h); flex: none; z-index: 5000;
  display: flex; align-items: center; gap: 10px; padding: 0 12px;
  background: rgba(21, 24, 31, 0.42);
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border-bottom: 1px solid var(--line);
  font-size: 12px; color: var(--fg-dim);
}
:root[data-theme="light"] .menubar {
  background: rgba(255, 255, 255, 0.48);
}
.menubar .brand-menu {
  display: flex; align-items: center; gap: 7px; color: var(--fg); font-weight: 600;
  cursor: default; user-select: none;
}

/* VanorOS 品牌 Logo（透明底，尺寸分级） */
.vanor-logo { display: block; object-fit: contain; flex: none; }
.vanor-logo-xs { width: 14px; height: 14px; }
.vanor-logo-sm { width: 16px; height: 16px; }
.vanor-logo-md { width: 42px; height: 42px; }
.vanor-logo-lg { width: 64px; height: 64px; }
.menubar .mb-item.danger { color: var(--danger); }
.menubar .mb-item.danger:hover { background: rgba(var(--danger-rgb), 0.12); }
.menubar .spacer { flex: 1; }
.menubar .item { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.menubar .clock { font-variant-numeric: tabular-nums; color: var(--fg); }
.menubar .mb-btn {
  cursor: pointer; padding: 2px 6px; border-radius: var(--radius-sm); position: relative;
  transition: background var(--dur-1), color var(--dur-1);
}
.menubar .mb-btn:hover { background: var(--bg-hover); color: var(--fg); }
/* 菜单栏行内 SVG 图标（搜索/铃铛/全屏） */
.menubar .mb-ico {
  display: flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; color: var(--fg-dim);
}
.menubar .mb-btn:hover .mb-ico { color: var(--fg); }
.menubar .mb-ico svg { display: block; width: 14px; height: 14px; }

/* 顶栏全局指示器（录制 REC / 暂停） */
.menubar .mb-ind-wrap { display: flex; align-items: center; gap: 2px; flex: none; }
.menubar .mb-ind {
  position: relative; gap: 5px; padding: 0 8px; color: var(--danger);
}
.menubar .mb-ind.paused { color: var(--warn); }
.menubar .mb-ind.open, .menubar .mb-ind:hover { background: var(--bg-hover); }
.menubar .mb-ind-dot {
  width: 7px; height: 7px; border-radius: 50%; flex: none;
  background: currentColor;
}
.menubar .mb-ind.pulse .mb-ind-dot { animation: mbIndPulse 1.4s ease-in-out infinite; }
@keyframes mbIndPulse { 0%,100%{ opacity:1 } 50%{ opacity:0.35 } }
.menubar .mb-ind-label {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.menubar .mb-ind-menu {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 9100;
  min-width: 160px; padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  color: var(--fg);
}
.menubar .mb-ind-menu .mb-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 12.5px; white-space: nowrap;
}
.menubar .mb-ind-menu .mb-item:hover { background: var(--accent-soft); }
.menubar .mb-ind-menu .mb-item.danger { color: var(--danger); }
.menubar .mb-ind-menu .mb-label { flex: 1; }
.menubar .mb-ind-menu .mb-accel { color: var(--fg-faint); font-size: 11px; }

/* 菜单栏应用菜单（macOS 风格：应用名 + 菜单根项 + 下拉） */
.menubar .mb-app {
  font-weight: 650; color: var(--fg); white-space: nowrap;
  max-width: 180px; overflow: hidden; text-overflow: ellipsis;
}
.menubar .mb-menu {
  position: relative; padding: 2px 8px; border-radius: var(--radius-sm);
  cursor: default; white-space: nowrap; color: var(--fg-dim); user-select: none;
  transition: background var(--dur-1), color var(--dur-1);
}
.menubar .mb-menu:hover, .menubar .mb-menu.open { background: var(--bg-hover); color: var(--fg); }
.menubar .mb-drop {
  position: absolute; top: calc(100% + 5px); left: 0; z-index: 8950;
  min-width: 210px; padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: spotIn var(--dur-1) var(--ease-out);
}
.menubar .mb-account {
  display: flex; align-items: center;
  padding: 1px 3px; color: var(--fg);
  cursor: pointer;
}
.menubar .mb-account .mb-drop { left: 0; right: auto; min-width: 196px; }
.menubar .mb-account .mb-drop.mb-drop-end { left: auto; right: 0; }
.menubar .mb-avatar {
  width: 18px; height: 18px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; background: var(--accent); color: #fff;
  font-size: 10px; font-weight: 700; line-height: 1;
}
.menubar .mb-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.menubar .mb-item .mb-chev {
  margin-left: auto; color: var(--fg-faint); width: 14px; height: 14px;
  display: inline-flex; align-items: center; justify-content: center;
}
.menubar .mb-item .mb-chev svg { width: 14px; height: 14px; display: block; }
.menubar .mb-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 13px; color: var(--fg);
}
.menubar .mb-item:hover { background: var(--accent-soft); }
.menubar .mb-item.disabled { opacity: 0.4; pointer-events: none; }
.menubar .mb-item .cm-icon { width: 16px; height: 16px; flex: none; display: inline-flex; align-items: center; justify-content: center; color: var(--fg-dim); }
.menubar .mb-item .cm-icon svg { width: 15px; height: 15px; display: block; }
.menubar .mb-item:hover .cm-icon { color: var(--fg); }
.menubar .mb-check { width: 13px; flex: none; font-size: 11px; color: var(--accent); }
.menubar .mb-label { flex: 1; }
.menubar .mb-accel { color: var(--fg-faint); font-size: 11.5px; margin-left: 16px; letter-spacing: 0.04em; }
.menubar .mb-sep { height: 1px; margin: 4px 8px; background: var(--line); }
/* ---------- 顶部菜单栏迷你 Dock（dockPos = top，默认） ---------- */
.menubar .mb-dock-zone {
  flex: 1; min-width: 0; align-self: stretch;
  display: flex; align-items: center; justify-content: flex-end;
}
.menubar .mb-dock { position: relative; display: flex; align-items: center; gap: 4px; }
.menubar .mb-dock .ditem {
  position: relative; width: 22px; height: 22px; border-radius: 6px; font-size: 12px; flex: none;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: background var(--dur-1), margin var(--dur-2) var(--ease-out), opacity var(--dur-1);
}
.menubar .mb-dock .ditem:hover { background: var(--bg-hover); }
.menubar .mb-dock .ditem.active { background: var(--bg-strong); }
.menubar .mb-dock .ditem.drop-gap { margin-left: 26px; }
.menubar .mb-dock .ditem.dragging { opacity: 0.35; }
.menubar .mb-dock .ditem.app-disabled { opacity: 0.45; filter: grayscale(0.85); }
.menubar .mb-dock .ditem.app-disabled:hover { opacity: 0.6; }
.menubar .mb-dock .ditem .glyph {
  display: flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 5px; overflow: hidden;
  transition: opacity var(--dur-1);
}
.menubar .mb-dock .ditem .glyph .glyph-svg { width: 14px; height: 14px; }
.menubar .mb-dock .ditem .dot {
  position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%);
  width: 3px; height: 3px; border-radius: 50%; background: var(--fg-dim);
}
.menubar .mb-dock .ditem.active .dot { background: var(--accent); }
.menubar .mb-dock .dock-more .glyph-svg { color: var(--fg-dim); }
.menubar .mb-dock .dock-more:hover .glyph-svg { color: var(--fg); }
.menubar .mb-dock .dock-overflow { top: calc(100% + 6px); right: 0; }

/* Dock 溢出浮层（顶部/底部共用）：玻璃菜单列出放不下的图标，点选后关闭 */
.dock-overflow {
  position: absolute; z-index: 8900;
  min-width: 190px; max-width: 280px; max-height: min(60vh, 480px); overflow: auto;
  padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: spotIn var(--dur-1) var(--ease-out);
}
.dock-overflow .do-item {
  display: flex; align-items: center; gap: 9px;
  padding: 6px 9px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 13px; color: var(--fg); white-space: nowrap;
}
.dock-overflow .do-item:hover { background: var(--accent-soft); }
.dock-overflow .do-item.app-disabled { opacity: 0.5; filter: grayscale(0.8); }
.dock-overflow .do-item .glyph {
  flex: none; width: 22px; height: 22px; border-radius: 6px; font-size: 13px;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.dock-overflow .do-item .glyph .glyph-svg { width: 15px; height: 15px; }
.dock-overflow .do-item .do-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.dock-overflow .do-item .dot { flex: none; width: 4px; height: 4px; border-radius: 50%; background: var(--fg-dim); }
.dock-overflow .do-item.active .dot { background: var(--accent); box-shadow: 0 0 5px var(--accent); }

.bell-badge {
  position: absolute; top: -2px; right: -2px; min-width: 14px; height: 14px; padding: 0 4px;
  border-radius: 8px; background: var(--danger); color: #fff;
  font-size: 9.5px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}

/* ---------- 通知中心面板 ---------- */
.notif-panel {
  position: fixed; top: 40px; right: 10px; z-index: 8500;
  width: 360px; max-height: min(70vh, 560px); overflow: auto;
  padding: 10px; border-radius: var(--radius);
  background: var(--bg-glass);
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: toastIn var(--dur-2) var(--ease-out);
}
.notif-panel .np-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 2px 4px 8px; font-size: 13px;
}
.notif-panel .np-head-actions { display: flex; gap: 6px; flex: none; }
.notif-panel .np-filters {
  display: flex; flex-wrap: wrap; gap: 4px; padding: 0 2px 8px;
}
.notif-panel .np-filter {
  border: 1px solid var(--line); background: transparent; color: var(--fg-dim);
  border-radius: 999px; padding: 2px 8px; font-size: 11px; cursor: pointer;
}
.notif-panel .np-filter.on { border-color: var(--accent); color: var(--accent); background: rgba(var(--accent-rgb), 0.12); }
.notif-panel .np-empty { padding: 26px 0 30px; text-align: center; color: var(--fg-faint); font-size: 12.5px; }
.notif-panel .np-item {
  position: relative;
  display: flex; gap: 9px; align-items: flex-start;
  padding: 9px 10px; border-radius: var(--radius-md); margin-bottom: 6px;
  background: var(--bg-input); border: 1px solid var(--line);
  font-size: 12.5px; line-height: 1.45; user-select: text;
}
.notif-panel .np-item.error { border-color: rgba(var(--danger-rgb), 0.4); }
.notif-panel .np-item.high { border-color: rgba(var(--danger-rgb), 0.55); box-shadow: inset 3px 0 0 rgba(var(--danger-rgb), 0.65); }
.notif-panel .np-item.low { opacity: 0.78; }
.notif-panel .np-item.unread { background: color-mix(in srgb, var(--bg-input) 88%, var(--accent) 12%); }
.notif-panel .np-dot {
  position: absolute; left: 4px; top: 14px; width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent);
}
.notif-panel .np-main { flex: 1; min-width: 0; }
.notif-panel .np-title { font-weight: 600; display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.notif-panel .np-title-text { min-width: 0; word-break: break-word; }
.notif-panel .np-time { color: var(--fg-faint); font-weight: 400; font-size: 11px; flex: none; font-variant-numeric: tabular-nums; }
.notif-panel .np-meta { margin-top: 2px; }
.notif-panel .np-cat {
  display: inline-block; font-size: 10.5px; color: var(--fg-faint);
  border: 1px solid var(--line); border-radius: 4px; padding: 0 5px; line-height: 1.6;
}
.notif-panel .np-body { color: var(--fg-dim); margin-top: 3px; white-space: pre-wrap; word-break: break-word; }
.notif-panel .np-body.clamped {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;
}
.notif-panel .np-toggle {
  margin-top: 4px; border: none; background: none; padding: 0; cursor: pointer;
  color: var(--accent); font-size: 12px; font-weight: 500;
}
.notif-panel .np-toggle:hover { text-decoration: underline; }
.notif-panel .np-actions { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 10px; }
.notif-panel .np-link {
  border: none; background: none; padding: 0; cursor: pointer;
  color: var(--accent); font-size: 12px; font-weight: 500;
  display: inline-flex; align-items: center; gap: 5px;
}
.notif-panel .np-link:hover { text-decoration: underline; }
.notif-panel .np-link.danger { color: var(--fg-faint); }
.notif-panel .np-link.danger:hover { color: var(--danger); }
.notif-panel .np-link svg { width: 13px; height: 13px; }
.notif-panel .np-prefs {
  margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 6px;
}
.notif-panel .np-pref {
  display: flex; align-items: center; gap: 8px; padding: 2px 4px;
  font-size: 12px; color: var(--fg-dim); cursor: pointer;
}
.notif-panel .np-pref input { accent-color: var(--accent); margin: 0; }
.notif-panel a,
.toast a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-all;
}
.notif-panel a:hover,
.toast a:hover { color: var(--fg); }

/* ---------- 顶栏连接状态 / 时钟设置面板 ---------- */
.conn-panel, .clock-panel {
  position: fixed; top: 40px; right: 10px; z-index: 8500;
  width: 280px; padding: 10px 12px 12px; border-radius: var(--radius);
  background: var(--bg-glass);
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  font-size: 12.5px;
}
.conn-panel .np-head, .clock-panel .np-head { padding: 2px 2px 8px; font-size: 13px; }
.conn-panel .cp-state { display: flex; align-items: center; gap: 8px; padding: 4px 2px 10px; font-size: 13px; }
.conn-dot.big { width: 9px; height: 9px; }
.cp-row { display: flex; justify-content: space-between; gap: 10px; padding: 7px 2px; border-top: 1px solid var(--line); }
.cp-label { color: var(--fg-faint); flex: none; }
.cp-value { color: var(--fg); text-align: right; word-break: break-all; user-select: text; }
.cp-value.mono { font-family: var(--mono); font-size: 11.5px; }
.cp-retry {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--line);
}
.cp-count { color: var(--fg-dim); font-variant-numeric: tabular-nums; }
.clock-panel .ck-toggle { display: flex; align-items: center; gap: 8px; padding: 4px 2px 10px; cursor: pointer; }
.clock-panel .ck-label { color: var(--fg-faint); font-size: 11px; padding: 8px 2px 5px; border-top: 1px solid var(--line); }
.clock-panel .ck-opts { display: flex; flex-direction: column; gap: 1px; }
.clock-panel .ck-opt {
  display: flex; align-items: center; gap: 8px; padding: 6px 6px;
  border-radius: var(--radius-sm); cursor: pointer;
}
.clock-panel .ck-opt:hover { background: var(--bg-hover); }
.clock-panel .ck-opt:has(input:disabled) { opacity: 0.45; cursor: not-allowed; }
.clock-panel .ck-name { flex: 1; }
.clock-panel .ck-sample { color: var(--fg-faint); font-variant-numeric: tabular-nums; font-size: 11.5px; }
.clock-panel input[type="checkbox"], .clock-panel input[type="radio"] { accent-color: var(--accent); margin: 0; }

/* 通知/Toast 语义图标 */
.sem-ico {
  flex: none; width: 20px; height: 20px; margin-top: 1px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: var(--accent); background: var(--accent-soft);
}
.sem-ico svg { width: 12.5px; height: 12.5px; display: block; }
.sem-ico.error { color: var(--danger); background: rgba(var(--danger-rgb), 0.14); }
.sem-ico.success { color: var(--ok); background: rgba(var(--ok-rgb), 0.14); }
.sem-ico.warn { color: var(--warn); background: rgba(var(--warn-rgb), 0.14); }

/* ---------- Spotlight 快捷启动器 ---------- */
.spotlight-mask {
  position: fixed; inset: 0; z-index: 8800;
  background: var(--mask);
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  display: flex; justify-content: center; padding-top: 16vh;
  animation: spotFade var(--dur-2) var(--ease-out);
}
@keyframes spotFade { from { opacity: 0; } }
.spotlight {
  width: min(580px, 92vw); height: fit-content;
  border-radius: var(--radius-lg); overflow: hidden;
  background: var(--bg-glass);
  backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-3), var(--edge-light);
  animation: spotIn var(--dur-2) var(--ease-out);
}
@keyframes spotIn { from { transform: scale(0.98) translateY(-6px); opacity: 0; } }
.spotlight .sp-row { display: flex; align-items: center; gap: 11px; padding: 14px 16px; }
.spotlight .sp-glyph { flex: none; width: 18px; height: 18px; color: var(--fg-faint); display: flex; align-items: center; justify-content: center; }
.spotlight .sp-glyph svg { width: 17px; height: 17px; display: block; }
.spotlight .sp-input {
  flex: 1; border: none; outline: none; background: transparent;
  color: var(--fg); font-size: 16px; font-family: var(--font);
}
.spotlight .sp-input:focus-visible { box-shadow: none; }
.spotlight .sp-input::placeholder { color: var(--fg-faint); }
.spotlight .sp-kbd {
  font-size: 10.5px; color: var(--fg-faint); border: 1px solid var(--line-strong);
  border-radius: 5px; padding: 2px 6px;
}
.spotlight .sp-results { border-top: 1px solid var(--line); padding: 6px; max-height: 46vh; overflow: auto; }
.spotlight .sp-group {
  padding: 8px 10px 3px; font-size: 10.5px; font-weight: 650; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--fg-faint); user-select: none;
}
.spotlight .sp-item {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px; min-height: 36px;
  border-radius: var(--radius-sm); cursor: pointer; font-size: 13.5px;
}
.spotlight .sp-item.on { background: var(--accent-soft); }
.spotlight .sp-item.app-disabled { opacity: 0.55; filter: grayscale(0.75); }
.spotlight .sp-item.app-disabled.on { opacity: 0.72; }
.spotlight .sp-icon { flex: none; width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; font-size: 16px; }
.spotlight .sp-icon svg { width: 17px; height: 17px; display: block; }
.spotlight .sp-icon-img { width: 18px; height: 18px; object-fit: contain; }
.spotlight .sp-title { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spotlight .sp-sub { color: var(--fg-faint); font-size: 11px; flex: none; }
.spotlight .sp-foot {
  display: flex; align-items: center; gap: 14px; padding: 7px 14px;
  border-top: 1px solid var(--line); font-size: 11px; color: var(--fg-faint); user-select: none;
}
.spotlight .sp-foot b { font-weight: 500; color: var(--fg-dim); font-family: var(--mono); font-size: 10.5px; }

/* ---------- 右键菜单 ---------- */
.ctx-menu {
  position: fixed; z-index: 8900; min-width: 190px;
  padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: ctxIn var(--dur-1) var(--ease-out); transform-origin: top left;
}
/* 比视口高才滚动。无条件 overflow 会把侧飞子菜单裁掉，所以只在 is-scroll 上开。 */
.ctx-menu.is-scroll {
  max-height: calc(100vh - 16px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.ctx-menu.is-scroll:has(.cm-sub) { overflow: visible; }
@keyframes ctxIn { from { transform: scale(0.96); opacity: 0; } }
.ctx-menu .cm-item {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 10px; border-radius: var(--radius-sm); cursor: pointer; font-size: 13px;
}
.ctx-menu .cm-item:hover { background: var(--accent-soft); }
.ctx-menu .cm-item.selected,
.ctx-menu .cm-item.selected:hover { color: var(--accent); background: var(--accent-soft); }
.ctx-menu .cm-check { flex: none; display: inline-flex; margin-left: 8px; }
.ctx-menu .cm-check svg { width: 14px; height: 14px; display: block; }
.ctx-menu .cm-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 二级菜单：本体右侧一个小三角，点开后子菜单从右侧飞出（放不下翻到左侧） */
.ctx-menu .cm-row { position: relative; }
/* 分隔线（os.contextMenu 里传 "-"/"separator"） */
.ctx-menu .cm-sep { height: 1px; margin: 5px 8px; background: var(--line-strong); opacity: 0.7; pointer-events: none; }
.ctx-menu .cm-head { padding: 6px 10px 2px; font-size: 11px; line-height: 1.2; color: var(--fg-faint); pointer-events: none; user-select: none; }
.ctx-menu .cm-prov {
  display: flex; align-items: center; gap: 6px; width: 100%;
  margin: 2px 0; padding: 5px 8px; border: none; border-radius: 7px;
  background: var(--bg-soft); cursor: pointer;
  color: var(--fg); font: 600 12px/1.2 var(--font); text-align: left;
}
.ctx-menu .cm-prov:hover { background: var(--bg-hover); }
.ctx-menu .cm-prov-name { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctx-menu .cm-count { flex: none; font-weight: 400; color: var(--fg-dim); font-size: 11px; }
.ctx-menu .cm-prov .cm-chevron { transition: transform 0.12s; }
.ctx-menu .cm-prov.collapsed .cm-chevron { transform: rotate(-90deg); }
.ctx-menu .cm-brand {
  flex: none; width: 16px; height: 16px; border-radius: 4px;
  display: inline-flex; align-items: center; justify-content: center; overflow: hidden;
  font: 700 9px/1 var(--font); color: var(--fg-dim); background: var(--bg-0);
}
.ctx-menu .cm-brand img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ctx-menu .cm-brand-svg { display: flex; width: 100%; height: 100%; }
.ctx-menu .cm-brand-svg svg { width: 100%; height: 100%; display: block; }
.ctx-menu .cm-caret { flex: none; display: inline-flex; color: var(--fg-faint); }
.ctx-menu .cm-caret svg { width: 13px; height: 13px; display: block; }
.ctx-menu .cm-item.sub-open { background: var(--accent-soft); }
.ctx-menu .cm-item.sub-open .cm-caret { color: var(--accent); }
.ctx-menu .cm-sub {
  position: absolute; left: 100%; top: -5px; z-index: 1;
  min-width: 168px; max-width: 260px; max-height: min(60vh, 340px); overflow-y: auto;
  padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: ctxIn var(--dur-1) var(--ease-out); transform-origin: top left;
}
.ctx-menu .cm-sub.flip { left: auto; right: 100%; transform-origin: top right; }
.ctx-menu .cm-item.disabled { opacity: 0.4; pointer-events: none; }
.ctx-menu .cm-item.danger { color: var(--danger); }
.ctx-menu .cm-item.danger:hover { background: rgba(var(--danger-rgb), 0.12); }
.cm-icon {
  width: 17px; height: 17px; flex: none; color: var(--fg-dim);
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
}
.cm-icon svg { width: 15.5px; height: 15.5px; display: block; }
.ctx-menu .cm-item:hover .cm-icon { color: inherit; }
.ctx-menu .cm-item.danger .cm-icon { color: var(--danger); }
.conn-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--danger); transition: background 0.3s; }
.conn-dot.on { background: var(--ok); box-shadow: 0 0 6px rgba(var(--ok-rgb), 0.8); }

/* 桌面图标 */
.desktop-icons {
  position: absolute; inset: 18px; z-index: 1;
  pointer-events: none;
}
.desktop-page {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start;
  gap: 6px; pointer-events: none;
}
/* 宽屏自由摆放：图标按持久化格子绝对定位（left/top 由 os.js iconStyle 按格子换算），可拖到桌面任意格 */
.desktop-page.free { display: block; }
.desktop-page.free .dicon { position: absolute; }
.desktop-dots {
  display: none;
  position: absolute; left: 0; right: 0; z-index: 2;
  bottom: calc(72px + env(safe-area-inset-bottom, 0));
  justify-content: center; align-items: center; gap: 7px;
  pointer-events: none;
}
.desktop-dots span {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--fg-faint); opacity: 0.55;
}
.desktop-dots span.on {
  background: var(--accent); opacity: 1;
}
[data-os="windows"] .desktop-dots {
  bottom: calc(var(--taskbar-h) + 12px + env(safe-area-inset-bottom, 0));
}
@media (max-width: 768px) {
  .desktop-icons.paging {
    display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-snap-stop: always;
    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
    pointer-events: auto;
    scrollbar-width: none;
  }
  .desktop-icons.paging::-webkit-scrollbar { width: 0; height: 0; }
  .desktop-icons.paging .desktop-page {
    position: relative; inset: auto;
    flex: 0 0 100%; width: 100%; height: 100%;
    overflow: hidden;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  .desktop-dots { display: flex; }
}
.dicon {
  pointer-events: auto; position: relative;
  width: 86px; padding: 10px 4px 8px; border-radius: 12px;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  cursor: pointer; border: 1px solid transparent;
  transition: background var(--dur-1), border-color var(--dur-1), transform var(--dur-1);
}
.dicon:hover { background: var(--bg-hover); border-color: var(--line); }
.dicon:active { transform: scale(0.95); }
.dicon.dragging { opacity: 0.4; }
.dicon.app-disabled { opacity: 0.48; filter: grayscale(0.85); }
.dicon.app-disabled:hover { opacity: 0.62; }
/* 拖放反馈：合并成新文件夹 / 收纳进文件夹时，目标图标高亮提示「松手即收纳」 */
.dicon.drop-into .glyph {
  border-color: var(--accent);
  background: var(--dicon-tile-hover);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), 0.55), var(--shadow-1);
  transform: scale(1.1);
}
/* 拖放反馈：落在图标缝隙时显示插入线（桌面图标纵向成列 → 缝隙为水平线） */
.dicon.drop-before::after, .dicon.drop-after::after {
  content: ""; position: absolute; left: 6px; right: 6px; height: 3px;
  background: var(--accent); border-radius: 3px;
  box-shadow: 0 0 8px rgba(var(--accent-rgb), 0.9); pointer-events: none;
}
.dicon.drop-before::after { top: -4px; }
.dicon.drop-after::after { bottom: -4px; }
/* 新应用提示点：新装且未打开过的应用图标右上角 */
.dicon .fresh-dot {
  position: absolute; top: 6px; right: 14px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--accent);
  border: 2px solid var(--bg); box-shadow: 0 0 6px rgba(var(--accent-rgb), 0.85);
  pointer-events: none;
}
.dicon .glyph {
  flex: none; position: relative;
  width: 52px; height: 52px; border-radius: var(--radius); font-size: 26px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; /* 与 Dock 一致：裁剪 SVG 固有尺寸撑破磁贴的情况 */
  /* 不用 backdrop-filter：图标数量多、每个都是独立模糊层，滚动/合成时 GPU 成本成倍；
     磁贴底色本就高不透明度（0.85+），壁纸为静态渐变，玻璃效果几乎不可见 */
  background: var(--dicon-tile-bg);
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-1), var(--edge-light);
  transition: background var(--dur-1), border-color var(--dur-1), box-shadow var(--dur-1), transform var(--dur-1);
}
/* 文件/目录快捷方式：类型色线性图标 + 左下角快捷方式箭头徽标 */
.dicon .glyph.glyph-file { color: var(--fg-dim); }
.dicon .glyph .sc-badge {
  position: absolute; left: 3px; bottom: 3px; width: 16px; height: 16px;
  border-radius: 5px; display: flex; align-items: center; justify-content: center;
  background: var(--bg-glass-2); border: 1px solid var(--line-strong);
  color: var(--fg-dim); box-shadow: var(--shadow-1); pointer-events: none;
}
.dicon .glyph .sc-badge svg { width: 9.5px; height: 9.5px; display: block; }
/* logo.svg：flex 子项默认 min-width/min-height:auto，会按 SVG 固有尺寸（viewBox/width）拒绝缩小到 70%，
   大 viewBox（如 128²、1024²）会撑破 52px 磁贴；min-size:0 + max 约束后由 object-fit 适配 */
.glyph-img {
  display: block; flex: none;
  width: 70%; height: 70%; max-width: 100%; max-height: 100%;
  min-width: 0; min-height: 0;
  object-fit: contain; pointer-events: none;
}
/* 内置应用线性图标：着色 SVG（tint 由行内 style 提供） */
.glyph-svg {
  width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.glyph-svg svg { width: 100%; height: 100%; display: block; }
/* 第三方 emoji：着色瓷贴由行内渐变提供，emoji 上加轻微投影稳重量 */
.glyph .glyph-emoji { pointer-events: none; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.28)); }
.dicon:hover .glyph {
  background: var(--dicon-tile-hover);
  border-color: rgba(var(--accent-rgb), 0.35);
  transform: translateY(-1px);
  box-shadow: var(--shadow-2), var(--edge-light);
}
/* 文件夹图标：内含最多 4 个 mini 应用图标（扁平玻璃，圆角硬裁剪） */
.dicon .glyph.fglyph {
  display: grid; grid-template-columns: 1fr 1fr; place-items: center;
  font-size: 15px; padding: 6px; gap: 2px;
  background: var(--dicon-folder-bg);
  border-color: rgba(var(--accent-rgb), 0.28);
  /* 去掉 inset 顶光：与圆角合成时易出亮边/毛边；外阴影收单层 */
  box-shadow: var(--dicon-folder-shadow);
  overflow: hidden;
  isolation: isolate;
}
.dicon:hover .glyph.fglyph {
  background: linear-gradient(0deg, rgba(var(--accent-rgb), 0.22), rgba(var(--accent-rgb), 0.22)), var(--dicon-tile-hover);
  border-color: rgba(var(--accent-rgb), 0.42);
  /* 不跟普通图标抬升，避免文件夹「鼓起来」的假立体 */
  transform: none;
  box-shadow: var(--dicon-folder-shadow), 0 0 0 1px rgba(var(--accent-rgb), 0.12);
}
:root[data-theme="light"] .dicon:hover .glyph.fglyph {
  background: linear-gradient(0deg, rgba(var(--accent-rgb), 0.14), rgba(var(--accent-rgb), 0.14)), var(--dicon-tile-hover);
}
.dicon.drop-into .glyph.fglyph {
  background: linear-gradient(0deg, rgba(var(--accent-rgb), 0.28), rgba(var(--accent-rgb), 0.28)), var(--dicon-tile-hover);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), 0.55), var(--dicon-folder-shadow);
}
.dicon .fg-cell { line-height: 1; display: flex; align-items: center; justify-content: center; overflow: hidden; min-width: 0; min-height: 0; border-radius: 4px; }
.dicon .fg-cell-img { width: 100%; height: 100%; max-width: 22px; max-height: 22px; object-fit: contain; pointer-events: none; border-radius: 4px; }
.dicon .fg-cell svg { width: 15px; height: 15px; display: block; }
.dicon .fg-cell.empty { grid-column: 1 / -1; grid-row: 1 / -1; }
.dicon .fg-cell.empty svg { width: 22px; height: 22px; color: var(--fg-dim); }

/* 文件夹展开弹窗 */
.folder-pop-mask {
  position: absolute; inset: 0; z-index: 4500;
  display: flex; align-items: center; justify-content: center;
  background: var(--mask); backdrop-filter: blur(6px);
}
.folder-pop {
  width: min(520px, 92vw); max-height: 70vh; display: flex; flex-direction: column;
  border-radius: 18px; background: var(--bg-glass); border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-3), var(--edge-light); padding: 14px;
  backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5);
  animation: spotIn var(--dur-2) var(--ease-out);
}
.folder-pop .fp-head { display: flex; align-items: center; gap: 8px; padding: 2px 4px 12px; }
.folder-pop .fp-head .spacer { flex: 1; min-width: 8px; }
.folder-pop .fp-title {
  display: flex; align-items: baseline; gap: 6px; min-width: 0;
}
.folder-pop .fp-title b {
  font-size: 15px; font-weight: 650; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.folder-pop .fp-count {
  flex: none; color: var(--fg-dim); font-size: 13px; font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.folder-pop .fp-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.folder-pop .fp-actions .btn.sm { padding: 4px 9px; }
.folder-pop .fp-actions .btn.sm.icon-only { padding: 4px 6px; }
.folder-pop .fp-grid {
  display: flex; flex-wrap: wrap; gap: 6px; overflow-y: auto; align-content: flex-start;
}
/* 夹内网格：插入线改为竖线（左右缝隙），覆盖桌面纵向列表的水平线 */
.folder-pop .fp-grid .dicon.drop-before::after, .folder-pop .fp-grid .dicon.drop-after::after {
  left: auto; right: auto; top: 6px; bottom: 6px; width: 3px; height: auto;
}
.folder-pop .fp-grid .dicon.drop-before::after { left: -4px; }
.folder-pop .fp-grid .dicon.drop-after::after { right: -4px; }
.folder-pop .fp-empty { padding: 26px 8px; text-align: center; color: var(--fg-faint); font-size: 12.5px; }

/* 上传传输面板 */
.transfers {
  position: fixed; right: 12px; bottom: 84px; z-index: 7500;
  display: flex; flex-direction: column; gap: 8px; width: 280px;
}
.tr-item {
  padding: 9px 12px 8px; border-radius: 12px; background: var(--bg-glass-2);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-1); font-size: 12px;
}
.tr-item .tr-row { display: flex; align-items: center; gap: 8px; }
.tr-item .tr-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--fg); }
.tr-item .tr-state { flex: none; color: var(--fg-dim); font-variant-numeric: tabular-nums; }
.tr-item .tr-x {
  flex: none; border: none; background: none; color: var(--fg-dim); cursor: pointer;
  font-size: 12px; padding: 2px 4px; border-radius: 6px;
}
.tr-item .tr-x:hover { color: var(--danger); background: rgba(var(--danger-rgb), 0.12); }
.tr-item .tr-bar { height: 3px; margin-top: 7px; border-radius: 2px; background: var(--bg-strong); overflow: hidden; }
.tr-item .tr-fill { height: 100%; border-radius: 2px; background: var(--accent); transition: width 0.2s; }
.tr-item.done .tr-fill { background: var(--ok); }
.tr-item.cancelled .tr-fill, .tr-item.failed .tr-fill { background: var(--danger); }
.tr-item.cancelled, .tr-item.failed { opacity: 0.75; }

.dicon .label {
  flex: none;
  width: 100%; max-width: 84px;
  font-size: 11.5px; color: var(--desktop-label-fg, var(--fg)); text-align: center; line-height: 1.25;
  /* 固定两行高度，避免短/长标题导致整格高度不一、列内图标错位 */
  height: 2.5em;
  overflow: hidden; text-overflow: ellipsis;
  word-break: break-word; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
  text-shadow: var(--desktop-label-shadow, var(--label-shadow));
}

/* ---------- 窗口 ---------- */
.window {
  position: absolute; min-width: min(320px, calc(100vw - 16px)); min-height: 220px;
  display: flex; flex-direction: column;
  background: var(--bg-glass);
  /* 窗口是面积最大的常驻毛玻璃，模糊半径直接决定每帧 GPU 成本，克制取值 */
  backdrop-filter: blur(16px) saturate(1.5); -webkit-backdrop-filter: blur(16px) saturate(1.5);
  border: 1px solid var(--line-strong); border-radius: var(--radius);
  box-shadow: var(--shadow-2), var(--edge-light);
  overflow: hidden;
  overflow: clip; /* 裁剪圆角但不形成滚动端口，避免锚点把标题栏顶走 */
  animation: winIn var(--dur-3) var(--ease-out);
}
.window.focused { border-color: rgba(var(--accent-rgb), 0.4); box-shadow: var(--shadow-3), var(--edge-light); }
/* 最大化：窗口无边距贴满桌面，去圆角与边框（菜单栏/Dock 自带分隔线） */
.window.zoomed { border-radius: 0; border: none; }
.window.minimized { display: none; }
/* 布局切换（平铺 / 最大化 / 2/3 / 还原）时为位置/尺寸加过渡；拖拽/缩放时无该类，不受影响 */
.window.tiling { transition: left 0.2s var(--ease-out), top 0.2s var(--ease-out), width 0.2s var(--ease-out), height 0.2s var(--ease-out); }
@keyframes winIn { from { transform: scale(0.97) translateY(8px); opacity: 0; } }

.titlebar {
  /* 高于点选层 .win-pick-glass(20)。标题栏在有搜索框时是 container，会把菜单的 z-index 关在里面，否则二次点「选择元素」打在玻璃上 */
  position: relative; z-index: 30;
  height: var(--titlebar-h); flex: none;
  display: flex; align-items: center; gap: 7px; padding: 0 10px;
  /* 近实色扁平底 + 发丝分隔（对齐 macOS Big Sur+，无渐变层） */
  background: var(--titlebar-bg);
  border-bottom: 1px solid var(--line);
  cursor: default; touch-action: none;
}
.window:not(.focused) .titlebar {
  background: var(--titlebar-bg-inactive);
}
.titlebar:active { cursor: default; }
.traffic { display: flex; gap: 8px; flex: none; align-items: center; cursor: default; }
.t-leading {
  flex: 1 1 0; min-width: 0;
  display: flex; align-items: center; justify-content: flex-start; gap: 4px;
}
.t-center {
  flex: 0 1 auto; min-width: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center; gap: 7px;
}
.t-center.t-center-search {
  flex: 1 1 168px; min-width: 22px; max-width: 324px;
  overflow: hidden; gap: 4px;
}
.titlebar.has-title-search {
  container-type: inline-size;
  container-name: titlebar;
}
.titlebar.has-title-search .t-leading,
.titlebar.has-title-search .t-trailing {
  flex: 1 1 0;
  min-width: min-content;
}
.titlebar.has-title-search .t-sub,
.titlebar.has-title-search .t-plan,
.titlebar.has-title-search .t-model,
.titlebar.has-title-search .t-tools-extra {
  flex: 0 4 auto; min-width: 0;
}
.titlebar.has-title-search .t-sub,
.titlebar.has-title-search .t-plan,
.titlebar.has-title-search .t-tools-extra,
.titlebar.has-title-search .t-tools-center,
.titlebar.has-title-search .t-tools-lead {
  overflow: hidden;
}
.titlebar.has-title-search .t-tools-center { flex: 0 2 auto; min-width: 0; }
.titlebar.has-title-search .t-tools-lead { flex: 0 1 auto; min-width: 0; }
.titlebar.has-title-search .t-tools-keep { flex: none; }
@container titlebar (max-width: 720px) {
  .t-sub, .t-plan, .tm-name, .tm-usage { display: none; }
}
@container titlebar (max-width: 520px) {
  .t-tools.t-tools-extra { display: none; }
}
@container titlebar (max-width: 420px) {
  .t-tools.t-tools-center { display: none; }
}
@container titlebar (max-width: 360px) {
  .t-tools.t-tools-lead { display: none; }
}
.t-trailing {
  flex: 1 1 0; min-width: min-content;
  display: flex; align-items: center; justify-content: flex-end; gap: 7px;
}
.traffic button {
  position: relative; flex: none;
  width: 14px; height: 14px; border-radius: 50%; border: none; padding: 0;
  cursor: default; opacity: 0.9; transition: opacity var(--dur-1), transform var(--dur-1), background var(--dur-2);
}
.traffic:hover button { opacity: 1; }
.traffic button:hover { transform: scale(1.12); }
.traffic .t-close { background: #ff5f57; }
.traffic .t-min { background: #febc2e; }
.traffic .t-zoom { background: #28c840; }
/* 失焦窗口红绿灯变灰、标题降淡（macOS 行为），悬停恢复彩色便于直接操作 */
.window:not(.focused) .traffic button { background: var(--bg-strong); }
.window:not(.focused) .traffic:hover .t-close { background: #ff5f57; }
.window:not(.focused) .traffic:hover .t-min { background: #febc2e; }
.window:not(.focused) .traffic:hover .t-zoom { background: #28c840; }
.window:not(.focused) .titlebar .t-title { color: var(--fg-dim); }
/* macOS 风格悬停符号：整组悬停时全部显示，单键悬停加深 */
.traffic .t-close::before,
.traffic .t-close::after,
.traffic .t-min::before,
.traffic .t-zoom::before,
.traffic .t-zoom::after {
  content: ""; position: absolute; pointer-events: none;
  opacity: 0; transition: opacity var(--dur-1) ease;
}
.traffic:hover .t-close::before,
.traffic:hover .t-close::after,
.traffic:hover .t-min::before,
.traffic:hover .t-zoom::before,
.traffic:hover .t-zoom::after { opacity: 0.6; }
.traffic button:hover::before,
.traffic button:hover::after { opacity: 1 !important; }
/* 关闭 × */
.traffic .t-close::before,
.traffic .t-close::after {
  top: 50%; left: 50%; width: 7px; height: 1.5px; margin: -0.75px 0 0 -3.5px;
  border-radius: 0.5px; background: rgba(77, 0, 0, 0.88);
}
.traffic .t-close::before { transform: rotate(45deg); }
.traffic .t-close::after { transform: rotate(-45deg); }
/* 最小化 − */
.traffic .t-min::before {
  top: 50%; left: 50%; width: 7px; height: 1.5px; margin: -0.75px 0 0 -3.5px;
  border-radius: 0.5px; background: rgba(153, 87, 0, 0.88);
}
/* 最大化 + */
.traffic .t-zoom::before,
.traffic .t-zoom::after {
  top: 50%; left: 50%; background: rgba(0, 90, 0, 0.88); border-radius: 0.5px;
}
.traffic .t-zoom::before { width: 7px; height: 1.5px; margin: -0.75px 0 0 -3.5px; }
.traffic .t-zoom::after { width: 1.5px; height: 7px; margin: -3.5px 0 0 -0.75px; }
/* 已最大化：还原角标（macOS 双角括号） */
.traffic .t-zoom.zoomed::before,
.traffic .t-zoom.zoomed::after {
  width: 5px; height: 5px; margin: 0; background: none; border-radius: 0;
}
.traffic .t-zoom.zoomed::before {
  top: 3.5px; left: 3.5px; transform: none;
  border-top: 1.5px solid rgba(0, 90, 0, 0.88); border-left: 1.5px solid rgba(0, 90, 0, 0.88);
}
.traffic .t-zoom.zoomed::after {
  top: auto; left: auto; bottom: 3.5px; right: 3.5px; transform: none;
  border-bottom: 1.5px solid rgba(0, 90, 0, 0.88); border-right: 1.5px solid rgba(0, 90, 0, 0.88);
}
.titlebar .t-icon { font-size: 14px; flex: none; }
.titlebar .t-icon.t-icon-logo {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; overflow: hidden;
}
.titlebar .t-icon-logo .t-icon-img {
  width: 100%; height: 100%; max-width: 15px; max-height: 15px;
  object-fit: contain; pointer-events: none;
}
.titlebar .t-icon.t-icon-svg {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px;
}
.titlebar .t-icon-svg svg { width: 14px; height: 14px; display: block; }
.titlebar .t-title {
  flex: 0 1 auto; min-width: 0; font-size: 12.5px; font-weight: 500; color: var(--fg);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.titlebar .t-sub {
  flex: 0 1 auto; min-width: 0; max-width: 40%; font-size: 11px; color: var(--fg-faint);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right;
  padding-right: 4px;
}
/* 标题栏状态小图标：仅思考中（含流式输出）显示旋转环，空闲不渲染 */
.titlebar .t-status {
  flex: none; width: 11px; height: 11px; box-sizing: border-box; border-radius: 50%;
}
.titlebar .t-status.st-thinking {
  border: 1.5px solid rgba(var(--accent-rgb), 0.25); border-top-color: var(--accent);
  animation: tStatusSpin 0.7s linear infinite;
}
@keyframes tStatusSpin { to { transform: rotate(360deg); } }

/* 标题栏模型区：简化模型名（hover 显示完整名）+ token 用量 + 切换图标下拉，紧贴右侧工具区 */
.titlebar .t-model {
  flex: 0 1 auto; min-width: 0; display: flex; align-items: center; gap: 4px; margin-left: 2px;
}
.titlebar .tm-name {
  min-width: 0; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 500 11.5px/1.3 var(--mono); color: var(--fg-dim);
}
.titlebar .tm-usage {
  flex: none; font: 400 11px/1.3 var(--mono); color: var(--fg-faint); font-variant-numeric: tabular-nums;
}
/* 计划进度徽标：紧贴模型名左侧，显示最新 plan 的 passed/total */
.titlebar .t-plan {
  flex: none; display: inline-flex; align-items: center; gap: 4px; margin-left: 2px;
  padding: 0 6px; border-radius: 999px; white-space: nowrap;
  font: 600 10px/1.5 var(--mono); font-variant-numeric: tabular-nums;
  color: var(--accent); background: var(--accent-soft); border: 1px solid rgba(var(--accent-rgb), 0.28);
}
.titlebar .t-plan.done { color: var(--ok); background: rgba(var(--ok-rgb), 0.14); border-color: rgba(var(--ok-rgb), 0.32); }
.titlebar .t-plan.clickable { cursor: pointer; transition: background var(--dur-1), border-color var(--dur-1); }
.titlebar .t-plan.clickable:hover { background: rgba(var(--accent-rgb), 0.28); border-color: var(--accent); }
.titlebar .t-plan.done.clickable:hover { background: rgba(var(--ok-rgb), 0.26); border-color: var(--ok); }
.titlebar .t-plan .t-plan-ico { font-size: 10px; line-height: 1; display: inline-flex; align-items: center; }
.titlebar .t-plan .t-plan-ico svg { width: 10px; height: 10px; display: block; }
.titlebar .tm-pick { position: relative; flex: none; display: flex; }
.titlebar .tm-btn { width: 18px; height: 18px; border-radius: 6px; }
.titlebar .tm-btn .t-tool-ico, .titlebar .tm-btn .t-tool-ico svg { width: 12px; height: 12px; }
.titlebar .tm-fly { position: absolute; top: calc(100% + 8px); right: 0; z-index: 120; width: 280px; }
.t-menu-drop.tm-drop {
  position: relative; top: auto; right: auto;
  width: 100%; max-height: 360px; display: flex; flex-direction: column; overflow: hidden; padding: 0;
  background: var(--bg-0);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.tm-drop .tm-toolbar {
  flex: none; position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; gap: 4px; padding: 5px 6px;
  border-bottom: 1px solid var(--line); background: transparent;
}
.tm-drop .tm-search {
  flex: 1; min-width: 0; height: 24px; padding: 0 8px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-input); color: var(--fg); font-size: 11.5px;
  outline: none;
}
.tm-drop .tm-search:focus { border-color: var(--accent); box-shadow: none; }
.tm-drop .tm-refresh { width: 24px; height: 24px; border-radius: 6px; flex: none; }
.tm-drop .tm-refresh.spin .t-tool-ico { animation: tmSpin 0.8s linear infinite; }
@keyframes tmSpin { to { transform: rotate(360deg); } }
.tm-drop .tm-list { flex: 1; min-width: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 5px; }
.tm-drop .tm-vg { min-width: 0; padding-left: 8px; }
.tm-drop .tm-prov {
  display: flex; align-items: center; gap: 6px; width: 100%;
  margin-top: 6px; padding: 5px 8px; border: none; border-radius: 7px;
  background: var(--bg-soft); cursor: pointer;
  color: var(--fg-dim); font: 600 11px/1.2 var(--font); text-align: left;
}
.tm-drop .tm-prov:first-child { margin-top: 0; }
.tm-drop .tm-prov:hover { background: var(--bg-hover); color: var(--fg); }
.tm-drop .tm-prov-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-drop .tm-count { margin-left: auto; font-weight: 400; color: var(--fg-faint); font-size: 11px; }
.tm-drop .tm-caret { flex: none; display: inline-flex; opacity: 0.45; transition: transform 0.12s; }
.tm-drop .tm-caret svg { width: 12px; height: 12px; display: block; }
.tm-drop .tm-prov.collapsed .tm-caret { transform: rotate(-90deg); }
.tm-pick .tm-brand {
  flex: none; width: 16px; height: 16px; border-radius: 4px;
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; font: 700 9px/1 var(--font); color: var(--fg-dim); background: var(--bg-soft);
}
.tm-pick .tm-brand.plate { background: var(--brand-plate); }
.tm-pick .tm-brand img { width: 100%; height: 100%; object-fit: contain; display: block; }
.tm-pick .tm-brand-svg { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: var(--fg-dim); }
.tm-pick .tm-brand-svg svg { width: 100%; height: 100%; display: block; }
.tm-pick .tm-brand.sm { width: 14px; height: 14px; border-radius: 3px; font-size: 8px; }
.tm-drop .tm-vendor { padding: 8px 6px 4px; font: 500 11px/1.2 var(--font); color: var(--fg-faint); }
.tm-drop .tm-prov + .tm-vg .tm-vendor { padding-top: 4px; }
.tm-drop .t-menu-item {
  display: flex; align-items: flex-start; gap: 8px;
  min-width: 0; padding: 6px 8px; border-radius: 8px;
  border: none; background: transparent;
  font: 500 12px/1.3 var(--font); color: var(--fg); white-space: normal;
}
.tm-drop .tm-item-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.tm-drop .tm-item-default { font-weight: 400; color: var(--fg-faint); }
.tm-drop .tm-item-meta { margin-left: auto; flex: none; display: flex; align-items: flex-start; gap: 6px; }
.tm-drop .tm-item-check { flex: none; color: var(--accent); padding-top: 1px; }
.tm-drop .tm-item-check svg { width: 14px; height: 14px; display: block; }
.tm-model-tip {
  position: absolute; right: 100%; top: 0; margin-right: 4px; z-index: 40;
  transform: translateY(-50%);
  display: flex; flex-direction: column;
  width: 240px; max-width: min(240px, 70vw); padding: 12px 14px 10px; box-sizing: border-box;
  background: var(--bg-0); border: 1px solid var(--line-strong);
  border-radius: 12px; box-shadow: var(--shadow);
  pointer-events: none;
}
.tm-model-tip-name { font: 600 13.5px/1.4 var(--font); color: var(--fg); }
.tm-model-tip-desc {
  margin: 6px 0 0; font: 400 12px/1.45 var(--font); color: var(--fg-dim);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tm-model-tip-specs { margin-top: 10px; padding-top: 2px; border-top: 1px solid var(--line); }
.tm-model-tip-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 0 0;
}
.tm-model-tip-k { font: 400 12.5px/1.3 var(--font); color: var(--fg); }
.tm-model-tip-v { font: 400 12.5px/1.3 var(--font); color: var(--fg-faint); font-variant-numeric: tabular-nums; }
.tm-drop .t-menu-item.active { background: var(--accent-soft); box-shadow: none; }
.tm-drop .t-menu-item.selected { color: var(--fg); }
.tm-drop .tm-more {
  display: block; width: 100%; padding: 4px 8px 6px 32px; border: none; background: transparent;
  font: 500 11px/1.2 var(--font); color: var(--fg-faint); text-align: left; cursor: pointer;
}
.tm-drop .tm-more:hover { color: var(--fg-dim); }
.tm-drop .tm-empty { opacity: 0.55; cursor: default; pointer-events: none; border: none; background: none; margin: 0; }
.t-menu-item.selected { color: var(--accent); background: var(--accent-soft); }
.t-menu-sep { height: 1px; margin: 4px 6px; background: var(--line); }

/* 标题栏右侧工具簇：无容器底，悬停/按下时单按钮反馈 */
.t-tools {
  flex: none; display: flex; align-items: center; gap: 2px;
  margin-left: 4px; padding: 0;
}
.t-tools-lead, .t-tools-center { margin-left: 0; }
/* 窄窗时标题先省略。右侧工具图标不让位；左侧/中间工具仍可裁，窗口按钮（⋯ / 关闭 / 最大化 / 最小化）不让位。 */
.t-tools-lead, .t-tools-center { flex: 0 1 auto; min-width: 0; overflow: hidden; }
.t-tools-extra { flex: none; }
.t-search-slot {
  container-type: inline-size;
  container-name: title-search;
  flex: 1 1 168px; width: 168px; min-width: 22px; max-width: 280px;
  height: 22px;
}
.t-search {
  position: relative;
  display: flex; align-items: center; gap: 4px;
  width: 100%; height: 22px; min-width: 0;
  padding: 0 6px; box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 7px;
  background: var(--bg-soft); color: var(--fg-faint);
  font: inherit; appearance: none; -webkit-appearance: none;
  cursor: pointer;
  transition: background var(--dur-1), border-color var(--dur-1), box-shadow var(--dur-1), color var(--dur-1);
}
.t-search:hover {
  border-color: var(--line-strong);
  background: var(--bg-hover);
  color: var(--fg-dim);
}
.t-search:focus-visible {
  border-color: var(--accent);
  background: var(--bg-input);
  color: var(--fg);
  box-shadow: var(--ring);
}
.t-search.filled { color: var(--fg); }
.t-search.open { visibility: hidden; }
@container title-search (max-width: 80px) {
  .t-search {
    padding: 0; justify-content: center;
    border-color: transparent; background: transparent;
  }
  .t-search:hover, .t-search:focus-visible {
    border-color: transparent; background: var(--bg-hover); color: var(--fg);
    box-shadow: none;
  }
  .t-search-text { display: none; }
  .t-search.filled .t-search-dot { display: block; }
}
@container titlebar (max-width: 480px) {
  .t-search-slot { flex: 0 0 22px; width: 22px; max-width: 22px; }
  .t-center.t-center-search { flex: 0 1 22px; max-width: 80px; }
  .t-search-text { display: none; }
  .t-search {
    padding: 0; justify-content: center;
    border-color: transparent; background: transparent;
  }
  .t-search:hover, .t-search:focus-visible {
    border-color: transparent; background: var(--bg-hover); color: var(--fg);
    box-shadow: none;
  }
  .t-search.filled .t-search-dot { display: block; }
}
.t-search-text {
  flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 400 12px var(--font); text-align: left;
}
.t-search-dot {
  display: none;
  position: absolute; top: 3px; right: 3px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent); pointer-events: none;
}
.t-search-ico {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 12px; height: 12px; color: inherit; pointer-events: none;
}
.t-search-ico svg { display: block; width: 12px; height: 12px; }
.t-search-pop {
  position: absolute; z-index: 140;
  display: flex; flex-direction: column; min-width: 0; min-height: 0;
  overflow: hidden;
  padding: 6px; box-sizing: border-box;
  background: var(--bg-glass-drop); border: 1px solid var(--line-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-2), var(--edge-light);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  animation: menuDrop var(--dur-1) var(--ease-out);
}
.t-search-pop-input {
  flex: none; display: flex; align-items: center; gap: 6px;
  height: 32px; padding: 0 8px; box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg-input); color: var(--fg);
}
.t-search-pop-input:focus-within {
  border-color: var(--accent);
  box-shadow: var(--ring);
}
.t-search-pop-list {
  flex: 1; min-height: 0; margin-top: 4px; overflow: auto;
}
.t-search-input {
  flex: 1; min-width: 0; height: 20px; border: none; outline: none; padding: 0;
  background: transparent; color: inherit; font: 400 12px var(--font);
  appearance: none; -webkit-appearance: none;
}
.t-search-input::placeholder { color: var(--fg-faint); }
.t-search-input:focus, .t-search-input:focus-visible {
  outline: none; box-shadow: none;
}
.t-search-input::-webkit-search-cancel-button { display: none; }
.t-search-clear {
  flex: none; width: 16px; height: 16px; padding: 0; border: none; border-radius: 5px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--fg-faint); cursor: pointer;
}
.t-search-clear:hover { background: var(--bg-hover); color: var(--fg); }
.t-search-clear .t-tool-ico, .t-search-clear .t-tool-ico svg { width: 10px; height: 10px; }
.t-search-hint {
  padding: 5px 8px 6px; font: 400 11px/1.3 var(--font); color: var(--fg-faint);
}
.t-search-group {
  padding: 6px 8px 3px; font: 600 10.5px/1.2 var(--font); color: var(--fg-faint);
}
.t-search-item {
  display: flex; align-items: flex-start; gap: 8px;
  min-width: 0; padding: 6px 8px; border-radius: 8px;
  font: 500 12px/1.3 var(--font); color: var(--fg); cursor: pointer;
}
.t-search-item:hover, .t-search-item.active { background: var(--accent-soft); }
.t-search-item.hint { cursor: default; color: var(--fg-dim); }
.t-search-item.hint:hover { background: transparent; }
.t-search-item-ico {
  flex: none; width: 16px; height: 16px; margin-top: 1px;
  display: inline-flex; align-items: center; justify-content: center; color: var(--fg-dim);
}
.t-search-item-ico svg { width: 14px; height: 14px; display: block; }
.t-search-item-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.t-search-item-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t-search-item-sub {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 400 11px/1.3 var(--font); color: var(--fg-faint);
}
.t-search-item mark {
  background: rgba(var(--accent-rgb), 0.18); color: inherit;
  border-radius: 2px; padding: 0;
}
.t-search-dismiss {
  flex: none; width: 16px; height: 16px; margin-top: 1px; padding: 0; border: none; border-radius: 5px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--fg-faint); cursor: pointer;
}
.t-search-dismiss:hover { background: var(--bg-hover); color: var(--fg); }
.t-search-dismiss .t-tool-ico, .t-search-dismiss .t-tool-ico svg { width: 10px; height: 10px; }

.t-tool {
  flex: none; width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  border: none; border-radius: var(--radius-sm); padding: 0;
  background: transparent; color: var(--fg-faint);
  cursor: pointer; line-height: 1;
  transition: background var(--dur-1), color var(--dur-1), transform var(--dur-1);
}
.t-tool:hover:not(:disabled):not(.disabled) {
  background: var(--bg-hover); color: var(--fg);
}
.t-tool:active:not(:disabled):not(.disabled) {
  background: var(--bg-strong); color: var(--fg); transform: scale(0.92);
}
.t-tool.open, .t-tool.open:hover {
  background: var(--accent-soft); color: var(--accent);
}
.t-tool.open:active { background: rgba(var(--accent-rgb), 0.22); transform: scale(0.92); }
.t-tool.t-tool-chat,
.t-tool.t-tool-chat:hover,
.t-tool.t-tool-chat:active,
.t-tool.t-tool-chat.open,
.t-tool.t-tool-chat.open:hover,
.t-tool.t-tool-chat.open:active {
  background: transparent; color: var(--fg-dim); transform: none;
}
.t-tool.t-tool-chat:hover { color: var(--fg); }
.t-tool.t-tool-chat.open,
.t-tool.t-tool-chat.open:hover,
.t-tool.t-tool-chat.open:active { color: var(--accent); }
.t-tool-bug { color: var(--warn); }
.t-tool-bug:hover:not(:disabled):not(.disabled) {
  color: var(--warn); background: rgba(var(--warn-rgb), 0.14);
}
.t-tool:disabled, .t-tool.disabled {
  opacity: 0.38; cursor: default; pointer-events: none;
}
.t-tool-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; pointer-events: none;
}
.t-tool-ico svg { display: block; width: 14px; height: 14px; }
.t-tool-img { width: 14px; height: 14px; object-fit: contain; pointer-events: none; display: block; }
.t-tool-glyph {
  font-size: 12px; font-weight: 600; line-height: 1; pointer-events: none;
}
.t-tools-sep {
  flex: none; width: 1px; height: 12px; margin: 0 2px;
  background: var(--line); border-radius: 1px;
}

.t-menu-wrap { position: relative; flex: none; display: flex; }
.t-menu-drop {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 120;
  min-width: 176px; padding: 5px;
  background: var(--bg-glass-drop); border: 1px solid var(--line-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-2), var(--edge-light);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  animation: menuDrop var(--dur-1) var(--ease-out);
}
@keyframes menuDrop {
  from { opacity: 0; transform: translateY(-4px) scale(0.98); }
  to { opacity: 1; transform: none; }
}
.t-menu-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 11px; border-radius: var(--radius-sm); font-size: 12.5px; font-weight: 500;
  color: var(--fg-dim); cursor: pointer; white-space: nowrap; user-select: none;
  transition: background var(--dur-1), color var(--dur-1);
}
.t-menu-item .cm-icon { width: 16px; height: 16px; flex: none; display: inline-flex; align-items: center; justify-content: center; color: var(--fg-dim); }
.t-menu-item .cm-icon svg { width: 15px; height: 15px; display: block; }
.t-menu-item:hover .cm-icon { color: inherit; }
.t-menu-item:hover { background: var(--accent-soft); color: var(--fg); }
.t-menu-item.selected,
.t-menu-item.selected:hover { color: var(--accent); background: var(--accent-soft); }
.t-menu-item.selected .cm-icon,
.t-menu-item.selected:hover .cm-icon { color: inherit; }
.t-menu-item.danger { color: var(--danger); }
.t-menu-item.danger .cm-icon { color: var(--danger); }
.t-menu-item.danger:hover { background: rgba(var(--danger-rgb), 0.12); color: var(--danger); }
.t-menu-item.disabled { opacity: 0.4; pointer-events: none; }
.t-menu-sep { height: 1px; margin: 4px 6px; background: var(--line); }

/* z-index:0 形成层叠上下文，把应用内 z-index 关在内容区，避免盖住窗口缩放把手 */
.win-main { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: row; position: relative; }
.win-stage { flex: 1; min-width: 0; min-height: 0; position: relative; display: flex; flex-direction: column; }
.win-body { flex: 1; min-height: 0; position: relative; z-index: 0; display: flex; flex-direction: column; }
.win-pick-glass {
  position: absolute; inset: 0; z-index: 20; cursor: crosshair;
  background: transparent;
}
.win-pick-hl {
  position: absolute; z-index: 19; pointer-events: none;
  background: rgba(var(--accent-rgb), 0.18);
  box-shadow: inset 0 0 0 1.5px rgba(var(--accent-rgb), 0.55);
  border-radius: 4px;
}
.win-pick-chat {
  flex: none; min-width: 240px; position: relative;
  display: flex; flex-direction: column; min-height: 0;
  border-left: 1px solid var(--line); background: var(--surface-panel, var(--bg-sunken));
}
.win-pick-chat.narrow {
  position: absolute; top: 0; right: 0; bottom: 0; z-index: 6;
  max-width: 100%;
  box-shadow: var(--shadow-2);
}
.win-pick-resizer {
  position: absolute; left: -2px; top: 0; bottom: 0; width: 5px;
  cursor: col-resize; z-index: 10; touch-action: none;
}
.win-pick-resizer::after {
  content: ""; position: absolute; inset: 0 2px;
}
.win-pick-resizer:hover::after, .win-pick-resizer.active::after {
  background: rgba(var(--accent-rgb), .55);
}
.win-pick-tabs {
  flex: none; display: flex; align-items: stretch; height: 36px; min-width: 0;
  border-bottom: 1px solid var(--line); background: transparent;
}
.win-pick-tabscroll {
  flex: 1; min-width: 0; display: flex; gap: 2px; padding: 4px 6px 0; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: none;
}
.win-pick-tabscroll::-webkit-scrollbar { height: 0; }
.win-pick-tab {
  position: relative;
  flex: 0 0 auto; width: 120px; max-width: 160px; display: flex; align-items: center; gap: 6px;
  padding: 0 8px 0 10px; border: 0; border-radius: 8px 8px 0 0;
  background: transparent; color: var(--fg-dim); font: 400 12px var(--font); cursor: pointer;
}
.win-pick-tab + .win-pick-tab::before { content: ""; position: absolute; left: -1px; top: 8px; bottom: 8px; width: 1px; background: var(--line); }
.win-pick-tab.on + .win-pick-tab::before, .win-pick-tab + .win-pick-tab.on::before, .win-pick-tab:hover + .win-pick-tab::before, .win-pick-tab + .win-pick-tab:hover::before { opacity: 0; }
.win-pick-tab:hover { background: var(--bg-hover); color: var(--fg); }
.win-pick-tab.on { background: var(--bg-hover); color: var(--fg); box-shadow: inset 0 -2px var(--accent); }
.win-pick-tab .ico { display: inline-flex; flex: none; }
.win-pick-tab .ico svg { width: 13px; height: 13px; display: block; }
.win-pick-tab .lbl { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.win-pick-tab .x { display: inline-flex; flex: none; margin-left: auto; color: var(--fg-faint); }
.win-pick-tab .x svg { width: 14px; height: 14px; display: block; }
.win-pick-tabtools { flex: none; display: flex; align-items: center; padding-right: 2px; }
.win-pick-tabtools .win-pick-btn { width: 26px; height: 26px; }
.win-pick-pop {
  position: absolute; z-index: 8; top: 40px; right: 6px; width: min(240px, calc(100% - 12px));
  max-height: 280px; overflow-x: hidden; overflow-y: auto; padding: 4px 0 4px 4px;
  border: 1px solid var(--line-strong); border-radius: 10px;
  background: var(--bg-0); box-shadow: var(--shadow-2, 0 8px 24px rgba(0,0,0,.18));
}
.win-pick-pop-empty { padding: 8px; font-size: 12px; color: var(--fg-faint); }
.win-pick-pop.vsh-pop { overflow: hidden; display: flex; flex-direction: column; padding: 0; }
.win-pick-pop.vsh-pop .vsh { max-height: 280px; }
.win-pick-pop-item {
  width: 100%; display: flex; align-items: center; min-height: 30px; padding: 2px 2px 2px 8px;
  border: 0; border-radius: 7px; background: transparent; color: var(--fg);
  font: 500 12.5px var(--font); text-align: left; cursor: pointer;
}
.win-pick-pop-item:hover { background: var(--bg-hover); }
.win-pick-pop-item:disabled { opacity: .4; cursor: default; }
.win-pick-pop-item .lbl { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.win-pick-pop-item .more {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; margin: 0; padding: 0;
  border: 0; border-radius: 5px; background: transparent; color: var(--fg-faint); cursor: pointer;
}
.win-pick-pop-item .more svg { width: 14px; height: 14px; display: block; }
.win-pick-pop-item .more:hover { color: var(--fg); background: var(--bg-hover); }
.win-pick-stream {
  flex: 1 1 auto; min-height: 0; min-width: 0;
  display: flex; flex-direction: column;
}
.win-pick-chat .vcv { flex: 1 1 auto; min-height: 0; height: auto; }
.win-pick-composer { flex: none; margin: auto 8px 8px; }
.win-pick-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 4px 0; }
.win-pick-chip {
  display: flex; align-items: center; gap: 4px; max-width: 100%;
  padding: 2px 4px 2px 6px; border-radius: 8px;
  background: var(--bg-soft); color: var(--fg); font-size: 12px; line-height: 1.3;
}
.win-pick-chip.file {
  padding: 4px 6px 4px 4px; border: 1px solid var(--line-strong); border-radius: 10px;
}
.win-pick-chip .wpc-ico { flex: none; display: flex; color: var(--accent); }
.win-pick-chip .wpc-ico svg { width: 12px; height: 12px; display: block; }
.win-pick-chip .wpc-thumb {
  flex: none; width: 28px; height: 28px; border-radius: 8px; overflow: hidden;
  border: none; padding: 0; cursor: pointer; background: var(--bg-strong);
  display: inline-flex; align-items: center; justify-content: center; color: var(--accent);
}
.win-pick-chip .wpc-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.win-pick-chip .wpc-thumb svg { width: 14px; height: 14px; display: block; }
.win-pick-chip .wpc-name {
  min-width: 0; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  border: none; background: transparent; padding: 0; cursor: pointer; text-align: left;
  color: inherit; font: inherit;
}
.win-pick-chip .wpc-name:hover { color: var(--accent); }
.win-pick-chip .wpc-rm {
  flex: none; width: 16px; height: 16px; border: none; background: transparent;
  color: var(--fg-dim); cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center;
}
.win-pick-chip .wpc-rm:hover { color: var(--danger); background: rgba(var(--danger-rgb), 0.1); }
.win-pick-chip .wpc-rm svg { width: 12px; height: 12px; display: block; }
.win-pick-user-atts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; max-width: 100%; }
.win-pick-chat .vcv-msg.user.user-with-attach { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.win-pick-input {
  width: 100%; min-height: 32px; max-height: 120px; border: none; background: none;
  color: var(--fg); font: 400 13px/1.45 var(--font); padding: 6px 8px 2px; outline: none; resize: none;
  box-sizing: border-box;
}
.win-pick-input:focus, .win-pick-input:focus-visible { outline: none; box-shadow: none; }
.win-pick-input::placeholder { color: var(--fg-faint); }
.win-pick-bar { display: flex; align-items: center; gap: 4px; padding: 0 2px 2px; }
.win-pick-bar .spacer { flex: 1; min-width: 4px; }
.win-pick-btn {
  flex: none; width: 28px; height: 28px; border: none; border-radius: 50%;
  background: transparent; color: var(--fg-dim); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.win-pick-btn:hover { color: var(--accent); background: var(--accent-soft); }
.win-pick-btn.open { color: var(--accent); background: var(--accent-soft); }
.win-pick-btn:disabled { cursor: default; opacity: 0.6; }
.win-pick-btn.busy svg { animation: winPickSpin 1s linear infinite; pointer-events: none; }
.win-pick-btn svg { width: 15px; height: 15px; display: block; }
@keyframes winPickSpin { to { transform: rotate(360deg); } }
.win-pick-drop-hint {
  position: absolute; inset: 0; z-index: 8;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  background: var(--mask); backdrop-filter: blur(6px); color: var(--fg);
  font: 650 13px var(--font); pointer-events: none;
}
.win-pick-drop-hint .ico { display: inline-flex; color: var(--accent); }
.win-pick-drop-hint .ico svg { width: 22px; height: 22px; display: block; }
.win-pick-send {
  flex: none; width: 28px; height: 28px; border: none; border-radius: 50%; padding: 0;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  background: var(--accent); color: var(--accent-contrast, #fff);
}
.win-pick-send svg { width: 14px; height: 14px; display: block; }
.win-pick-send:disabled { background: var(--bg-strong); color: var(--fg-faint); cursor: default; }
.win-pick-send.stop { background: rgba(var(--danger-rgb), 0.14); color: var(--danger); }
.win-body:fullscreen,
.win-body:-webkit-full-screen {
  width: 100%;
  height: 100%;
  /* 脱离窗口玻璃底后需实色铺底；--bg 不存在，用主题画布色 */
  background: var(--bg-0);
}
/* 八向缩放热区：主要向窗口外延伸、仅内嵌约 1px，让出内容区右侧/底部滚动条（约 8px）的点击区 */
.rs { position: absolute; z-index: 40; touch-action: none; } /* 高于标题栏(30)，顶角缩放不被挡住 */
.rs-n { top: -7px; left: 14px; right: 14px; height: 8px; cursor: ns-resize; }
.rs-s { bottom: -7px; left: 14px; right: 14px; height: 8px; cursor: ns-resize; }
.rs-e { right: -7px; top: 14px; bottom: 14px; width: 8px; cursor: ew-resize; }
.rs-w { left: -7px; top: 14px; bottom: 14px; width: 8px; cursor: ew-resize; }
.rs-ne { top: -8px; right: -8px; width: 16px; height: 16px; cursor: nesw-resize; }
.rs-nw { top: -8px; left: -8px; width: 16px; height: 16px; cursor: nwse-resize; }
.rs-se { bottom: -8px; right: -8px; width: 22px; height: 22px; cursor: nwse-resize; }
.rs-sw { bottom: -8px; left: -8px; width: 16px; height: 16px; cursor: nesw-resize; }
/* 右下缩放手柄：弧线与窗口圆角同心（距边 4px，弧半径 = 窗口圆角 - 4px），视觉贴合窗口轮廓。
   热区 22×22（窗外 8 + 窗内 14）盖住角标；overflow:clip 裁掉窗外部分后仍能点到可见弧线 */
.rs-se::after {
  content: ""; position: absolute; right: 12px; bottom: 12px; width: 11px; height: 11px;
  border-right: 2px solid var(--fg-faint); border-bottom: 2px solid var(--fg-faint);
  border-radius: 0 0 calc(var(--radius) - 4px) 0; opacity: 0.3;
}
.window.zoomed .rs { display: none; }

/* ---------- Dock ---------- */
.dock-wrap {
  position: absolute; left: 0; right: 0; bottom: 10px;
  display: flex; justify-content: center; z-index: 4000; pointer-events: none;
  transition: transform 0.32s var(--ease-out), opacity 0.32s var(--ease-out);
}
/* 自动隐藏（用户开关 / 全屏强制）：整体滑出底缘（含投影），指针触底（.peek）时滑回 */
.dock-wrap.autohide { transform: translateY(calc(100% + 60px)); opacity: 0; }
.dock-wrap.autohide.peek { transform: none; opacity: 1; }
.dock {
  pointer-events: auto; position: relative;
  display: flex; align-items: flex-end; gap: 6px; padding: 7px 10px;
  /* macOS 风格毛玻璃：低不透明度深底透出壁纸 + 重度模糊提饱和；顶部微光渐变模拟玻璃曲面 */
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.015) 55%),
    rgba(22, 26, 34, 0.38);
  backdrop-filter: blur(26px) saturate(1.9); -webkit-backdrop-filter: blur(26px) saturate(1.9);
  border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 22px;
  /* 外圈暗色发丝线勾边 + 大范围柔和投影 + 内侧顶光/底光 */
  box-shadow:
    0 0 0 0.5px rgba(0, 0, 0, 0.35),
    0 16px 40px rgba(0, 0, 0, 0.38),
    0 2px 10px rgba(0, 0, 0, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04);
}
:root[data-theme="light"] .dock {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.25) 55%),
    rgba(250, 251, 253, 0.32);
  border-color: rgba(255, 255, 255, 0.6);
  box-shadow:
    0 0 0 0.5px rgba(28, 36, 56, 0.16),
    0 16px 40px rgba(28, 36, 56, 0.18),
    0 2px 10px rgba(28, 36, 56, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
}
.dock .ditem {
  position: relative; width: 46px; height: 46px; border-radius: 13px; font-size: 23px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  background: var(--bg-raise);
  border: 1px solid var(--line);
  box-shadow: var(--edge-light);
  transform-origin: center bottom; /* 底缘为锚点：悬停放大时位置不上移 */
  transition: transform var(--dur-2) var(--ease-spring), background var(--dur-2), border-color var(--dur-2),
    margin var(--dur-2) var(--ease-out), opacity var(--dur-2);
}
.dock .ditem:hover { transform: scale(1.12); background: var(--bg-raise-2); }
.dock .ditem:active { transform: scale(1.0); }
/* 拖拽重排（macOS 风格让位）：插入点处图标平移出一个图标位的空隙，拖动源降淡 */
.dock .ditem.drop-gap { margin-left: 52px; }
.dock .ditem.drop-gap-end { margin-right: 52px; }
.dock .ditem.dragging { opacity: 0.35; }
.dock .ditem.app-disabled { opacity: 0.45; filter: grayscale(0.85); }
.dock .ditem.app-disabled:hover { opacity: 0.65; }
.dock .ditem .glyph {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%; border-radius: inherit; overflow: hidden;
  transition: opacity var(--dur-2);
}
.dock .ditem .glyph .glyph-svg { width: 24px; height: 24px; }
.dock .ditem .glyph .glyph-emoji { filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.28)); }
.dock .ditem .dot {
  position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%);
  width: 4px; height: 4px; border-radius: 50%; background: var(--fg-dim);
}
/* 运行态三档（聚焦高亮 > 显示中未聚焦 > 最小化）：只暗图标字形，tooltip（::before）与圆点始终全亮 */
.dock .ditem.running .glyph { opacity: 0.72; }
.dock .ditem.min .glyph { opacity: 0.45; } /* 最小化实例：点击恢复显示 */
.dock .ditem.active .glyph, .dock .ditem:hover .glyph { opacity: 1; }
.dock .ditem.active {
  background: var(--bg-raise-2);
  border-color: var(--line-strong);
}
.dock .ditem.active .dot { background: var(--accent); box-shadow: 0 0 5px var(--accent); }
.dock .sep { width: 1px; align-self: stretch; margin: 4px 3px; background: var(--line-strong); }
.dock .ditem .badge {
  position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 8px; background: var(--danger); color: #fff;
  font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}

/* tooltip：两主题均深底白字（对比稳定），文字色固定不随 --fg 反转；延迟出现避免扫过闪烁 */
.dock .ditem::before {
  content: attr(data-title); position: absolute; bottom: 56px; left: 50%; transform: translateX(-50%);
  padding: 4px 10px; border-radius: var(--radius-sm); background: var(--tip-bg);
  border: 1px solid rgba(255, 255, 255, 0.14); font-size: 11.5px; color: #e9ecf1; white-space: nowrap;
  opacity: 0; pointer-events: none; transition: opacity var(--dur-2) ease 0s;
}
.dock .ditem:hover::before { opacity: 1; transition-delay: 0.35s; }
/* 折叠按钮（图标过多放不下时出现在末尾）：朝上箭头，点击展开溢出浮层 */
.dock .ditem.dock-more .glyph .glyph-svg { width: 20px; height: 20px; color: var(--fg-dim); transform: rotate(180deg); }
.dock .ditem.dock-more:hover .glyph .glyph-svg { color: var(--fg); }
.dock .dock-overflow { bottom: calc(100% + 14px); right: 0; }

/* ---------- 系统对话框 ---------- */
.dlg-mask {
  position: fixed; inset: 0; z-index: 9000;
  background: var(--mask);
  backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
  display: flex; align-items: center; justify-content: center;
  animation: spotFade var(--dur-2) ease;
}
.dlg {
  border-radius: var(--radius-lg);
  background: var(--bg-glass);
  backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-3), var(--edge-light);
  display: flex; flex-direction: column;
  animation: spotIn var(--dur-2) var(--ease-out);
}
/* alert / confirm / prompt / perm：左图右文、按钮右对齐；pick 另有覆盖 */
.dlg:not(.dlg-pick) {
  width: min(400px, 92vw);
  padding: 20px 20px 16px;
  align-items: stretch; gap: 16px;
  text-align: left;
}
.dlg .dlg-head {
  display: flex; align-items: flex-start; gap: 14px; min-width: 0;
}
.dlg .dlg-icon {
  flex: none; width: 36px; height: 36px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); background: var(--accent-soft);
}
.dlg .dlg-icon svg { width: 18px; height: 18px; display: block; }
.dlg .dlg-icon.warn { color: var(--warn); background: rgba(var(--warn-rgb), 0.14); }
.dlg .dlg-copy {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.dlg:not(.dlg-pick) .dlg-title {
  font-size: 15px; font-weight: 650; color: var(--fg); line-height: 1.35;
}
.dlg .dlg-msg {
  font-size: 13px; color: var(--fg-dim); line-height: 1.55;
  white-space: pre-wrap; word-break: break-word; max-height: 40vh; overflow: auto;
  user-select: text;
}
.dlg .dlg-copy:not(:has(.dlg-title)) .dlg-msg { color: var(--fg); font-size: 14px; font-weight: 550; }
.dlg.dlg-md { width: min(440px, 92vw); }
.dlg .dlg-msg.md {
  white-space: normal; text-align: left; width: 100%;
}
.dlg .dlg-msg.md > *:first-child { margin-top: 0; }
.dlg .dlg-msg.md > *:last-child { margin-bottom: 0; }
.dlg .dlg-msg.md h1,
.dlg .dlg-msg.md h2,
.dlg .dlg-msg.md h3,
.dlg .dlg-msg.md h4 {
  margin: 0 0 10px; font-size: 14px; font-weight: 650; color: var(--fg);
  word-break: break-word;
}
/* 覆盖 app-base .md table 的 display:block / 全边框 / 斑马纹，对话框内用 KV 行表 */
.dlg .dlg-msg.md table {
  display: table; width: 100%; max-width: 100%;
  border-collapse: collapse; font-size: 12.5px;
  margin: 2px 0 0; overflow: visible;
}
.dlg .dlg-msg.md thead { position: static; }
/* 空表头（文件属性 KV）隐藏；有文案的表头（如快捷键）保留 */
.dlg .dlg-msg.md thead:not(:has(th:not(:empty))) { display: none; }
.dlg .dlg-msg.md th,
.dlg .dlg-msg.md td {
  border: none; border-bottom: 1px solid var(--line);
  padding: 6px 0; vertical-align: top; text-align: left;
  white-space: normal; background: transparent;
}
.dlg .dlg-msg.md th {
  color: var(--fg-dim); font-weight: 600; font-size: 11.5px;
  padding-bottom: 8px; border-bottom-color: var(--line-strong);
}
.dlg .dlg-msg.md tbody tr:nth-child(even) td { background: transparent; }
.dlg .dlg-msg.md tr:last-child td { border-bottom: none; }
.dlg .dlg-msg.md td:first-child,
.dlg .dlg-msg.md th:first-child {
  color: var(--fg-dim); white-space: nowrap; width: 1%;
  padding-right: 14px; font-weight: 500;
}
.dlg .dlg-msg.md td:last-child,
.dlg .dlg-msg.md th:last-child {
  color: var(--fg); word-break: break-word; white-space: normal;
}
.dlg .dlg-msg.md code {
  font-family: var(--mono); font-size: 12px; padding: 1px 5px; border-radius: 4px;
  background: var(--bg-input); color: var(--fg);
}
.dlg .dlg-msg.md pre {
  margin: 8px 0; padding: 8px 10px; border-radius: 8px; overflow-x: auto;
  background: var(--code-bg); border: 1px solid var(--line);
  text-align: left;
}
.dlg .dlg-msg.md pre code { background: none; padding: 0; }
.dlg .dlg-msg.md blockquote {
  margin: 10px 0 0; padding: 6px 10px; border-left: 3px solid var(--warn);
  color: var(--fg-dim); background: rgba(var(--warn-rgb), 0.08); border-radius: 0 6px 6px 0;
}
.dlg .dlg-msg.md p { margin: 0 0 8px; }
.dlg .dlg-msg.md ul,
.dlg .dlg-msg.md ol { margin: 0.35em 0; padding-left: 1.35em; text-align: left; }
.dlg .dlg-msg.md li { margin: 0.15em 0; }
.dlg .dlg-msg.md strong { color: var(--fg); font-weight: 650; }
.dlg .dlg-msg.md td:first-child strong { color: inherit; font-weight: 500; }
.dlg input.field { width: 100%; text-align: left; }
.dlg-fields { display: flex; flex-direction: column; gap: 10px; }
.dlg-field { display: flex; flex-direction: column; gap: 4px; }
.dlg-field-lab { font-size: 13px; color: var(--fg-dim); }
.dlg .dlg-check {
  display: flex; align-items: flex-start; gap: 8px;
  text-align: left; font-size: 13px; color: var(--fg-dim);
  cursor: pointer; user-select: none;
}
.dlg .dlg-check input { margin-top: 2px; flex: none; accent-color: var(--accent); }
.dlg .dlg-check span { line-height: 1.4; }
.dlg .dlg-actions { display: flex; gap: 8px; }
.dlg:not(.dlg-pick) .dlg-actions { flex-wrap: wrap; justify-content: flex-end; }
.dlg .dlg-actions .btn { min-width: 96px; justify-content: center; }

/* ---------- 工作区文件选择对话框（pickOpen / pickSave / pickDir），布局对齐 mac/Windows 惯例 ---------- */
.dlg.dlg-pick {
  width: min(720px, 94vw);
  height: min(560px, 88vh);
  max-height: min(640px, 88vh);
  padding: 14px 16px;
  align-items: stretch;
  text-align: left;
  gap: 10px;
}
.dlg.dlg-pick .dlg-title {
  font-size: 14px; font-weight: 650; text-align: left;
}
/* 工具栏：后退 / 前进 / 上级 + 地址栏式面包屑 */
.dlg.dlg-pick .pick-toolbar {
  display: flex; align-items: center; gap: 8px; min-width: 0;
}
.dlg.dlg-pick .pick-nav { display: flex; gap: 2px; flex: none; }
.dlg.dlg-pick .pick-crumbs {
  flex: 1; min-width: 0; display: flex; align-items: center; flex-wrap: nowrap;
  overflow: hidden; padding: 4px 8px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg-input);
}
.dlg.dlg-pick .pick-crumb {
  appearance: none; border: 0; background: transparent; flex: none;
  color: var(--fg-dim); font-size: 12px; font-weight: 500;
  padding: 2px 6px; border-radius: 6px; cursor: pointer;
  max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dlg.dlg-pick .pick-crumb:hover { background: var(--bg-hover); color: var(--fg); }
.dlg.dlg-pick .pick-crumb.current { color: var(--fg); font-weight: 600; }
.dlg.dlg-pick .pick-crumb:not(.current)::after {
  content: "›"; margin-left: 5px; color: var(--fg-faint); font-weight: 400;
}
/* 主体：左侧位置栏 + 右侧列表 */
.dlg.dlg-pick .pick-body {
  flex: 1; min-height: 0; display: flex; gap: 10px;
}
.dlg.dlg-pick .pick-side.kb-places { width: 196px; }
.dlg.dlg-pick .pick-side {
  flex: none; width: 136px; display: flex; flex-direction: column; gap: 2px;
  padding: 8px 6px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg-input);
  overflow-y: auto;
}
.dlg.dlg-pick .pick-side-title {
  font-size: 11px; font-weight: 600; color: var(--fg-faint);
  padding: 0 8px 4px;
}
.dlg.dlg-pick .pick-place {
  display: flex; align-items: center; gap: 8px; width: 100%;
  appearance: none; border: 0; background: transparent;
  padding: 6px 8px; border-radius: 8px; cursor: pointer;
  color: var(--fg); font-size: 12.5px; text-align: left;
}
.dlg.dlg-pick .pick-place:hover { background: var(--bg-hover); }
.dlg.dlg-pick .pick-place.active { background: var(--accent-soft); color: var(--accent); }
.dlg.dlg-pick .pick-place-ico {
  flex: none; width: 16px; height: 16px; display: inline-flex;
  align-items: center; justify-content: center; color: inherit; opacity: 0.85;
}
.dlg.dlg-pick .pick-place-ico svg { width: 15px; height: 15px; display: block; }
.dlg.dlg-pick .pick-place-name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dlg.dlg-pick .pick-main {
  flex: 1; min-width: 0; display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg-input); overflow: hidden;
}
/* 列表表头：名称 / 修改时间 / 大小 */
.dlg.dlg-pick .pick-cols {
  flex: none; display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-bottom: 1px solid var(--line);
  font-size: 11px; font-weight: 600; color: var(--fg-faint);
}
.dlg.dlg-pick .pick-col-name { flex: 1; min-width: 0; padding-left: 26px; }
.dlg.dlg-pick .pick-col-mtime,
.dlg.dlg-pick .pick-mtime { flex: none; width: 108px; }
.dlg.dlg-pick .pick-col-size,
.dlg.dlg-pick .pick-size { flex: none; width: 64px; text-align: right; }
.dlg.dlg-pick .pick-list {
  flex: 1; min-height: 0; overflow: auto; scrollbar-gutter: stable;
  padding: 4px;
}
.dlg.dlg-pick .pick-empty {
  padding: 28px 16px; text-align: center;
  color: var(--fg-faint); font-size: 12.5px;
}
.dlg.dlg-pick .pick-empty.err { color: var(--danger); }
.dlg.dlg-pick .pick-row {
  display: flex; align-items: center; gap: 8px; width: 100%;
  appearance: none; border: 0; background: transparent;
  padding: 6px; text-align: left; cursor: pointer;
  color: var(--fg); font-size: 13px; border-radius: 8px;
  transition: background 0.15s ease;
}
.dlg.dlg-pick .pick-row:hover { background: var(--bg-hover); }
.dlg.dlg-pick .pick-row.selected { background: var(--accent-soft); }
.dlg.dlg-pick .pick-row.disabled { opacity: 0.42; cursor: default; }
.dlg.dlg-pick .pick-row.disabled:hover { background: transparent; }
.dlg.dlg-pick .pick-ico {
  flex: none; width: 18px; height: 18px; display: inline-flex;
  align-items: center; justify-content: center; color: var(--fg-dim);
}
.dlg.dlg-pick .pick-ico svg { width: 16px; height: 16px; display: block; }
.dlg.dlg-pick .pick-row .kb-new-name { flex: 1; min-width: 0; height: 28px; padding: 2px 8px; }
.dlg.dlg-pick .pick-name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dlg.dlg-pick .pick-mtime,
.dlg.dlg-pick .pick-size {
  font-size: 11.5px; color: var(--fg-faint);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dlg.dlg-pick .pick-row.selected .pick-mtime,
.dlg.dlg-pick .pick-row.selected .pick-size { color: var(--fg-dim); }
/* 底栏：文件名（save）/ 新建文件夹 + 动词化主按钮 */
.dlg.dlg-pick .pick-foot {
  display: flex; flex-direction: column; gap: 10px; margin-top: 2px;
}
.dlg.dlg-pick .pick-name-row {
  display: flex; align-items: center; gap: 10px;
}
.dlg.dlg-pick .pick-name-label {
  flex: none; font-size: 12px; color: var(--fg-dim); font-weight: 500;
}
.dlg.dlg-pick .pick-name-row .field { flex: 1; min-width: 0; text-align: left; }
.dlg.dlg-pick .pick-foot-row {
  display: flex; align-items: center; gap: 10px; min-width: 0;
}
.dlg.dlg-pick .pick-new-folder { flex: none; }
.dlg.dlg-pick .pick-meta {
  flex: none; font-size: 11.5px; color: var(--fg-faint);
}
.dlg.dlg-pick .pick-actions {
  margin-top: 0; margin-left: auto; justify-content: flex-end;
  min-width: 0; flex: 0 1 auto;
}
.dlg.dlg-pick .pick-actions .btn { flex: none; white-space: nowrap; }
/* 主按钮：长文件名单行省略，不换行不撑坏底栏（JS 已做中间截断，此处为兜底） */
.dlg.dlg-pick .pick-actions .btn.primary {
  flex: 0 1 auto; max-width: 280px; min-width: 96px;
}
.dlg.dlg-pick .pick-ok-label {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* 窄屏：位置栏横排、隐藏时间与大小列 */
@media (max-width: 640px) {
  .dlg.dlg-pick .pick-body { flex-direction: column; }
  .dlg.dlg-pick .pick-side {
    width: 100%; flex-direction: row; align-items: center;
    overflow-x: auto; overflow-y: hidden; padding: 6px;
  }
  .dlg.dlg-pick .pick-side-title { display: none; }
  .dlg.dlg-pick .pick-place { width: auto; flex: none; }
  .dlg.dlg-pick .pick-col-mtime,
  .dlg.dlg-pick .pick-col-size,
  .dlg.dlg-pick .pick-mtime,
  .dlg.dlg-pick .pick-size { display: none; }
  .dlg.dlg-pick .pick-actions .btn.primary { max-width: 180px; }
}

/* ---------- 应用属性弹层 ---------- */
.app-props-mask {
  position: fixed; inset: 0; z-index: 9000;
  background: var(--mask);
  backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
  display: flex; align-items: center; justify-content: center; padding: 14px;
  animation: spotFade var(--dur-2) ease;
}
.app-props {
  width: min(460px, 100%); max-height: 82vh;
  display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden;
  border-radius: var(--radius-lg); background: var(--bg-glass);
  backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-3), var(--edge-light);
  animation: spotIn var(--dur-2) var(--ease-out);
}
.app-props .ap-head {
  display: flex; align-items: center; gap: 11px;
  padding: 15px 16px 13px; border-bottom: 1px solid var(--line);
}
.app-props .ap-head .spacer { flex: 1; }
.app-props .ap-icon {
  font-size: 30px; line-height: 1; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: var(--radius-md);
  overflow: hidden;
}
.app-props .ap-icon .glyph-svg { width: 26px; height: 26px; }
.app-props .ap-icon-img {
  display: block; flex: none;
  width: 100%; height: 100%; max-width: 100%; max-height: 100%;
  min-width: 0; min-height: 0;
  object-fit: contain; pointer-events: none;
}
.app-props .ap-head-text { min-width: 0; }
.app-props .ap-title { font-size: 15px; font-weight: 650; word-break: break-word; }
.app-props .ap-ver { margin-left: 6px; font-size: 11.5px; font-weight: 500; color: var(--fg-faint); font-family: var(--mono); }
.app-props .ap-kind { font-size: 11.5px; color: var(--fg-faint); margin-top: 2px; }
.app-props .ap-body {
  min-height: 0; overflow-x: hidden; overflow-y: auto;
  padding: 4px 16px 16px; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.app-props .ap-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px;
  padding: 6px 0 10px; border-bottom: 1px solid var(--line);
}
.app-props .ap-cell {
  min-width: 0; padding: 7px 0;
}
.app-props .ap-cell-wide { grid-column: 1 / -1; }
.app-props .ap-block {
  padding: 10px 0; border-bottom: 1px solid var(--line);
}
.app-props .ap-block:last-child { border-bottom: none; padding-bottom: 2px; }
.app-props .ap-block-actions {
  display: flex; justify-content: flex-end; padding-top: 12px;
}
.app-props .ap-label { font-size: 11px; color: var(--fg-faint); margin-bottom: 3px; }
.app-props .ap-value { font-size: 13px; color: var(--fg); word-break: break-all; user-select: text; }
.app-props .ap-value.mono { font-family: var(--mono); font-size: 12px; }
.app-props .ap-value.desc { word-break: break-word; line-height: 1.55; color: var(--fg-dim); font-size: 12.5px; }
.app-props .ap-path-row {
  display: flex; align-items: center; gap: 2px;
  flex-wrap: nowrap; min-width: 0;
}
.app-props .ap-path-row .ap-value {
  flex: 1; min-width: 0; margin-bottom: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  word-break: normal;
}
.app-props .ap-path-btn {
  flex: none; width: 28px; height: 28px;
  border: none; border-radius: var(--radius-sm);
  background: transparent; color: var(--fg-dim);
  cursor: pointer; padding: 0;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--dur-1), color var(--dur-1);
}
.app-props .ap-path-btn:hover { background: var(--bg-hover); color: var(--fg); }
.app-props .ap-path-btn:active { transform: scale(0.94); }
.app-props .ap-path-btn:disabled { opacity: 0.4; cursor: default; pointer-events: none; }
.app-props .ap-path-btn .glyph-svg { width: 15px; height: 15px; display: block; }
.app-props .ap-path-btn svg { display: block; }
/* 文件快捷方式属性：目标失效警示条 */
.app-props .ap-warn {
  display: flex; align-items: center; gap: 8px;
  margin: 8px 0 2px; padding: 8px 11px; border-radius: var(--radius-sm);
  background: rgba(var(--danger-rgb), 0.1); border: 1px solid rgba(var(--danger-rgb), 0.3);
  color: var(--danger); font-size: 12.5px;
}
.app-props .ap-warn-ico { flex: none; display: inline-flex; }
.app-props .ap-warn-ico svg { width: 15px; height: 15px; display: block; }

/* ---------- 通知 Toast ---------- */
.toasts { position: fixed; top: 44px; right: 12px; z-index: 9100; display: flex; flex-direction: column; gap: 8px; }
.toast {
  display: flex; gap: 9px; align-items: flex-start;
  min-width: 260px; max-width: 380px; padding: 11px 12px 11px 14px; border-radius: 12px;
  background: var(--bg-glass-drop);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  font-size: 13px; line-height: 1.45; animation: toastIn var(--dur-3) var(--ease-out);
  user-select: text;
}
.toast.error { border-color: rgba(var(--danger-rgb), 0.5); }
.toast .t-main { flex: 1; min-width: 0; }
.toast .t-head { font-weight: 650; display: flex; gap: 6px; align-items: center; }
.toast .t-body {
  margin-top: 2px; color: var(--fg-dim);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;
  white-space: pre-wrap; word-break: break-word;
}
.toast .t-x {
  flex: none; width: 20px; height: 20px; margin: -2px -3px 0 0;
  border: none; background: none; padding: 0; border-radius: 6px;
  color: var(--fg-faint); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--dur-1), color var(--dur-1);
}
.toast .t-x:hover { background: var(--bg-hover); color: var(--fg); }
.toast .t-x svg { width: 11px; height: 11px; display: block; }
@keyframes toastIn { from { transform: translateX(30px); opacity: 0; } }

/* ---------- 语音输入 Overlay（系统级：波形 + 流式识别文本） ---------- */
.voice-overlay {
  position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%);
  z-index: 8600; width: 360px; max-width: calc(100vw - 32px);
  display: flex; flex-direction: column; gap: 7px;
  padding: 12px 14px 10px; border-radius: var(--radius-lg);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  animation: voiceIn var(--dur-2) var(--ease-out);
}
.voice-overlay.error { border-color: rgba(var(--danger-rgb), 0.5); }
.voice-overlay .vo-main { display: flex; align-items: center; gap: 10px; }
.voice-overlay .vo-ico {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent);
}
.voice-overlay .vo-ico svg { width: 16px; height: 16px; display: block; }
.voice-overlay .vo-ico.pulse { animation: voicePulse 1.6s ease-in-out infinite; }
.voice-overlay.error .vo-ico { background: rgba(var(--danger-rgb), 0.14); color: var(--danger); }
.voice-overlay .vo-wave { flex: 1; min-width: 0; height: 30px; display: block; }
.voice-overlay .vo-actions { flex: none; display: flex; gap: 6px; }
.voice-overlay .vo-btn {
  width: 28px; height: 28px; border-radius: 50%; border: none; padding: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg-strong); color: var(--fg-dim);
  transition: background var(--dur-1), color var(--dur-1), transform var(--dur-1);
}
.voice-overlay .vo-btn:hover { background: var(--bg-raise-2); color: var(--fg); }
.voice-overlay .vo-btn:active { transform: scale(0.92); }
.voice-overlay .vo-btn.primary { background: var(--accent); color: var(--accent-contrast); }
.voice-overlay .vo-btn.primary:hover { filter: brightness(1.08); }
.voice-overlay .vo-btn:disabled { opacity: 0.4; cursor: default; }
.voice-overlay .vo-btn svg { width: 13px; height: 13px; display: block; }
.voice-overlay .vo-text {
  /* 预留一行高度：识别文本到达时不撑高抖动，超过约三行后内部滚动 */
  min-height: 21px; max-height: 72px; overflow-y: auto; overscroll-behavior: contain;
  font-size: 13px; line-height: 1.55; color: var(--fg);
  white-space: pre-wrap; word-break: break-word; user-select: text;
}
.voice-overlay .vo-text .vo-partial { color: var(--fg-dim); }
.voice-overlay .vo-text.empty .vo-partial { color: var(--fg-faint); }
/* 新识别增量上屏微动画：从模糊 + 强调色浮现，制造“飞快打出”的观感
   （内层 .vo-partial 自带颜色，需单独挂动画才能吃到强调色淡出） */
.voice-overlay .vo-text .vo-chunk { animation: voiceChunkIn 0.25s var(--ease-out); }
.voice-overlay .vo-text .vo-chunk .vo-partial { animation: voiceChunkIn 0.25s var(--ease-out); }
@keyframes voiceChunkIn {
  0% { opacity: 0; color: var(--accent); }
  55% { opacity: 1; color: var(--accent); }
  100% { }
}
.voice-overlay .vo-status { font-size: 11px; color: var(--fg-faint); text-align: center; }
.voice-overlay .vo-status.err { color: var(--danger); }
@keyframes voiceIn { from { transform: translate(-50%, 14px); opacity: 0; } }
@keyframes voicePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.35); }
  50% { box-shadow: 0 0 0 7px rgba(var(--accent-rgb), 0); }
}

/* ---------- 全屏门卫浮层（访问令牌 / 首启配置） ---------- */
.gate-mask {
  position: fixed; inset: 0; z-index: 8900;
  display: flex; align-items: center; justify-content: center;
  background: var(--mask);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.gate-mask.gate-token { z-index: 9000; }
.gate-card {
  width: 384px; max-width: 92vw; padding: 24px;
  border-radius: var(--radius-lg); background: var(--bg-glass);
  backdrop-filter: blur(20px) saturate(1.5); -webkit-backdrop-filter: blur(20px) saturate(1.5);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-3), var(--edge-light);
  animation: spotIn var(--dur-2) var(--ease-out);
}
.gate-head { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.gate-head h3 { margin: 0; font-size: 16px; font-weight: 650; }
.gate-sub { margin: 0 0 14px; font-size: 12.5px; color: var(--fg-dim); line-height: 1.55; }
.gate-field { margin-bottom: 7px; }
.gate-links { display: flex; align-items: center; margin-bottom: 14px; }
.gate-link { font-size: 12px; color: var(--accent); text-decoration: none; }
.gate-link:hover { text-decoration: underline; }
.gate-toggle {
  margin-left: auto; border: none; background: none; padding: 0; cursor: pointer;
  color: var(--accent); font-size: 12px;
}
.gate-adv { margin-bottom: 14px; display: flex; flex-direction: column; gap: 9px; }
.gate-adv label { display: block; }
.gate-adv .gate-lbl { font-size: 11.5px; color: var(--fg-dim); }
.gate-adv .field { margin-top: 3px; }
.gate-error-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 10px; }
.gate-error-row .gate-error { flex: 1; margin: 0; }
.gate-error { margin: 0 0 10px; font-size: 12px; color: var(--danger); }
.gate-error-copy {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; margin-top: -2px; padding: 0;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg-soft); color: var(--fg-dim); cursor: pointer;
}
.gate-error-copy:hover { background: var(--bg-hover); color: var(--fg); border-color: var(--fg-faint); }
.gate-error-copy:active { transform: scale(0.94); }
.gate-actions .btn { width: 100%; justify-content: center; }
.gate-skip { text-align: center; margin-top: 10px; }
.gate-skip button {
  border: none; background: none; cursor: pointer; color: var(--fg-faint); font-size: 12px;
}
.gate-skip button:hover { color: var(--fg-dim); }

/* ---------- 响应式（窄屏 / 刘海屏） ---------- */
.menubar {
  padding-top: env(safe-area-inset-top, 0);
  padding-left: max(12px, env(safe-area-inset-left, 0));
  padding-right: max(12px, env(safe-area-inset-right, 0));
}
.dock-wrap {
  bottom: calc(10px + env(safe-area-inset-bottom, 0));
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}

@media (max-width: 768px) {
  .hide-sm { display: none !important; }
  .menubar { gap: 8px; font-size: 12px; }
  .menubar .mb-clock { display: none; }
  /* 窄屏无悬停：红绿灯 ×/−/+ 常显，并保持彩色，少猜关闭/最小化/最大化 */
  .traffic .t-close::before,
  .traffic .t-close::after,
  .traffic .t-min::before,
  .traffic .t-zoom::before,
  .traffic .t-zoom::after { opacity: 0.6; }
  .window:not(.focused) .traffic .t-close { background: #ff5f57; }
  .window:not(.focused) .traffic .t-min { background: #febc2e; }
  .window:not(.focused) .traffic .t-zoom { background: #28c840; }
}

@media (max-width: 480px) {
  .menubar .item:has(.conn-dot) { font-size: 0; }
  .menubar .item:has(.conn-dot) .conn-dot { margin: 0; }
  .dock .ditem { width: 42px; height: 42px; font-size: 21px; }
}

/* ==========================================================================
   Windows 窗口系统风格（html[data-os="windows"]）
   全部规则限定在 [data-os="windows"] 作用域内：macOS（默认）样式零改动。
   形态对齐 Windows 11：无顶部菜单栏、窗口标题栏左图标菜单 + 右侧矩形控制按钮、
   底部通栏任务栏（居中图标 + 开始/搜索 + 右侧系统托盘）。
   ========================================================================== */

:root[data-os="windows"] {
  --menubar-h: 0px; /* 无顶栏：桌面从视口顶开始（与 os.js menubarH() 一致） */
  --titlebar-h: 32px; /* Win11 标准标题栏高度 */
  --taskbar-h: 40px;
}

/* ---------- 桌面 ---------- */
/* 桌面图标区避开底部任务栏（任务栏常驻，不像 macOS Dock 居中悬浮） */
[data-os="windows"] .desktop-icons { bottom: calc(var(--taskbar-h) + 10px); }

/* ---------- 窗口 ---------- */
[data-os="windows"] .window { border-radius: 8px; } /* Win11 圆角 */
[data-os="windows"] .window.zoomed { border-radius: 0; }
[data-os="windows"] .rs-se::after { border-radius: 0 0 4px 0; }

/* ---------- 标题栏：左图标菜单 + 左对齐标题 + 右侧 caption 按钮 ---------- */
[data-os="windows"] .titlebar { padding: 0 0 0 6px; gap: 6px; }
/* 标题左对齐：无搜索时 t-leading 仅侧栏钮；有搜索时左右等分，搜索簇在文档流中收缩 */
[data-os="windows"] .titlebar .t-leading { flex: 0 1 auto; min-width: 0; }
[data-os="windows"] .titlebar.has-title-search .t-leading { flex: 1 1 0; min-width: min-content; }
[data-os="windows"] .titlebar .t-center { justify-content: flex-start; }
[data-os="windows"] .titlebar .t-center.t-center-search { justify-content: center; }
[data-os="windows"] .titlebar .t-center .t-icon { display: none; }
[data-os="windows"] .titlebar .t-title { font-size: 12px; }

/* 左侧应用图标按钮（点击弹出应用菜单 + 窗口系统菜单） */
[data-os="windows"] .tw-menu { position: relative; flex: none; display: flex; align-items: center; align-self: stretch; }
[data-os="windows"] .tw-menu-btn {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 24px; padding: 0; border: none; border-radius: 4px;
  background: transparent; cursor: default;
  transition: background var(--dur-1);
}
[data-os="windows"] .tw-menu-btn:hover,
[data-os="windows"] .tw-menu-btn.open { background: var(--bg-hover); }
[data-os="windows"] .tw-menu-drop {
  position: absolute; top: calc(100% - 3px); left: 0; z-index: 130;
  min-width: 200px; padding: 5px;
  background: var(--bg-glass-drop); border: 1px solid var(--line-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-2), var(--edge-light);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  animation: menuDrop var(--dur-1) var(--ease-out);
  cursor: default;
}
/* 顶级应用菜单行：hover 展开右侧飞出子菜单 */
[data-os="windows"] .tw-menu-group {
  position: relative; display: flex; align-items: center; gap: 8px;
  padding: 8px 11px; border-radius: var(--radius-sm);
  font-size: 12.5px; font-weight: 500; color: var(--fg-dim);
  cursor: pointer; white-space: nowrap; user-select: none;
  transition: background var(--dur-1), color var(--dur-1);
}
[data-os="windows"] .tw-menu-group:hover,
[data-os="windows"] .tw-menu-group.open { background: var(--accent-soft); color: var(--fg); }
[data-os="windows"] .tw-menu-glabel { flex: 1; }
[data-os="windows"] .tw-menu-caret {
  width: 12px; height: 12px; flex: none; color: var(--fg-faint);
  display: inline-flex; align-items: center; justify-content: center;
  transform: rotate(-90deg); /* caret 默认朝下，飞出方向朝右 */
}
[data-os="windows"] .tw-menu-caret svg { width: 12px; height: 12px; display: block; }
[data-os="windows"] .tw-menu-flyout {
  position: absolute; left: calc(100% + 2px); top: -5px; z-index: 131;
  min-width: 190px; padding: 5px;
  background: var(--bg-glass-drop); border: 1px solid var(--line-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-2), var(--edge-light);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  animation: menuDrop var(--dur-1) var(--ease-out);
}
[data-os="windows"] .tw-menu-flyout .mb-check { width: 13px; flex: none; font-size: 11px; color: var(--accent); }
[data-os="windows"] .tw-menu-flyout .mb-label { flex: 1; }
[data-os="windows"] .tw-menu-flyout .mb-accel { color: var(--fg-faint); font-size: 11px; margin-left: 16px; letter-spacing: 0.04em; }

/* 右侧控制按钮（caption buttons）：矩形贴边热区，关闭键 hover 红底（Win11） */
[data-os="windows"] .tw-caption { display: flex; align-self: stretch; flex: none; margin-left: 2px; }
[data-os="windows"] .twc-btn {
  width: 44px; height: 100%; padding: 0; border: none; background: transparent;
  display: flex; align-items: center; justify-content: center;
  color: var(--fg-dim); cursor: default;
  transition: background var(--dur-1), color var(--dur-1);
}
[data-os="windows"] .twc-btn svg {
  width: 10px; height: 10px; display: block;
  fill: none; stroke: currentColor; stroke-width: 1.1; stroke-linecap: round;
}
[data-os="windows"] .twc-btn:hover { background: var(--bg-hover); color: var(--fg); }
[data-os="windows"] .twc-btn:active { background: var(--bg-strong); }
[data-os="windows"] .twc-close:hover { background: #c42b1c; color: #fff; }
[data-os="windows"] .twc-close:active { background: #b3271a; color: #fff; }
[data-os="windows"] .window:not(.focused) .twc-btn { color: var(--fg-faint); }
[data-os="windows"] .window:not(.focused) .twc-btn:hover { color: var(--fg); }
[data-os="windows"] .window:not(.focused) .twc-close:hover { color: #fff; }

/* ---------- 任务栏（复用 .dock-wrap/.dock 结构，通栏 + 居中图标） ---------- */
[data-os="windows"] .dock-wrap {
  bottom: 0; padding-left: 0; padding-right: 0;
  z-index: 5000; pointer-events: auto;
}
[data-os="windows"] .dock {
  width: 100%; height: var(--taskbar-h); box-sizing: border-box;
  justify-content: center; align-items: center; gap: 4px; padding: 0 8px;
  border: none; border-top: 1px solid var(--line); border-radius: 0;
  background: rgba(22, 26, 34, 0.66);
  backdrop-filter: blur(28px) saturate(1.6); -webkit-backdrop-filter: blur(28px) saturate(1.6);
  box-shadow: none;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
:root[data-theme="light"][data-os="windows"] .dock {
  background: rgba(244, 246, 250, 0.76);
  border-top-color: var(--line);
  box-shadow: none;
}
[data-os="windows"] .dock .ditem {
  width: 34px; height: 34px; border-radius: 6px; font-size: 17px;
  background: transparent; border: none; box-shadow: none;
  transform-origin: center center;
}
[data-os="windows"] .dock .ditem:hover { transform: none; background: var(--bg-hover); }
[data-os="windows"] .dock .ditem:active { transform: scale(0.94); }
[data-os="windows"] .dock .ditem.active { background: var(--bg-hover); border: none; }
[data-os="windows"] .dock .ditem .glyph { width: 24px; height: 24px; border-radius: 5px; flex: none; margin: auto; }
[data-os="windows"] .dock .ditem .glyph .glyph-svg { width: 17px; height: 17px; }
/* 运行指示：圆点 → 底部短横条，聚焦时加宽并着 accent（Win11 任务栏） */
[data-os="windows"] .dock .ditem .dot {
  bottom: 2px; width: 6px; height: 3px; border-radius: 2px;
  background: var(--fg-faint); transition: width var(--dur-2), background var(--dur-2);
}
[data-os="windows"] .dock .ditem.active .dot { width: 14px; background: var(--accent); box-shadow: none; }
[data-os="windows"] .dock .ditem.drop-gap { margin-left: 38px; }
[data-os="windows"] .dock .ditem.drop-gap-end { margin-right: 38px; }
[data-os="windows"] .dock .ditem::before { bottom: calc(100% + 10px); }
[data-os="windows"] .dock .dock-overflow { bottom: calc(100% + 8px); right: 8px; }
[data-os="windows"] .dock .ditem.dock-more .glyph .glyph-svg { width: 16px; height: 16px; }

/* 开始按钮 + 搜索按钮（居中图标区最左） */
[data-os="windows"] .dock .tb-start .glyph-img { width: 20px; height: 20px; object-fit: contain; }
[data-os="windows"] .dock .tb-search .glyph-svg { color: var(--fg-dim); }
[data-os="windows"] .dock .tb-search:hover .glyph-svg { color: var(--fg); }
[data-os="windows"] .tb-start-menu {
  position: absolute; bottom: calc(100% + 10px); left: 0; z-index: 8950;
  min-width: 230px; padding: 6px;
  background: var(--bg-glass-drop); border: 1px solid var(--line-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-2), var(--edge-light);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  animation: spotIn var(--dur-1) var(--ease-out);
  cursor: default; text-align: left;
}
[data-os="windows"] .tb-start-menu .mb-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 13px; color: var(--fg); white-space: nowrap;
}
[data-os="windows"] .tb-start-menu .mb-item:hover { background: var(--accent-soft); }
[data-os="windows"] .tb-start-menu .mb-item.danger { color: var(--danger); }
[data-os="windows"] .tb-start-menu .mb-item.danger:hover { background: rgba(var(--danger-rgb), 0.12); }
[data-os="windows"] .tb-start-menu .mb-item .cm-icon {
  width: 16px; height: 16px; flex: none; color: var(--fg-dim);
  display: inline-flex; align-items: center; justify-content: center;
}
[data-os="windows"] .tb-start-menu .mb-item .cm-icon svg { width: 15px; height: 15px; display: block; }
[data-os="windows"] .tb-start-menu .mb-item:hover .cm-icon { color: var(--fg); }
[data-os="windows"] .tb-start-menu .mb-sep { height: 1px; margin: 4px 8px; background: var(--line); }

/* 系统托盘（任务栏右端）：指示器 / 连接 / 通知 / 时钟 / 全屏 */
[data-os="windows"] .tb-tray {
  position: absolute; right: 4px; top: 0; bottom: 0;
  display: flex; align-items: center; pointer-events: auto;
}
[data-os="windows"] .tb-tray-inner { display: flex; align-items: center; gap: 2px; height: 100%; padding: 0 2px; }
[data-os="windows"] .tb-tray .item {
  position: relative; display: flex; align-items: center; gap: 5px;
  height: 30px; padding: 0 7px; border-radius: 6px;
  color: var(--fg-dim); font-size: 12px; white-space: nowrap; cursor: pointer;
  transition: background var(--dur-1), color var(--dur-1);
}
[data-os="windows"] .tb-tray .item:hover { background: var(--bg-hover); color: var(--fg); }
[data-os="windows"] .tb-tray .mb-ico {
  display: flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; color: var(--fg-dim);
}
[data-os="windows"] .tb-tray .item:hover .mb-ico { color: var(--fg); }
[data-os="windows"] .tb-tray .mb-ico svg { display: block; width: 15px; height: 15px; }
[data-os="windows"] .tb-tray .bell-badge { top: 3px; right: 2px; }
/* 托盘时钟：上行时间、下行日期（Win11 布局），右对齐 */
[data-os="windows"] .tb-tray .tb-clock {
  flex-direction: column; justify-content: center; align-items: flex-end;
  gap: 0; line-height: 1.3; font-variant-numeric: tabular-nums;
}
[data-os="windows"] .tb-tray .tb-clock-time { font-size: 11.5px; color: var(--fg); }
[data-os="windows"] .tb-tray .tb-clock-date { font-size: 10px; color: var(--fg-dim); }
/* 录制指示器（复用菜单栏类名，托盘配色）：菜单向上弹出 */
[data-os="windows"] .tb-tray .mb-ind { color: var(--danger); }
[data-os="windows"] .tb-tray .mb-ind.paused { color: var(--warn); }
[data-os="windows"] .tb-tray .mb-ind:hover,
[data-os="windows"] .tb-tray .mb-ind.open { background: var(--bg-hover); }
[data-os="windows"] .tb-tray .mb-ind-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; background: currentColor; }
[data-os="windows"] .tb-tray .mb-ind.pulse .mb-ind-dot { animation: mbIndPulse 1.4s ease-in-out infinite; }
[data-os="windows"] .tb-tray .mb-ind-label { font-size: 10.5px; font-weight: 700; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }
[data-os="windows"] .tb-tray .mb-ind-menu {
  position: absolute; bottom: calc(100% + 8px); top: auto; right: 0; z-index: 9100;
  min-width: 160px; padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  color: var(--fg);
}
[data-os="windows"] .tb-tray .mb-ind-menu .mb-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 12.5px; white-space: nowrap;
}
[data-os="windows"] .tb-tray .mb-ind-menu .mb-item:hover { background: var(--accent-soft); }
[data-os="windows"] .tb-tray .mb-ind-menu .mb-item.danger { color: var(--danger); }
[data-os="windows"] .tb-tray .mb-ind-menu .mb-label { flex: 1; }
[data-os="windows"] .tb-tray .mb-ind-menu .mb-accel { color: var(--fg-faint); font-size: 11px; }
[data-os="windows"] .tb-tray .mb-account {
  position: relative; display: flex; align-items: center;
  padding: 0 6px; color: var(--fg);
  cursor: pointer;
}
[data-os="windows"] .tb-tray .mb-account.open,
[data-os="windows"] .tb-tray .mb-account:hover { background: var(--bg-hover); }
[data-os="windows"] .tb-tray .mb-account .mb-drop {
  position: absolute; top: auto; bottom: calc(100% + 8px); left: 0; right: auto; z-index: 9100;
  min-width: 196px; padding: 5px; border-radius: var(--radius-md);
  background: var(--bg-glass-drop);
  backdrop-filter: blur(18px) saturate(1.25); -webkit-backdrop-filter: blur(18px) saturate(1.25);
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), var(--edge-light);
  color: var(--fg);
}
[data-os="windows"] .tb-tray .mb-account .mb-drop.mb-drop-end { left: auto; right: 0; }
[data-os="windows"] .tb-tray .mb-avatar {
  width: 18px; height: 18px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; background: var(--accent); color: #fff;
  font-size: 10px; font-weight: 700; line-height: 1;
}
[data-os="windows"] .tb-tray .mb-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
[data-os="windows"] .tb-tray .mb-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 12.5px; color: var(--fg); white-space: nowrap;
}
[data-os="windows"] .tb-tray .mb-item:hover { background: var(--accent-soft); }
[data-os="windows"] .tb-tray .mb-item .cm-icon { width: 16px; height: 16px; flex: none; display: inline-flex; align-items: center; justify-content: center; color: var(--fg-dim); }
[data-os="windows"] .tb-tray .mb-item .cm-icon svg { width: 15px; height: 15px; display: block; }
[data-os="windows"] .tb-tray .mb-item .mb-chev { margin-left: auto; color: var(--fg-faint); width: 14px; height: 14px; display: inline-flex; }

/* ---------- 弹出面板改从任务栏上方弹出（通知 / 连接 / 时钟） ---------- */
[data-os="windows"] .notif-panel,
[data-os="windows"] .conn-panel,
[data-os="windows"] .clock-panel {
  top: auto; bottom: calc(var(--taskbar-h) + 8px + env(safe-area-inset-bottom, 0));
}

/* 窄屏：托盘收敛（时钟隐藏与 macOS 顶栏行为一致） */
@media (max-width: 768px) {
  [data-os="windows"] .tb-tray .tb-clock { display: none; }
}

/* ---------- Mermaid 渲染期临时容器 ---------- */
/* mermaid.render 不传宿主时在 body 下建 d<id> 裸容器做布局测量，渲染期间会在左上角闪现
   （ELK 布局异步耗时更明显）。钉到视口外隐藏；须用 visibility 而非 display:none，
   否则 getBBox 测量归零图形错乱。语法错误时容器泄漏也一并不可见（os.js finally 仍兜底清理）。 */
body > div[id^="dvanor-mermaid-"] {
  position: fixed;
  left: -10000px;
  top: 0;
  visibility: hidden;
}

/* 窄屏图标从按下起由 JS 分流：快滑翻页、按住后任意方向拖。子节点也必须 none，否则浏览器会按目标元素抢横滑。 */
@media (max-width: 768px) {
  .desktop-icons.paging .dicon,
  .desktop-icons.paging .dicon *,
  .folder-pop .dicon,
  .folder-pop .dicon * { touch-action: none; }
  .desktop-icons.paging .dicon .glyph,
  .desktop-icons.paging .dicon .label { pointer-events: none; }
  .desktop-icons.paging, .desktop .dicon { user-select: none; -webkit-touch-callout: none; }
}
.dicon img { -webkit-user-drag: none; }
/* 整理时图标接管拖放，横向轻滑由 JS 翻页；空白处仍走容器 pan-x。 */
.desktop-editing .dicon { touch-action: none; user-select: none; -webkit-touch-callout: none; cursor: grab; }
.desktop-editing .dicon img { pointer-events: none; }
.desktop-drag-ghost {
  position: fixed !important; z-index: 99999; pointer-events: none !important;
  opacity: 0.85; margin: 0;
}