/* 全局样式 - 保留基础重置和深灰背景 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft Yahei", sans-serif;
    /* 新增：强制长文本/长链接自动换行 */
    word-wrap: break-word;
    /* 允许在单词内换行（兼容旧浏览器） */
    word-break: break-all;
    /* 强制换行，哪怕是单个长单词/链接 */
    white-space: normal;
    /* 恢复默认换行，取消强制不换行 */
}

body {
    background-color: #2c2c2c;
    /* 最深背景 */
    padding: 0;
    position: relative;
    min-height: 100vh;
}

/* 通用侧边栏容器样式 */
.sidebar-container {
    position: fixed;
    top: 20px;
    bottom: 20px;
    width: 140px;
    z-index: 999;
    display: flex;
    flex-direction: column;
}

/* 左侧目录侧边栏 */
.left-sidebar {
    left: 20px;
}

.sidebar-title {
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
}

.sidebar-nav {
    flex: 1;
    background-color: #3a3a3a;
    padding: 10px 10px;
    overflow-y: auto;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
}

.nav-tip {
    color: #cccccc;
    font-size: 12px;
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #555555;
}

.nav-items-wrapper {
    flex: 1;
}

.nav-item {
    display: block;
    color: #a8d1ff;
    text-decoration: none;
    padding: 4px;
    background-color: #444444;
    margin-bottom: 8px;
    transition: background-color 0.2s;
    font-size: 18px;
    text-align: center;
}

.nav-item:hover {
    background-color: #555555;
    color: #ffffff;
}

/* 信息块的内容样式 */
.info-item {
    display: block;
    color: #a8d1ff;
    padding: 4px;
    background-color: #444444;
    margin-bottom: 8px;
    font-size: 14px;
    text-align: center;
}

