frontend/src/index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

/* 明暗主题语义色板（RGB 三元组，供 Tailwind 以 <alpha-value> 引用） */
:root {
  --c-page: 241 245 249;
  --c-card: 255 255 255;
  --c-soft: 248 250 252;
  --c-line: 226 232 240;
  --c-ink: 15 23 42;
  --c-body: 51 65 85;
  --c-muted: 100 116 139;
  --c-faint: 148 163 184;
  color-scheme: light;
}
.dark {
  --c-page: 2 6 23;
  --c-card: 15 23 42;
  --c-soft: 22 32 51;
  --c-line: 38 50 71;
  --c-ink: 241 245 249;
  --c-body: 203 213 225;
  --c-muted: 148 163 184;
  --c-faint: 100 116 139;
  color-scheme: dark;
}

html, body, #root { height: 100%; }
body {
  @apply bg-page text-body antialiased;
  font-family: Inter, system-ui, sans-serif;
}

/* 细滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgb(var(--c-line)); border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: rgb(var(--c-muted)); }

/* 键盘焦点环（鼠标点击不显示） */
:focus-visible { @apply outline-none ring-2 ring-indigo-500/40 rounded-sm; }

/* 进出场动画 */
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes pop-in {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to { opacity: 1; transform: none; }
}
@keyframes slide-up {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}
.animate-fade-in { animation: fade-in 0.18s ease-out both; }
.animate-pop-in { animation: pop-in 0.22s cubic-bezier(0.16, 1, 0.3, 1) both; }
.animate-slide-up { animation: slide-up 0.25s cubic-bezier(0.16, 1, 0.3, 1) both; }