/* 字体导入 */
@import url("https://fontsapi.zeoseven.com/69/main/result.css");
@import url("https://fontsapi.zeoseven.com/285/main/result.css");
:root {
    /* === Primary Color System (#E50012) === */
    --color__primary: #E50012;
    --color__primary--dark: #B3000E;
    --color__primary--light: #FF3344;
    --color__primary--lighter: rgba(229, 0, 18, 0.1);
    --color__primary--ultra-light: rgba(229, 0, 18, 0.05);

    /* === Secondary Color System (#1D2087) === */
    --color__secondary: #1D2087;
    --color__secondary--dark: #15196A;
    --color__secondary--light: #2E32A8;
    --color__secondary--lighter: rgba(29, 32, 135, 0.1);
    --color__secondary--ultra-light: rgba(29, 32, 135, 0.05);

    /* === Text Colors === */
    --color__text: #1A1A1A;
    --color__text--light: #555555;
    --color__text--muted: #888888;
    --color__text--inverse: #FFFFFF;

    /* === Background Colors === */
    --color__bg: #F5F6F8;
    --color__bg--white: #FFFFFF;
    --color__bg--light: #FAFBFC;
    --color__bg--dark: #1D2087;

    /* === Border Colors === */
    --color__border: #E0E2E6;
    --color__border--light: #F0F1F3;
    --color__border--dark: #C5C8CE;

    /* === Functional Colors === */
    --color__success: #28A745;
    --color__success--light: rgba(40, 167, 69, 0.1);
    --color__warning: #FFC107;
    --color__warning--light: rgba(255, 193, 7, 0.1);
    --color__error: #DC3545;
    --color__error--light: rgba(220, 53, 69, 0.1);
    --color__info: #17A2B8;
    --color__info--light: rgba(23, 162, 184, 0.1);

    /* Typography Variables */
    --font__family: "Noto Sans CJK", -apple-system, BlinkMacSystemFont, sans-serif;
    --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.5rem;    /* 24px */
    --font__line-height: 1.6;

    /* Spacing Variables */
    --space--xs: 0.25rem;
    --space--sm: 0.5rem;
    --space--md: 1rem;
    --space--lg: 1.5rem;
    --space--xl: 2rem;
    --space--xxl: 3rem;

    /* Layout Variables */
    --container__max-width: 1400px;
    --sidebar__width: 360px;
    --header__height: 60px;

    /* Breakpoints (For reference in media queries) */
    --breakpoint--sm: 576px;
    --breakpoint--md: 768px;
    --breakpoint--lg: 992px;
    --breakpoint--xl: 1400px;

    /* Effects */
    --shadow__card: 0 2px 8px rgba(0, 0, 0, 0.05);
    --shadow__hover: 0 4px 12px rgba(0, 0, 0, 0.1);
    --radius__sm: 4px;
    --radius__md: 8px;
}
/* CSS Reset */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font__family); font-size: var(--font__size--base); line-height: var(--font__line-height); color: var(--color__text); background-color: var(--color__bg); }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 700; }
p { margin: 0; }
ul, ol { list-style: none; padding: 0; margin: 0; }
a { text-decoration: none; color: inherit; transition: color 0.2s; }
img { display: block; max-width: 100%; height: auto; }
button { background: none; border: none; cursor: pointer; font-family: inherit; }
input, textarea { font-family: inherit; font-size: inherit; }

/* Utility Classes (u-prefix) */
.u-container { width: 100%; max-width: var(--container__max-width); margin: 0 auto; padding: 0 var(--space--md); }
@media (min-width: 768px) {
    .u-container { padding: 0 var(--space--lg); }
}
@media (min-width: 1200px) {
    .u-container { padding: 0 var(--space--xl); }
}
.u-hidden { display: none !important; }
.u-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/* Responsive Utilities */
@media (max-width: 991px) {
    .u-hidden-md-down { display: none !important; }
}
@media (min-width: 992px) {
    .u-hidden-lg-up { display: none !important; }
}

/* Text Utilities */
.u-text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u-text-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.u-text-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.u-text-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }