/* ============================================
   EraNova 设计系统 · tokens
   Hallmark · route: custom (tuned) · macrostructure: Marquee Hero
   theme: custom · vibe: "ocean-blue sky, light cards, calm"
   paper(dark): oklch(20% 0.02 246) · accent: oklch(66.9% 0.081 246) #6B9AC4
   paper(light): oklch(97% 0.008 246) · accent: oklch(56% 0.077 242) #4A7A9E
   display: Bricolage Grotesque · body: Switzer · outlier: JetBrains Mono
   axes: dark+light dual / display-heavy / cool-blue
   深色 = 星空蓝黑（不纯黑 · 保留发光），浅色 = 淡白卡片（回归原站）
   主题色 = 原站蓝色系 #6B9AC4，未更改
   ============================================ */

/* ---------- 字体 ---------- */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Switzer:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* ---------- 布局与层级 ---------- */
:root {
    --space-3xs: 0.125rem;  /*  2px */
    --space-2xs: 0.25rem;   /*  4px */
    --space-xs:  0.5rem;    /*  8px */
    --space-sm:  0.75rem;   /* 12px */
    --space-md:  1rem;      /* 16px */
    --space-lg:  1.5rem;    /* 24px */
    --space-xl:  2.5rem;    /* 40px */
    --space-2xl: 4rem;      /* 64px */
    --space-3xl: 6rem;      /* 96px */
    --space-4xl: 9rem;      /* 144px */

    --text-xs:   0.64rem;
    --text-sm:   0.8rem;
    --text-base: 1rem;
    --text-md:   1.25rem;
    --text-lg:   1.5625rem;
    --text-xl:   1.9531rem;
    --text-2xl:  2.4414rem;
    --text-3xl:  3.0518rem;
    --text-4xl:  3.8147rem;
    --text-display: clamp(2.75rem, 5vw + 1rem, 5.25rem);

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;

    --z-base:     1;
    --z-raised:   10;
    --z-dropdown: 100;
    --z-sticky:   200;
    --z-modal:    400;
    --z-toast:    500;
    --z-tooltip:  600;

    --font-display: "Bricolage Grotesque", "Noto Sans SC", sans-serif;
    --font-body:    "Switzer", "Noto Sans SC", "PingFang SC", system-ui, sans-serif;
    --font-mono:    "JetBrains Mono", "Consolas", monospace;

    --display-weight: 800;
    --tracking-display: -0.03em;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in:  cubic-bezier(0.4, 0, 0.68, 0.06);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --dur-fast: 0.15s;
    --dur-med:  0.25s;
    --dur-slow: 0.45s;
}

/* ========== 深色模式（默认 · 星空蓝黑 · 调亮） ========== */
:root,
:root[data-theme="dark"] {
    color-scheme: dark;

    /* 纸面：20% 亮度，比原来的 14% 明显更亮，不刺眼的深蓝 */
    --color-paper:      oklch(20% 0.022 246);
    --color-paper-2:    oklch(24% 0.024 246);
    --color-paper-3:    oklch(29% 0.026 246);
    --color-ink:        oklch(94% 0.012 246);
    --color-ink-2:      oklch(76% 0.014 246);
    --color-muted:      oklch(62% 0.014 246);
    --color-neutral:    oklch(55% 0.012 246);
    --color-rule:       oklch(34% 0.016 246);
    --color-rule-2:     oklch(28% 0.014 246);

    /* 主题色 = 原站 #6B9AC4（未更改） */
    --color-accent:     oklch(70% 0.085 246);
    --color-accent-ink: oklch(18% 0.02 246);
    --color-focus:      oklch(74% 0.11 246);
    --color-success:    oklch(72% 0.13 145);
    --color-warn:       oklch(74% 0.13 75);
    --color-danger:     oklch(66% 0.16 25);
    --color-info:       oklch(70% 0.10 246);

    --shadow-card: 0 1px 2px oklch(6% 0.01 246 / 0.5);
    --shadow-pop:  0 8px 30px oklch(6% 0.01 246 / 0.6);

    /* 保留发光（原站深色就有文字发光） */
    --glow-ink: 0 0 20px oklch(94% 0.012 246 / 0.4);
    --glow-soft: 0 0 12px oklch(70% 0.085 246 / 0.35);

    /* 背景遮罩：透明度约 60%，背景图透出，深色不至于全黑 */
    --bg-overlay: linear-gradient(
        to bottom,
        oklch(16% 0.02 246 / 0.60),
        oklch(20% 0.022 246 / 0.60) 45%,
        oklch(20% 0.022 246 / 0.62)
    );

    --nav-bg: oklch(17% 0.02 246 / 0.9);
    --card-bg: oklch(24% 0.024 246 / 0.8);
    --card-border: 1px solid oklch(38% 0.016 246 / 0.6);
    --code-bg: oklch(27% 0.024 246 / 0.7);
}

/* ========== 浅色模式（淡白 · 回归原站卡片） ========== */
:root[data-theme="light"] {
    color-scheme: light;

    /* 纸面：淡白，接近原站 rgba(255,255,255,0.92) 卡片底色 */
    --color-paper:      oklch(97.5% 0.006 246);
    --color-paper-2:    oklch(95% 0.008 246);
    --color-paper-3:    oklch(92% 0.01 246);
    --color-ink:        oklch(27.9% 0.037 249);   /* 原站 text-dark #1A2A3A */
    --color-ink-2:      oklch(40.2% 0.034 249);   /* 原站 text-gray #3A4A5A */
    --color-muted:      oklch(51.7% 0.032 248);   /* 原站 text-light #5A6A7A */
    --color-neutral:    oklch(58% 0.03 248);
    --color-rule:       oklch(84% 0.018 246);
    --color-rule-2:     oklch(89% 0.014 246);

    /* 主题色 = 原站深蓝 #4A7A9E（浅色下用深一点的蓝保证对比度） */
    --color-accent:     oklch(56% 0.077 242);     /* #4A7A9E */
    --color-accent-ink: oklch(97.5% 0.006 246);
    --color-focus:      oklch(48% 0.10 242);
    --color-success:    oklch(52% 0.12 145);
    --color-warn:       oklch(58% 0.12 75);
    --color-danger:     oklch(52% 0.15 25);
    --color-info:       oklch(50% 0.10 246);

    --shadow-card: 0 1px 2px oklch(30% 0.01 246 / 0.08);
    --shadow-pop:  0 8px 30px oklch(30% 0.01 246 / 0.12);

    --glow-ink: none;
    --glow-soft: 0 0 0 1px oklch(56% 0.077 242 / 0.2);

    /* 浅色下背景遮罩改浅（约 55% 不透明），背景图透出；卡片保持淡白 */
    --bg-overlay: linear-gradient(
        to bottom,
        oklch(97.5% 0.006 246 / 0.55),
        oklch(97.5% 0.006 246 / 0.58) 50%,
        oklch(97.5% 0.006 246 / 0.60)
    );

    --nav-bg: oklch(97.5% 0.006 246 / 0.88);
    --card-bg: oklch(97.5% 0.006 246 / 0.92);    /* 淡白卡片 rgba(255,255,255,0.92) */
    --card-border: 1px solid oklch(84% 0.018 246 / 0.8);
    --code-bg: oklch(93% 0.012 246 / 0.9);
}

/* ========== 文本尺寸（两主题共用） ========== */
:root {
    --text-body: var(--text-base);
    --text-body-line: 1.65;
    --text-display-lh: 1.05;
}