/**
 * 设计令牌（design tokens）——全站唯一权威来源。
 *
 * 消费方：① legacy 主应用 index.html 直接 <link>（在 style.css 之前）；
 *        ② SPA 经 src/styles/base.css → src/styles/tokens.css（@import 转发到本文件）。
 *
 * 原 css/style.css 的 :root / [data-theme=dark] 变量已全部迁入此处（值原样，视觉零变化），
 * style.css 不再定义这些变量，仅消费 var()。新增分级标度：间距 / 圆角 / 字号 / 层级 / 阴影 / 品牌色阶。
 * 既有变量名（--accent-color/--accent-hover/--radius/--shadow）保留为新标度的别名，故老引用不受影响。
 */
:root {
  /* ===== 字体 ===== */
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --chat-content-font-family: var(--font-sans);
  --chat-content-font-size: var(--type-size-card-title);
  --root-font-size-small: 14px;
  --root-font-size-medium: 16px;
  --root-font-size-large: 18px;

  /* ===== 布局 ===== */
  --chat-max-width: 900px;            /* 保留舒适阅读列，避免消息在宽屏上贴近两端 */
  --chat-reading-width: 780px;        /* 长篇正文采用更舒适的行长；代码、表格和媒体仍可使用整列 */
  --chat-inline-padding: 24px;
  --chat-side-gutter: max(var(--chat-inline-padding), calc((100% - var(--chat-max-width)) / 2));
  --sidebar-width: 280px;
  --header-height: 60px;
  --workspace-header-height: 56px;
  --control-height-sm: 36px;
  --control-height-md: 40px;
  --control-height-lg: 44px;
  --touch-target-min: 44px;
  --chat-upload-thumbnail-size: 112px;
  --chat-user-message-collapsed-height: clamp(220px, 36vh, 360px);
  --chat-code-block-max-height: clamp(220px, 36vh, 360px);
  --chat-bottom-dock-height: 174px;   /* 侧栏底栏与主区输入区统一高度，使 border-top 分割线对齐 */
  --icp-footer-height: 36px;

  /* ===== 背景 ===== */
  --bg-primary: #fafafa;
  --bg-secondary: #f3f4f6;
  --bg-tertiary: #e5e7eb;

  /* ===== 文本 ===== */
  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --text-muted: #9ca3af;

  /* ===== 边框 ===== */
  --border-color: #e5e7eb;

  /* ===== 品牌色阶（accent 50–900，基于既有 #2563eb，Tailwind blue 量级） ===== */
  --accent-50: #eff6ff;
  --accent-100: #dbeafe;
  --accent-200: #bfdbfe;
  --accent-300: #93c5fd;
  --accent-400: #60a5fa;
  --accent-500: #3b82f6;
  --accent-600: #2563eb;
  --accent-700: #1d4ed8;
  --accent-800: #1e40af;
  --accent-900: #1e3a8a;
  --accent-color: var(--accent-600);  /* 既有别名（=#2563eb） */
  --accent-hover: var(--accent-700);  /* 既有别名（=#1d4ed8） */

  /* ===== 语义色 ===== */
  --danger-color: #dc2626;
  --success-color: #16a34a;
  --warning-color: #b45309;

  /* ===== 应用工作台语义配色 =====
   * 管理页、弹窗和后续新增工作台统一引用这一层，不再自行维护品牌色。
   * 它与主页基础令牌保持映射，因此主题切换时可同步响应。
   */
  --app-canvas: var(--bg-primary);
  --app-surface: var(--chat-main-bg);
  --app-sidebar: var(--sidebar-bg);
  --app-control: var(--bg-tertiary);
  --app-control-hover: var(--border-color);
  --app-border: var(--border-color);
  --app-text: var(--text-primary);
  --app-text-secondary: var(--text-secondary);
  --app-text-muted: var(--text-muted);
  --app-accent: var(--accent-color);
  --app-accent-hover: var(--accent-hover);
  --app-accent-soft: var(--accent-50);
  --app-accent-border: var(--accent-200);
  --app-focus-ring: color-mix(in srgb, var(--accent-color) 18%, transparent);
  --app-on-accent: #ffffff;
  --app-overlay: rgba(15, 23, 42, 0.52);
  --app-modal-shadow: 0 24px 70px rgba(15, 23, 42, 0.25);
  --app-danger: var(--danger-color);
  --app-success: var(--success-color);
  --app-warning: var(--warning-color);
  --app-danger-soft: color-mix(in srgb, var(--danger-color) 9%, var(--app-surface));
  --app-danger-border: color-mix(in srgb, var(--danger-color) 30%, var(--app-border));
  --app-success-soft: color-mix(in srgb, var(--success-color) 10%, var(--app-surface));
  --app-success-border: color-mix(in srgb, var(--success-color) 30%, var(--app-border));
  --app-warning-soft: color-mix(in srgb, var(--warning-color) 10%, var(--app-surface));
  --app-warning-border: color-mix(in srgb, var(--warning-color) 30%, var(--app-border));

  /* ===== 管理控制台壳层 =====
   * 管理页可以保留深色品牌侧栏，但内容画布、表面与状态必须跟随全局主题。
   */
  --management-canvas: color-mix(in srgb, var(--app-canvas) 96%, var(--app-accent) 4%);
  --management-surface: var(--app-surface);
  --management-surface-subtle: color-mix(in srgb, var(--app-surface) 92%, var(--app-control) 8%);
  --management-border: var(--app-border);
  --management-heading: var(--app-text);
  --management-sidebar-start: #101c32;
  --management-sidebar-end: #0d182a;
  --management-sidebar-text: rgba(255, 255, 255, 0.76);
  --management-sidebar-muted: rgba(255, 255, 255, 0.42);
  --management-sidebar-border: rgba(255, 255, 255, 0.07);
  --management-sidebar-hover: rgba(255, 255, 255, 0.065);
  --management-sidebar-active: rgba(57, 126, 230, 0.28);
  --management-sidebar-faint: rgba(255, 255, 255, 0.28);
  --management-sidebar-nav: rgba(255, 255, 255, 0.62);
  --management-sidebar-strong: rgba(255, 255, 255, 0.82);
  --management-sidebar-icon: rgba(255, 255, 255, 0.35);
  --management-sidebar-count-text: #dbeafe;
  --management-sidebar-count-bg: rgba(59, 130, 246, 0.38);
  --management-sidebar-avatar-text: #dceaff;
  --management-sidebar-avatar-bg: #244e8b;
  --management-metric-violet: #7955ca;
  --management-metric-violet-soft: color-mix(in srgb, var(--management-metric-violet) 11%, var(--management-surface));
  --management-metric-cyan: #258ba0;
  --management-metric-cyan-soft: color-mix(in srgb, var(--management-metric-cyan) 11%, var(--management-surface));
  --management-metric-green: #398660;
  --management-metric-green-soft: color-mix(in srgb, var(--management-metric-green) 11%, var(--management-surface));

  /* ===== 管理门禁 =====
   * 组件只消费这些值；窄屏切换由本文件统一维护，避免每个管理入口复制品牌色和断点规则。
   */
  --management-gate-columns: minmax(360px, 0.9fr) minmax(460px, 1.1fr);
  --management-gate-story-min-height: 100vh;
  --management-gate-story-padding: clamp(36px, 5vw, 72px);
  --management-gate-story-title-size: clamp(38px, 5vw, 64px);
  --management-gate-story-text: var(--app-on-accent);
  --management-gate-story-muted: rgba(255, 255, 255, 0.65);
  --management-gate-story-faint: rgba(255, 255, 255, 0.38);
  --management-gate-story-eyebrow: #86b6ff;
  --management-gate-story-background: radial-gradient(circle at 15% 15%, rgba(96, 165, 250, 0.38), transparent 27%), linear-gradient(150deg, #0a1c3c, #102e62 60%, #17417f);
  --management-gate-ornament-border: rgba(255, 255, 255, 0.12);
  --management-gate-ornament-shadow: 0 0 0 68px rgba(255, 255, 255, 0.025), 0 0 0 136px rgba(255, 255, 255, 0.018);
  --management-gate-footer-display: block;
  --management-gate-form-min-height: 100vh;
  --management-gate-form-padding: 70px clamp(30px, 8vw, 120px);
  --management-gate-back-top: 28px;
  --management-gate-back-color: var(--app-text-muted);

  /* ===== 消息气泡 ===== */
  --message-user-bg: #2563eb;
  --message-user-text: #ffffff;
  --message-assistant-bg: #eceef2;
  --message-assistant-text: #1f2937;

  /* ===== 侧栏（Lobe 式浅灰底 + 白内容区对比） ===== */
  --sidebar-bg: #eef1f5;
  --sidebar-border: rgba(15, 23, 42, 0.08);
  --sidebar-item-hover: rgba(15, 23, 42, 0.055);
  --sidebar-item-active: #ebebed;
  --chat-main-bg: #ffffff;

  /* ===== 对话区 Markdown（表格 / 代码块外框） ===== */
  --dialog-table-border: #e8e8ec;
  --dialog-table-header-bg: #f0f1f4;
  --dialog-code-frame-bg: #eceef2;
  --dialog-code-header-bg: #e4e6ec;

  /* ===== 间距标度（4px 基准） ===== */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* ===== 圆角标度（覆盖现有 4/6/8/10/12 + full） ===== */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-full: 9999px;
  --radius: var(--radius-xl);         /* 既有别名（=12px） */
  --control-radius: var(--radius-md);
  --surface-radius: var(--radius-xl);
  --dialog-radius: var(--radius-xl);

  /* ===== 字号标度（rem 跟随用户的小 / 中 / 大字体设置） ===== */
  --text-2xs: max(0.6875rem, 11px);
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.875rem;
  --text-md: 0.9375rem;
  --text-lg: 1rem;
  --text-xl: 1.125rem;
  --text-2xl: 1.25rem;
  --text-3xl: 1.375rem;

  /* ===== 语义排版 =====
   * 页面与组件只选择文字类型，不再自行拼装字号、字重和行高。
   */
  --type-family-ui: var(--font-sans);
  --type-family-code: var(--font-mono);
  --type-family-document-body: 'Times New Roman', '仿宋_GB2312', FangSong, STFangsong, 'Songti SC', serif;
  --type-family-document-heading: 'Times New Roman', '方正小标宋简体', 'FZXiaoBiaoSong-B05S', STZhongsong, 'Songti SC', serif;
  --type-family-document-strong: 'Times New Roman', SimHei, '黑体', 'Heiti SC', STHeiti, sans-serif;
  --type-family-document-caption: 'Times New Roman', SimSun, '宋体', 'Songti SC', serif;
  --type-family-document-callout: 'Times New Roman', KaiTi, '楷体_GB2312', STKaiti, 'Kaiti SC', serif;
  --type-size-meta: var(--text-2xs);
  --type-size-caption: var(--text-xs);
  --type-size-control: var(--text-sm);
  --type-size-body: var(--text-base);
  --type-size-card-title: var(--text-md);
  --type-size-compact-title: var(--text-lg);
  --type-size-section-title: var(--text-xl);
  --type-size-page-title: var(--text-2xl);
  --type-size-subpage-title: var(--text-3xl);
  --type-size-metric: 1.5rem;
  --type-size-display: clamp(1.5rem, 3vw, 2rem);
  --type-size-hero: clamp(1.875rem, 4vw, 3rem);
  --type-line-none: 1;
  --type-line-dense: 1.2;
  --type-line-tight: 1.25;
  --type-line-snug: 1.35;
  --type-line-compact: 1.45;
  --type-line-control: 1.5;
  --type-line-body: 1.65;
  --type-line-relaxed: 1.75;
  --type-line-reading: 1.85;

  /* ===== 品牌组合与侧栏菜单 ===== */
  --brand-logo-sm: 28px;
  --brand-logo-md: 34px;
  --brand-logo-lg: 38px;
  --brand-lockup-gap: var(--space-2);
  --brand-title-tracking: -0.01em;
  --sidebar-menu-gap: 2px;
  --sidebar-menu-item-height: 40px;
  --sidebar-menu-item-gap: var(--space-2);
  --sidebar-menu-item-padding: 6px 8px;
  --sidebar-menu-item-radius: var(--radius-lg);
  --sidebar-menu-icon-size: 28px;
  --sidebar-popover-offset: var(--space-2);
  --sidebar-popover-min-width: 200px;
  --sidebar-popover-max-width: 280px;
  --sidebar-popover-padding: 6px;
  --sidebar-popover-item-height: 36px;

  /* ===== 阴影分级 ===== */
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.12);
  --shadow: var(--shadow-sm);         /* 既有别名 */

  /* ===== z-index 分级（覆盖现有 1–20000 量级，供精修时逐步替换硬编码） ===== */
  --z-base: 1;
  --z-dropdown: 1000;
  --z-sticky: 1100;
  --z-overlay: 2000;
  --z-modal: 10000;
  --z-popover: 12000;
  --z-toast: 20000;
}

