/* ======================================== * @font-face XCharter 700 - 自托管衬线标题字体子集 * 源: Bitstream Charter 衍生字族 XCharter (Bitstream license, 自由再分发) * 工件: static/fonts/xcharter-bold-subset.woff2 (英文标题用子集, 仅 700) * 决策: docs/stellar-design-decisions.md 2026-08-08 字体对账 * 许可: docs/licenses/xcharter-bitstream.md * ======================================== */ @font-face { font-family: 'XCharter'; src: url('/static/fonts/xcharter-bold-subset.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; } /* ======================================== * 夜航账本 2026-08-09（supersede） * 主视觉态 = 深色夜航：深空底 + 星光字 + 火箭橙（行动与证据）。 * 橙 = 行动与证据（CTA rocket-500 底 + rocket-400 证据标记文字级）； * nebula-300 = 链接唯一去处（不当第二品牌色）；ok/warn/err = 数据状态色； * 其余一律星光灰阶。亮色纸感降级为 `.light` 第二映射（白昼航班）。 * 决策文档: docs/stellar-design-decisions.md「夜航账本 2026-08-09」 * ======================================== */ :root { /* ======================================== * :root = 夜航主态（深空 + 火箭橙 + 星光）。所有 app shell 经 L1 token 级联。 * ======================================== */ /* --- 深空底 + 星光字 --- */ --background: #0C0E16; /* space-950: body 深空底 */ --foreground: #ECEEF6; /* star-50: 星光字 */ --card: #12141F; /* space-900: 卡片/纸面 */ --card-foreground: #ECEEF6; --popover: #12141F; /* space-900 */ --popover-foreground: #ECEEF6; /* --- 火箭橙：行动 + 证据标记 --- */ --primary: oklch(0.66 0.16 42); /* rocket-400: 证据标记文字级 */ --primary-action: #EE5F0C; /* rocket-500: CTA 底 */ --primary-foreground: #0C0E16; /* CTA 深空字 (>=7.4:1) */ /* --- 深空灰阶语义 --- */ --secondary: #161927; /* space-850 */ --secondary-foreground: #B6BAC9; /* space-200: 表格正文 */ --muted: #161927; /* space-850 */ --muted-foreground: #8A90A8; /* space-300: 描述/导航项 */ --accent: #161927; /* space-850 */ --accent-foreground: #ECEEF6; --destructive: oklch(0.62 0.18 25); --destructive-foreground: #0C0E16; --border: #262A3C; /* space-700: 容器边框 */ --input: #262A3C; /* space-700 */ --ring: oklch(0.66 0.16 42); /* rocket-400 focus ring */ /* --- 图表 --- */ --chart-1: oklch(0.66 0.16 42); /* rocket-400 */ --chart-2: #6E7590; /* star gray: nebula 仅供链接，图表退为星光灰 */ --chart-3: #6E7590; --chart-4: #3A4056; /* space-600 */ --chart-5: oklch(0.60 0.14 42); /* --- Sidebar --- */ --sidebar: #10121C; --sidebar-foreground: #B6BAC9; /* space-200 */ --sidebar-primary: oklch(0.66 0.16 42); /* rocket-400 */ --sidebar-primary-foreground: #0C0E16; --sidebar-accent: #161927; /* space-850 */ --sidebar-accent-foreground: #ECEEF6; --sidebar-border: #1E2230; --sidebar-ring: oklch(0.66 0.16 42); /* --- 字体栈（theme-neutral，共享） --- */ --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-serif: 'XCharter', Charter, 'Bitstream Charter', Georgia, 'Sitka Text', Cambria, serif; /* 标题衬线: XCharter 700 自托管子集优先, 本地 Charter/Georgia 兜底 */ --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; /* --- 圆角 + 阴影参数（theme-neutral，共享） --- */ --radius: 0.75rem; --shadow-x: 0; --shadow-y: 1px; --shadow-blur: 3px; --shadow-spread: 0px; --shadow-opacity: 0.1; --shadow-color: oklch(0 0 0); /* --- 阴影（夜航 = 深底阴影值） --- */ --shadow-2xs: 0 1px 2px 0px hsl(0 0% 0% / 0.3); --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.3), 0 1px 2px -1px hsl(0 0% 0% / 0.3); --shadow-sm: 0 2px 4px 0px hsl(0 0% 0% / 0.3), 0 1px 3px -1px hsl(0 0% 0% / 0.3); --shadow: 0 4px 6px -1px hsl(0 0% 0% / 0.3), 0 2px 4px -2px hsl(0 0% 0% / 0.3); --shadow-md: 0 6px 10px -2px hsl(0 0% 0% / 0.3), 0 3px 6px -3px hsl(0 0% 0% / 0.3); --shadow-lg: 0 10px 15px -3px hsl(0 0% 0% / 0.3), 0 4px 6px -4px hsl(0 0% 0% / 0.3); --shadow-xl: 0 20px 25px -5px hsl(0 0% 0% / 0.3), 0 8px 10px -6px hsl(0 0% 0% / 0.3); --shadow-2xl: 0 25px 50px -12px hsl(0 0% 0% / 0.5); /* --- 额外灰阶语义（组件级使用）--- */ --card-border: #2A2E40; /* 卡片边框 */ --tab-border: #3A4056; /* space-600: tab/pagination 边框 */ --ghost-border: #3A4056; /* space-600: ghost 按钮边框 */ --text-secondary: #B6BAC9; /* space-200: 描述文字 */ --text-tertiary: #8A90A8; /* space-300: hint/meta 弱化文字 */ --text-table: #B6BAC9; /* space-200: 表格正文 */ /* --- 交互态色板 --- */ --active-bg: rgba(238, 95, 12, 0.10); /* rocket-500 10% active tab/nav 背景 */ /* --- 新 token：链接 + 数据状态色（每屏橙 <=5 类） --- */ --link: #7E9BFF; /* nebula-300: 链接唯一去处 */ --ok: #5BBF8A; /* 数据状态: ok */ --warn: #D9A441; /* 数据状态: warn */ --err: #E06C5E; /* 数据状态: err */ } /* ======================================== * .light = 白昼航班第二映射（纸 + Prussian + 墨 CTA）。 * 映射值为上一版 shipped 亮色主态 verbatim；仅 `prefers-color-scheme: light` * 或显式切到白昼时由 base.templ 加 `.light` 类。 * ======================================== */ .light { /* --- 纯白纯灰背景 + 墨色 CTA + Prussian Ink 证据标记 --- */ --background: #FFFFFF; /* 容器背景: 纯白 */ --foreground: #191919; /* 标题文字: 近黑 */ --card: #FAFAFA; --card-foreground: #191919; --popover: #FFFFFF; --popover-foreground: #191919; /* --- Prussian Ink primary (证据标记) + 墨色 CTA (劝说元素) --- */ --primary: oklch(0.45 0.09 250); /* Prussian Ink: 证据标记专用 */ --primary-action: #191919; /* 劝说元素 = 墨色 CTA */ --primary-foreground: #FFFFFF; /* --- 灰阶语义 --- */ --secondary: #FAFAFA; --secondary-foreground: #333333; /* 表格正文 */ --muted: #F0F0F0; /* 标签背景 */ --muted-foreground: #666666; /* 描述/导航项 */ --accent: #FAFAFA; --accent-foreground: #191919; --destructive: oklch(0.6 0.2 25); --destructive-foreground: #FFFFFF; --border: #E8E8E8; /* 容器边框 */ --input: #E8E8E8; --ring: oklch(0.45 0.09 250); /* --- 图表（保持 oklch 色域） --- */ --chart-1: oklch(0.45 0.09 250); --chart-2: oklch(0.55 0.08 250); --chart-3: oklch(0.55 0.12 220); --chart-4: oklch(0.7 0.1 300); --chart-5: oklch(0.40 0.09 250); /* --- Sidebar --- */ --sidebar: #FAFAFA; --sidebar-foreground: #333333; --sidebar-primary: oklch(0.45 0.09 250); --sidebar-primary-foreground: #FFFFFF; --sidebar-accent: #F0F0F0; --sidebar-accent-foreground: #191919; --sidebar-border: #E8E8E8; --sidebar-ring: oklch(0.45 0.09 250); /* --- 字体栈（self-contained：与 :root 字面一致，防夜航改动漂移白昼映射） --- */ --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-serif: 'XCharter', Charter, 'Bitstream Charter', Georgia, 'Sitka Text', Cambria, serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; /* --- 圆角 + 阴影参数（self-contained：与 :root 字面一致） --- */ --radius: 0.75rem; --shadow-x: 0; --shadow-y: 1px; --shadow-blur: 3px; --shadow-spread: 0px; --shadow-opacity: 0.1; --shadow-color: oklch(0 0 0); /* --- 阴影（白昼 = 浅底阴影值） --- */ --shadow-2xs: 0 1px 2px 0px hsl(0 0% 10% / 0.05); --shadow-xs: 0 1px 3px 0px hsl(0 0% 10% / 0.05), 0 1px 2px -1px hsl(0 0% 10% / 0.05); --shadow-sm: 0 2px 4px 0px hsl(0 0% 10% / 0.05), 0 1px 3px -1px hsl(0 0% 10% / 0.05); --shadow: 0 4px 6px -1px hsl(0 0% 10% / 0.05), 0 2px 4px -2px hsl(0 0% 10% / 0.05); --shadow-md: 0 6px 10px -2px hsl(0 0% 10% / 0.05), 0 3px 6px -3px hsl(0 0% 10% / 0.05); --shadow-lg: 0 10px 15px -3px hsl(0 0% 10% / 0.05), 0 4px 6px -4px hsl(0 0% 10% / 0.05); --shadow-xl: 0 20px 25px -5px hsl(0 0% 10% / 0.05), 0 8px 10px -6px hsl(0 0% 10% / 0.05); --shadow-2xl: 0 25px 50px -12px hsl(0 0% 10% / 0.15); /* --- 额外灰阶语义（组件级使用）--- */ --card-border: #EBEBEB; /* 卡片边框 */ --tab-border: #E0E0E0; /* tab/pagination 边框 */ --ghost-border: #D5D5D5; /* ghost 按钮边框 */ --text-secondary: #666666; /* 描述文字 */ --text-tertiary: #888888; /* hint/meta 弱化文字 */ --text-table: #333333; /* 表格正文 */ /* --- 交互态色板 --- */ --active-bg: rgba(44, 82, 126, 0.10); /* active tab/nav 背景 */ /* --- 新 token：链接 + 数据状态色（白昼 ink 映射） --- */ --link: #191919; /* ink: 链接 */ --ok: #1F7A4D; /* 数据状态: ok */ --warn: #9A6B1F; /* 数据状态: warn */ --err: #C23B2E; /* 数据状态: err */ } @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); --font-sans: var(--font-sans); --font-mono: var(--font-mono); --font-serif: var(--font-serif); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --shadow-2xs: var(--shadow-2xs); --shadow-xs: var(--shadow-xs); --shadow-sm: var(--shadow-sm); --shadow: var(--shadow); --shadow-md: var(--shadow-md); --shadow-lg: var(--shadow-lg); --shadow-xl: var(--shadow-xl); --shadow-2xl: var(--shadow-2xl); }