/* Xenlion AI employee console design tokens and base rules. */
:root {
  --bg: #f4f6f9;
  --bg-wash: #f4f6f9;
  --panel: #ffffff;
  --panel-elevated: rgba(255, 255, 255, 0.92);
  --panel-soft: #f7f9fc;
  --surface: #ffffff;
  --surface-raised: #fbfcfe;
  --surface-muted: #f2f5f9;
  --surface-hover: #f2fbf9;
  --line: #d6deea;
  --line-soft: #e8edf4;
  --line-strong: #c7d1df;
  --text: #101828;
  --text-strong: #0b1220;
  --muted: #667085;
  --muted-soft: #8a97a8;
  --brand: #0f766e;
  --brand-strong: #0b3b35;
  --brand-ink: #075e54;
  --brand-soft: #e8f8f5;
  --brand-line: #b7e7de;
  --brand-tint: #f2fffc;
  --success: #0f9f6e;
  --success-ink: #047857;
  --success-soft: #eafaf3;
  --success-line: #bfead7;
  --danger: #dc2626;
  --danger-ink: #b42318;
  --danger-soft: #fff1f1;
  --danger-line: #ffc7c7;
  --warn: #d97706;
  --warn-ink: #9a5b00;
  --warn-soft: #fff7e8;
  --warn-line: #f6d69c;
  --idle: #a7b0bd;
  --idle-soft: #f1f4f8;
  --terminal: #0b1715;
  --terminal-raised: #10231f;
  --terminal-line: rgba(45, 212, 191, 0.18);
  --radius-xs: 0;
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --control-h: 40px;
  --shadow: 0 18px 42px rgba(16, 24, 40, 0.08);
  --shadow-soft: 0 8px 22px rgba(16, 24, 40, 0.055);
  --shadow-focus: 0 0 0 3px rgba(15, 118, 110, 0.18);
  /* 字体栈（系统字体栈，零外部依赖，Win / Mac / 移动端都能正常回退）。 */
  --font-sans:
    -apple-system, BlinkMacSystemFont,
    "Segoe UI",
    "PingFang SC", "Microsoft YaHei",
    system-ui, sans-serif;
  --font-mono:
    ui-monospace, "SF Mono", "JetBrains Mono", "Consolas",
    "Liberation Mono", monospace;

  /* 字号刻度：7 档。不再有 10.5 / 11.5 / 12.5 / 13.5 / 15 / 17 这种半级。 */
  --fs-2xs: 11px;     /* 辅助文字：时间戳、caption、tag */
  --fs-xs:  12px;     /* 次要说明：meta、hint */
  --fs-sm:  13px;     /* 默认正文：按钮、表单标签、消息 */
  --fs-md:  14px;     /* 强调正文：composer 输入、主消息文本 */
  --fs-lg:  16px;     /* 小标题：卡片头部、分组标题 */
  --fs-xl:  20px;     /* 中标题：弹窗标题、tab 大标题 */
  --fs-2xl: 28px;     /* 大标题：首页 hero、员工详情页 h2 */

  /* 旧 --type-* 保留作为别名，逐步迁移到 --fs-* */
  --type-display: var(--fs-2xl);
  --type-page-title: var(--fs-2xl);
  --type-section-title: var(--fs-lg);
  --type-card-title: var(--fs-md);
  --type-body: var(--fs-md);
  --type-body-sm: var(--fs-sm);
  --type-meta: var(--fs-xs);
  --type-caption: var(--fs-2xs);
  --type-number-lg: var(--fs-2xl);
  --type-number-md: var(--fs-xl);
  --type-terminal: var(--fs-sm);
  /* 字重刻度：4 档。不再有 560 / 680 / 760 / 850 这种半级（浏览器会回退，视觉无差别）。 */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-heavy: 700;   /* 老别名，逐步清理 */
  --leading-tight: 1.15;
  --leading-title: 1.25;
  --leading-body: 1.5;
  --leading-dense: 1.35;
  --tracking-title: -0.02em;
  --tracking-normal: 0;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font: var(--type-body) / var(--leading-body) var(--font-sans);
  overflow: hidden;
}

body {
  padding: 12px;
  background:
    linear-gradient(180deg, #f8fafc 0%, var(--bg-wash) 42%, #eef2f7 100%);
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  border: 0;
  cursor: pointer;
  transition:
    transform 140ms ease,
    background 140ms ease,
    border-color 140ms ease,
    color 140ms ease,
    box-shadow 140ms ease,
    opacity 140ms ease;
  -webkit-tap-highlight-color: transparent;
}

button:hover {
  transform: translateY(-1px);
}

button:active {
  transform: translateY(0);
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

h1,
h2,
h3,
h4,
p {
  margin: 0;
}

input,
select,
textarea {
  width: 100%;
  min-height: var(--control-h);
  padding: 9px 11px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  outline: none;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--brand);
  box-shadow: var(--shadow-focus);
}

textarea {
  min-height: 120px;
  resize: vertical;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.62;
    transform: scale(1.12);
  }
}

@keyframes shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

.muted {
  font-size: 12px;
  color: var(--muted-soft);
}

.eyebrow {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--brand);
}

.hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}

.scroll {
  min-height: 0;
  overflow: auto;
}

.employee-list,
.scroll,
.config-form-scroll,
.mini-console,
.mono,
.json-box {
  scrollbar-width: thin;
  scrollbar-color: rgba(134, 134, 139, 0.7) rgba(229, 229, 234, 0.55);
}

.employee-list::-webkit-scrollbar,
.scroll::-webkit-scrollbar,
.config-form-scroll::-webkit-scrollbar,
.mini-console::-webkit-scrollbar,
.mono::-webkit-scrollbar,
.json-box::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.employee-list::-webkit-scrollbar-track,
.scroll::-webkit-scrollbar-track,
.config-form-scroll::-webkit-scrollbar-track,
.mini-console::-webkit-scrollbar-track,
.mono::-webkit-scrollbar-track,
.json-box::-webkit-scrollbar-track {
  background: rgba(226, 232, 240, 0.55);
  border-radius: 999px;
}

.employee-list::-webkit-scrollbar-thumb,
.scroll::-webkit-scrollbar-thumb,
.config-form-scroll::-webkit-scrollbar-thumb,
.mini-console::-webkit-scrollbar-thumb,
.mono::-webkit-scrollbar-thumb,
.json-box::-webkit-scrollbar-thumb {
  background: rgba(134, 134, 139, 0.72);
  border: 2px solid rgba(245, 245, 247, 0.86);
  border-radius: 999px;
}