@media (max-width: 820px) {
  :root {
    --management-gate-columns: 1fr;
    --management-gate-story-min-height: 210px;
    --management-gate-story-padding: 24px;
    --management-gate-story-title-size: 32px;
    --management-gate-footer-display: none;
    --management-gate-form-min-height: auto;
    --management-gate-form-padding: 38px 24px;
    --management-gate-back-top: -180px;
    --management-gate-back-color: var(--management-sidebar-text);
  }
}

@media (max-width: 768px) {
  :root {
    --chat-inline-padding: 16px;
  }
}

[data-theme="dark"] {
  --bg-primary: #111111;
  --bg-secondary: #1a1a1a;
  --bg-tertiary: #2d2d2d;

  --text-primary: #ececec;
  --text-secondary: #a3a3a3;
  --text-muted: #8c8c8c;

  --border-color: #3f3f3f;

  --message-assistant-bg: #1e1e1e;
  --message-assistant-text: #ececec;

  --sidebar-bg: #141414;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --sidebar-item-hover: rgba(255, 255, 255, 0.06);
  --sidebar-item-active: #252525;
  --chat-main-bg: #111111;

  --dialog-table-border: #2d2d33;
  --dialog-table-header-bg: #1c1c20;
  --dialog-code-frame-bg: #252528;
  --dialog-code-header-bg: #1e1e22;

  --app-accent-soft: color-mix(in srgb, var(--accent-color) 14%, var(--app-surface));
  --app-accent-border: color-mix(in srgb, var(--accent-color) 38%, var(--app-border));
  --app-overlay: rgba(0, 0, 0, 0.68);
  --app-modal-shadow: 0 24px 70px rgba(0, 0, 0, 0.58);

  /* 阴影在暗色下加深（别名链 --shadow → --shadow-sm 保持不变） */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.55);
}