:root {
  color-scheme: light;

  --qg-font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", Arial, sans-serif;
  --qg-font-page-title: 28px;
  --qg-font-card-title: 20px;
  --qg-font-body: 14px;
  --qg-font-caption: 12px;
  --qg-font-weight-regular: 400;
  --qg-font-weight-medium: 600;
  --qg-font-weight-bold: 800;
  --qg-line-height-tight: 1.35;
  --qg-line-height-body: 1.7;

  --qg-brand-400: #ff9838;
  --qg-brand-500: #ff7a00;
  --qg-brand-600: #dc6200;
  --qg-brand-100: #fff0e2;
  --qg-brand-050: #fff8f2;
  --qg-brand-alpha-10: rgba(255, 122, 0, .10);
  --qg-brand-alpha-18: rgba(255, 122, 0, .18);
  --qg-brand-alpha-28: rgba(255, 122, 0, .28);

  --qg-neutral-000: #ffffff;
  --qg-neutral-025: #fbfcfd;
  --qg-neutral-050: #f7f8fa;
  --qg-neutral-100: #f0f2f5;
  --qg-neutral-200: #e5e8ec;
  --qg-neutral-300: #d4d8de;
  --qg-neutral-500: #8a919b;
  --qg-neutral-600: #626a75;
  --qg-neutral-700: #414852;
  --qg-neutral-900: #17191c;
  --qg-neutral-alpha-06: rgba(23, 25, 28, .06);
  --qg-neutral-alpha-10: rgba(23, 25, 28, .10);
  --qg-neutral-alpha-14: rgba(23, 25, 28, .14);
  --qg-white-alpha-10: rgba(255, 255, 255, .10);
  --qg-white-alpha-18: rgba(255, 255, 255, .18);
  --qg-white-alpha-30: rgba(255, 255, 255, .30);

  --qg-success: #218657;
  --qg-success-soft: rgba(33, 134, 87, .10);
  --qg-warning: #b87914;
  --qg-warning-soft: rgba(184, 121, 20, .12);
  --qg-vip-bg: linear-gradient(90deg, #ffd900, #ffbd2f);
  --qg-vip-text: #5c3c00;
  --qg-danger: #c63f3f;
  --qg-danger-soft: rgba(198, 63, 63, .10);

  --qg-gradient-cover-1:
    radial-gradient(circle at 70% 16%, rgba(74, 69, 232, .88), transparent 34%),
    radial-gradient(circle at 30% 108%, rgba(34, 194, 224, .86), transparent 38%),
    linear-gradient(135deg, #745cff 0%, #df79de 52%, #ffb693 100%);
  --qg-gradient-cover-2:
    radial-gradient(circle at 72% 12%, rgba(255, 68, 0, .76), transparent 36%),
    radial-gradient(circle at 35% 112%, rgba(255, 215, 82, .9), transparent 42%),
    linear-gradient(135deg, #ff5b09 0%, #ff8e39 52%, #ffd866 100%);
  --qg-gradient-cover-3:
    radial-gradient(circle at 72% 12%, rgba(105, 132, 220, .54), transparent 36%),
    radial-gradient(circle at 26% 108%, rgba(128, 220, 230, .64), transparent 40%),
    linear-gradient(135deg, #78b7e8 0%, #d6ddf0 48%, #efb8cf 100%);
  --qg-gradient-cover-4:
    radial-gradient(circle at 74% 18%, rgba(151, 76, 130, .5), transparent 36%),
    radial-gradient(circle at 25% 110%, rgba(255, 175, 146, .82), transparent 42%),
    linear-gradient(135deg, #d8858e 0%, #e99b9d 50%, #d6bb78 100%);
  --qg-gradient-cover-5:
    radial-gradient(circle at 68% 10%, rgba(68, 65, 155, .75), transparent 36%),
    radial-gradient(circle at 32% 110%, rgba(78, 190, 201, .76), transparent 42%),
    linear-gradient(135deg, #645acb 0%, #bc78ba 50%, #efac9b 100%);
  --qg-gradient-cover-6:
    radial-gradient(circle at 74% 14%, rgba(208, 76, 67, .58), transparent 38%),
    radial-gradient(circle at 28% 110%, rgba(255, 210, 102, .86), transparent 42%),
    linear-gradient(135deg, #eb806d 0%, #f4a175 48%, #e7c77d 100%);
  --qg-gradient-shape-1: linear-gradient(135deg, rgba(255, 255, 255, .34), rgba(67, 78, 225, .72));
  --qg-gradient-shape-2: linear-gradient(135deg, rgba(255, 255, 255, .30), rgba(255, 91, 0, .68));
  --qg-gradient-shape-3: linear-gradient(135deg, rgba(255, 255, 255, .58), rgba(91, 176, 215, .54));
  --qg-gradient-shape-4: linear-gradient(135deg, rgba(255, 255, 255, .34), rgba(117, 68, 119, .58));
  --qg-gradient-badge-1: linear-gradient(145deg, #8063ff, #3f4ee8);
  --qg-gradient-badge-2: linear-gradient(145deg, #ff8d1e, #ff6c00);
  --qg-gradient-badge-3: linear-gradient(145deg, #6fb7e8, #378bc5);
  --qg-gradient-badge-4: linear-gradient(145deg, #e9867d, #c94d61);
  --qg-gradient-badge-5: linear-gradient(145deg, #776ce3, #4039a4);
  --qg-gradient-badge-6: linear-gradient(145deg, #f39b45, #db653c);

  --qg-radius-card: 16px;
  --qg-radius-market-card: 20px;
  --qg-radius-control: 9px;
  --qg-radius-tag: 6px;
  --qg-radius-round: 999px;

  --qg-shadow-card: 0 8px 24px var(--qg-neutral-alpha-06);
  --qg-shadow-card-hover: 0 16px 36px var(--qg-neutral-alpha-10);
  --qg-shadow-market-card: 0 4px 10px var(--qg-neutral-alpha-10);
  --qg-shadow-market-card-hover: 0 14px 30px var(--qg-neutral-alpha-14);

  --qg-space-1: 8px;
  --qg-space-2: 16px;
  --qg-space-3: 24px;
  --qg-space-4: 32px;

  --qg-control-height: 42px;
  --qg-market-sidebar-width: 256px;
  --qg-market-card-height: 380px;
  --qg-market-cover-height: 140px;
  --qg-market-icon-size: 80px;
  --qg-transition-fast: 160ms ease;
}

html {
  font-family: var(--qg-font-family);
}