/**
 * 九天代理 - 设计系统令牌 (Design Tokens)
 *
 * 层级结构：
 * 1. 颜色系统 (Colors)
 * 2. 间距系统 (Spacing)
 * 3. 排版系统 (Typography)
 * 4. 尺寸系统 (Sizing)
 * 5. 边框系统 (Borders)
 * 6. 阴影系统 (Shadows)
 * 7. 动效系统 (Transitions & Animations)
 * 8. 层级系统 (Z-Index)
 * 9. 断点系统 (Breakpoints)
 * 10. 组件令牌 (Component-specific Tokens)
 *
 * 使用原则：
 * 1. 优先使用语义化变量（如 --color-primary）
 * 2. 原始值（如 #49C9FF）只作为值来源
 * 3. 从抽象到具体，避免直接使用原始值
 */

:root {
    /* ==========================================================================
       1. 颜色系统
       ========================================================================== */

    /* 1.1 原始颜色值 - 设计师维护，开发者不应直接使用 */
    --color-raw-primary: #49C9FF;
    --color-raw-success: #0ACF83;
    --color-raw-warning: #FF7B2A;
    --color-raw-error: #FF5A5A;
    --color-raw-info: #49C9FF;
    --color-raw-accent-1: #B56DEF;
    --color-raw-accent-2: #08A0F7;

    /* 1.2 语义化颜色 - 开发者的主要接口 */
    --color-primary: var(--color-raw-primary);
    --color-primary-hover: #6AD4FF;
    --color-primary-active: #2AB7FF;
    --color-primary-bg: #E6F7FF;
    --color-primary-border: #9AE0FF;

    --color-success: var(--color-raw-success);
    --color-success-hover: #2BDA95;
    --color-success-active: #00B06B;
    --color-success-bg: #E8F9F1;
    --color-success-border: #90E0BB;

    --color-warning: var(--color-raw-warning);
    --color-warning-hover: #FF944C;
    --color-warning-active: #D16000;
    --color-warning-bg: #FBF9F7;
    --color-warning-border: #FFC7A6;

    --color-error: var(--color-raw-error);
    --color-error-hover: #FF7875;
    --color-error-active: #E63946;
    --color-error-bg: #FFEFEF;
    --color-error-border: #FFB8B8;

    --color-info: var(--color-raw-info);
    --color-info-hover: #6AD4FF;
    --color-info-active: #2AB7FF;
    --color-info-bg: #E6F7FF;
    --color-info-border: #9AE0FF;

    /* 链接色 */
    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-hover);
    --color-link-active: var(--color-primary-active);
    --color-link-visited: #8A5FFB;

    /* 辅助色 */
    --color-accent-1: var(--color-raw-accent-1);
    --color-accent-1-hover: #C78FFF;
    --color-accent-1-active: #9E4FDF;
    --color-accent-1-bg: #F4E8FF;
    --color-accent-1-border: #D9B3FF;

    --color-accent-2: var(--color-raw-accent-2);
    --color-accent-2-hover: #2BAFF9;
    --color-accent-2-active: #0684D4;
    --color-accent-2-bg: #E8F6FF;
    --color-accent-2-border: #A6D9FF;

    /* 1.3 中性色阶 - 文本、背景、边框 */
    --color-neutral-title: #12141D;
    --color-neutral-text: rgba(0, 0, 0, 0.85);
    --color-neutral-text-secondary: rgba(0, 0, 0, 0.65);
    --color-neutral-text-tertiary: rgba(0, 0, 0, 0.45);
    --color-neutral-text-quaternary: rgba(0, 0, 0, 0.25);
    --color-neutral-text-disabled: rgba(0, 0, 0, 0.15);

    --color-neutral-border: #D6DDE4;
    --color-neutral-border-secondary: #EDF1F5;
    --color-neutral-border-tertiary: #F1F5F9;
    --color-neutral-divider: rgba(184, 196, 205, 0.5);

    --color-neutral-bg: #FFFFFF;
    --color-neutral-bg-secondary: #F8FAFC;
    --color-neutral-bg-tertiary: #F1F5F9;
    --color-neutral-bg-disabled: rgba(0, 0, 0, 0.04);

    --color-neutral-fill: rgba(0, 0, 0, 0.15);
    --color-neutral-fill-secondary: rgba(0, 0, 0, 0.06);
    --color-neutral-fill-tertiary: rgba(0, 0, 0, 0.02);

    /* 1.4 产品标识色 */
    --color-product-dps: var(--color-primary);
    --color-product-tps: var(--color-accent-1);
    --color-product-api: var(--color-accent-2);

    /* 1.5 功能状态色 */
    --color-state-active: var(--color-primary);
    --color-state-selected: var(--color-primary-bg);
    --color-state-hover: rgba(73, 201, 255, 0.08);
    --color-state-focus: rgba(73, 201, 255, 0.15);
    --color-state-disabled: var(--color-neutral-bg-disabled);

    /* 1.6 简化别名（兼容旧代码） */
    --color-text: var(--color-neutral-text);
    --color-text-secondary: var(--color-neutral-text-secondary);
    --color-text-tertiary: var(--color-neutral-text-tertiary);
    --color-text-disabled: var(--color-neutral-text-disabled);
    --color-text-link: var(--color-link);
    --color-text-link-hover: var(--color-link-hover);
    --color-danger: var(--color-error);
    --color-danger-bg: var(--color-error-bg);
    --color-danger-border: var(--color-error-border);

    /* 控制台专用变量 */
    --color-console-bg: #F7F8FB;
    --color-console-text-header: #C5D0DD;
    --color-console-text-header-hover: #FFFFFF;

    /* 特殊标记颜色 */
    --color-tag-new: #FFD166;
    --color-tag-hot: linear-gradient(135deg, var(--color-error) 0%, var(--color-warning) 100%);

    /* 输入框相关颜色 */
    --color-input-border: var(--color-neutral-border);
    --color-input-border-hover: var(--color-primary);
    --color-input-border-focus: var(--color-primary);
    --color-input-bg-disabled: var(--color-neutral-bg-disabled);
    --color-input-text-disabled: var(--color-neutral-text-disabled);
    --color-input-placeholder: var(--color-neutral-text-tertiary);
    --color-input-shadow-focus: rgba(73, 201, 255, 0.15);
    --color-input-shadow-focus-error: rgba(255, 90, 90, 0.2);

    /* ==========================================================================
       2. 间距系统 (扩展自 layout.css)
       ========================================================================== */

    /* 2.1 基础单位 (基于 4px = 0.25rem) */
    --spacing-unit: 0.25rem; /* 4px - 设计基础单位 */
    --spacing-px: 1px; /* 1像素单位 */

    /* 2.2 间距刻度 (0-20) */
    --spacing-0: 0;
    --spacing-0-5: calc(0.5 * var(--spacing-unit)); /* 2px */
    --spacing-1: calc(1 * var(--spacing-unit)); /* 4px */
    --spacing-1-5: calc(1.5 * var(--spacing-unit)); /* 6px */
    --spacing-2: calc(2 * var(--spacing-unit)); /* 8px */
    --spacing-2-5: calc(2.5 * var(--spacing-unit)); /* 10px */
    --spacing-3: calc(3 * var(--spacing-unit)); /* 12px */
    --spacing-3-5: calc(3.5 * var(--spacing-unit)); /* 14px */
    --spacing-4: calc(4 * var(--spacing-unit)); /* 16px */
    --spacing-5: calc(5 * var(--spacing-unit)); /* 20px */
    --spacing-6: calc(6 * var(--spacing-unit)); /* 24px */
    --spacing-7: calc(7 * var(--spacing-unit)); /* 28px */
    --spacing-8: calc(8 * var(--spacing-unit)); /* 32px */
    --spacing-9: calc(9 * var(--spacing-unit)); /* 36px */
    --spacing-10: calc(10 * var(--spacing-unit)); /* 40px */
    --spacing-12: calc(12 * var(--spacing-unit)); /* 48px */
    --spacing-14: calc(14 * var(--spacing-unit)); /* 56px */
    --spacing-16: calc(16 * var(--spacing-unit)); /* 64px */
    --spacing-20: calc(20 * var(--spacing-unit)); /* 80px */
    --spacing-24: calc(24 * var(--spacing-unit)); /* 96px */
    --spacing-28: calc(28 * var(--spacing-unit)); /* 112px */
    --spacing-32: calc(32 * var(--spacing-unit)); /* 128px */

    /* 2.3 语义化间距 - 用于特定场景 */
    --spacing-container-padding: var(--spacing-4);
    --spacing-section-padding-y: var(--spacing-16);
    --spacing-section-padding-x: var(--spacing-4);
    --spacing-card-padding: var(--spacing-6);
    --spacing-button-padding-y: var(--spacing-2);
    --spacing-button-padding-x: var(--spacing-4);
    --spacing-input-padding-y: var(--spacing-2);
    --spacing-input-padding-x: var(--spacing-3);
    --spacing-gutter: var(--spacing-4);

    /* ==========================================================================
       3. 排版系统 (扩展自 typography.css)
       ========================================================================== */

    /* 3.1 字体家族 */
    --font-family-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
    --font-family-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, 'Courier New', monospace;
    --font-family-base: var(--font-family-sans);
    --font-family-heading: var(--font-family-sans);

    /* 3.2 字体大小 (rem 单位) */
    --font-size-xs: 0.75rem; /* 12px */
    --font-size-sm: 0.875rem; /* 14px */
    --font-size-base: 1rem; /* 16px */
    --font-size-lg: 1.125rem; /* 18px */
    --font-size-xl: 1.25rem; /* 20px */
    --font-size-2xl: 1.5rem; /* 24px */
    --font-size-3xl: 1.875rem; /* 30px */
    --font-size-4xl: 2.25rem; /* 36px */
    --font-size-5xl: 3rem; /* 48px */
    --font-size-6xl: 3.75rem; /* 60px */
    --font-size-7xl: 4.5rem; /* 72px */
    --font-size-8xl: 6rem; /* 96px */
    --font-size-9xl: 8rem; /* 128px */

    /* 3.3 响应式字体大小 (使用 clamp) */
    --font-size-responsive-sm: clamp(0.875rem, 2vw, 1rem);
    --font-size-responsive-base: clamp(1rem, 2.5vw, 1.125rem);
    --font-size-responsive-lg: clamp(1.125rem, 3vw, 1.5rem);
    --font-size-responsive-xl: clamp(1.5rem, 4vw, 2rem);
    --font-size-responsive-2xl: clamp(1.875rem, 5vw, 2.5rem);
    --font-size-responsive-3xl: clamp(2.25rem, 6vw, 3rem);
    --font-size-responsive-4xl: clamp(3rem, 7vw, 4rem);

    /* 3.4 字重 */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --font-weight-black: 900;

    /* 3.5 行高 */
    --line-height-none: 1;
    --line-height-tight: 1.25;
    --line-height-snug: 1.375;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.625;
    --line-height-loose: 2;

    /* 3.6 字母间距 */
    --letter-spacing-tighter: -0.05em;
    --letter-spacing-tight: -0.025em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.025em;
    --letter-spacing-wider: 0.05em;
    --letter-spacing-widest: 0.1em;

    /* ==========================================================================
       4. 尺寸系统 (Sizing)
       ========================================================================== */

    /* 4.1 基础尺寸 */
    --size-0: 0;
    --size-px: 1px;
    --size-0-5: 0.125rem; /* 2px */
    --size-1: 0.25rem; /* 4px */
    --size-2: 0.5rem; /* 8px */
    --size-2-5: 0.625rem; /* 10px */
    --size-3: 0.75rem; /* 12px */
    --size-4: 1rem; /* 16px */
    --size-5: 1.25rem; /* 20px */
    --size-6: 1.5rem; /* 24px */
    --size-7: 1.75rem; /* 28px */
    --size-8: 2rem; /* 32px */
    --size-9: 2.25rem; /* 36px */
    --size-10: 2.5rem; /* 40px */
    --size-11: 2.75rem; /* 44px */
    --size-12: 3rem; /* 48px */
    --size-14: 3.5rem; /* 56px */
    --size-16: 4rem; /* 64px */
    --size-18: 4.5rem; /* 72px */
    --size-20: 5rem; /* 80px */
    --size-24: 6rem; /* 96px */
    --size-28: 7rem; /* 112px */
    --size-32: 8rem; /* 128px */
    --size-36: 9rem; /* 144px */
    --size-40: 10rem; /* 160px */
    --size-44: 11rem; /* 176px */
    --size-48: 12rem; /* 192px */
    --size-50: 12.5rem; /* 200px */
    --size-52: 13rem; /* 208px */
    --size-56: 14rem; /* 224px */
    --size-60: 15rem; /* 240px */
    --size-64: 16rem; /* 256px */
    --size-72: 18rem; /* 288px */
    --size-80: 20rem; /* 320px */
    --size-96: 24rem; /* 384px */

    /* 4.2 百分比尺寸 */
    --size-p-1-2: 50%;
    --size-p-1-3: 33.333333%;
    --size-p-2-3: 66.666667%;
    --size-p-1-4: 25%;
    --size-p-3-4: 75%;
    --size-p-1-5: 20%;
    --size-full: 100%;
    --size-screen: 100vw;
    --size-screen-height: 100vh;

    /* 4.3 最大/最小尺寸 */
    --size-max-xs: 20rem; /* 320px */
    --size-max-sm: 24rem; /* 384px */
    --size-max-md: 28rem; /* 448px */
    --size-max-lg: 32rem; /* 512px */
    --size-max-xl: 36rem; /* 576px */
    --size-max-2xl: 42rem; /* 672px */
    --size-max-3xl: 48rem; /* 768px */
    --size-max-4xl: 56rem; /* 896px */
    --size-max-5xl: 64rem; /* 1024px */
    --size-max-6xl: 72rem; /* 1152px */
    --size-max-7xl: 80rem; /* 1280px */

    /* 4.4 负尺寸 */
    --size--0-5: -0.125rem; /* -2px */
    --size--1: -0.25rem; /* -4px */
    --size--2: -0.5rem; /* -8px */
    --size--2-5: -0.625rem; /* -10px */
    --size--3: -0.75rem; /* -12px */
    --size--4: -1rem; /* -16px */
    --size--5: -1.25rem; /* -20px */
    --size--6: -1.5rem; /* -24px */
    --size--8: -2rem; /* -32px */
    --size--10: -2.5rem; /* -40px */
    --size--12: -3rem; /* -48px */
    --size--16: -4rem; /* -64px */
    --size--20: -5rem; /* -80px */
    --size--24: -6rem; /* -96px */
    --size--32: -8rem; /* -128px */

    /* ==========================================================================
       5. 边框系统 (Borders)
       ========================================================================== */

    /* 5.1 边框宽度 */
    --border-width-0: 0;
    --border-width-1: 1px;
    --border-width-2: 2px;
    --border-width-3: 3px;
    --border-width-4: 4px;
    --border-width-8: 8px;

    /* 5.2 边框样式 */
    --border-style-solid: solid;
    --border-style-dashed: dashed;
    --border-style-dotted: dotted;
    --border-style-double: double;
    --border-style-none: none;

    /* 5.3 边框颜色 (使用颜色系统变量) */
    --border-color-default: var(--color-neutral-border);
    --border-color-muted: var(--color-neutral-border-secondary);
    --border-color-emphasis: var(--color-neutral-border);
    --border-color-primary: var(--color-primary-border);
    --border-color-error: var(--color-error-border);
    --border-color-success: var(--color-success-border);
    --border-color-warning: var(--color-warning-border);

    /* 5.4 圆角半径 (扩展自 utilities.css) */
    --radius-none: 0;
    --radius-sm: 0.125rem; /* 2px */
    --radius-base: 0.25rem; /* 4px */
    --radius-md: 0.5rem; /* 8px */
    --radius-lg: 0.75rem; /* 12px */
    --radius-xl: 1rem; /* 16px */
    --radius-2xl: 1.5rem; /* 24px */
    --radius-3xl: 2rem; /* 32px */
    --radius-full: 9999px;

    /* ==========================================================================
       6. 阴影系统 (Shadows)
       ========================================================================== */

    /* 6.1 基础阴影 */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    --shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
    --shadow-none: 0 0 #0000;
    --shadow-right: 1px 0 3px -1px rgba(0, 0, 0, 0.1), 1px 0 2px -1px rgba(0, 0, 0, 0.06);

    /* 6.2 彩色阴影 (基于主色调) */
    --shadow-primary: 0 4px 14px 0 rgba(73, 201, 255, 0.25);
    --shadow-primary-lg: 0 10px 25px 0 rgba(73, 201, 255, 0.3);
    --shadow-error: 0 4px 14px 0 rgba(255, 90, 90, 0.25);
    --shadow-success: 0 4px 14px 0 rgba(10, 207, 131, 0.25);

    /* 6.3 特殊阴影 */
    --shadow-focus: 0 0 0 3px rgba(73, 201, 255, 0.15);
    --shadow-focus-error: 0 0 0 3px rgba(255, 90, 90, 0.2);
    --shadow-focus-success: 0 0 0 3px rgba(10, 207, 131, 0.2);
    --shadow-focus-warning: 0 0 0 3px rgba(255, 181, 71, 0.2);

    /* ==========================================================================
       7. 动效系统 (Transitions & Animations)
       ========================================================================== */

    /* 7.1 过渡时间 */
    --transition-duration-75: 75ms;
    --transition-duration-100: 100ms;
    --transition-duration-150: 150ms;
    --transition-duration-200: 200ms;
    --transition-duration-250: 250ms;
    --transition-duration-300: 300ms;
    --transition-duration-350: 350ms;
    --transition-duration-500: 500ms;
    --transition-duration-700: 700ms;
    --transition-duration-1000: 1000ms;

    /* 7.2 缓动函数 */
    --transition-timing-linear: linear;
    --transition-timing-ease: ease;
    --transition-timing-ease-in: ease-in;
    --transition-timing-ease-out: ease-out;
    --transition-timing-ease-in-out: ease-in-out;
    --transition-timing-cubic-bezier: cubic-bezier(0.4, 0, 0.2, 1);

    /* 7.3 标准过渡组合 */
    --transition-fast: var(--transition-duration-150) var(--transition-timing-ease);
    --transition-base: var(--transition-duration-250) var(--transition-timing-ease);
    --transition-slow: var(--transition-duration-350) var(--transition-timing-ease);
    --transition-smooth: var(--transition-duration-300) var(--transition-timing-cubic-bezier);

    /* 7.4 动画时长 */
    --animation-duration-fast: var(--transition-duration-150);
    --animation-duration-base: var(--transition-duration-300);
    --animation-duration-slow: var(--transition-duration-500);

    /* ==========================================================================
       8. 层级系统 (Z-Index)
       ========================================================================== */

    --z-index-auto: auto;
    --z-index-0: 0;
    --z-index-10: 10;
    --z-index-20: 20;
    --z-index-30: 30;
    --z-index-40: 40;
    --z-index-50: 50;
    --z-index-100: 100;
    --z-index-200: 200;
    --z-index-300: 300;
    --z-index-400: 400;
    --z-index-500: 500;
    --z-index-1000: 1000;
    --z-index-1020: 1020;
    --z-index-1030: 1030;
    --z-index-1040: 1040;
    --z-index-1050: 1050;
    --z-index-1060: 1060;
    --z-index-1070: 1070;
    --z-index-1080: 1080;
    --z-index-2000: 2000;

    /* 语义化层级 */
    --z-index-dropdown: var(--z-index-1000);
    --z-index-sticky: var(--z-index-1020);
    --z-index-fixed: var(--z-index-1030);
    --z-index-modal-backdrop: var(--z-index-1040);
    --z-index-modal: var(--z-index-1050);
    --z-index-popover: var(--z-index-1060);
    --z-index-tooltip: var(--z-index-1070);
    --z-index-toast: var(--z-index-1080);
    --z-index-overlay: var(--z-index-2000);
    --z-index-max: 9999;

    /* ==========================================================================
       9. 断点系统 (扩展自 responsive.css)
       ========================================================================== */

    /* 9.1 断点值 */
    --breakpoint-xs: 0px;
    --breakpoint-sm: 480px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;
    --breakpoint-2xl: 1536px;
    --breakpoint-3xl: 1920px;

    /* 9.2 容器最大宽度 */
    --container-max-width-xs: 100%;
    --container-max-width-sm: 640px;
    --container-max-width-md: 768px;
    --container-max-width-lg: 1024px;
    --container-max-width-xl: 1280px;
    --container-max-width-2xl: 1536px;
    --container-max-width-3xl: 1920px;

    /* 9.3 媒体查询字符串 (用于 JS) */
    --mq-sm: '(min-width: 480px)';
    --mq-md: '(min-width: 768px)';
    --mq-lg: '(min-width: 1024px)';
    --mq-xl: '(min-width: 1280px)';
    --mq-2xl: '(min-width: 1536px)';

    /* ==========================================================================
       10. 组件令牌 (Component-specific Tokens)
       ========================================================================== */

    /* 10.1 按钮 (Button) */
    --button-height-sm: var(--size-8);
    --button-height-base: var(--size-10);
    --button-height-lg: var(--size-12);
    --button-padding-x-sm: var(--spacing-3);
    --button-padding-x-base: var(--spacing-4);
    --button-padding-x-lg: var(--spacing-6);
    --button-font-size-sm: var(--font-size-sm);
    --button-font-size-base: var(--font-size-base);
    --button-font-size-lg: var(--font-size-lg);
    --button-border-radius: var(--radius-base);

    /* 10.2 输入框 (Input) */
    --input-height-sm: var(--size-8);
    --input-height-base: var(--size-10);
    --input-height-lg: var(--size-12);
    --input-padding-x: var(--spacing-3);
    --input-padding-y: var(--spacing-2);
    --input-border-width: var(--border-width-1);
    --input-border-radius: var(--radius-base);
    --input-font-size: var(--font-size-base);
    --input-placeholder-color: var(--color-neutral-text-tertiary);

    /* 10.3 卡片 (Card) */
    --card-padding: var(--spacing-6);
    --card-border-radius: var(--radius-lg);
    --card-border-width: var(--border-width-1);
    --card-border-color: var(--color-neutral-border);
    --card-bg: var(--color-neutral-bg);
    --card-shadow: var(--shadow-base);

    /* 10.4 弹窗 (Modal) */
    --modal-max-width-sm: var(--size-max-sm);
    --modal-max-width-md: var(--size-max-md);
    --modal-max-width-lg: var(--size-max-lg);
    --modal-max-width-xl: var(--size-max-xl);
    --modal-padding: var(--spacing-6);
    --modal-border-radius: var(--radius-lg);
    --modal-backdrop-bg: rgba(0, 0, 0, 0.5);
    --modal-z-index: var(--z-index-modal);

    /* 10.5 导航 (Navigation) */
    --header-height: 4.5rem;
    --sidebar-width: 12.5rem;
    --sidebar-collapsed-width: 4rem;
    --footer-height: 4rem;

    /* 10.6 布局容器 (Layout) */
    --container-padding: var(--spacing-4);
    --section-padding-y: var(--spacing-16);
    --section-padding-x: var(--spacing-4);
    --content-max-width: var(--container-max-width-xl);
    --content-min-height: calc(100vh - var(--header-height) - var(--footer-height));

    /* 10.7 滚动条 (Scrollbar) */
    --scrollbar-width: var(--size-2);
    --scrollbar-height: var(--size-2);
    --scrollbar-thumb-color: var(--color-neutral-border);
    --scrollbar-track-color: var(--color-neutral-bg-secondary);
    --scrollbar-thumb-hover-color: var(--color-neutral-text-tertiary);
}

/* ==========================================================================
   响应式覆盖 (在媒体查询中更新令牌)
   ========================================================================== */
@media (min-width: 768px) {
    :root {
        --container-padding: var(--spacing-6);
        --section-padding-x: var(--spacing-8);
        --section-padding-y: var(--spacing-24);
    }
}

@media (min-width: 1024px) {
    :root {
        --container-padding: var(--spacing-8);
        --section-padding-y: var(--spacing-32);
    }
}