/* ============================================
   ReadVenture Design Tokens
   (Fonts self-hosted in /css/fonts/)
   ============================================ */

/* ── Nunito (Primary UI Font) ── */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/css/fonts/nunito-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/css/fonts/nunito-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/css/fonts/nunito-800.woff2') format('woff2');
}

/* ── Baloo 2 (Heading/Display Font) ── */
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/css/fonts/baloo2-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/css/fonts/baloo2-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/css/fonts/baloo2-800.woff2') format('woff2');
}

:root {
  /* ── 背景色 ── */
  --bg-deep: #0f0c29;
  --bg-dark: #0a0820;
  --bg-drawer: #1a1040;
  --bg-overlay: #1a1040;
  --bg-parent: #0a0820;
  --bg-white-wall: #f8f4ef;
  --bg-editor: #f0ebe5;
  --bg-corridor: #f5f0e8;
  --bg-star: #0a0820;
  --bg-post: #1e1b4b;

  /* ── 卡片背景 ── */
  --card-dark: #1e293b;
  --card-darker: #0f172a;
  --card-ai: #1e1b4b;
  --card-ai2: #312e81;
  --card-feed: #1e293b;
  --card-daily: rgba(255,255,255,0.10);
  --card-glass: rgba(255,255,255,0.05);

  /* ── 文字色 ── */
  --text-primary: #ffffff;
  --text-secondary: #e2e8f0;
  --text-tertiary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-dim: #64748b;
  --text-very-dim: rgba(255,255,255,0.4);
  --text-dark-bg: #1e1b4b;
  --text-drawer-title: rgba(255,255,255,0.85);
  --text-empty: #b8a898;
  --text-empty2: #c4b0a0;

  /* ── 品牌色 ── */
  --gold: #f9a825;
  --gold-dark: #f59e0b;
  --gold-light: #fbbf24;
  --coral: #ff6f61;
  --coral-dark: #f4a261;
  --purple: #a855f7;
  --purple-light: #c084fc;
  --purple-dark: #7c3aed;
  --purple-text: #a78bfa;
  --cyan: #22d3ee;
  --cyan-dark: #0d9488;
  --green: #34d399;
  --green-bright: #22c55e;
  --green-deep: #16a34a;
  --green-light: #4ade80;
  --blue: #3b82f6;
  --blue-dark: #2563eb;
  --blue-purple: #4338ca;
  --blue-light: #6366f1;
  --red: #ef4444;
  --red-dark: #dc2626;
  --orange: #f97316;
  --amber: #f59e0b;
  --amber-dark: #d97706;
  --teal: #0f766e;
  --bronze: #b45309;
  --bronze-dark: #d97706;
  --silver: #94a3b8;
  --silver-light: #cbd5e1;
  --gold-frame: #c4924a;
  --gold-frame-light: #e8c070;
  --gold-frame-dark: #a0732d;
  --gold-frame-mid: #d4a854;
  --gold-me: #C8922A;
  --gold-me-light: #E8B84B;
  --gold-yellow: #fde68a;

  /* ── 品牌渐变 ── */
  --grad-primary: linear-gradient(135deg, #f9a825, #ff6f61);
  --grad-ai: linear-gradient(135deg, #8B5CF6, #06B6D4);
  --grad-purple: linear-gradient(135deg, #8B5CF6, #A855F7);
  --grad-purple-light: linear-gradient(135deg, #7c3aed, #c084fc);
  --grad-card-ai: linear-gradient(135deg, #1e1b4b, #312e81);
  --grad-card-dark: linear-gradient(135deg, #1e293b, #0f172a);
  --grad-drawer: linear-gradient(180deg, #1a1040 0%, #0f0c29 100%);
  --grad-overlay: linear-gradient(180deg, #1a1040 0%, #0f0c29 100%);
  --grad-post: linear-gradient(135deg, #1e1b4b, #0f172a);
  --grad-library: linear-gradient(135deg, #7c3aed, #2563eb);
  --grad-parent: linear-gradient(180deg, #0a0820 0%, #0f0c29 100%);
  --grad-sprite-space: linear-gradient(180deg, #1a0a3a 0%, #0f0c29 100%);
  --grad-restart: linear-gradient(135deg, #22d3ee, #a855f7);
  --grad-send: linear-gradient(135deg, #A855F7, #06B6D4);
  --grad-send-bright: linear-gradient(135deg, #C084FC, #22D3EE);
  --grad-recording: linear-gradient(135deg, #ef4444, #f97316);
  --grad-gold: linear-gradient(135deg, #f9a825, #ff6f61);
  --grad-green: linear-gradient(135deg, #22c55e, #16a34a);
  --grad-red: linear-gradient(135deg, #ef4444, #dc2626);
  --grad-teal: linear-gradient(135deg, #0d9488, #22d3ee);
  --grad-bg-gen: linear-gradient(135deg, #7c3aed, #22d3ee);
  --grad-me-btn: linear-gradient(135deg, #C8922A, #E8B84B);
  --grad-gold-frame: linear-gradient(135deg, #f9c74f, #f4a261);
  --grad-level-fill: linear-gradient(90deg, #a855f7, #22d3ee);
  --grad-xp-fill: linear-gradient(90deg, #f9a825, #ff6f61);
  --grad-quest-fill: linear-gradient(90deg, #f9a825, #ff6f61);
  --grad-gold-bronze: linear-gradient(135deg, #f59e0b, #fbbf24);
  --grad-silver: linear-gradient(135deg, #94a3b8, #cbd5e1);
  --grad-bronze2: linear-gradient(135deg, #b45309, #d97706);
  --grad-profile-avatar: linear-gradient(135deg, #f9a825, #ff6f61);
  /* 更高饱和度的 hover 变体 */
  --grad-purple-bright: linear-gradient(135deg, #A78BFA, #C084FC);
  --grad-ai-bright: linear-gradient(135deg, #A78BFA, #22D3EE);
  --grad-gold-bright: linear-gradient(135deg, #FBBF24, #FF8C7A);
  --grad-art-edit: linear-gradient(135deg, #f9c74f, #f4a261);
  --grad-purple-amber: linear-gradient(135deg, #a855f7, #f9a825);

  /* ── 半透色 ── */
  --glass-5: rgba(255,255,255,0.05);
  --glass-7: rgba(255,255,255,0.07);
  --glass-8: rgba(255,255,255,0.08);
  --glass-10: rgba(255,255,255,0.10);
  --glass-12: rgba(255,255,255,0.12);
  --glass-15: rgba(255,255,255,0.15);
  --glass-18: rgba(255,255,255,0.18);
  --glass-20: rgba(255,255,255,0.20);
  --glass-25: rgba(255,255,255,0.25);
  --glass-30: rgba(255,255,255,0.30);
  --glass-92: rgba(255,255,255,0.92);
  --glass-96: rgba(255,255,255,0.96);
  --purple-5: rgba(168,85,247,0.05);
  --purple-7: rgba(168,85,247,0.07);
  --purple-8: rgba(168,85,247,0.08);
  --purple-10: rgba(168,85,247,0.10);
  --purple-12: rgba(168,85,247,0.12);
  --purple-15: rgba(168,85,247,0.15);
  --purple-18: rgba(168,85,247,0.18);
  --purple-20: rgba(168,85,247,0.20);
  --purple-25: rgba(168,85,247,0.25);
  --purple-30: rgba(168,85,247,0.30);
  --purple-35: rgba(168,85,247,0.35);
  --gold-10: rgba(249,168,37,0.10);
  --gold-12: rgba(249,168,37,0.12);
  --gold-15: rgba(249,168,37,0.15);
  --gold-18: rgba(249,168,37,0.18);
  --gold-20: rgba(249,168,37,0.20);
  --gold-25: rgba(249,168,37,0.25);
  --gold-30: rgba(249,168,37,0.30);
  --gold-35: rgba(249,168,37,0.35);
  --gold-50: rgba(249,168,37,0.50);
  --cyan-7: rgba(34,211,238,0.07);
  --cyan-8: rgba(34,211,238,0.08);
  --cyan-10: rgba(34,211,238,0.10);
  --cyan-12: rgba(34,211,238,0.12);
  --cyan-15: rgba(34,211,238,0.15);
  --cyan-18: rgba(34,211,238,0.18);
  --cyan-20: rgba(34,211,238,0.20);
  --cyan-25: rgba(34,211,238,0.25);
  --cyan-30: rgba(34,211,238,0.30);
  --cyan-50: rgba(34,211,238,0.50);
  --amber-12: rgba(245,158,11,0.12);
  --amber-15: rgba(245,158,11,0.15);
  --amber-25: rgba(245,158,11,0.25);
  --amber-35: rgba(245,158,11,0.35);
  --green-12: rgba(34,197,94,0.12);
  --red-60: rgba(200,40,40,0.60);
  --red-90: rgba(220,50,50,0.90);
  --black-55: rgba(0,0,0,0.55);
  --black-60: rgba(0,0,0,0.60);
  --black-65: rgba(0,0,0,0.65);
  --black-70: rgba(0,0,0,0.70);
  --white-92: rgba(248,244,239,0.92);

  /* ── 边框色 ── */
  --border-light: rgba(255,255,255,0.06);
  --border-mid: rgba(255,255,255,0.08);
  --border-strong: rgba(255,255,255,0.10);
  --border-12: rgba(255,255,255,0.12);
  --border-15: rgba(255,255,255,0.15);
  --border-18: rgba(255,255,255,0.18);
  --border-20: rgba(255,255,255,0.20);
  --border-25: rgba(255,255,255,0.25);
  --border-purple-15: rgba(168,85,247,0.15);
  --border-purple-20: rgba(168,85,247,0.20);
  --border-purple-25: rgba(168,85,247,0.25);
  --border-purple-30: rgba(168,85,247,0.30);
  --border-purple-35: rgba(168,85,247,0.35);
  --border-purple-50: rgba(168,85,247,0.50);
  --border-gold-20: rgba(245,158,11,0.20);
  --border-gold-25: rgba(245,158,11,0.25);
  --border-gold-30: rgba(249,168,37,0.30);
  --border-gold-35: rgba(249,168,37,0.35);
  --border-gold-40: rgba(249,168,37,0.40);
  --border-gold-60: rgba(249,168,37,0.60);
  --border-cyan-20: rgba(34,211,238,0.20);
  --border-cyan-25: rgba(34,211,238,0.25);
  --border-cyan-30: rgba(34,211,238,0.30);
  --border-cyan-50: rgba(34,211,238,0.50);
  --border-amber-25: rgba(245,158,11,0.25);
  --border-amber-35: rgba(245,158,11,0.35);
  --border-green-20: rgba(34,197,94,0.20);
  --border-dashed: #d8cec4;
  --border-wall: rgba(180,160,140,0.18);

  /* ── 阴影 ── */
  --shadow-sm: 0 2px 8px rgba(168,85,247,0.08);
  --shadow-md: 0 4px 12px rgba(168,85,247,0.10);
  --shadow-lg: 0 4px 18px rgba(168,85,247,0.15);
  --shadow-xl: 0 4px 20px rgba(168,85,247,0.12);
  --shadow-2xl: 0 8px 30px rgba(249,168,37,0.45);
  --shadow-card: 0 4px 20px rgba(168,85,247,0.12);
  --shadow-drawer: 0 -8px 40px rgba(0,0,0,0.60);
  --shadow-purple: 0 0 15px rgba(168,85,247,0.50);
  --shadow-purple-lg: 0 -8px 48px rgba(168,85,247,0.20);
  --shadow-gold: 0 0 30px rgba(249,168,37,0.50);
  --shadow-cyan: 0 8px 30px rgba(34,211,238,0.40);
  --shadow-sprite: 0 8px 20px rgba(0,0,0,0.20);
  --shadow-frame: 4px 4px 24px rgba(0,0,0,0.35), -2px -2px 12px rgba(255,240,200,0.30);
  --shadow-frame-hover: 6px 6px 32px rgba(0,0,0,0.45), -2px -2px 14px rgba(255,240,200,0.40);

  /* ── 圆角 ── */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-2xl: 22px;
  --radius-3xl: 20px;
  --radius-4xl: 22px;
  --radius-5xl: 24px;
  --radius-6xl: 24px;
  --radius-7xl: 26px;
  --radius-8xl: 28px;
  --radius-pill: 32px;
  --radius-full: 50%;
  --radius-99: 99px;

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

  /* ── 字体 ── */
  --font-stack: 'Nunito', 'Baloo 2', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-serif: Georgia, serif;
  --font-mono: monospace;

  /* ── 字号 ── */
  --text-9: 9px;
  --text-10: 10px;
  --text-11: 11px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-17: 17px;
  --text-18: 18px;
  --text-19: 19px;
  --text-20: 20px;
  --text-22: 22px;
  --text-24: 24px;
  --text-26: 26px;
  --text-28: 28px;
  --text-30: 30px;
  --text-32: 32px;
  --text-36: 36px;
  --text-40: 40px;
  --text-48: 48px;
  --text-56: 56px;
  --text-64: 64px;
  --text-72: 72px;
  --text-80: 80px;

  /* ── 过渡 ── */
  --ease-out: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-bounce: cubic-bezier(0.34, 1.1, 0.64, 1);
  --ease-spring: cubic-bezier(0.34, 1.15, 0.64, 1);
  --ease-spring2: cubic-bezier(0.34, 1.2, 0.64, 1);

  /* ── 动画时长 ── */
  --anim-fast: 0.15s;
  --anim-normal: 0.2s;
  --anim-slow: 0.3s;
  --anim-drawer: 0.38s;
  --anim-overlay: 0.4s;
}