/* 主容器 */
.container {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px 20px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* 资料块样式 - 移除hover效果 */
.link-card {
    background-color: #3a3a3a;
    /* 第二深背景 */
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 10px;
    border-left: 4px solid #666;
    cursor: default;
    /* 鼠标样式为默认 */
}

/* 完全移除资料块的hover效果 */
.link-card:hover {
    background-color: #3a3a3a;
    /* 保持原背景色 */
    transform: none;
    /* 取消位移 */
    box-shadow: none;
    /* 取消阴影 */
}

.card-title {
    color: #ffffff;
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 600;
}

/* 内容项基础样式 - 区分类型和内容色 */
.content-item {
    display: block;
    padding: 10px 15px;
    background-color: #444444;
    /* 最浅背景 */
    border-radius: 4px;
    margin-bottom: 10px;
    transition: background-color 0.3s ease;
    /* 仅添加背景色过渡 */
}

/* 单条资料hover效果 - 只变色 */
.content-item:hover {
    background-color: #505050;
}

/* 类型文字（黄色） */
.type-text {
    color: #ffcc00;
    font-weight: bold;
}

.prompt-text {
    color: #39FF39;
    font-weight: bold;
}

/* 普通文字 */
.normal-text {
    color: #ffffff;
    text-decoration: none;
    word-wrap: break-word;
    /* 兼容旧浏览器，允许长单词/文本内换行 */
    word-break: break-all;
    /* 强制所有字符换行，适配长概念说明文本 */
    white-space: normal;
    /* 恢复默认换行，确保上述属性生效 */
    line-height: 1.6;
    /* 可选优化：增大行高，换行后阅读更舒适 */
}

/* 链接/密码文字（蓝色） */
.content-text {
    color: #a8d1ff;
    text-decoration: none;
    word-wrap: break-word;
    /* 兼容旧浏览器，允许长单词/文本内换行 */
    word-break: break-all;
    /* 强制所有字符换行，适配长概念说明文本 */
    white-space: normal;
    /* 恢复默认换行，确保上述属性生效 */
    line-height: 1.6;
    /* 可选优化：增大行高，换行后阅读更舒适 */
}

/* 可点击链接样式 */
.content-text.link {
    transition: color 0.2s;
}

.content-text.link:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* 可复制的密码文字样式 - 移除虚线下划线 */
.content-text.copyable {
    cursor: pointer;
    text-decoration: none;
    /* 移除下划线 */
    transition: color 0.2s;
}

/* 可复制文本悬停效果 */
.content-text.copyable:hover {
    color: #ffffff;
}

/* 分组标题 */
.group-title {
    color: pink;
    font-size: 40px;
    text-align: center;
    margin: 7px;
}

/* 警告信息样式 */
.info {
    color: #ffffff;
    font-size: 16px;
    font-weight: bold;
    margin-top: 15px;
    text-align: center;
    background-color: #3a3a3a;
    padding: 10px 20px;
    border-radius: 8px;
    max-width: 800px;
}

/* 彩虹标题动画 */
@keyframes rainbow {
    0% {
        color: red;
    }

    20% {
        color: orange;
    }

    40% {
        color: yellow;
    }

    60% {
        color: green;
    }

    80% {
        color: blue;
    }

    100% {
        color: red;
    }
}

.rainbow-title {
    font-size: 50px;
    text-align: center;
    font-weight: bold;
    display: flex;
    justify-content: center;
    gap: 5px;
}

.rainbow-title span {
    animation: rainbow 1.5s infinite;
    animation-delay: calc(var(--i) * 0.1s);
}

/* 复制提示框样式 - 调整到居中靠近底部位置 */
.copy-toast {
    position: fixed;
    bottom: 60px;
    /* 距离底部60px，靠近底部但不贴边 */
    left: 50%;
    transform: translateX(-50%);
    /* 水平居中 */
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 16px;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 9999;
}

.copy-toast.show {
    opacity: 1;
}

/* 核心：用CSS函数实现淡色+斜体 */
.light-italic-text {
    /* 斜体效果 */
    font-style: italic;
    /* 淡色效果（用rgba函数控制透明度，推荐） */
    color: rgb(255, 255, 255, 0.8);
    /* 黑色基础，0.6透明度（0-1可调，越小越淡） */
    /* 可选：用opacity函数（整体透明，会影响所有子元素） */
    /* opacity: 0.6; */
    /* 补充：字体大小，方便查看效果 */
    font-size: 24px;
}

/* 左上角跳转模块样式 */
.home-jump {
    position: fixed;
    top: 8px;
    left: 170px;
    /* 目录宽度140px + 间距20px + 微调10px */
    z-index: 998;
    /* 低于目录层级，避免遮挡目录 */
}

.jump-link {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    padding: 8px 8px;
}

.jump-icon {
    width: 50px;
    height: 50px;
    border-radius: 4px;
}

.jump-text {
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
}

/* 响应式适配 - 移动端优化（核心修改：保留侧边栏左右固定） */
@media (max-width: 992px) {
    body {
        /* 缩小侧边栏预留空间，适配小屏幕 */
        padding-left: 90px;
    }

    /* 保留侧边栏固定定位，仅缩小宽度 */
    .sidebar-container {
        position: fixed;
        top: 20px;
        bottom: 20px;
        width: 70px;
        /* 移动端缩窄侧边栏 */
    }

    /* 左侧/右侧侧边栏位置不变 */
    .left-sidebar {
        left: 10px;
    }

    /* 侧边栏标题适配小尺寸 */
    .sidebar-title {
        font-size: 16px;
        margin-bottom: 8px;
    }

    /* 侧边栏内部排版优化 */
    .sidebar-nav {
        padding: 5px;
    }

    .nav-tip {
        font-size: 12px;
        margin-bottom: 8px;
        padding-bottom: 5px;
    }

    .nav-item,
    .info-item {
        font-size: 20px;
        padding: 3px;
        margin-bottom: 5px;
    }

    /* 主容器适配侧边栏宽度 */
    .container {
        padding: 10px;
        max-width: 100%;
    }

    .home-jump {
        left: 90px;
        /* 移动端目录宽度70px + 间距10px + 微调10px */
    }

    .jump-icon {
        width: 20px;
        height: 20px;
    }

    .jump-text {
        font-size: 14px;
    }
}

@media (max-width: 480px) {

    /* 超小屏进一步优化 */
    body {
        padding-left: 65px;
    }

    .sidebar-container {
        width: 60px;
        top: 10px;
        bottom: 10px;
    }

    .left-sidebar {
        left: 5px;
    }

    .sidebar-title {
        font-size: 14px;
    }

    .nav-item,
    .info-item {
        font-size: 20px;
        padding: 2px;
    }

    .link-card {
        padding: 15px;
    }

    .card-title {
        font-size: 16px;
    }

    .content-item {
        font-size: 14px;
        padding: 8px 12px;
    }

    .rainbow-title {
        font-size: 30px;
    }

    .group-title {
        font-size: 28px;
    }

    .copy-toast {
        font-size: 14px;
        padding: 8px 16px;
        bottom: 40px;
    }

    .home-jump {
        left: 70px;
        /* 超小屏目录宽度60px + 间距5px + 微调10px */
        top: 5px;
    }

    .jump-link {
        padding: 1px 1px;
    }

    .jump-icon {
        width: 25px;
        height: 25px;
    }

    .jump-text {
        font-size: 12px;
    }
}