/* Fonts: use China-accessible mirror with local system fallback */
@import url('https://fonts.font.im/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* @group-priority: primary, accent-blue, accent-teal, success, info */

:root {
  /* primary */
  --xhy-primary-50: #F1EDFE; /* AI-generated */  --xhy-primary-100: #E0D7FB; /* AI-generated */
  --xhy-primary-200: #C4B2F6; /* AI-generated */ --xhy-primary-300: #A98CF1; /* AI-generated */
  --xhy-primary-400: #8B6DEC; /* AI-generated */ --xhy-primary-500: #7960E8; /* AI-generated */
  --xhy-primary-600: #6C53EA; /* @primary */ /* AI-generated */ --xhy-primary-700: #5840C7; /* AI-generated */
  --xhy-primary-800: #42339D; /* AI-generated */ --xhy-primary-900: #2D2472; /* AI-generated */

  /* accent-blue */
  --xhy-accent-blue-50: #EDF4FF; /* AI-generated */  --xhy-accent-blue-100: #D9E7FF; /* AI-generated */
  --xhy-accent-blue-200: #B6D0FF; /* AI-generated */ --xhy-accent-blue-300: #8FB5FF; /* AI-generated */
  --xhy-accent-blue-400: #6A9CFF; /* AI-generated */ --xhy-accent-blue-500: #4A8EFF; /* @primary */ /* AI-generated */
  --xhy-accent-blue-600: #3A76E0; /* AI-generated */ --xhy-accent-blue-700: #2D5DB3; /* AI-generated */
  --xhy-accent-blue-800: #234890; /* AI-generated */ --xhy-accent-blue-900: #1A3568; /* AI-generated */

  /* accent-teal */
  --xhy-accent-teal-50: #E6FAF5; /* AI-generated */  --xhy-accent-teal-100: #C5F2E8; /* AI-generated */
  --xhy-accent-teal-200: #94E5D2; /* AI-generated */ --xhy-accent-teal-300: #62D8BC; /* AI-generated */
  --xhy-accent-teal-400: #36C7A6; /* AI-generated */ --xhy-accent-teal-500: #10AD96; /* @primary */ /* AI-generated */
  --xhy-accent-teal-600: #0B8E7A; /* AI-generated */ --xhy-accent-teal-700: #087060; /* AI-generated */
  --xhy-accent-teal-800: #065248; /* AI-generated */ --xhy-accent-teal-900: #033830; /* AI-generated */

  /* neutral */
  --xhy-neutral-50: #F7F6FD; /* AI-generated */ --xhy-neutral-100: #EFEDF5; /* AI-generated */
  --xhy-neutral-200: #E4E0F0; /* AI-generated */ --xhy-neutral-300: #D2CEDE; /* AI-generated */
  --xhy-neutral-400: #B0ACC4; /* AI-generated */ --xhy-neutral-500: #808094; /* @primary */ /* AI-generated */
  --xhy-neutral-600: #5A5A78; /* AI-generated */ --xhy-neutral-700: #484860; /* AI-generated */
  --xhy-neutral-800: #2A2A40; /* AI-generated */ --xhy-neutral-900: #0E0E18; /* AI-generated */

  /* success */
  --xhy-success-50: #E8FAEC; /* AI-generated */  --xhy-success-100: #C7F0D2; /* AI-generated */
  --xhy-success-200: #95E0A8; /* AI-generated */ --xhy-success-300: #5FCD7E; /* AI-generated */
  --xhy-success-400: #34B85D; /* AI-generated */ --xhy-success-500: #1FA349; /* @primary */ /* AI-generated */
  --xhy-success-600: #178A3D; /* AI-generated */ --xhy-success-700: #126C30; /* AI-generated */
  --xhy-success-800: #0D5124; /* AI-generated */ --xhy-success-900: #083719; /* AI-generated */

  /* warning */
  --xhy-warning-50: #FFF7E6; /* AI-generated */  --xhy-warning-100: #FFEAC2; /* AI-generated */
  --xhy-warning-200: #FFD388; /* AI-generated */ --xhy-warning-300: #FFBA4D; /* AI-generated */
  --xhy-warning-400: #FFA31F; /* AI-generated */ --xhy-warning-500: #F08800; /* @primary */ /* AI-generated */
  --xhy-warning-600: #C66E00; /* AI-generated */ --xhy-warning-700: #9C5500; /* AI-generated */
  --xhy-warning-800: #733E00; /* AI-generated */ --xhy-warning-900: #4D2900; /* AI-generated */

  /* error */
  --xhy-error-50: #FEEBEB; /* AI-generated */  --xhy-error-100: #FDCFCF; /* AI-generated */
  --xhy-error-200: #FAA5A5; /* AI-generated */ --xhy-error-300: #F67676; /* AI-generated */
  --xhy-error-400: #EF4848; /* AI-generated */ --xhy-error-500: #E22222; /* @primary */ /* AI-generated */
  --xhy-error-600: #BC1818; /* AI-generated */ --xhy-error-700: #941414; /* AI-generated */
  --xhy-error-800: #6E1010; /* AI-generated */ --xhy-error-900: #480B0B; /* AI-generated */

  /* info */
  --xhy-info-50: #E8F1FF; /* AI-generated */  --xhy-info-100: #CFE2FF; /* AI-generated */
  --xhy-info-200: #A2C4FF; /* AI-generated */ --xhy-info-300: #74A5FF; /* AI-generated */
  --xhy-info-400: #4887F7; /* AI-generated */ --xhy-info-500: #2569E8; /* @primary */ /* AI-generated */
  --xhy-info-600: #1A52C4; /* AI-generated */ --xhy-info-700: #143F99; /* AI-generated */
  --xhy-info-800: #0F2F73; /* AI-generated */ --xhy-info-900: #0A1F4D; /* AI-generated */

  /* text */
  --foreground: #0E0E18; /* @primary */ --muted-foreground: #484860; --light-muted-foreground: #808094;
  --primary-foreground: #FFFFFF; --accent-foreground: #FFFFFF; --on-muted: #0E0E18;

  /* surface */
  --background: #F7F6FD; /* @primary */ --surface: #FAF8FF; --card: #FAF8FF; --popover: #FFFFFF;
  --muted: #EFEDF5; --border: #E4E0F0; --ring: #6C53EA; --overlay: rgba(14,14,24,0.48);

  /* semantic aliases */
  --primary: var(--xhy-primary-600); --accent: var(--xhy-accent-blue-500);
  --accent-hover: var(--xhy-accent-blue-600); --teal: var(--xhy-accent-teal-500);
  --success: var(--xhy-success-500); --warning: var(--xhy-warning-500);
  --error: var(--xhy-error-500); --info: var(--xhy-info-500); --link: var(--xhy-primary-600);
  --xhy-radius-sm: var(--radius-sm); --xhy-radius-md: var(--radius-md); --xhy-radius-lg: var(--radius-lg);
  --xhy-mid-bg-1: #FBF6EE; --xhy-mid-bg-2: #F5ECDB; --xhy-mid-bg-3: #EFE2C9;
  --xhy-mid-accent: #C99533;

  /* typography */
  --font-display: 'Manrope', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  --font-heading: 'Manrope', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', Consolas, 'Courier New', monospace;
  --font-size-display: 72px; --font-size-h1: 61px;
  --font-size-h2: 43px; --font-size-h3: 24px;
  --font-size-h4: 20px; --font-size-body: 16px;
  --font-size-lead: 18px; --font-size-caption: 12px;
  --font-size-eyebrow: 11px; --font-size-mono: 14px;
  --font-weight-display: 700; --font-weight-h1: 600;
  --font-weight-h2: 600; --font-weight-h3: 600;
  --font-weight-h4: 600; --font-weight-body: 400;
  --font-weight-lead: 400; --font-weight-caption: 400;
  --font-weight-eyebrow: 600; --font-weight-mono: 400;
  --line-height-display: 1.1; --line-height-h1: 1.15;
  --line-height-h2: 1.2; --line-height-h3: 1.3;
  --line-height-h4: 1.4; --line-height-body: 1.6;
  --line-height-lead: 1.7; --line-height-caption: 1.5;
  --line-height-eyebrow: 1.4; --line-height-mono: 1.6;

  /* spacing */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-7: 28px; --space-8: 32px;
  --space-9: 36px; --space-10: 40px; --space-11: 44px; --space-12: 48px;
  --space-13: 52px; --space-14: 56px; --space-15: 60px; --space-16: 64px;

  /* size */
  --size-icon-sm: 16px; --size-icon-md: 20px; --size-icon-lg: 24px;
  --size-button-sm: 32px; --size-button-md: 40px; --size-button-lg: 48px; --size-input: 40px;

  /* radius */
  --radius-xs: 4px; --radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px;
  --radius-xl: 16px; --radius-2xl: 20px; --radius-full: 9999px;

  /* shadow */
  --shadow-1: rgba(30,28,64,0.04) 0px 1px 2px 0px, rgba(108,83,234,0.08) 0px 2px 8px -2px; /* Card */
  --shadow-2: rgba(30,28,64,0.05) 0px 2px 4px -1px, rgba(108,83,234,0.10) 0px 4px 12px -3px; /* Card Hover */
  --shadow-3: rgba(108,83,234,0.16) 0px 6px 16px -4px, rgba(30,28,64,0.06) 0px 3px 8px -2px; /* Float */
  --shadow-4: rgba(108,83,234,0.40) 0px 4px 14px -4px, rgba(30,28,64,0.12) 0px 10px 28px -8px; /* Modal */
  --shadow-5: rgba(108,83,234,0.45) 0px 16px 48px -12px, rgba(14,14,24,0.30) 0px 24px 60px -20px; /* Overlay */

  /* portable aliases */
  --color-primary: var(--primary); --color-accent: var(--accent); --color-teal: var(--teal);
  --color-foreground: var(--foreground); --color-background: var(--background);
  --color-border: var(--border); --color-card: var(--card); --color-surface: var(--surface);
  --color-muted-foreground: var(--muted-foreground); --color-success: var(--success);
  --color-warning: var(--warning); --color-error: var(--error); --color-info: var(--info);
  --color-on-primary: #FFFFFF; --color-ring: var(--ring);
  --type-display: var(--font-display); --type-body: var(--font-body); --type-mono: var(--font-mono);
  --font-family-base: var(--font-body);
}

.dark {
  --background: #0E0E18; --surface: #16152A; --card: #1A1830; --popover: #1A1830;
  --foreground: #F7F6FD; --muted: #221F3A; --muted-foreground: #A8A4C4; --border: #2E2A4A;
  --primary: #8B6DEC; --accent: #6A9CFF; --teal: #36C7A6; --ring: #8B6DEC;
  --light-muted-foreground: #808094; --overlay: rgba(0,0,0,0.64);
  --color-background: var(--background); --color-foreground: var(--foreground);
  --color-card: var(--card); --color-surface: var(--surface); --color-border: var(--border);
  --color-primary: var(--primary); --color-accent: var(--accent); --color-muted-foreground: var(--muted-foreground);
}

.xhy-display { font-family: var(--font-display); font-size: 4.5rem; font-weight: var(--font-weight-display); line-height: var(--line-height-display); letter-spacing: -0.02em; }
.xhy-h1 { font-family: var(--font-heading); font-size: 3.8125rem; font-weight: var(--font-weight-h1); line-height: var(--line-height-h1); letter-spacing: -0.02em; }
.xhy-h2 { font-family: var(--font-heading); font-size: 2.6875rem; font-weight: var(--font-weight-h2); line-height: var(--line-height-h2); letter-spacing: -0.01em; }
.xhy-h3 { font-family: var(--font-heading); font-size: 1.5rem; font-weight: var(--font-weight-h3); line-height: var(--line-height-h3); }
.xhy-h4 { font-family: var(--font-heading); font-size: 1.25rem; font-weight: var(--font-weight-h4); line-height: var(--line-height-h4); }
.xhy-body { font-family: var(--font-body); font-size: 1rem; font-weight: var(--font-weight-body); line-height: var(--line-height-body); }
.xhy-lead { font-family: var(--font-body); font-size: 1.125rem; font-weight: var(--font-weight-lead); line-height: var(--line-height-lead); }
.xhy-caption { font-family: var(--font-body); font-size: 0.75rem; font-weight: var(--font-weight-caption); line-height: var(--line-height-caption); }
.xhy-eyebrow { font-family: var(--font-body); font-size: 0.6875rem; font-weight: var(--font-weight-eyebrow); line-height: var(--line-height-eyebrow); letter-spacing: 0.08em; text-transform: uppercase; }
.xhy-mono { font-family: var(--font-mono); font-size: 0.875rem; font-weight: var(--font-weight-mono); line-height: var(--line-height-mono); }