/* SNS 餐饮供应商 Web · 青瓷绿 · V2.3 */
/* Layer 01: raw palette. Layer 02: semantic colors and gradients. */
:root[data-theme="celadon"] {
  /* Layer 01 · 基础色板 */
  --palette-brand-50: #F0FAF7;
  --palette-brand-100: #DCF1EB;
  --palette-brand-200: #B9E3D7;
  --palette-brand-300: #8ACDBD;
  --palette-brand-400: #54AF9A;
  --palette-brand-500: #2D9581;
  --palette-brand-600: #147D70;
  --palette-brand-700: #12665D;
  --palette-brand-800: #14534C;
  --palette-brand-900: #14453F;
  --palette-brand-950: #092C29;
  --palette-neutral-0: #FFFFFF;
  --palette-neutral-50: #F5F7F7;
  --palette-neutral-100: #EDF1F0;
  --palette-neutral-200: #DDE4E2;
  --palette-neutral-300: #BECAC7;
  --palette-neutral-400: #8B9C97;
  --palette-neutral-500: #657771;
  --palette-neutral-600: #51625D;
  --palette-neutral-700: #3F504B;
  --palette-neutral-800: #2B3B36;
  --palette-neutral-900: #1A2924;
  --palette-neutral-950: #101C18;
  --palette-accent-50: #EDF3FF;
  --palette-accent-100: #DBE7FC;
  --palette-accent-200: #BFD0F0;
  --palette-accent-300: #9DB6E4;
  --palette-accent-400: #7598D1;
  --palette-accent-500: #547DC0;
  --palette-accent-600: #426EB2;
  --palette-accent-700: #375FA4;
  --palette-accent-800: #2B4C83;
  --palette-accent-900: #253F68;
  --palette-accent-950: #162745;
  --palette-green-50: #EAF5EE;
  --palette-green-100: #D8EDDF;
  --palette-green-200: #B8DCC6;
  --palette-green-300: #8AC4A4;
  --palette-green-400: #5BA77F;
  --palette-green-500: #3D8C64;
  --palette-green-600: #2D8059;
  --palette-green-700: #23754F;
  --palette-green-800: #1D5B40;
  --palette-green-900: #184B36;
  --palette-green-950: #0C2D20;
  --palette-amber-50: #FFF5DE;
  --palette-amber-100: #F9E8BE;
  --palette-amber-200: #EACD8B;
  --palette-amber-300: #DCB35A;
  --palette-amber-400: #C99835;
  --palette-amber-500: #B38124;
  --palette-amber-600: #A1701B;
  --palette-amber-700: #8B5D12;
  --palette-amber-800: #704A12;
  --palette-amber-900: #583B12;
  --palette-amber-950: #342309;
  --palette-red-50: #FCEEF0;
  --palette-red-100: #F8DCE0;
  --palette-red-200: #F1BEC4;
  --palette-red-300: #E99AA4;
  --palette-red-400: #DB727F;
  --palette-red-500: #CD5765;
  --palette-red-600: #C04752;
  --palette-red-700: #B13F45;
  --palette-red-800: #8F3039;
  --palette-red-900: #732C33;
  --palette-red-950: #44171E;
  --palette-blue-50: #EDF3FF;
  --palette-blue-100: #DBE7FC;
  --palette-blue-200: #BFD0F0;
  --palette-blue-300: #9DB6E4;
  --palette-blue-400: #7598D1;
  --palette-blue-500: #547DC0;
  --palette-blue-600: #426EB2;
  --palette-blue-700: #375FA4;
  --palette-blue-800: #2B4C83;
  --palette-blue-900: #253F68;
  --palette-blue-950: #162745;

  /* Layer 02 · 纯色语义引用 */
  --color-text-primary: var(--palette-neutral-900); /* 主要文字 */
  --color-text-secondary: var(--palette-neutral-600); /* 次要文字 */
  --color-text-tertiary: var(--palette-neutral-500); /* 辅助文字 */
  --color-text-disabled: var(--palette-neutral-400); /* 禁用文字 */
  --color-text-inverse: var(--palette-neutral-0); /* 反色文字 */
  --color-text-inverse-muted: var(--palette-brand-200); /* 反色辅助文字 */
  --color-text-brand: var(--palette-brand-700); /* 品牌强调文字 */
  --color-bg-page: var(--palette-neutral-50); /* 页面背景 */
  --color-bg-surface: var(--palette-neutral-0); /* 内容表面 */
  --color-bg-subtle: var(--palette-neutral-100); /* 浅层背景 */
  --color-bg-input: var(--palette-neutral-0); /* 输入区域背景 */
  --color-bg-hover: var(--palette-brand-50); /* 悬停背景 */
  --color-bg-selected: var(--palette-brand-100); /* 选中背景 */
  --color-bg-disabled: var(--palette-neutral-100); /* 禁用背景 */
  --color-bg-emphasis: var(--palette-brand-950); /* 重点背景 */
  --color-bg-overlay: var(--palette-neutral-950); /* 遮罩基色 */
  --color-border-default: var(--palette-neutral-200); /* 普通边框 */
  --color-border-subtle: var(--palette-neutral-100); /* 弱分割线 */
  --color-border-input: var(--palette-neutral-500); /* 输入框边界 */
  --color-border-focus: var(--palette-brand-600); /* 聚焦边界 */
  --color-border-selected: var(--palette-brand-600); /* 选中边界 */
  --color-border-disabled: var(--palette-neutral-200); /* 禁用边界 */
  --color-border-error: var(--palette-red-700); /* 错误边界 */
  --color-action-primary: var(--palette-brand-600); /* 主操作默认 */
  --color-action-hover: var(--palette-brand-700); /* 主操作悬停 */
  --color-action-active: var(--palette-brand-800); /* 主操作按下 */
  --color-action-on-primary: var(--palette-neutral-0); /* 主操作文字 */
  --color-action-secondary: var(--palette-brand-100); /* 次级操作底色 */
  --color-action-secondary-hover: var(--palette-brand-200); /* 次级操作悬停 */
  --color-action-secondary-active: var(--palette-brand-300); /* 次级操作按下 */
  --color-action-on-secondary: var(--palette-brand-900); /* 次级操作文字 */
  --color-action-link: var(--palette-brand-700); /* 文字链接 */
  --color-action-link-hover: var(--palette-brand-800); /* 链接悬停 */
  --color-action-link-active: var(--palette-brand-900); /* 链接按下 */
  --color-action-disabled: var(--palette-neutral-100); /* 禁用操作背景 */
  --color-interaction-focus-ring: var(--palette-brand-600); /* 焦点环 */
  --color-interaction-selection-bg: var(--palette-brand-200); /* 文本选择背景 */
  --color-interaction-selection-text: var(--palette-brand-950); /* 文本选择文字 */
  --color-interaction-checked-bg: var(--palette-brand-600); /* 勾选背景 */
  --color-interaction-checked-mark: var(--palette-neutral-0); /* 勾选标记 */
  --color-interaction-track: var(--palette-neutral-500); /* 未选控件边界 */
  --color-icon-primary: var(--palette-neutral-700); /* 主要图标 */
  --color-icon-secondary: var(--palette-neutral-500); /* 次要图标 */
  --color-icon-brand: var(--palette-brand-700); /* 选中图标 */
  --color-icon-disabled: var(--palette-neutral-400); /* 禁用图标 */
  --color-status-success-text: var(--palette-green-700); /* 成功 · 状态文字 */
  --color-status-success-bg: var(--palette-green-50); /* 成功 · 状态浅底 */
  --color-status-success-border: var(--palette-green-200); /* 成功 · 状态弱边框 */
  --color-status-success-solid: var(--palette-green-700); /* 成功 · 状态实色 */
  --color-status-success-hover: var(--palette-green-800); /* 成功 · 实色悬停 */
  --color-status-success-active: var(--palette-green-900); /* 成功 · 实色按下 */
  --color-status-success-on-solid: var(--palette-neutral-0); /* 成功 · 实色文字 */
  --color-status-warning-text: var(--palette-amber-700); /* 警告 · 状态文字 */
  --color-status-warning-bg: var(--palette-amber-50); /* 警告 · 状态浅底 */
  --color-status-warning-border: var(--palette-amber-200); /* 警告 · 状态弱边框 */
  --color-status-warning-solid: var(--palette-amber-700); /* 警告 · 状态实色 */
  --color-status-warning-hover: var(--palette-amber-800); /* 警告 · 实色悬停 */
  --color-status-warning-active: var(--palette-amber-900); /* 警告 · 实色按下 */
  --color-status-warning-on-solid: var(--palette-neutral-0); /* 警告 · 实色文字 */
  --color-status-error-text: var(--palette-red-700); /* 错误 · 状态文字 */
  --color-status-error-bg: var(--palette-red-50); /* 错误 · 状态浅底 */
  --color-status-error-border: var(--palette-red-200); /* 错误 · 状态弱边框 */
  --color-status-error-solid: var(--palette-red-700); /* 错误 · 状态实色 */
  --color-status-error-hover: var(--palette-red-800); /* 错误 · 实色悬停 */
  --color-status-error-active: var(--palette-red-900); /* 错误 · 实色按下 */
  --color-status-error-on-solid: var(--palette-neutral-0); /* 错误 · 实色文字 */
  --color-status-info-text: var(--palette-blue-700); /* 信息 · 状态文字 */
  --color-status-info-bg: var(--palette-blue-50); /* 信息 · 状态浅底 */
  --color-status-info-border: var(--palette-blue-200); /* 信息 · 状态弱边框 */
  --color-status-info-solid: var(--palette-blue-700); /* 信息 · 状态实色 */
  --color-status-info-hover: var(--palette-blue-800); /* 信息 · 实色悬停 */
  --color-status-info-active: var(--palette-blue-900); /* 信息 · 实色按下 */
  --color-status-info-on-solid: var(--palette-neutral-0); /* 信息 · 实色文字 */
  --color-status-neutral-text: var(--palette-neutral-600); /* 中性 · 状态文字 */
  --color-status-neutral-bg: var(--palette-neutral-100); /* 中性 · 状态浅底 */
  --color-status-neutral-border: var(--palette-neutral-200); /* 中性 · 状态边框 */

  /* Layer 02 · 主题渐变（用于 background-image，直接引用基础色板） */
  --gradient-theme-start: var(--palette-brand-600); /* Figma 渐变参数：主题色渐变起点 */
  --gradient-theme-end: var(--palette-accent-700); /* Figma 渐变参数：主题色渐变终点 */
  --gradient-theme-light-start: var(--palette-brand-200); /* Figma 渐变参数：浅色主题渐变起点 */
  --gradient-theme-light-end: var(--palette-accent-200); /* Figma 渐变参数：浅色主题渐变终点 */
  --gradient-direction-horizontal: 90deg; /* Figma 渐变参数：水平角度（CSS 度数） */
  --gradient-direction-vertical: 180deg; /* Figma 渐变参数：垂直角度（CSS 度数） */
  --gradient-stop-start: 0%; /* Figma 渐变参数：起点位置（0–1 比例） */
  --gradient-stop-end: 100%; /* Figma 渐变参数：终点位置（0–1 比例） */
  --gradient-theme-horizontal: linear-gradient(90deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 水平 */
  --gradient-theme-vertical: linear-gradient(180deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 垂直 */
  --gradient-theme-light-horizontal: linear-gradient(90deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 水平 */
  --gradient-theme-light-vertical: linear-gradient(180deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 垂直 */
  --motion-duration: 180ms;
}

/* SNS 餐饮供应商 Web · 鲜蔬橄榄 · V2.3 */
/* Layer 01: raw palette. Layer 02: semantic colors and gradients. */
:root[data-theme="olive"] {
  /* Layer 01 · 基础色板 */
  --palette-brand-50: #F7F9EE;
  --palette-brand-100: #EDF1D7;
  --palette-brand-200: #DCE4B2;
  --palette-brand-300: #C3CF82;
  --palette-brand-400: #A5B557;
  --palette-brand-500: #879B3B;
  --palette-brand-600: #64752C;
  --palette-brand-700: #505E26;
  --palette-brand-800: #424D23;
  --palette-brand-900: #384020;
  --palette-brand-950: #242B12;
  --palette-neutral-0: #FFFFFF;
  --palette-neutral-50: #F8F8F4;
  --palette-neutral-100: #F0F0E9;
  --palette-neutral-200: #E3E4DA;
  --palette-neutral-300: #CACCBF;
  --palette-neutral-400: #969B88;
  --palette-neutral-500: #6C735F;
  --palette-neutral-600: #565E4B;
  --palette-neutral-700: #444C3B;
  --palette-neutral-800: #30382A;
  --palette-neutral-900: #222A1D;
  --palette-neutral-950: #161C12;
  --palette-accent-50: #EAF5EE;
  --palette-accent-100: #D8EDDF;
  --palette-accent-200: #B8DCC6;
  --palette-accent-300: #8AC4A4;
  --palette-accent-400: #5BA77F;
  --palette-accent-500: #3D8C64;
  --palette-accent-600: #2D8059;
  --palette-accent-700: #23754F;
  --palette-accent-800: #1D5B40;
  --palette-accent-900: #184B36;
  --palette-accent-950: #0C2D20;
  --palette-green-50: #EAF5EE;
  --palette-green-100: #D8EDDF;
  --palette-green-200: #B8DCC6;
  --palette-green-300: #8AC4A4;
  --palette-green-400: #5BA77F;
  --palette-green-500: #3D8C64;
  --palette-green-600: #2D8059;
  --palette-green-700: #23754F;
  --palette-green-800: #1D5B40;
  --palette-green-900: #184B36;
  --palette-green-950: #0C2D20;
  --palette-amber-50: #FFF5DE;
  --palette-amber-100: #F9E8BE;
  --palette-amber-200: #EACD8B;
  --palette-amber-300: #DCB35A;
  --palette-amber-400: #C99835;
  --palette-amber-500: #B38124;
  --palette-amber-600: #A1701B;
  --palette-amber-700: #8B5D12;
  --palette-amber-800: #704A12;
  --palette-amber-900: #583B12;
  --palette-amber-950: #342309;
  --palette-red-50: #FCEEF0;
  --palette-red-100: #F8DCE0;
  --palette-red-200: #F1BEC4;
  --palette-red-300: #E99AA4;
  --palette-red-400: #DB727F;
  --palette-red-500: #CD5765;
  --palette-red-600: #C04752;
  --palette-red-700: #B13F45;
  --palette-red-800: #8F3039;
  --palette-red-900: #732C33;
  --palette-red-950: #44171E;
  --palette-blue-50: #EDF3FF;
  --palette-blue-100: #DBE7FC;
  --palette-blue-200: #BFD0F0;
  --palette-blue-300: #9DB6E4;
  --palette-blue-400: #7598D1;
  --palette-blue-500: #547DC0;
  --palette-blue-600: #426EB2;
  --palette-blue-700: #375FA4;
  --palette-blue-800: #2B4C83;
  --palette-blue-900: #253F68;
  --palette-blue-950: #162745;

  /* Layer 02 · 纯色语义引用 */
  --color-text-primary: var(--palette-neutral-900); /* 主要文字 */
  --color-text-secondary: var(--palette-neutral-600); /* 次要文字 */
  --color-text-tertiary: var(--palette-neutral-500); /* 辅助文字 */
  --color-text-disabled: var(--palette-neutral-400); /* 禁用文字 */
  --color-text-inverse: var(--palette-neutral-0); /* 反色文字 */
  --color-text-inverse-muted: var(--palette-brand-200); /* 反色辅助文字 */
  --color-text-brand: var(--palette-brand-700); /* 品牌强调文字 */
  --color-bg-page: var(--palette-neutral-50); /* 页面背景 */
  --color-bg-surface: var(--palette-neutral-0); /* 内容表面 */
  --color-bg-subtle: var(--palette-neutral-100); /* 浅层背景 */
  --color-bg-input: var(--palette-neutral-0); /* 输入区域背景 */
  --color-bg-hover: var(--palette-brand-50); /* 悬停背景 */
  --color-bg-selected: var(--palette-brand-100); /* 选中背景 */
  --color-bg-disabled: var(--palette-neutral-100); /* 禁用背景 */
  --color-bg-emphasis: var(--palette-brand-950); /* 重点背景 */
  --color-bg-overlay: var(--palette-neutral-950); /* 遮罩基色 */
  --color-border-default: var(--palette-neutral-200); /* 普通边框 */
  --color-border-subtle: var(--palette-neutral-100); /* 弱分割线 */
  --color-border-input: var(--palette-neutral-500); /* 输入框边界 */
  --color-border-focus: var(--palette-brand-600); /* 聚焦边界 */
  --color-border-selected: var(--palette-brand-600); /* 选中边界 */
  --color-border-disabled: var(--palette-neutral-200); /* 禁用边界 */
  --color-border-error: var(--palette-red-700); /* 错误边界 */
  --color-action-primary: var(--palette-brand-600); /* 主操作默认 */
  --color-action-hover: var(--palette-brand-700); /* 主操作悬停 */
  --color-action-active: var(--palette-brand-800); /* 主操作按下 */
  --color-action-on-primary: var(--palette-neutral-0); /* 主操作文字 */
  --color-action-secondary: var(--palette-brand-100); /* 次级操作底色 */
  --color-action-secondary-hover: var(--palette-brand-200); /* 次级操作悬停 */
  --color-action-secondary-active: var(--palette-brand-300); /* 次级操作按下 */
  --color-action-on-secondary: var(--palette-brand-900); /* 次级操作文字 */
  --color-action-link: var(--palette-brand-700); /* 文字链接 */
  --color-action-link-hover: var(--palette-brand-800); /* 链接悬停 */
  --color-action-link-active: var(--palette-brand-900); /* 链接按下 */
  --color-action-disabled: var(--palette-neutral-100); /* 禁用操作背景 */
  --color-interaction-focus-ring: var(--palette-brand-600); /* 焦点环 */
  --color-interaction-selection-bg: var(--palette-brand-200); /* 文本选择背景 */
  --color-interaction-selection-text: var(--palette-brand-950); /* 文本选择文字 */
  --color-interaction-checked-bg: var(--palette-brand-600); /* 勾选背景 */
  --color-interaction-checked-mark: var(--palette-neutral-0); /* 勾选标记 */
  --color-interaction-track: var(--palette-neutral-500); /* 未选控件边界 */
  --color-icon-primary: var(--palette-neutral-700); /* 主要图标 */
  --color-icon-secondary: var(--palette-neutral-500); /* 次要图标 */
  --color-icon-brand: var(--palette-brand-700); /* 选中图标 */
  --color-icon-disabled: var(--palette-neutral-400); /* 禁用图标 */
  --color-status-success-text: var(--palette-green-700); /* 成功 · 状态文字 */
  --color-status-success-bg: var(--palette-green-50); /* 成功 · 状态浅底 */
  --color-status-success-border: var(--palette-green-200); /* 成功 · 状态弱边框 */
  --color-status-success-solid: var(--palette-green-700); /* 成功 · 状态实色 */
  --color-status-success-hover: var(--palette-green-800); /* 成功 · 实色悬停 */
  --color-status-success-active: var(--palette-green-900); /* 成功 · 实色按下 */
  --color-status-success-on-solid: var(--palette-neutral-0); /* 成功 · 实色文字 */
  --color-status-warning-text: var(--palette-amber-700); /* 警告 · 状态文字 */
  --color-status-warning-bg: var(--palette-amber-50); /* 警告 · 状态浅底 */
  --color-status-warning-border: var(--palette-amber-200); /* 警告 · 状态弱边框 */
  --color-status-warning-solid: var(--palette-amber-700); /* 警告 · 状态实色 */
  --color-status-warning-hover: var(--palette-amber-800); /* 警告 · 实色悬停 */
  --color-status-warning-active: var(--palette-amber-900); /* 警告 · 实色按下 */
  --color-status-warning-on-solid: var(--palette-neutral-0); /* 警告 · 实色文字 */
  --color-status-error-text: var(--palette-red-700); /* 错误 · 状态文字 */
  --color-status-error-bg: var(--palette-red-50); /* 错误 · 状态浅底 */
  --color-status-error-border: var(--palette-red-200); /* 错误 · 状态弱边框 */
  --color-status-error-solid: var(--palette-red-700); /* 错误 · 状态实色 */
  --color-status-error-hover: var(--palette-red-800); /* 错误 · 实色悬停 */
  --color-status-error-active: var(--palette-red-900); /* 错误 · 实色按下 */
  --color-status-error-on-solid: var(--palette-neutral-0); /* 错误 · 实色文字 */
  --color-status-info-text: var(--palette-blue-700); /* 信息 · 状态文字 */
  --color-status-info-bg: var(--palette-blue-50); /* 信息 · 状态浅底 */
  --color-status-info-border: var(--palette-blue-200); /* 信息 · 状态弱边框 */
  --color-status-info-solid: var(--palette-blue-700); /* 信息 · 状态实色 */
  --color-status-info-hover: var(--palette-blue-800); /* 信息 · 实色悬停 */
  --color-status-info-active: var(--palette-blue-900); /* 信息 · 实色按下 */
  --color-status-info-on-solid: var(--palette-neutral-0); /* 信息 · 实色文字 */
  --color-status-neutral-text: var(--palette-neutral-600); /* 中性 · 状态文字 */
  --color-status-neutral-bg: var(--palette-neutral-100); /* 中性 · 状态浅底 */
  --color-status-neutral-border: var(--palette-neutral-200); /* 中性 · 状态边框 */

  /* Layer 02 · 主题渐变（用于 background-image，直接引用基础色板） */
  --gradient-theme-start: var(--palette-brand-600); /* Figma 渐变参数：主题色渐变起点 */
  --gradient-theme-end: var(--palette-accent-700); /* Figma 渐变参数：主题色渐变终点 */
  --gradient-theme-light-start: var(--palette-brand-200); /* Figma 渐变参数：浅色主题渐变起点 */
  --gradient-theme-light-end: var(--palette-accent-200); /* Figma 渐变参数：浅色主题渐变终点 */
  --gradient-direction-horizontal: 90deg; /* Figma 渐变参数：水平角度（CSS 度数） */
  --gradient-direction-vertical: 180deg; /* Figma 渐变参数：垂直角度（CSS 度数） */
  --gradient-stop-start: 0%; /* Figma 渐变参数：起点位置（0–1 比例） */
  --gradient-stop-end: 100%; /* Figma 渐变参数：终点位置（0–1 比例） */
  --gradient-theme-horizontal: linear-gradient(90deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 水平 */
  --gradient-theme-vertical: linear-gradient(180deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 垂直 */
  --gradient-theme-light-horizontal: linear-gradient(90deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 水平 */
  --gradient-theme-light-vertical: linear-gradient(180deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 垂直 */
  --motion-duration: 180ms;
}

/* SNS 餐饮供应商 Web · 雾海蓝 · V2.3 */
/* Layer 01: raw palette. Layer 02: semantic colors and gradients. */
:root[data-theme="harbor"] {
  /* Layer 01 · 基础色板 */
  --palette-brand-50: #F1F5FD;
  --palette-brand-100: #E4ECFA;
  --palette-brand-200: #CEDBF4;
  --palette-brand-300: #ACC1EA;
  --palette-brand-400: #86A3DC;
  --palette-brand-500: #6585CC;
  --palette-brand-600: #4263B8;
  --palette-brand-700: #355199;
  --palette-brand-800: #2F447D;
  --palette-brand-900: #2B3C65;
  --palette-brand-950: #17233D;
  --palette-neutral-0: #FFFFFF;
  --palette-neutral-50: #F5F7FA;
  --palette-neutral-100: #EDF0F5;
  --palette-neutral-200: #DDE3ED;
  --palette-neutral-300: #BEC8D8;
  --palette-neutral-400: #8D9CB3;
  --palette-neutral-500: #65758D;
  --palette-neutral-600: #526179;
  --palette-neutral-700: #414F65;
  --palette-neutral-800: #2E3C50;
  --palette-neutral-900: #1D2B3E;
  --palette-neutral-950: #111D2D;
  --palette-accent-50: #F0FAF7;
  --palette-accent-100: #DCF1EB;
  --palette-accent-200: #B9E3D7;
  --palette-accent-300: #8ACDBD;
  --palette-accent-400: #54AF9A;
  --palette-accent-500: #2D9581;
  --palette-accent-600: #147D70;
  --palette-accent-700: #12665D;
  --palette-accent-800: #14534C;
  --palette-accent-900: #14453F;
  --palette-accent-950: #092C29;
  --palette-green-50: #EAF5EE;
  --palette-green-100: #D8EDDF;
  --palette-green-200: #B8DCC6;
  --palette-green-300: #8AC4A4;
  --palette-green-400: #5BA77F;
  --palette-green-500: #3D8C64;
  --palette-green-600: #2D8059;
  --palette-green-700: #23754F;
  --palette-green-800: #1D5B40;
  --palette-green-900: #184B36;
  --palette-green-950: #0C2D20;
  --palette-amber-50: #FFF5DE;
  --palette-amber-100: #F9E8BE;
  --palette-amber-200: #EACD8B;
  --palette-amber-300: #DCB35A;
  --palette-amber-400: #C99835;
  --palette-amber-500: #B38124;
  --palette-amber-600: #A1701B;
  --palette-amber-700: #8B5D12;
  --palette-amber-800: #704A12;
  --palette-amber-900: #583B12;
  --palette-amber-950: #342309;
  --palette-red-50: #FCEEF0;
  --palette-red-100: #F8DCE0;
  --palette-red-200: #F1BEC4;
  --palette-red-300: #E99AA4;
  --palette-red-400: #DB727F;
  --palette-red-500: #CD5765;
  --palette-red-600: #C04752;
  --palette-red-700: #B13F45;
  --palette-red-800: #8F3039;
  --palette-red-900: #732C33;
  --palette-red-950: #44171E;
  --palette-blue-50: #EDF3FF;
  --palette-blue-100: #DBE7FC;
  --palette-blue-200: #BFD0F0;
  --palette-blue-300: #9DB6E4;
  --palette-blue-400: #7598D1;
  --palette-blue-500: #547DC0;
  --palette-blue-600: #426EB2;
  --palette-blue-700: #375FA4;
  --palette-blue-800: #2B4C83;
  --palette-blue-900: #253F68;
  --palette-blue-950: #162745;

  /* Layer 02 · 纯色语义引用 */
  --color-text-primary: var(--palette-neutral-900); /* 主要文字 */
  --color-text-secondary: var(--palette-neutral-600); /* 次要文字 */
  --color-text-tertiary: var(--palette-neutral-500); /* 辅助文字 */
  --color-text-disabled: var(--palette-neutral-400); /* 禁用文字 */
  --color-text-inverse: var(--palette-neutral-0); /* 反色文字 */
  --color-text-inverse-muted: var(--palette-brand-200); /* 反色辅助文字 */
  --color-text-brand: var(--palette-brand-700); /* 品牌强调文字 */
  --color-bg-page: var(--palette-neutral-50); /* 页面背景 */
  --color-bg-surface: var(--palette-neutral-0); /* 内容表面 */
  --color-bg-subtle: var(--palette-neutral-100); /* 浅层背景 */
  --color-bg-input: var(--palette-neutral-0); /* 输入区域背景 */
  --color-bg-hover: var(--palette-brand-50); /* 悬停背景 */
  --color-bg-selected: var(--palette-brand-100); /* 选中背景 */
  --color-bg-disabled: var(--palette-neutral-100); /* 禁用背景 */
  --color-bg-emphasis: var(--palette-brand-950); /* 重点背景 */
  --color-bg-overlay: var(--palette-neutral-950); /* 遮罩基色 */
  --color-border-default: var(--palette-neutral-200); /* 普通边框 */
  --color-border-subtle: var(--palette-neutral-100); /* 弱分割线 */
  --color-border-input: var(--palette-neutral-500); /* 输入框边界 */
  --color-border-focus: var(--palette-brand-600); /* 聚焦边界 */
  --color-border-selected: var(--palette-brand-600); /* 选中边界 */
  --color-border-disabled: var(--palette-neutral-200); /* 禁用边界 */
  --color-border-error: var(--palette-red-700); /* 错误边界 */
  --color-action-primary: var(--palette-brand-600); /* 主操作默认 */
  --color-action-hover: var(--palette-brand-700); /* 主操作悬停 */
  --color-action-active: var(--palette-brand-800); /* 主操作按下 */
  --color-action-on-primary: var(--palette-neutral-0); /* 主操作文字 */
  --color-action-secondary: var(--palette-brand-100); /* 次级操作底色 */
  --color-action-secondary-hover: var(--palette-brand-200); /* 次级操作悬停 */
  --color-action-secondary-active: var(--palette-brand-300); /* 次级操作按下 */
  --color-action-on-secondary: var(--palette-brand-900); /* 次级操作文字 */
  --color-action-link: var(--palette-brand-700); /* 文字链接 */
  --color-action-link-hover: var(--palette-brand-800); /* 链接悬停 */
  --color-action-link-active: var(--palette-brand-900); /* 链接按下 */
  --color-action-disabled: var(--palette-neutral-100); /* 禁用操作背景 */
  --color-interaction-focus-ring: var(--palette-brand-600); /* 焦点环 */
  --color-interaction-selection-bg: var(--palette-brand-200); /* 文本选择背景 */
  --color-interaction-selection-text: var(--palette-brand-950); /* 文本选择文字 */
  --color-interaction-checked-bg: var(--palette-brand-600); /* 勾选背景 */
  --color-interaction-checked-mark: var(--palette-neutral-0); /* 勾选标记 */
  --color-interaction-track: var(--palette-neutral-500); /* 未选控件边界 */
  --color-icon-primary: var(--palette-neutral-700); /* 主要图标 */
  --color-icon-secondary: var(--palette-neutral-500); /* 次要图标 */
  --color-icon-brand: var(--palette-brand-700); /* 选中图标 */
  --color-icon-disabled: var(--palette-neutral-400); /* 禁用图标 */
  --color-status-success-text: var(--palette-green-700); /* 成功 · 状态文字 */
  --color-status-success-bg: var(--palette-green-50); /* 成功 · 状态浅底 */
  --color-status-success-border: var(--palette-green-200); /* 成功 · 状态弱边框 */
  --color-status-success-solid: var(--palette-green-700); /* 成功 · 状态实色 */
  --color-status-success-hover: var(--palette-green-800); /* 成功 · 实色悬停 */
  --color-status-success-active: var(--palette-green-900); /* 成功 · 实色按下 */
  --color-status-success-on-solid: var(--palette-neutral-0); /* 成功 · 实色文字 */
  --color-status-warning-text: var(--palette-amber-700); /* 警告 · 状态文字 */
  --color-status-warning-bg: var(--palette-amber-50); /* 警告 · 状态浅底 */
  --color-status-warning-border: var(--palette-amber-200); /* 警告 · 状态弱边框 */
  --color-status-warning-solid: var(--palette-amber-700); /* 警告 · 状态实色 */
  --color-status-warning-hover: var(--palette-amber-800); /* 警告 · 实色悬停 */
  --color-status-warning-active: var(--palette-amber-900); /* 警告 · 实色按下 */
  --color-status-warning-on-solid: var(--palette-neutral-0); /* 警告 · 实色文字 */
  --color-status-error-text: var(--palette-red-700); /* 错误 · 状态文字 */
  --color-status-error-bg: var(--palette-red-50); /* 错误 · 状态浅底 */
  --color-status-error-border: var(--palette-red-200); /* 错误 · 状态弱边框 */
  --color-status-error-solid: var(--palette-red-700); /* 错误 · 状态实色 */
  --color-status-error-hover: var(--palette-red-800); /* 错误 · 实色悬停 */
  --color-status-error-active: var(--palette-red-900); /* 错误 · 实色按下 */
  --color-status-error-on-solid: var(--palette-neutral-0); /* 错误 · 实色文字 */
  --color-status-info-text: var(--palette-blue-700); /* 信息 · 状态文字 */
  --color-status-info-bg: var(--palette-blue-50); /* 信息 · 状态浅底 */
  --color-status-info-border: var(--palette-blue-200); /* 信息 · 状态弱边框 */
  --color-status-info-solid: var(--palette-blue-700); /* 信息 · 状态实色 */
  --color-status-info-hover: var(--palette-blue-800); /* 信息 · 实色悬停 */
  --color-status-info-active: var(--palette-blue-900); /* 信息 · 实色按下 */
  --color-status-info-on-solid: var(--palette-neutral-0); /* 信息 · 实色文字 */
  --color-status-neutral-text: var(--palette-neutral-600); /* 中性 · 状态文字 */
  --color-status-neutral-bg: var(--palette-neutral-100); /* 中性 · 状态浅底 */
  --color-status-neutral-border: var(--palette-neutral-200); /* 中性 · 状态边框 */

  /* Layer 02 · 主题渐变（用于 background-image，直接引用基础色板） */
  --gradient-theme-start: var(--palette-brand-600); /* Figma 渐变参数：主题色渐变起点 */
  --gradient-theme-end: var(--palette-accent-700); /* Figma 渐变参数：主题色渐变终点 */
  --gradient-theme-light-start: var(--palette-brand-200); /* Figma 渐变参数：浅色主题渐变起点 */
  --gradient-theme-light-end: var(--palette-accent-200); /* Figma 渐变参数：浅色主题渐变终点 */
  --gradient-direction-horizontal: 90deg; /* Figma 渐变参数：水平角度（CSS 度数） */
  --gradient-direction-vertical: 180deg; /* Figma 渐变参数：垂直角度（CSS 度数） */
  --gradient-stop-start: 0%; /* Figma 渐变参数：起点位置（0–1 比例） */
  --gradient-stop-end: 100%; /* Figma 渐变参数：终点位置（0–1 比例） */
  --gradient-theme-horizontal: linear-gradient(90deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 水平 */
  --gradient-theme-vertical: linear-gradient(180deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 垂直 */
  --gradient-theme-light-horizontal: linear-gradient(90deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 水平 */
  --gradient-theme-light-vertical: linear-gradient(180deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 垂直 */
  --motion-duration: 180ms;
}

/* SNS 餐饮供应商 Web · 陶土橙 · V2.3 */
/* Layer 01: raw palette. Layer 02: semantic colors and gradients. */
:root[data-theme="terracotta"] {
  /* Layer 01 · 基础色板 */
  --palette-brand-50: #FDF5F0;
  --palette-brand-100: #F9E7DB;
  --palette-brand-200: #F0CDB6;
  --palette-brand-300: #E7AB88;
  --palette-brand-400: #D98860;
  --palette-brand-500: #C96B46;
  --palette-brand-600: #AF5335;
  --palette-brand-700: #91432E;
  --palette-brand-800: #763A2B;
  --palette-brand-900: #613328;
  --palette-brand-950: #3A1E16;
  --palette-neutral-0: #FFFFFF;
  --palette-neutral-50: #F9F7F5;
  --palette-neutral-100: #F2EEEA;
  --palette-neutral-200: #E7DED7;
  --palette-neutral-300: #D1C1B6;
  --palette-neutral-400: #A28E80;
  --palette-neutral-500: #7D6B5E;
  --palette-neutral-600: #66564B;
  --palette-neutral-700: #524337;
  --palette-neutral-800: #3E3228;
  --palette-neutral-900: #2B231C;
  --palette-neutral-950: #1C1611;
  --palette-accent-50: #FFF5DE;
  --palette-accent-100: #F9E8BE;
  --palette-accent-200: #EACD8B;
  --palette-accent-300: #DCB35A;
  --palette-accent-400: #C99835;
  --palette-accent-500: #B38124;
  --palette-accent-600: #A1701B;
  --palette-accent-700: #8B5D12;
  --palette-accent-800: #704A12;
  --palette-accent-900: #583B12;
  --palette-accent-950: #342309;
  --palette-green-50: #EAF5EE;
  --palette-green-100: #D8EDDF;
  --palette-green-200: #B8DCC6;
  --palette-green-300: #8AC4A4;
  --palette-green-400: #5BA77F;
  --palette-green-500: #3D8C64;
  --palette-green-600: #2D8059;
  --palette-green-700: #23754F;
  --palette-green-800: #1D5B40;
  --palette-green-900: #184B36;
  --palette-green-950: #0C2D20;
  --palette-amber-50: #FFF5DE;
  --palette-amber-100: #F9E8BE;
  --palette-amber-200: #EACD8B;
  --palette-amber-300: #DCB35A;
  --palette-amber-400: #C99835;
  --palette-amber-500: #B38124;
  --palette-amber-600: #A1701B;
  --palette-amber-700: #8B5D12;
  --palette-amber-800: #704A12;
  --palette-amber-900: #583B12;
  --palette-amber-950: #342309;
  --palette-red-50: #FCEEF0;
  --palette-red-100: #F8DCE0;
  --palette-red-200: #F1BEC4;
  --palette-red-300: #E99AA4;
  --palette-red-400: #DB727F;
  --palette-red-500: #CD5765;
  --palette-red-600: #C04752;
  --palette-red-700: #B13F45;
  --palette-red-800: #8F3039;
  --palette-red-900: #732C33;
  --palette-red-950: #44171E;
  --palette-blue-50: #EDF3FF;
  --palette-blue-100: #DBE7FC;
  --palette-blue-200: #BFD0F0;
  --palette-blue-300: #9DB6E4;
  --palette-blue-400: #7598D1;
  --palette-blue-500: #547DC0;
  --palette-blue-600: #426EB2;
  --palette-blue-700: #375FA4;
  --palette-blue-800: #2B4C83;
  --palette-blue-900: #253F68;
  --palette-blue-950: #162745;

  /* Layer 02 · 纯色语义引用 */
  --color-text-primary: var(--palette-neutral-900); /* 主要文字 */
  --color-text-secondary: var(--palette-neutral-600); /* 次要文字 */
  --color-text-tertiary: var(--palette-neutral-500); /* 辅助文字 */
  --color-text-disabled: var(--palette-neutral-400); /* 禁用文字 */
  --color-text-inverse: var(--palette-neutral-0); /* 反色文字 */
  --color-text-inverse-muted: var(--palette-brand-200); /* 反色辅助文字 */
  --color-text-brand: var(--palette-brand-700); /* 品牌强调文字 */
  --color-bg-page: var(--palette-neutral-50); /* 页面背景 */
  --color-bg-surface: var(--palette-neutral-0); /* 内容表面 */
  --color-bg-subtle: var(--palette-neutral-100); /* 浅层背景 */
  --color-bg-input: var(--palette-neutral-0); /* 输入区域背景 */
  --color-bg-hover: var(--palette-brand-50); /* 悬停背景 */
  --color-bg-selected: var(--palette-brand-100); /* 选中背景 */
  --color-bg-disabled: var(--palette-neutral-100); /* 禁用背景 */
  --color-bg-emphasis: var(--palette-brand-950); /* 重点背景 */
  --color-bg-overlay: var(--palette-neutral-950); /* 遮罩基色 */
  --color-border-default: var(--palette-neutral-200); /* 普通边框 */
  --color-border-subtle: var(--palette-neutral-100); /* 弱分割线 */
  --color-border-input: var(--palette-neutral-500); /* 输入框边界 */
  --color-border-focus: var(--palette-brand-600); /* 聚焦边界 */
  --color-border-selected: var(--palette-brand-600); /* 选中边界 */
  --color-border-disabled: var(--palette-neutral-200); /* 禁用边界 */
  --color-border-error: var(--palette-red-700); /* 错误边界 */
  --color-action-primary: var(--palette-brand-600); /* 主操作默认 */
  --color-action-hover: var(--palette-brand-700); /* 主操作悬停 */
  --color-action-active: var(--palette-brand-800); /* 主操作按下 */
  --color-action-on-primary: var(--palette-neutral-0); /* 主操作文字 */
  --color-action-secondary: var(--palette-brand-100); /* 次级操作底色 */
  --color-action-secondary-hover: var(--palette-brand-200); /* 次级操作悬停 */
  --color-action-secondary-active: var(--palette-brand-300); /* 次级操作按下 */
  --color-action-on-secondary: var(--palette-brand-900); /* 次级操作文字 */
  --color-action-link: var(--palette-brand-700); /* 文字链接 */
  --color-action-link-hover: var(--palette-brand-800); /* 链接悬停 */
  --color-action-link-active: var(--palette-brand-900); /* 链接按下 */
  --color-action-disabled: var(--palette-neutral-100); /* 禁用操作背景 */
  --color-interaction-focus-ring: var(--palette-brand-600); /* 焦点环 */
  --color-interaction-selection-bg: var(--palette-brand-200); /* 文本选择背景 */
  --color-interaction-selection-text: var(--palette-brand-950); /* 文本选择文字 */
  --color-interaction-checked-bg: var(--palette-brand-600); /* 勾选背景 */
  --color-interaction-checked-mark: var(--palette-neutral-0); /* 勾选标记 */
  --color-interaction-track: var(--palette-neutral-500); /* 未选控件边界 */
  --color-icon-primary: var(--palette-neutral-700); /* 主要图标 */
  --color-icon-secondary: var(--palette-neutral-500); /* 次要图标 */
  --color-icon-brand: var(--palette-brand-700); /* 选中图标 */
  --color-icon-disabled: var(--palette-neutral-400); /* 禁用图标 */
  --color-status-success-text: var(--palette-green-700); /* 成功 · 状态文字 */
  --color-status-success-bg: var(--palette-green-50); /* 成功 · 状态浅底 */
  --color-status-success-border: var(--palette-green-200); /* 成功 · 状态弱边框 */
  --color-status-success-solid: var(--palette-green-700); /* 成功 · 状态实色 */
  --color-status-success-hover: var(--palette-green-800); /* 成功 · 实色悬停 */
  --color-status-success-active: var(--palette-green-900); /* 成功 · 实色按下 */
  --color-status-success-on-solid: var(--palette-neutral-0); /* 成功 · 实色文字 */
  --color-status-warning-text: var(--palette-amber-700); /* 警告 · 状态文字 */
  --color-status-warning-bg: var(--palette-amber-50); /* 警告 · 状态浅底 */
  --color-status-warning-border: var(--palette-amber-200); /* 警告 · 状态弱边框 */
  --color-status-warning-solid: var(--palette-amber-700); /* 警告 · 状态实色 */
  --color-status-warning-hover: var(--palette-amber-800); /* 警告 · 实色悬停 */
  --color-status-warning-active: var(--palette-amber-900); /* 警告 · 实色按下 */
  --color-status-warning-on-solid: var(--palette-neutral-0); /* 警告 · 实色文字 */
  --color-status-error-text: var(--palette-red-700); /* 错误 · 状态文字 */
  --color-status-error-bg: var(--palette-red-50); /* 错误 · 状态浅底 */
  --color-status-error-border: var(--palette-red-200); /* 错误 · 状态弱边框 */
  --color-status-error-solid: var(--palette-red-700); /* 错误 · 状态实色 */
  --color-status-error-hover: var(--palette-red-800); /* 错误 · 实色悬停 */
  --color-status-error-active: var(--palette-red-900); /* 错误 · 实色按下 */
  --color-status-error-on-solid: var(--palette-neutral-0); /* 错误 · 实色文字 */
  --color-status-info-text: var(--palette-blue-700); /* 信息 · 状态文字 */
  --color-status-info-bg: var(--palette-blue-50); /* 信息 · 状态浅底 */
  --color-status-info-border: var(--palette-blue-200); /* 信息 · 状态弱边框 */
  --color-status-info-solid: var(--palette-blue-700); /* 信息 · 状态实色 */
  --color-status-info-hover: var(--palette-blue-800); /* 信息 · 实色悬停 */
  --color-status-info-active: var(--palette-blue-900); /* 信息 · 实色按下 */
  --color-status-info-on-solid: var(--palette-neutral-0); /* 信息 · 实色文字 */
  --color-status-neutral-text: var(--palette-neutral-600); /* 中性 · 状态文字 */
  --color-status-neutral-bg: var(--palette-neutral-100); /* 中性 · 状态浅底 */
  --color-status-neutral-border: var(--palette-neutral-200); /* 中性 · 状态边框 */

  /* Layer 02 · 主题渐变（用于 background-image，直接引用基础色板） */
  --gradient-theme-start: var(--palette-brand-600); /* Figma 渐变参数：主题色渐变起点 */
  --gradient-theme-end: var(--palette-accent-700); /* Figma 渐变参数：主题色渐变终点 */
  --gradient-theme-light-start: var(--palette-brand-200); /* Figma 渐变参数：浅色主题渐变起点 */
  --gradient-theme-light-end: var(--palette-accent-200); /* Figma 渐变参数：浅色主题渐变终点 */
  --gradient-direction-horizontal: 90deg; /* Figma 渐变参数：水平角度（CSS 度数） */
  --gradient-direction-vertical: 180deg; /* Figma 渐变参数：垂直角度（CSS 度数） */
  --gradient-stop-start: 0%; /* Figma 渐变参数：起点位置（0–1 比例） */
  --gradient-stop-end: 100%; /* Figma 渐变参数：终点位置（0–1 比例） */
  --gradient-theme-horizontal: linear-gradient(90deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 水平 */
  --gradient-theme-vertical: linear-gradient(180deg, var(--palette-brand-600) 0%, var(--palette-accent-700) 100%); /* 主题色 · 垂直 */
  --gradient-theme-light-horizontal: linear-gradient(90deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 水平 */
  --gradient-theme-light-vertical: linear-gradient(180deg, var(--palette-brand-200) 0%, var(--palette-accent-200) 100%); /* 浅色主题色 · 垂直 */
  --motion-duration: 180ms;
}