sintbot 1.0.15 → 1.3.0

package/assets/design-styles/precision-mono.md

@@ -1,156 +0,0 @@
----
-name: 精密仪表
-description: 开发者工具那种密而准的界面——发丝线分区、等宽数字对齐、4px 小圆角,没有一处多余装饰
-name_en: "Precision Mono"
-description_en: "The dense, exact interface of developer tools: hairline dividers, aligned monospaced numbers and 4px corners, with not one ornament to spare."
-suits: "工具产品"
-colors:
-  bg: "#FAFAFA"
-  surface: "#FFFFFF"
-  ink: "#0A0A0A"
-  muted: "#737373"
-  line: "#E6E6E6"
-  accent: "#2B5AE1"
-fonts:
-  latin: "'Geist', 'Schibsted Grotesk'"
-  cjk: sans
-typography:
-  headline:
-    fontSize: "24px"
-    fontWeight: 600
-    lineHeight: 1.25
-    letterSpacing: "-0.02em"
-  body:
-    fontSize: "14px"
-    fontWeight: 400
-    lineHeight: 1.55
-    measure: "76ch"
-  data:
-    latin: "'Geist Mono', 'Martian Mono'"
-    generic: "ui-monospace, monospace"
-    fontSize: "13px"
-    fontWeight: 500
-    letterSpacing: "0.06em"
-border:
-  width: "1px"
-  style: solid
-  emphasis: "1px"
-rounded:
-  sm: 4px
-  md: 6px
-spacing:
-  unit: "4px"
-  maxWidth: "1200px"
-elevation:
-  mode: flat
-  levels: "1"
-status:
-  success: "#0B7A46"
-imagery:
-  ratio: "16:9"
-  treatment: none
-  crop: hard
-icon:
-  style: line
-  strokeWidth: "1.5px"
-  linecap: butt
-  corner: sharp
-components:
-  button-primary:
-    backgroundColor: "{colors.ink}"
-    textColor: "{colors.surface}"
-    typography: "{typography.body}"
-    rounded: "{rounded.sm}"
-    height: "32px"
-    padding: "12px"
-  card:
-    backgroundColor: "{colors.surface}"
-    textColor: "{colors.ink}"
-    rounded: "{rounded.md}"
-    padding: "16px"
-  input-field:
-    backgroundColor: "{colors.surface}"
-    textColor: "{colors.ink}"
-    rounded: "{rounded.sm}"
-    height: "32px"
-    padding: "8px"
-  tag:
-    backgroundColor: "{colors.bg}"
-    textColor: "{colors.muted}"
-    typography: "{typography.data}"
-    rounded: "{rounded.sm}"
-    height: "20px"
-    padding: "6px"
----
-
-## Overview
-
-参照物(均实测过 CSS):Linear `linear.app`、Vercel `vercel.com`(Geist Sans + Geist Mono,`#FAFAFA` / `#EAEAEA` / `#0070F3`)、2xA Studio `2xa.studio`、Resend `resend.com`。
-气质是**仪表**:每个数对得齐,每条线只有 1px,信息密而不乱。它不追求好看,追求「一眼看清十二个数」——装饰预算全花在对齐和字距上。
-
-**与「瑞士网格」的分界**:瑞士是**招贴逻辑**(Helvetica、唯一的红、圆角 0、留白 40%、根本没有组件);这一套是**屏幕产品逻辑**(等宽是主音而非数据配角、发丝线到处都是、4px 圆角、表格密排、tabular 数字、状态点)。瑞士留白,它留密度。
-
-## Colors
-
-- **bg (#FAFAFA) / surface (#FFFFFF)**:近白与纯白两级,卡片浮起靠这一档差 + 一条 1px 线,不靠投影。
-- **ink (#0A0A0A)**:文字与主按钮底(bg 上 19.0:1),这套里唯一的重色。
-- **muted (#737373)**:标签、单位、次级信息(bg 上 4.54:1,刚过线)。⚠ 别再往浅调,4.5 是底不是目标。
-- **line (#E6E6E6)**:发丝线 —— 这个风格的骨架。**分区一律用它,不用底色块**。
-- **accent (#2B5AE1)**:蓝,给链接、激活态、聚焦环、图表主线(白底 5.75:1,可作文字)。⚠ **不做按钮填充面**。
-- **success (#0B7A46,在顶层 `status:` 段)**:同一支绿(色相 151°)取到可读深度(bg 上 5.2:1),状态词与 6px 圆点都用它。⚠ **不做底色块** —— 这套的分区只有 1px 线;且圆点旁永远配一个状态词,颜色不单独承担语义。
-
-## Typography
-
-- 界面文字 Geist / Schibsted Grotesk + 系统黑体(苹方 / 微软雅黑,思源黑体兜底);**所有数值一律等宽**(Geist Mono)且必须 `font-variant-numeric: tabular-nums` —— 数字会跳,定宽数位是专业感的一半。
-- 标题 24 / 正文 14,反差只有 1.7 倍。**密度就是这个风格的性格**,别把标题拉大。
-- 等宽小字 `0.06em`、字重 500,用于 ID、时间戳、版本号、指标值;字重全站封顶 600。中文没有真正的等宽族,夹在数据里的汉字兜到系统黑体(与界面文字同一套)。
-
-## Layout
-
-- **spacing 单位 4px**,阶梯 4/8/12/16/24 —— 间距值只能从这五个里选;表格行高 32-36px,单元格内边距 8/12,列宽按内容定,**数值列一律右对齐**。
-- 分区靠 1px `line` 横贯到底(整条不留边距),不靠留白也不靠色块;内容最大宽 1200px,正文行长 76ch(字号小,容得下长行)。
-
-## Elevation & Depth
-
-默认**没有层**(`flat`)。纵深靠三样替代手段,按优先级用:
-
-1. **1px 描边**:卡片、输入框、表格容器一律 `1px solid #E6E6E6`。第一手段,占九成。
-2. **明度分级**:页面 `#FAFAFA`、卡片 `#FFFFFF`。只有这两级,不设第三级。
-3. **浮层例外**:只有真正脱离文档流的东西(下拉菜单、命令面板、toast)允许 `0 1px 2px rgba(0,0,0,.04), 0 8px 16px rgba(0,0,0,.06)` —— 两段式、极淡、无扩散。
-
-Don't:给卡片加阴影。柔和大阴影卡片是 AI 模板的第一特征,一出现整套掉价;卡片的边界永远是那条 1px 线。
-
-## Shapes
-
-- **圆角上限 8px**,实际只用两档:控件 4px、卡片 6px。超过 8 就变成通用 SaaS 模板;圆角**全站统一**,同类元素不许一处 4 一处 6,写成变量别手写。
-- 线条 1px、平头、直角相交;虚线只表示「待定/占位」这一种语义。
-- 图标 1.5px 细线、方头、直角,16px 网格上绘制,与文字基线对齐。状态点 6px 正圆,是这套里唯一的圆形。
-
-## Components
-
-- **主按钮**:`ink` 实心 + 白字 + 4px 圆角 + 32px 高,一屏一个。
-- **次按钮**:白底 + 1px `line` 边 + ink 字;hover 边框换 `#0A0A0A`,**不换底色**。
-- **卡片**:白底 + 1px 边 + 6px 圆角 + 16px 内边距,**无阴影**。
-- **输入框**:与次按钮同规格;聚焦态 = 边框换 accent + 3px 外圈 `rgba(43,90,225,.14)`。
-- **标签**:bg 底 + 等宽小字 + 20px 高,密集成排,不用彩色底。
-
-## Do's and Don'ts
-
-- Do:数字全部 `tabular-nums`,**同一列必须对齐** —— 对不齐的数字表等于没做;每个数值带单位与时间口径,没有量纲的数字在这个风格里是缺陷。
-- Do:分区只用 1px `#E6E6E6`,不用底色块;圆角全站统一 4px(卡片 6px)。
-- Don't:柔和大阴影卡片(**AI 模板的第一特征**)。
-- Don't:把蓝色做成填充按钮的主色面积 —— 按钮用 `#0A0A0A` 实心,蓝留给链接、聚焦环与激活态。
-- Don't:圆角 > 8px、胶囊按钮、渐变、玻璃、emoji 图标。
-- Don't:用 `success` 色做背景块 —— 分区只有 1px 线,不用色块(见 Colors)。
-
-## Composition
-
-- 仪表盘:顶部一行关键指标(等宽大数 + 小标签),下面是表格或图表,左侧窄导航。
-- 一屏可以放很多东西,但**层级只有两级**(区块标题 + 内容),不做三级嵌套卡片。
-- 图表线 1.5px,网格线用 `line` 色且明显浅于数据线;图片硬裁 16:9,不加圆角不加边。数据要造真:量级合理、有单位、有时间戳。
-
-## Image Prompt Templates
-
-- base: "precise developer-tool interface, near-white background (#FAFAFA), white cards separated by 1px hairline borders (#E6E6E6), no shadows, small 4px corner radius, dense data table with tabular monospaced numerals, black solid primary button (#0A0A0A), blue only for links and focus states (#2B5AE1), tiny monospace labels, thin 1.5px line icons, high information density, flat and exact"
-- negative: "soft drop shadow cards, large rounded corners, pastel gradient, glassmorphism, blue filled hero buttons, decorative illustration, emoji icons, oversized whitespace"
-- 注:画面里要出现**真实的表格与数值**(带单位、带时间戳),这个风格的可信度全在数据像不像真的;中文界面补 "clean CJK sans-serif UI typography, 14px body"。

package/assets/design-styles/quiet-luxury.md

@@ -1,163 +0,0 @@
----
-name: 静奢
-description: 巨大的衬线标题、微型全大写标签、一屏只说一件事——不装饰不发光,贵在敢空
-name_en: "Quiet Luxury"
-description_en: "Huge serif headlines, tiny all-caps labels and one idea per screen. No ornament and no glow: the luxury is in daring to leave space empty."
-suits: "品牌门面"
-colors:
-  bg: "#FFF8EF"
-  ink: "#0E0E0E"
-  accent: "#003933"
-  blush: "#EDCCBE"
-  muted: "#8E8A82"
-  line: "#E3DCD1"
-  gold: "#E2C373"
-fonts:
-  latin: "'Söhne', 'Neue Haas Grotesk', 'Host Grotesk'"
-  cjk: sans
-typography:
-  headline:
-    latin: "'Noe Display', 'Bodoni Moda'"
-    cjk: serif
-    fontSize: "72px"
-    fontWeight: 400
-    lineHeight: 1.02
-    letterSpacing: "-0.01em"
-  body:
-    fontSize: "16px"
-    fontWeight: 400
-    lineHeight: 1.65
-    measure: "52ch"
-  label:
-    fontSize: "11px"
-    fontWeight: 500
-    letterSpacing: "0.16em"
-border:
-  width: "0px"
-  style: solid
-  emphasis: "0px"
-rounded:
-  none: 0px
-spacing:
-  unit: "16px"
-  gutter: "32px"
-  margin: "64px"
-  maxWidth: "1280px"
-elevation:
-  mode: flat
-  levels: "0"
-imagery:
-  ratio: "3:4"
-  treatment: none
-  crop: full-bleed
-icon:
-  style: line
-  strokeWidth: "1px"
-  linecap: butt
-  corner: sharp
-components:
-  link-cta:
-    textColor: "{colors.ink}"
-    typography: "{typography.label}"
-    rounded: "{rounded.none}"
-    padding: "0px"
-  link-cta-hover:
-    textColor: "{colors.accent}"
-  card:
-    backgroundColor: "{colors.blush}"
-    textColor: "{colors.ink}"
-    rounded: "{rounded.none}"
-    padding: "64px"
-  input-field:
-    backgroundColor: "{colors.bg}"
-    textColor: "{colors.ink}"
-    rounded: "{rounded.none}"
-    height: "48px"
-  tag:
-    backgroundColor: "{colors.bg}"
-    textColor: "{colors.muted}"
-    typography: "{typography.label}"
-    rounded: "{rounded.none}"
----
-
-## Overview
-
-参照物:House of Honey(houseofhoney.com,Noe Text + Neue Haas Grotesk)、Aimé Leon Dore(aimeleondore.com,Söhne + Financier Display + DIN)、Brunello Cucinelli、Cecilie Bahnsen。
-这是**品牌门面**的风格:一屏只有一张大图、一个五个字的标题、一行微型全大写标签,几乎没有段落。
-气质是「不解释」——不说服、不列卖点、不放按钮;贵不来自装饰,来自敢把六成版面留空。
-
-**与「杂志编辑」的分界**(两者最容易混):编辑风是**内容叙事**,牛皮纸底、砖红点缀、衬线排正文、长文分栏、图注与页码一应俱全,读者是来读的;静奢是**品牌门面**,衬线只出现在巨标题上、正文全部无衬线且极短、没有分栏也没有图注体系,观众是来看的。
-**判据一句话:这一屏有没有段落?有 ⇒ 用编辑风。**
-
-## Colors
-
-- **bg (#FFF8EF)**:奶白偏暖。暖来自扣掉的那点蓝,不是加黄——一偏黄就成了米色便签纸。
-- **ink (#0E0E0E)**:近黑,与 bg 18.3:1。**所有文字都用它**,没有第二种文字色。
-- **accent (#003933)**:深墨绿,**极小面积**——一条 1px 线、一个词、CTA 的 hover 色。与 bg 12.2:1 承载文字安全,但一屏最多 1-2 处。
-- **blush (#EDCCBE)**:胭脂。用法与 accent 相反,**它是拿来铺大面积的**:整块 section 底、整张图的衬底;ink 压上去 12.8:1 可读。
-- **muted (#8E8A82)**:暖灰,与 bg 只有 3.3:1,**够不上正文**——只给图注、年份、地点这类「看不清也不影响」的信息。11px 标签一律用 ink。
-- **line (#E3DCD1)**:1px 发丝线。存在感应接近于零,一屏里数得出几条线就已经多了。
-- **gold (#E2C373)**:与 bg 只有 1.6:1,**永远不能当文字色**;只做细节(一个 4px 的点、图片一角的压线),整站不用也完全成立。
-
-## Typography
-
-- **标题**:高对比现代衬线(Noe Display / Bodoni Moda,中文走系统宋体、思源宋体兜底),字重恒 400,字距 -0.01em。72px 起步,**敢上 120px**——音量全在字号,不在字重。
-- **正文**:无衬线(Söhne / Neue Haas Grotesk / Host Grotesk),16px 400。**正文永远不用衬线**,这是与编辑风分家的那一刀。
-- **label**:同正文字族、500、11px、字距 0.16em、全大写——**这是这个风格的签名**。分类、季度、产地、材质全走这一档;中文没有大写,用 0.1em 以上字距代偿。
-- 一屏只允许一种衬线。两种衬线并置(哪怕一个做标题一个做引言)立刻变成排版练习。
-- 标题与正文 4.5 倍反差(72/16),中间**不存在任何字号**。
-
-## Layout
-
-- **spacing.unit 16px**,阶梯 16 / 32 / 64 / 128——留白要夸张到「像是没排完」。
-- 左右外边距 ≥ 版心的 8%;竖构图图片两侧的白比图本身更需要保护。
-- 一屏 = 一个标题 + 一个 label + 一张大图,三件套结束。第四个元素想出现时,先删掉一个。
-- 允许不对称(图偏右、字压左下),但**绝不居中堆成轴对称**。
-
-## Elevation & Depth
-
-`elevation.mode: flat`——**任何阴影都会立刻掉价**,包括 1px 的、包括 2% 透明度的。这个风格里没有「浮起来的卡片」这个概念,层次只靠三件事:
-
-1. **图片出血**:图压满一整块,它与 bg 的边界就是最强的一道层次。
-2. **blush 色块**:整段换 blush 底,与 bg 的明度差(0.95 : 0.65)自己就分了层。
-3. **留白量差**:密处紧到 16px、松处空到 128px,疏密比就是视觉层级。
-
-Don't:阴影、毛玻璃、半透明遮罩、hover 位移、任何「浮起 / 按下」的暗示。
-
-## Shapes
-
-- **圆角恒 0**。唯一例外是图片可以到 2px(印刷裁切的手感),再多就软了。
-- **边框恒 0px**。这个风格里没有描边卡片——要分区就换底色,不要画框。
-- **线**:1px、line 色、平头端点、只走水平垂直;不用虚线、不用斜线。
-- **图标**:1px 线性、平头、直角转角、无填充;高度与 label 齐,**永远不放进圆形底里**。
-
-## Components
-
-- **CTA 不是按钮**:它是一行 label 规格的小字加 1px 下划线(`link-cta`)。hover 时字色换 accent、下划线跟着换,**位置不动**。整站没有实心按钮这种东西。
-- **卡片**:blush 实底 + 64px 内边距 + 直角,无边框无阴影;卡片里不再套卡片。
-- **输入框**:只有底部一条 1px line,没有四边框、底色、圆角;聚焦时那条线换 ink。
-- **标签**:纯文字,无底色无边框——「标签」在这里是排版位置,不是一个色块。
-
-## Do's and Don'ts
-
-- Do:一屏只允许一个标题 + 一个 label + 一张大图。
-- Do:墨绿一屏只出现 1-2 处,金色出现 0-1 处。
-- Do:图片用 3:4 或 4:5 竖构图,左右留白 ≥8%。
-- Do:文案短到极限——五个字的标题比十五个字的贵。
-- Don't:**按钮化**(实心块、胶囊、大写粗字加箭头);CTA 就是一行带下划线的小字。
-- Don't:圆角、阴影、hover 位移、渐变、任何发光。
-- Don't:同一屏用两种衬线;正文用衬线。
-- Don't:拿 gold 或 blush 当文字色(1.6:1,见 Colors)。
-- Don't:堆 logo 墙、卖点图标、客户评价——那是转化页的语言,不是门面。
-
-## Composition
-
-- 竖幅优先:一张 3:4 的图占六成版面,标题压在图**外**的空白里,label 贴在标题上方 32px。
-- 文字与图**不重叠**(这是与巴黎高定的分界):这里的高级来自两者互不打扰。
-- 页脚只有一行 label:年份、城市、一个词。
-
-## Image Prompt Templates
-
-- base: "quiet luxury brand imagery, warm off-white background (#FFF8EF), soft natural daylight from one side, minimal composition with vast negative space, single subject, matte textures — raw linen, unglazed ceramic, brushed brass, muted blush drape (#EDCCBE), 3:4 vertical crop, editorial still life, restrained and expensive"
-- negative: "glossy reflection, gold gradient, sparkle, bokeh, busy background, multiple products, drop shadow, rounded corners, saturated colors, stock photo styling, text overlay, logo"
-- 注:出图只交代「材质 + 光」两件事——写清材质(亚麻 / 未上釉陶 / 黄铜 / 丝绒)与光的方向(单侧自然光),别写形容词(高级 / 奢华 / 优雅),那些词只会换来水晶和金色渐变。

package/assets/design-styles/riso-print.md

@@ -1,116 +0,0 @@
----
-name: 复古印刷
-description: Riso 孔版双色印刷——真实油墨色、网点纹理、轻微套印错位,独立 zine 的粗粝浪漫
-name_en: "Riso Print"
-description_en: "Two-color Risograph printing: real ink colors, halftone texture and slight misregistration. The rough romance of an indie zine."
-suits: "生图插画 · 活动推广"
-colors:
-  paper: "#F3EEE2"
-  ink-blue: "#0078BF"
-  ink-pink: "#FF48B0"
-  ink-orange: "#FF6C2F"
-  ink-black: "#1A1A1A"
-fonts:
-  cjk: sans
-typography:
-  headline:
-    latin: "'Cooper Hewitt', 'GT Pressura'"
-    fontSize: "44px"
-    fontWeight: 700
-  body:
-    fontSize: "16px"
-    lineHeight: 1.55
-    measure: "56ch"
-    fontWeight: 400
-  mono:
-    latin: "'IBM Plex Mono'"
-    fontWeight: 400
-border:
-  width: "0px"
-  style: solid
-  emphasis: "0px"
-rounded:
-  none: 0px
-spacing:
-  unit: 8px
-omitted: ["Components"]
-imagery:
-  ratio: "1:1"
-  treatment: halftone
-  crop: hard
-icon:
-  style: solid
-  strokeWidth: "2px"
-  linecap: butt
-  corner: sharp
----
-
-## Overview
-
-参照物:80 年代大学讲义的油印质感、独立出版 zine、日本 riso 工作室的双色海报。
-Riso 的美学全部来自限制:一次只印一色、油墨半透明、套印会错位、实色会有网点。
-选两个油墨色,把这些「缺陷」当作语言,粗粝但被精心控制。
-
-## Colors
-
-- **paper (#F3EEE2)**:再生纸的米黄底。
-- 油墨四选二:**ink-blue (#0078BF)**、**ink-pink (#FF48B0)**、**ink-orange (#FF6C2F)**、**ink-black (#1A1A1A)**——蓝/粉/橙是真实 riso 油墨的标准色号,别自调;黑刻意用近黑(纯黑在纸上并不存在)。
-- 双色叠印出第三色(蓝×粉=深紫调),是免费的丰富度;大面积实色要带网点感(50-80% 网点)。
-- 一图恒定两油墨 + 纸色,没有例外。
-
-## Typography
-
-- 粗壮的印刷感无衬线(拉丁 Cooper Hewitt/GT Pressura 一路,中文系统黑体 Bold:苹方 / 微软雅黑,思源黑体兜底);等宽字体做编号、日期等「档案感」信息;中文没有等宽族,夹在里面的汉字兜到系统黑体。
-- 文字直接用油墨色印,大标题可做 1-2px 的套印错位(两色版本轻微offset)。
-
-## Layout
-
-- 版面像印刷品不像屏幕:通栏大标题、粗规矩的分栏、页码页眉一应俱全。
-- 图像处理成单色网点版(halftone)再套油墨色;照片不以全彩出现。
-- 大色块 + 反白字是 riso 的强项,敢用。
-
-## Elevation & Depth
-
-孔版印刷是单层纸,**物理上不存在深度**。层级全部由工艺提供,三样:
-
-1. **叠印**:两个油墨色的重叠区自然生成第三色(蓝 × 粉 = 深紫调)。重叠区是画面上最「重」
-   的地方——主体压在哪里,哪里就是视觉中心。
-2. **网点密度**:这是它的明度台阶。**80% 网点比 50% 重**;同一个油墨色靠 30 / 50 / 80 三档网点
-   就能拉出三个层级,不用另调颜色。
-3. **纸色留白**:未上墨的 paper `#F3EEE2` 恒为最底层,也是唯一的「后退」手段。
-
-Don't:任何 box-shadow(油印做不出投影,加了立刻变数字味);用半透明模拟层次
-(油墨是**叠印**不是混色,半透明会出中间灰,而 riso 没有灰)。
-
-## Shapes
-
-形状语言 = **制版印得出来的东西**:实心块、粗线、网点面。
-
-- **圆角恒 0**(`rounded.none`);`border.width: 0` 是认真的——这个风格**不描边**,
-  形状靠色块自身的边界成立。
-- **线条**:最细 2px(1px 线在油印上会断),端点 butt、直角相交;**不用虚线**
-  (虚线遇上套印错位会碎成乱点)。
-- **边缘允许 1-2px 的套印错位**,这是形状语言的一部分,不是瑕疵——但整张图错位方向要一致。
-- **允许的形状**:矩形、正圆、粗箭头、网点密度渐变带。不用细腻曲线与小圆角,制版分辨率吃不下。
-- **图标**:跟着制版走——**实心块造形**,不描细边;非画线不可时最细 2px、端点 butt、直角相交。
-  线描图标印不出来:1px 的边在纸上会断,套印一错位就碎。
-
-## Do's and Don'ts
-
-- Don't:超过两个油墨色;渐变(riso 的「渐变」只能是网点密度渐变)。
-- Don't:假做旧滤镜(划痕、咖啡渍、揉纸效果)——riso 的旧来自工艺,不来自贴图。
-- Don't:光滑的数字纯色平涂;实色区域必须有油墨的不均匀与网点。
-- Don't:细字重(300 以下)——油印糊掉细节,细字是工艺不允许的。
-- Do:套印错位控制在「刚能察觉」的程度(1-2px),错太多是印坏了。
-- Do:利用叠印色做层次:两色 + 叠印色 + 纸色 = 四个层级,够用。
-
-## Composition
-
-- 海报:一个网点化的大图像主体 + 通栏粗标题 + 档案感小字(编号/日期),像一页被认真印出来的 zine。
-- 图解:粗线条图形 + 网点填充,标注用等宽字体。
-
-## Image Prompt Templates
-
-- base: "risograph print poster, two-ink design in riso blue (#0078BF) and fluorescent pink (#FF48B0) on off-white recycled paper (#F3EEE2), visible halftone dots, slight registration misalignment, ink overprint creating a third color, bold chunky sans-serif typography, grainy ink texture, independent zine aesthetic, 1980s duplicator print"
-- negative: "full color photo, smooth digital flat color, gradient, fake vintage scratches and coffee stains, thin delicate typography, glossy, 3D"
-- 注:换油墨组合时同步改 base 里的两个色名与 hex;两色纪律写死在描述里("exactly two ink colors")。

package/assets/design-styles/soft-friendly.md

@@ -1,174 +0,0 @@
----
-name: 圆融亲和
-description: 消费品与教育产品的温软圆润——奶白底、珊瑚与薄荷、大圆角,亲切但不幼稚
-name_en: "Soft & Friendly"
-description_en: "The soft roundness of consumer and education products: milk-white ground, coral and mint, and generous corners. Warm without being childish."
-suits: "工具产品 · 品牌门面"
-colors:
-  cream: "#FFFDF8"
-  ink: "#3A4254"
-  coral: "#F97A6C"
-  mint: "#7FD8BE"
-  butter: "#FFD98E"
-  line: "#E8E2D6"
-fonts:
-  latin: "'Nunito'"
-  cjk: rounded
-typography:
-  headline:
-    latin: "'Nunito', 'Quicksand'"
-    fontSize: "24px"
-    fontWeight: 700
-  body:
-    fontSize: "16px"
-    lineHeight: 1.75
-    measure: "50ch"
-    fontWeight: 400
-  label:
-    fontWeight: 600
-border:
-  width: "1px"
-  style: solid
-  emphasis: "2px"
-rounded:
-  md: 12px
-  lg: 20px
-  full: 999px
-spacing:
-  unit: 8px
-imagery:
-  ratio: "1:1"
-  treatment: none
-  crop: rounded
-icon:
-  style: line
-  strokeWidth: "2px"
-  linecap: round
-  corner: round
-components:
-  card:
-    backgroundColor: "{colors.cream}"
-    textColor: "{colors.ink}"
-    typography: "{typography.body}"
-    rounded: "{rounded.lg}"
-    padding: "24px"
-  button-primary:
-    backgroundColor: "{colors.coral}"
-    textColor: "{colors.ink}"
-    typography: "{typography.label}"
-    rounded: "{rounded.full}"
-    height: "44px"
-    padding: "24px"
-  button-secondary:
-    backgroundColor: "{colors.mint}"
-    textColor: "{colors.ink}"
-    typography: "{typography.label}"
-    rounded: "{rounded.full}"
-    height: "44px"
-    padding: "24px"
-  input-field:
-    backgroundColor: "{colors.cream}"
-    textColor: "{colors.ink}"
-    typography: "{typography.body}"
-    rounded: "{rounded.md}"
-    height: "44px"
-    padding: "16px"
-  tag:
-    backgroundColor: "{colors.butter}"
-    textColor: "{colors.ink}"
-    typography: "{typography.label}"
-    rounded: "{rounded.full}"
-    height: "28px"
-    padding: "12px"
-  avatar:
-    rounded: "{rounded.full}"
-    size: "40px"
----
-
-## Overview
-
-参照物:做得体面的儿童教育 App、健康食品包装、日系文具品牌。
-圆是这个风格的核心词:圆角、圆形色块、圆头线条、圆润字体。
-但「亲和」靠的是低饱和的暖色与充足留白——饱和度一拉高就成了廉价玩具。
-
-## Colors
-
-- **cream (#FFFDF8)**:奶白底,暖而不黄。
-- **ink (#3A4254)**:蓝灰墨色文字——比纯黑柔和,是「不幼稚」的关键一票。
-- **coral (#F97A6C)**:珊瑚主色,按钮与重点。
-- **mint (#7FD8BE) / butter (#FFD98E)**:薄荷与奶油黄,辅助色块与插画配色。
-- **line (#E8E2D6)**:温暖的描边与分隔线。
-- 配色纪律:一图一主色(coral),辅助色出现在插画与小标签里;三彩色齐上阵的场合要拉开面积比例。
-
-## Typography
-
-- 圆体系:拉丁 Nunito/Quicksand,中文走系统圆体(圆体-简),取不到再落苹方 / 微软雅黑 —— 圆黑更佳;标题 700 但字号别过大——这个风格音量是中等的。
-- 全部字色用 ink 蓝灰,彩色文字只出现在标签胶囊里。
-
-## Layout
-
-- 圆角统一档位:卡片 20px、按钮胶囊、小元素 12px——**同屏别混第三种圆角**。
-- 元素之间留白充足(16px 起步),挤密与亲和不共存。
-- 插画风格:圆头粗线 + 平涂 + 少量脸部表情(两点一线的极简脸,不是大眼萌系)。
-
-## Elevation & Depth
-
-允许**一层**柔投影,且**只有一层**——这是「亲和」与「廉价果冻感」的分界线。
-
-- **卡片是唯一投影的地方**:key 阴影 `0 1px 2px rgba(58,66,84,0.30)` +
-  ambient 阴影 `0 2px 6px 2px rgba(58,66,84,0.15)`。
-- **柔投影本质是两层**:近而实的 key + 远而散的 ambient,只画一层会显得硬。
-  (依据:Material 3 每一档 elevation 都是 key 0.3 + ambient 0.15 两层;
-  Adobe Spectrum 2 逐字说是 key + ambient + transition 三层。)
-- **阴影色取 ink 蓝灰 `#3A4254`,不是纯黑**——纯黑投影落在奶白底 `#FFFDF8` 上会发灰发脏。
-- **按钮不投影**。按钮的分量来自 coral 实色本身,不来自浮起。
-- **按下 = 背景色加深一档**(coral → 约 `#E86657`),不是加深阴影、不是位移。
-
-Don't:卡片里套卡片;多层投影堆出立体按钮。
-
-## Shapes
-
-形状语言 = **圆**:圆角、圆形色块、圆头线条、圆润字体,四件事说的是同一个词。
-
-- **三档分工**:`md 12px` 给输入框/标签/小元素,`lg 20px` 给卡片与图片,
-  `full 999px` **只给按钮胶囊、头像、圆点**——**矩形卡片永远不许用 full**。
-- **同心嵌套**:外圆角 − 内边距 = 内圆角(M3 optical roundness / Apple HIG concentricity)。
-  20px 圆角的卡片 + 8px 内边距 ⇒ 内层元素正好 12px(`md` 档);内边距要开到 16px 时,
-  内层就别再套带底色的容器,直接裸放内容,免得出现第四种圆角。
-- **线条**:1.5-2px,端点 **round**(`stroke-linecap: round`),贯彻到图标、箭头、下划线、
-  图表线——出现一个平头端点就破功。
-- **允许的形状**:圆角矩形、正圆、胶囊、圆头弧线与波浪。**不出现锐角三角形**;
-  需要箭头时用圆头折线代替三角箭头。
-- **图标**:线性圆头,2px 描边、端点与转角**都是 round**,24px 网格上画;实心图标和锐角三角
-  一个下场——一出现就硬了。
-
-## Components
-
-- **按钮**:44px 高胶囊 + 左右 24px 内边距,coral 实色 + **ink 字**。
-  白字在 coral 上只有 2.6:1,ink 是 3.8:1(16px / 600 字重按大文本判定达标)——所以按钮字用 ink。
-- **按钮交互**:hover 背景提亮约 8%,按下背景加深一档(约 `#E86657`);两态都不动阴影、不动位置。
-- **输入框**:44px 高、**12px 圆角(不用胶囊)**——胶囊输入框会让光标起始位置变得暧昧;
-  cream 底 + 1px line 描边,聚焦时描边换 coral 并加粗到 2px。
-- **卡片**:20px 圆角 + 24px 内边距 + 唯一那层柔投影,卡片之间至少 16px。
-- **标签**:28px 胶囊,butter 或 mint 底 + ink 字,一屏 ≤3 个。
-- **头像**:正圆 40px,不加描边不加投影。
-
-## Do's and Don'ts
-
-- Don't:高饱和彩虹全家桶(纯红纯蓝纯黄挤一屏)。
-- Don't:大眼睛萌系吉祥物、emoji 表情当插画。
-- Don't:投影堆叠的「果冻感」立体按钮;浮起感最多一层淡投影。
-- Don't:纯黑文字、锐利直角元素乱入。
-- Do:圆头线条(stroke linecap round)贯彻到图标、箭头、下划线。
-- Do:用留白与淡色线维持秩序,亲和的底子是整洁。
-
-## Composition
-
-- 界面/卡片:奶白底 + 圆角卡 + 一个珊瑚色主按钮,插画点缀在角落不抢主体。
-- 插画场景:主角居中、配角环绕,地面用一条 mint 或 butter 的圆角色带交代。
-
-## Image Prompt Templates
-
-- base: "friendly rounded illustration style, warm cream background (#FFFDF8), soft coral (#F97A6C) and mint (#7FD8BE) palette with muted saturation, thick round-capped outlines in blue-gray (#3A4254), generous rounded corners, simple dot-eyes minimal faces, clean and airy layout, tasteful children's-education-app aesthetic, flat with at most one soft shadow"
-- negative: "oversaturated rainbow colors, big anime eyes mascot, emoji, jelly 3D buttons, harsh black outlines, cluttered layout, sharp corners"
-- 注:饱和度是这个风格的生死线——描述里保留 "muted saturation";出图太艳就再加 "pastel, low saturation"。