/* 称号颜色系统 - 按稀有度分级 */
.title-common {
    color: #000000; /* 普通灰色 */
}

.title-uncommon {
    color: #2E7D32; /* 绿色 - 较罕见 */
}

.title-rare {
    color: #1976D2; /* 蓝色 - 稀有 */
}

.title-epic {
    color: #7B1FA2; /* 紫色 - 史诗 */
}

.title-legendary {
    color: #F57F17; /* 橙色 - 传说 */
}

.title-mythic {
    color: #E0115F;
}

.title-custom {
    color: #000000; /* 青色 - 自定义 */
    font-style: italic;
}

/* 旧有称号样式保留，兼容旧数据 */
.title-gold {
    color: #FFD700;
}

.title-silver {
    color: #C0C0C0;
}

.title-bronze {
    color: #CD7F32;
}

.title-royal {
    color: #9370DB;
}

.title-emerald {
    color: #50C878;
}

.title-ruby {
    color: #E0115F;
}

.title-sapphire {
    color: #0F52BA;
}

.title-diamond {
    color: #B9F2FF;
}

/* 定义颜色更丰富且优雅柔和的七彩渐变文本样式类 */

.rainbow-text {
    background: linear-gradient(140deg,
        /* 增加更多过渡色彩 */ #FF0000, /* 红色 */ #FF4500, /* 橙红色 */ #FFA500, /* 橙色 */ #FFD700, /* 金色 */ #FFFF00, /* 黄色 */ #9400D3, /* 紫色 */ #FF00FF, /* 品红 */ #FF1493 /* 深粉色 */
    );
    background-size: 600% 600%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow-gradient 10s cubic-bezier(0.42, 0, 0.58, 1) infinite;
}

/* 定义颜色更丰富且优雅柔和的七彩渐变文本样式类 */

.rainbow-text2 {
    background: linear-gradient(140deg,
    #00bbff, /* 橙色 */ #008cff, /* 金色 */ #9400D3, /* 紫色 */ #FF00FF, /* 品红 */ #FF1493 /* 深粉色 */
    );
    background-size: 600% 600%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow-gradient 10s cubic-bezier(0.42, 0, 0.58, 1) infinite;
}

@keyframes rainbow-gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* 如果你还需要为 xitong 类添加样式，可以在这里定义 */

.xitong {
    color: #ff0903;
}
.title-xitong {
    color: #ff0903;
}

/* =====================================================================
   月度称号 · 1~12 月满勤签到（month-1 ~ month-12）
   ---------------------------------------------------------------------
   用法：titles.icon 填 month-1 ~ month-12 之一即可，不用改任何逻辑。
   链路：icon 原值 → TitleComponent 挂到 span 的 class 上 → 命中本段样式。
         icon 以 month- 开头时 resolveTitleIconUrl() 返回空串（stores/localdb.ts），
         直接走纯文字分支，不会去请求一张不存在的 GIF。
   扩展：加一组新配色只需两步 —— 这里写一段 CSS + titles.icon 写 class 名。
   ===================================================================== */

/* 自托管思源宋体 Bold 子集（89 字 / 15.2 KB）。
   子集由 scripts/build_title_font_subset.py 生成，新增称号后要重跑。
   缺字时不报错：字体栈会回落到系统宋体（见下面 font-family）。 */
@font-face {
    font-family: "TitleSerif";
    src: url("/assets/fonts/title-serif-700.woff2?v=1") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

.month-1,
.month-2,
.month-3,
.month-4,
.month-5,
.month-6,
.month-7,
.month-8,
.month-9,
.month-10,
.month-11,
.month-12 {
    /* 衬线宋体：优先自托管子集，再回落各端系统宋体，最后 serif */
    font-family: "TitleSerif", "Songti SC", "STSong", "Noto Serif CJK SC",
        "Source Han Serif SC", "SimSun", serif;
    font-weight: 700;
    letter-spacing: .06em;
    background-image: linear-gradient(100deg, var(--c1) 0%, var(--c2) 52%, var(--c3) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* 1 月 岁朝 · 朱红 */
.month-1 { --c1: #B01326; --c2: #E8452E; --c3: #D91E36; }
/* 2 月 春序 · 新绿 */
.month-2 { --c1: #4E8C34; --c2: #7CB342; --c3: #6FA83A; }
/* 3 月 芳辰 · 桃粉 */
.month-3 { --c1: #C8446F; --c2: #EC6E9B; --c3: #D9557F; }
/* 4 月 清和 · 青碧 */
.month-4 { --c1: #2A7C70; --c2: #3FA796; --c3: #35917F; }
/* 5 月 薰风 · 暖橙 */
.month-5 { --c1: #B4652A; --c2: #E08A3C; --c3: #C87A33; }
/* 6 月 荷时 · 荷碧（唯一双色相：粉 → 碧） */
.month-6 { --c1: #C04A76; --c2: #E0678F; --c3: #2E7D5F; }
/* 7 月 流火 · 赤炎 */
.month-7 { --c1: #A8221C; --c2: #F07A2E; --c3: #C94A2A; }
/* 8 月 桂月 · 金桂 */
.month-8 { --c1: #A8801A; --c2: #D9B22E; --c3: #C09A24; }
/* 9 月 霜辰 · 霜银 */
.month-9 { --c1: #6E8698; --c2: #8FA6B8; --c3: #7C93A6; }
/* 10 月 金秋 · 秋金 */
.month-10 { --c1: #B07417; --c2: #E0A020; --c3: #C8881C; }
/* 11 月 寒序 · 寒青 */
.month-11 { --c1: #33536B; --c2: #4A6E8A; --c3: #3D5F79; }
/* 12 月 暮岁 · 暮紫 */
.month-12 { --c1: #3F3670; --c2: #6A5AA0; --c3: #514284; }