/* ═══════════════════════════════════════════
   快乐学习小天地 - CSS设计系统 v2.0
   色彩/字体/圆角/阴影/动画变量
   ═══════════════════════════════════════════ */

:root {
  /* ── 主色调 ── */
  --primary: #5B4FCF;
  --primary-light: #7B6FE8;
  --primary-dark: #3D3580;
  --secondary: #FF6B9D;
  --secondary-light: #FF8DB5;

  /* ── 强调色 ── */
  --accent-blue: #5DADE2;
  --accent-green: #58D68D;
  --accent-orange: #FFB347;
  --accent-purple: #B07CD8;
  --accent-gold: #F0C040;

  /* ── 语义色 ── */
  --danger: #FF6B6B;
  --danger-bg: rgba(255, 107, 107, 0.1);
  --success: #58D68D;
  --success-bg: rgba(88, 214, 141, 0.1);
  --warning: #FFB347;
  --warning-bg: rgba(255, 179, 71, 0.1);
  --info: #5DADE2;
  --info-bg: rgba(93, 173, 226, 0.1);

  /* ── 中性色 ── */
  --bg: #FFF8F0;
  --bg-alt: #F5F0FF;
  --card: #FFFFFF;
  --card-hover: #FDFBFF;
  --text: #3D315B;
  --text-secondary: #6B5E8A;
  --dim: #8B7DAD;
  --border: #E8DFF5;
  --border-focus: #B0A0D8;
  --divider: #F0EBF8;

  /* ── 侧边栏 ── */
  --sidebar-bg: #5B4FCF;
  --sidebar-hover: rgba(255, 255, 255, 0.15);
  --sidebar-active: #FF6B9D;
  --sidebar-text: #FFFFFF;
  --sidebar-dim: rgba(255, 255, 255, 0.7);

  /* ── 圆角 ── */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ── 阴影 ── */
  --shadow-sm: 0 2px 6px rgba(91, 79, 207, 0.08);
  --shadow: 0 3px 12px rgba(91, 79, 207, 0.12);
  --shadow-md: 0 6px 20px rgba(91, 79, 207, 0.18);
  --shadow-lg: 0 12px 32px rgba(91, 79, 207, 0.22);
  --shadow-glow: 0 0 20px rgba(255, 107, 157, 0.4);

  /* ── 字体 ── */
  --font: 'Segoe UI', 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', system-ui, sans-serif;
  --font-mono: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;

  /* ── 字号 ── */
  --fs-xs: 11px;
  --fs-sm: 13px;
  --fs-base: 16px;
  --fs-md: 18px;
  --fs-lg: 22px;
  --fs-xl: 28px;
  --fs-2xl: 36px;

  /* ── 间距 ── */
  --sp-xs: 4px;
  --sp-sm: 8px;
  --sp: 12px;
  --sp-md: 16px;
  --sp-lg: 20px;
  --sp-xl: 28px;
  --sp-2xl: 40px;

  /* ── 过渡 ── */
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 0.3s cubic-bezier(0.68, -0.2, 0.27, 1.3);

  /* ── 布局 ── */
  --sidebar-width: 210px;
  --sidebar-collapsed: 64px;
  --header-height: 56px;
  --bottom-nav-height: 60px;

  /* ── Z-index ── */
  --z-sidebar: 100;
  --z-header: 200;
  --z-modal: 900;
  --z-toast: 1000;
  --z-loading: 1100;
}

/* ── 始终保持明亮儿童主题（不随系统暗色模式翻转）── */