/* Theme Name: 琥珀暖橙 Theme URI: modern-ember Author: SoSite Description: 温润的琥珀橙色系，浅色顶栏配橙色点缀 Version: 1.1 Color: #e7672e */ :root { /* 主色 */ --mn-primary: #e7672e; --mn-primary-hover: #d05a1b; --mn-primary-light: #fef3ec; --mn-primary-subtle: #fdf5ee; /* 背景 */ --mn-bg: #ffffff; --mn-bg-body: #fdf1e4; --mn-bg-card: #ffffff; --mn-bg-nav: #ffffff; --mn-bg-sidebar: #ffffff; --mn-bg-row-hover: #fef3ec; --mn-bg-input: #ffffff; --mn-bg-tag: #fef3ec; /* 文字 */ --mn-text: #1a1a2e; --mn-text-secondary: #716158; --mn-text-muted: #9ca3af; --mn-text-inverse: #ffffff; --mn-text-link: #e7672e; --mn-text-nav: #716158; --mn-text-nav-hover: #c94f12; --mn-bg-nav-hover: rgba(231,103,46,0.09); /* 边框 */ --mn-border: #eaded6; --mn-border-light: #f2e9e1; --mn-divider: #f4ece5; /* 语义色 */ --mn-success: #22c55e; --mn-error: #ef4444; --mn-warning: #f59e0b; /* 标签 */ --mn-tag-bg: #fef3ec; --mn-tag-text: #e7672e; --mn-tag-hot-bg: #fef3ec; --mn-tag-hot-text: #e7672e; --mn-tag-elite-bg: #fefce8; --mn-tag-elite-text: #a16207; /* 白字（主色底/深色底上的文字） */ --mn-text-white: #ffffff; /* 标签-警告 */ --mn-tag-warning-bg: #fef3c7; --mn-tag-warning-text: #d97706; /* 提示框 */ --mn-alert-success-bg: #f0fdf4; --mn-alert-success-text: #16a34a; --mn-alert-success-border: #bbf7d0; --mn-alert-error-bg: #fef2ec; --mn-alert-error-text: #c2410c; --mn-alert-error-border: #fcd7c0; /* 正文内容（帖子/博客正文、表格） */ --mn-content-text: #5a3d2a; --mn-content-border: #eaded6; /* 代码块（白天浅色：浅橙底 + 深橙字） */ --mn-code-bg: #fef2ea; --mn-code-text: #c2410c; /* 杂项 */ --mn-bg-theme-badge: rgba(231,103,46,0.14); --mn-bg-strength-track: #f8e4d6; /* 阴影 */ --mn-shadow-sm: 0 1px 2px rgba(0,0,0,0.04); --mn-shadow: 0 1px 3px rgba(0,0,0,0.06); --mn-shadow-dropdown: 0 4px 16px rgba(0,0,0,0.12); --mn-shadow-dropdown-up: 0 -4px 16px rgba(0,0,0,0.12); --mn-shadow-mobile-nav: 0 -2px 8px rgba(0,0,0,0.05); --mn-shadow-primary-glow: 0 2px 8px rgba(231,103,46,0.35); --mn-shadow-float: 0 2px 8px rgba(0,0,0,0.12); /* 旧版通用变量（兼容 style.css / editor.css / 插件 CSS）：统一指向 --mn-* */ --primary-color: var(--mn-primary); --primary-hover: var(--mn-primary-hover); --bg-light: var(--mn-primary-subtle); --bg-white: var(--mn-bg-card); --border-color: var(--mn-border); --text-dark: var(--mn-text); --text-muted: var(--mn-text-muted); --success-color: var(--mn-success); /* 编辑器（WYSIWYG / Markdown） */ --mn-editor-toolbar-bg: #fdf7f1; --mn-editor-tab-hover-bg: rgba(231,103,46,0.06); --mn-editor-btn-text: #716158; --mn-editor-btn-hover-bg: #fef3ec; --mn-editor-btn-hover-text: #d05a1b; --mn-editor-btn-press-bg: #fbe3d3; --mn-editor-separator-bg: #ead2c0; --mn-editor-placeholder-text: #c9a892; --mn-editor-quote-bg: #fdf5ee; --mn-editor-quote-text: #716158; --mn-editor-quote-bg-2: #fdf7f1; --mn-editor-quote-text-2: #716158; --mn-editor-code-inline-bg: #fef3ec; --mn-editor-code-inline-text: #e7672e; --mn-editor-table-border: #eaded6; --mn-editor-table-th-bg: #fdf5ee; --mn-editor-emoji-border: #eaded6; --mn-editor-emoji-hover-bg: #fef3ec; --mn-editor-btn-highlight-bg: #fbe3d3; --mn-editor-btn-highlight-text: #e7672e; --mn-editor-btn-highlight-shadow: inset 0 1px 3px rgba(0,0,0,0.1); --mn-editor-word-count-text: #9ca3af; /* 旧组件（components.css） */ --mn-comp-tag-hot-bg: #fef3ec; --mn-comp-tag-hot-text: #e7672e; --mn-comp-tag-danger-bg: #fce4ec; --mn-comp-tag-danger-text: #be185d; --mn-comp-alert-error-bg: #fee; --mn-comp-alert-error-border: #f00; --mn-comp-alert-error-text: #c00; --mn-comp-alert-success-bg: #d4edda; --mn-comp-alert-success-border: #28a745; --mn-comp-alert-success-text: #155724; --mn-comp-alert-warning-bg: #fff3cd; --mn-comp-alert-warning-border: #ffc107; --mn-comp-alert-warning-text: #856404; --mn-comp-input-border: #eaded6; --mn-comp-label-text: #1a1a2e; --mn-comp-hint-text: #9ca3af; --mn-comp-btn-danger-bg: #e7672e; --mn-comp-tag-badge-bg: #e7672e; --mn-comp-tag-badge-hover-bg: #d05a1b; --mn-comp-vote-up-active: #ef4444; --mn-comp-vote-up-hover-bg: #fef3ec; --mn-comp-reply-lock-bg: #fef3c7; --mn-comp-reply-lock-border: #f59e0b; --mn-comp-pagination-active-bg: #e7672e; --mn-comp-swatch-border: #eaded6; --mn-comp-preview-border: #eaded6; --mn-comp-overlay-bg: rgba(0,0,0,0.85); } /* ===== 浅色顶栏关键覆盖 ===== 本文件在 modern.css 之后加载，可安全覆盖。 导航底色 / 文字 / 悬停 / 当前项全部由上面的 --mn-* 变量驱动，不再重复写选择器； 这里只放「变量表达不了」的三处：页面底色渐变、主按钮渐变、移动端加号渐变。 与 modern-sand.css 同一套手感（2026-10-26 对齐暖沙米金）。 ⚠️ 本主题的 --mn-bg-body 已从 #faf3ec 推橙到 #fdf1e4：原值与 sand 的 #faf5ec 只差 dE 1.63，两个主题并排会分不出；推橙后 dE 3.19，一眼能看出是暖橙不是米金。 */ /* ① 页面底色：暖橙渐变（上亮下略深），比纯色多一层温度 */ body { background: linear-gradient(180deg, #fff7ec 0%, #fdf1e4 46%, #f6e9db 100%); background-attachment: fixed; } /* ② 主按钮：橙调渐变（单色变量表达不了渐变）+ 柔和橙光 */ .mn-btn-primary { background: linear-gradient(135deg, #eb7541 0%, #d9602b 100%); border-color: #d9602b; box-shadow: 0 1px 2px rgba(0,0,0,0.08); } .mn-btn-primary:hover { background: linear-gradient(135deg, #e7672e 0%, #d05a1b 100%); border-color: #d05a1b; box-shadow: var(--mn-shadow-primary-glow); } .mn-btn-primary:active { background: linear-gradient(135deg, #ce5925 0%, #bd5120 100%); box-shadow: none; } /* ③ 移动端底部「发帖」圆形按钮：与主按钮同款橙调渐变，保持首尾一致 */ .mn-mobile-nav-plus { background: linear-gradient(135deg, #eb7541 0%, #d66429 100%); box-shadow: var(--mn-shadow-primary-glow); } .mn-mobile-nav-plus:hover { background: linear-gradient(135deg, #e7672e 0%, #d05a1b 100%); } /* ============================================================ 轻玻璃质感（2026-11-07） ------------------------------------------------------------ 只作用于本主题（modern-ember 琥珀暖橙），其他主题不受影响。 本文件在 modern.css 之后加载 → 同权重靠源序覆盖，不需要 !important。 前提：body 原本是纯色 --mn-bg-body，纯色上做毛玻璃等于没做。 所以先铺多层径向光斑提供可模糊的层次。 底色是暖奶油(#fdf1e4)、导航白底深字，光斑走橙金，保持暖调不被玻璃压灰。 范围刻意收窄为「容器级三件」：卡片、导航、下拉。 列表项（.mn-thread-item）不加 —— 一页几十个 backdrop-filter 就是几十个独立合成层，滚动会明显掉帧。 ============================================================ */ /* ① 底：柔光斑（fixed 让光斑不随内容滚动） */ body { background: radial-gradient(1100px 560px at 8% -8%, rgba(231,103,46,.16), transparent 62%), radial-gradient(900px 480px at 92% -2%, rgba(251,146,60,.18), transparent 58%), radial-gradient(760px 520px at 50% 108%, rgba(253,186,116,.22), transparent 62%), var(--mn-bg-body); background-attachment: fixed; } /* ② 卡片 / 面板：半透明白 + 模糊 */ .mn-card, .mn-panel { background: rgba(255, 255, 255, .62); border-color: rgba(255, 255, 255, .72); -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); box-shadow: 0 6px 24px rgba(231, 103, 46, .10), inset 0 1px 0 rgba(255, 255, 255, .9); } /* ③ 顶部导航：白底导航 → 半透明白 + 模糊，深色文字对比度不受影响 */ .mn-nav { background: rgba(255, 255, 255, .72); -webkit-backdrop-filter: blur(12px) saturate(150%); backdrop-filter: blur(12px) saturate(150%); box-shadow: 0 2px 12px rgba(231, 103, 46, .10); } /* ④ 下拉浮层：比卡片更实一点，否则 13px 小字发糊 */ .mn-dropdown-panel { background: rgba(255, 255, 255, .82); border-color: rgba(255, 255, 255, .8); -webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%); box-shadow: 0 10px 32px rgba(231, 103, 46, .10), inset 0 1px 0 rgba(255, 255, 255, .9); } /* ⑤ 回退：不支持 backdrop-filter 时全部退回不透明 */ @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .mn-card, .mn-panel { background: var(--mn-bg-card); border-color: var(--mn-border); box-shadow: var(--mn-shadow-sm); } .mn-nav { background: var(--mn-bg-nav); box-shadow: none; } .mn-dropdown-panel { background: var(--mn-bg-card); border-color: var(--mn-border-light); box-shadow: 0 4px 16px rgba(0, 0, 0, .08); } }