Spaces:
Running
Running
| /* ═══════════════════════════════════════════════════════════════════ | |
| Gemini 皮肤 · 组件层（dev-duotheme 双外观，Warm Paper 零改动） | |
| 纪律（完工自检 grep）： | |
| - 本文件不出现 width / height / left / top / position —— | |
| 只改颜色、字体、圆角、阴影、hover 这类「皮」；布局、间距、 | |
| 宽高、位置、tab 结构一律不动（避免与 dev-composer-ui 打架）。 | |
| - 每条覆盖规则都以 [data-style="gemini"] 打头 → Warm Paper 完全不受影响。 | |
| - 签名渐变（--grad-start/mid/end 蓝→紫→粉）只允许三处： | |
| ① 品牌标方标 ② 欢迎页大标题高光 ③ Ultra 档强调。 | |
| 其余全靠黑白灰 + Google Blue 单主色（彩色 = 点缀，不铺满）。 | |
| - 设置页「风格」预览卡是新控件：其排版样式走 Settings.tsx 内联 | |
| 样式（本文件保持「纯覆盖」），不新增任何组件 css 文件改动。 | |
| 大量视觉其实由 theme.css 的 [data-style="gemini"] 令牌自动换血 | |
| （导航激活浅蓝 #e8f0fe + Google Blue 竖条、焦点环、滚动条、选区、 | |
| 分段控件蓝底白字、卡片灰边……），本文件只补「换骨」的几处。 | |
| ═══════════════════════════════════════════════════════════════ */ | |
| /* ── ① 品牌标：签名渐变方标 + 白色线稿（渐变位 1/3） ───────────── */ | |
| [data-style="gemini"] .brand-mark { | |
| background: linear-gradient( | |
| 135deg, | |
| var(--grad-start) 0%, | |
| var(--grad-mid) 55%, | |
| var(--grad-end) 100% | |
| ); | |
| border-radius: 9px; /* 紧贴 26px 图形的圆角方标（不动其尺寸） */ | |
| color: #ffffff; /* BrandMark 走 currentColor 描边 → 白线 */ | |
| } | |
| [data-style="gemini"] .brand-name { | |
| font-weight: 500; /* Material 标题档 500，撤掉书卷气 600 */ | |
| } | |
| /* ── 标题字重：Material/Gemini 标题 400~500，不用衬线粗体气质 ──── */ | |
| [data-style="gemini"] h1, | |
| [data-style="gemini"] h2, | |
| [data-style="gemini"] h3 { | |
| font-weight: 500; | |
| } | |
| [data-style="gemini"] .hub-tab.is-active, | |
| [data-style="gemini"] .pref-subhead { | |
| font-weight: 500; | |
| } | |
| /* ── 按钮：pill 化（Google 主行动全圆角） + 蓝色态 ─────────────── */ | |
| [data-style="gemini"] .btn-primary, | |
| [data-style="gemini"] .btn-secondary, | |
| [data-style="gemini"] .btn-send, | |
| [data-style="gemini"] .btn-stop, | |
| [data-style="gemini"] .conv-new, | |
| [data-style="gemini"] .icon-btn { | |
| border-radius: 999px; | |
| } | |
| /* 主按钮 hover：Google 蓝变体（浅色 = Blue 700 加深，深色 = 加亮）； | |
| 令牌切换后两套深浅色自动各取各的 --accent-hover。 */ | |
| [data-style="gemini"] .btn-primary:hover, | |
| [data-style="gemini"] .btn-send:hover:not(:disabled) { | |
| background: var(--accent-hover); | |
| } | |
| /* 次按钮：浅灰底（elevated），hover 落到 sunken——中性灰，不用暖调 */ | |
| [data-style="gemini"] .btn-secondary { | |
| background: var(--bg-elevated); | |
| } | |
| [data-style="gemini"] .btn-secondary:hover, | |
| [data-style="gemini"] .btn-stop:hover, | |
| [data-style="gemini"] .conv-new:hover { | |
| background: var(--bg-sunken); | |
| } | |
| /* 危险小按钮 hover：红色浅底（accent-soft 在本皮肤是浅蓝，语义不对） */ | |
| [data-style="gemini"] .icon-btn-danger:hover { | |
| background: color-mix(in srgb, var(--danger) 12%, transparent); | |
| } | |
| /* ── 分段控件 / 模式切换：Google 分段 pill 形（只动圆角） ───────── */ | |
| [data-style="gemini"] .pref-seg, | |
| [data-style="gemini"] .pref-seg-btn, | |
| [data-style="gemini"] .mode-switch, | |
| [data-style="gemini"] .mode-pill { | |
| border-radius: 999px; | |
| } | |
| /* ── 卡片 hover：浅灰蓝描边（令牌已把圆角变 16、底变 #f8f9fa 灰） ── */ | |
| [data-style="gemini"] .metric-card:hover, | |
| [data-style="gemini"] .panel:hover, | |
| [data-style="gemini"] .diag-card:hover, | |
| [data-style="gemini"] .diag-trash:hover, | |
| [data-style="gemini"] .skill-card:hover, | |
| [data-style="gemini"] .mcp-card:hover, | |
| [data-style="gemini"] .cloud-card:hover, | |
| [data-style="gemini"] .expert-card:hover { | |
| border-color: color-mix(in srgb, var(--accent) 40%, var(--border)); | |
| } | |
| /* ── 消息：用户气泡中性化（Google 风更克制：浅灰底 + 发丝描边， | |
| 圆角走 --radius-card=16；渐变不进对话流） ─────────────────── */ | |
| [data-style="gemini"] .msg-card { | |
| background: var(--bg-elevated); | |
| border-color: var(--border); | |
| } | |
| /* ── ② 欢迎页大标题：签名渐变高光（渐变位 2/3；整句文字渐变， | |
| 正文与水印保持中性/单色） ─────────────────────────────────── */ | |
| [data-style="gemini"] .chat-welcome h1 { | |
| background: linear-gradient( | |
| 100deg, | |
| var(--grad-start) 0%, | |
| var(--grad-mid) 52%, | |
| var(--grad-end) 100% | |
| ); | |
| -webkit-background-clip: text; | |
| background-clip: text; | |
| color: transparent; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| /* ── ③ Ultra 档强调：档名渐变高光（渐变位 3/3；轨道/手柄的蓝色系 | |
| 渐变由 --accent 令牌自动中性化，不在本文件另写） ───────────── */ | |
| [data-style="gemini"] .think-slider.is-ultra .think-name { | |
| background: linear-gradient( | |
| 90deg, | |
| var(--grad-start), | |
| var(--grad-mid), | |
| var(--grad-end) | |
| ); | |
| -webkit-background-clip: text; | |
| background-clip: text; | |
| color: transparent; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| /* ── 滚动条：全圆角细条（颜色本身已走中性令牌：#dadce0 → #80868b） ── */ | |
| [data-style="gemini"] ::-webkit-scrollbar-thumb { | |
| border-radius: 999px; | |
| } | |
| /* ── 按图精修层（Lead，2026-10-23，依据 docs/refs 五张 Gemini 实拍）──── | |
| ① 环境光晕：Gemini 的"彩色元素"本体——内容区背后两团大范围柔光 | |
| （浅色=薰衣草紫、深色=蓝紫，取自 --grad-* 低透明度），只用 background-image | |
| 不引入任何布局属性；欢迎页最明显，对话中退为氛围。 | |
| ② 用户气泡：更圆的 18px 近胶囊，贴近 Gemini 对话态实拍。 */ | |
| [data-style="gemini"] .content { | |
| background-image: | |
| radial-gradient(55% 40% at 80% 100%, color-mix(in srgb, var(--grad-mid) 14%, transparent), transparent 72%), | |
| radial-gradient(45% 35% at 12% 100%, color-mix(in srgb, var(--grad-start) 10%, transparent), transparent 70%); | |
| background-repeat: no-repeat; | |
| } | |
| [data-style="gemini"][data-theme="dark"] .content { | |
| background-image: | |
| radial-gradient(55% 42% at 78% 100%, color-mix(in srgb, var(--grad-mid) 20%, transparent), transparent 72%), | |
| radial-gradient(45% 36% at 14% 100%, color-mix(in srgb, var(--grad-start) 14%, transparent), transparent 70%); | |
| } | |
| [data-style="gemini"] .msg-card { | |
| border-radius: 18px; | |
| } | |