@font-face {
  font-family: "Lora";
  src: url("../assets/fonts/english/lora/Lora-VariableFont_wght.ttf") format("truetype");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "Lora";
  src: url("../assets/fonts/english/lora/Lora-Italic-VariableFont_wght.ttf") format("truetype");
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
}

:root {
  --font-ui: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-serif: "Lora", "Songti SC", STSong, "Noto Serif CJK SC", "Source Han Serif SC", serif;
  --font-voice: var(--font-serif);
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --font-greeting: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;

  --clay: #d97757;
  --clay-emphasized: #c6613f;
  --blue: #2c84db;
  --danger: #d03b3b;
  --success: #1a8633;
  --warning: #8b751c;

  --page: #f9f9f7;
  --page-raised: #fff;
  --sidebar-wash: linear-gradient(to top, rgb(243 243 240 / 5%), rgb(243 243 240 / 30%));
  --surface-1: #fff;
  --surface-2: #f3f3f0;
  --surface-3: #f0efec;
  --surface-hover: rgb(11 11 11 / 5%);
  --surface-pressed: rgb(11 11 11 / 8%);
  --surface-selected: #f3f3f0;
  --surface-overlay: rgb(255 255 255 / 82%);
  --backdrop: rgb(11 11 11 / 28%);

  --text-primary: #0b0b0b;
  --text-secondary: #383835;
  --text-muted: #52514e;
  --text-faint: #898781;
  --text-inverse: #fff;
  --border: rgb(11 11 11 / 10%);
  --border-strong: rgb(30 30 29 / 20%);
  --focus: 0 0 0 2px #f9f9f7, 0 0 0 4px rgb(44 132 219 / 78%);

  --shadow-composer: 0 4px 20px rgb(0 0 0 / 3.5%), 0 0 0 .5px rgb(30 30 29 / 15%);
  --shadow-composer-focus: 0 4px 20px rgb(0 0 0 / 7.5%), 0 0 0 .5px rgb(30 30 29 / 30%);
  --shadow-menu: 0 0 0 .5px rgb(30 30 29 / 18%), 0 8px 24px rgb(0 0 0 / 12%), 0 2px 6px rgb(0 0 0 / 8%);
  --shadow-search: 0 25px 50px -12px rgb(0 0 0 / 25%), 0 0 0 .5px rgb(30 30 29 / 15%);
  --shadow-sidebar: 0 4px 8px rgb(11 11 11 / 8%), 0 12px 28px -2px rgb(11 11 11 / 8%);
  --shadow-card: 0 1px 2px rgb(0 0 0 / 4%), 0 0 0 .5px var(--border);

  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-composer: 20px;
  --provider-logo-column: 28px;
  --provider-logo-size: 20px;
  --provider-logo-wordmark-width: 28px;
  --provider-logo-wordmark-height: 14px;

  --sidebar-width: 288px;
  --main-safe-right: 11px;
  --composer-width: 672px;
  --titlebar-height: 40px;

  --z-content: 1;
  --z-sticky: 10;
  --z-sidebar: 20;
  --z-inspector: 24;
  --z-sidebar-trigger: 26;
  --z-popover: 30;
  --z-tooltip: 35;
  --z-modal: 40;
  --z-system: 50;

  --ease-standard: cubic-bezier(.4, 0, .2, 1);
  --ease-dialog: cubic-bezier(.165, .84, .44, 1);
  --duration-fast: 60ms;
  --duration-tooltip: 80ms;
  --duration-surface: 200ms;

  /* ━━━━ 单行 UI 控件光学对齐规范 (Optical Alignment Tokens) ━━━━ */
  --ui-control-icon-box-sm: 16px;
  --ui-control-icon-box-md: 20px;
  --ui-control-label-line-height: 1;
  --ui-control-label-optical-shift-y: 1px;
  --ui-search-input-optical-shift-y: 0px;
}

html[data-font-system="lora"] {
  --font-ui: "Lora", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-serif: "Lora", "Songti SC", STSong, "Noto Serif CJK SC", "Source Han Serif SC", serif;
  --font-voice: var(--font-serif);
  --font-greeting: "Lora", "Songti SC", STSong, serif;
}

html[data-font-system="system-sans"] {
  --font-ui: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-serif: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-voice: var(--font-serif);
  --font-greeting: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
}

html[data-font-system="system-serif"] {
  --font-ui: "Songti SC", STSong, "Noto Serif CJK SC", "Source Han Serif SC", serif;
  --font-serif: "Songti SC", STSong, "Noto Serif CJK SC", "Source Han Serif SC", serif;
  --font-voice: var(--font-serif);
  --font-greeting: "Songti SC", STSong, serif;
}

html[data-theme="dark"] {
  --page: #262624;
  --page-raised: #30302e;
  --sidebar-wash: linear-gradient(to top, rgb(20 20 19 / 12%), rgb(20 20 19 / 42%));
  --surface-1: #30302e;
  --surface-2: #1f1e1d;
  --surface-3: #141413;
  --surface-hover: rgb(250 249 245 / 7%);
  --surface-pressed: rgb(250 249 245 / 11%);
  --surface-selected: #383835;
  --surface-overlay: rgb(48 48 46 / 84%);
  --backdrop: rgb(0 0 0 / 45%);
  --text-primary: #faf9f5;
  --text-secondary: #e5e5e2;
  --text-muted: #c2c0b6;
  --text-faint: #9c9a92;
  --border: rgb(222 220 209 / 12%);
  --border-strong: rgb(222 220 209 / 22%);
  --focus: 0 0 0 2px #262624, 0 0 0 4px rgb(116 171 226 / 85%);
  --shadow-composer: 0 4px 20px rgb(0 0 0 / 18%), 0 0 0 .5px rgb(222 220 209 / 14%);
  --shadow-composer-focus: 0 4px 20px rgb(0 0 0 / 28%), 0 0 0 .5px rgb(222 220 209 / 26%);
  --shadow-menu: 0 0 0 .5px rgb(222 220 209 / 16%), 0 10px 28px rgb(0 0 0 / 42%), 0 2px 8px rgb(0 0 0 / 28%);
  --shadow-search: 0 25px 50px -12px rgb(0 0 0 / 58%), 0 0 0 .5px rgb(222 220 209 / 16%);
  --shadow-sidebar: 0 4px 8px rgb(0 0 0 / 28%), 0 12px 28px -2px rgb(0 0 0 / 34%);
  --shadow-card: 0 1px 2px rgb(0 0 0 / 16%), 0 0 0 .5px var(--border);
}