/* 全局重置样式 */
* {margin:0;padding:0;box-sizing:border-box;}
/* 可以修改: 字体、背景颜色渐变、文本颜色 */
body {font-family:'Arial Rounded MT Bold', sans-serif; /* 可以修改: 字体 */
    background:linear-gradient(135deg, #3498db 0%, #2c3e50 100%); /* 蓝色到深蓝色渐变背景 */
    color:#333; /* 可以修改: 文本颜色 */
    min-height:100vh;position:relative;overflow-x:hidden;}
/* 装饰元素样式 */
/* 可以修改: 装饰元素颜色、透明度 */
.deco {position:fixed;color:#90caf9; /* 浅蓝色装饰元素 */
    opacity:0.3; /* 可以修改: 透明度 */
    z-index:-1;}
/* 可以修改: 装饰元素大小、位置、动画时长 */
.deco-1 {font-size:100px; /* 可以修改: 大小 */
    top:10%;left:5%; /* 可以修改: 位置 */
    animation:float 8s ease-in-out infinite; /* 可以修改: 动画时长 */}
.deco-3 {font-size:120px; /* 可以修改: 大小 */
    bottom:5%;left:15%; /* 可以修改: 位置 */
    animation:float 12s ease-in-out infinite 1s; /* 可以修改: 动画时长和延迟 */}
/* 可以修改: 浮动动画效果 */
@keyframes float {0%,100%{transform:translateY(0);}50%{transform:translateY(-20px);} /* 可以修改: 浮动距离 */}
/* 容器样式 */
/* 可以修改: 最大宽度、内边距 */
.container {max-width:800px; /* 可以修改: 最大宽度 */
    margin:0 auto;padding:20px; /* 可以修改: 内边距 */}
/* 头部样式 */
/* 可以修改: 背景颜色渐变、内边距、边框圆角、阴影效果 */
header {text-align:center;
    background:linear-gradient(135deg, #ffffff 0%, #f5f7fa 100%); /* 白色到浅灰蓝色渐变背景 */
    padding:30px 20px; /* 可以修改: 内边距 */
    border-radius:30px; /* 可以修改: 边框圆角大小 */
    margin-bottom:25px;
    box-shadow:0 8px 25px rgba(52, 73, 94, 0.15), 0 0 0 8px rgba(255, 255, 255, 0.8); /* 灰色阴影 */}
/* 头像样式 */
.avatar {margin-bottom:15px;}
/* 可以修改: 头像框大小、颜色渐变、阴影 */
.avatar-frame {width:130px;height:130px; /* 可以修改: 大小 */
    border-radius:50%; /* 可以修改: 形状 */
    background:linear-gradient(135deg, #34495e, #5dade2); /* 深灰到蓝色渐变 */
    margin:0 auto;display:flex;align-items:center;justify-content:center;
    box-shadow:0 0 0 6px white, 0 0 15px rgba(52, 152, 219, 0.5); /* 蓝色阴影 */}
/* 可以修改: 头像文字大小、颜色、阴影 */
.avatar-text {font-size:60px; /* 可以修改: 字体大小 */
    font-weight:bold;
    color:white; /* 可以修改: 文字颜色 */
    text-shadow:2px 2px 4px rgba(0,0,0,0.3); /* 可以修改: 文字阴影 */}
/* 标题样式 */
/* 可以修改: 名字字体大小、颜色、阴影 */
.name {font-size:42px; /* 可以修改: 字体大小 */
    color:#34495e; /* 深蓝色文字 */
    margin-bottom:10px;
    text-shadow:2px 2px 0px rgba(245, 247, 250, 0.8); /* 浅灰蓝色文字阴影 */}
/* 可以修改: 副标题字体大小、颜色 */
.subtitle {font-size:20px; /* 可以修改: 字体大小 */
    color:#2c3e50; /* 深灰色文字 */
    margin-bottom:15px;}
/* 可以修改: 可爱标签内边距、背景颜色、文字颜色、圆角、阴影 */
.cute-tag {display:inline-block;
    padding:8px 20px; /* 可以修改: 内边距 */
    background:linear-gradient(135deg, #3498db, #2980b9); /* 蓝色渐变 */
    color:white; /* 可以修改: 文字颜色 */
    border-radius:30px; /* 可以修改: 圆角大小 */
    font-weight:bold;
    box-shadow:0 4px 15px rgba(52, 152, 219, 0.4); /* 蓝色阴影 */}
/* 区块通用样式 */
/* 可以修改: 背景颜色、圆角、内边距、阴影 */
section {background:white; /* 可以修改: 背景颜色 */
    border-radius:25px; /* 可以修改: 圆角大小 */
    padding:25px; /* 可以修改: 内边距 */
    margin-bottom:25px;
    box-shadow:0 6px 20px rgba(52, 73, 94, 0.15), 0 0 0 4px rgba(255, 255, 255, 0.7); /* 灰色阴影 */
    position:relative;overflow:hidden;}
/* 可以修改:/* 区块顶部装饰条颜色、高度 */
section::before {content:'';position:absolute;top:0;left:0;width:100%;
    height:4px; /* 可以修改: 高度 */
    background:linear-gradient(90deg, #3498db, #2980b9); /* 蓝色渐变 */}
/* 区块标题样式 */
/* 可以修改: 标题颜色、字体大小、内边距 */
.section-title {color:#34495e; /* 深蓝色文字 */
    font-size:28px; /* 可以修改: 字体大小 */
    margin-bottom:20px;position:relative;padding-bottom:10px; /* 可以修改: 底部内边距 */}
/* 可以修改: 标题下划线长度、高度、颜色、圆角 */
.section-title::after {content:'';position:absolute;bottom:0;left:0;
    width:80px; /* 可以修改: 长度 */
    height:3px; /* 可以修改: 高度 */
    background:#3498db; /* 蓝色 */
    border-radius:3px; /* 可以修改: 圆角 */}
/* 可以修改: emoji大小和间距 */
.emoji {margin-left:10px; /* 可以修改: 左边距 */
    font-size:24px; /* 可以修改: 大小 */}
/* 关于我区块样式 */
/* 可以修改: 段落字体大小、行高、颜色 */
.about p {font-size:18px; /* 可以修改: 字体大小 */
    line-height:1.8; /* 可以修改: 行高 */
    color:#666; /* 可以修改: 文字颜色 */}
/* 兴趣爱好样式 */
/* 可以修改: 网格布局、间距 */
.hobby-list {display:grid;
    grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); /* 可以修改: 列宽 */
    gap:20px; /* 可以修改: 间距 */}
/* 可以修改: 爱好项目内边距、背景色、圆角 */
.hobby-item {display:flex;align-items:center;
    gap:15px; /* 可以修改: 图标和文字间距 */
    padding:15px; /* 可以修改: 内边距 */
    background:#f8f9fa; /* 可以修改: 背景颜色 */
    border-radius:20px; /* 可以修改: 圆角大小 */}
/* 可以修改: 悬停效果 */
.hobby-item:hover {background:#f0f7fb; /* 浅蓝灰色悬停背景 */
    transform:scale(1.05); /* 可以修改: 缩放比例 */}
/* 可以修改: 爱好图标大小 */
.hobby-icon {font-size:28px; /* 可以修改: 图标大小 */}
/* 可以修改: 爱好文字大小、颜色 */
.hobby-text {font-size:18px; /* 可以修改: 字体大小 */
    color:#555; /* 可以修改: 文字颜色 */}
/* 喜欢的动漫样式 */
/* 可以修改: 网格布局、间距 */
.anime-list {display:grid;
    grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); /* 可以修改: 列宽 */
    gap:15px; /* 可以修改: 间距 */}
/* 可以修改: 动漫项目内边距、背景色、圆角、阴影 */
.anime-item {text-align:center;
    padding:18px; /* 可以修改: 内边距 */
    background:linear-gradient(135deg, #ffffff 0%, #f5f7fa 100%); /* 白色到浅灰蓝色渐变 */
    border-radius:18px; /* 可以修改: 圆角大小 */
    box-shadow:0 4px 15px rgba(52, 73, 94, 0.1); /* 灰色阴影 */}
/* 可以修改: 动漫名称字体大小、颜色 */
.anime-name {font-size:18px; /* 可以修改: 字体大小 */
    color:#34495e; /* 深蓝色文字 */
    font-weight:bold;}
/* 联系方式样式 */
/* 可以修改: 联系列表布局、间距 */
.contact-list {display:flex;flex-direction:column;
    gap:15px; /* 可以修改: 间距 */}
/* 可以修改: 联系项内边距、背景色、圆角、文字颜色 */
.contact-item {display:flex;align-items:center;
    gap:15px; /* 可以修改: 图标和文字间距 */
    padding:15px; /* 可以修改: 内边距 */
    background:#f0f7fb; /* 浅蓝灰色背景 */
    border-radius:20px; /* 可以修改: 圆角大小 */
    color:#34495e; /* 深蓝色文字 */
    text-decoration:none;}
/* 可以修改: 悬停效果 */
.contact-item:hover {background:#e3f2fd; /* 浅蓝色悬停背景 */
    transform:translateX(10px); /* 可以修改: 移动距离 */}
/* 可以修改: 联系图标大小 */
.contact-icon {font-size:24px; /* 可以修改: 图标大小 */}
/* 页脚样式 */
/* 可以修改: 页脚内边距、背景色、圆角、阴影 */
footer {text-align:center;
    padding:25px; /* 可以修改: 内边距 */
    background:linear-gradient(135deg, #ffffff 0%, #f5f7fa 100%); /* 白色到浅灰蓝色渐变 */
    border-radius:25px; /* 可以修改: 圆角大小 */
    margin-top:35px;
    box-shadow:0 5px 20px rgba(52, 73, 94, 0.15); /* 灰色阴影 */}
/* 可以修改: 页脚主文字大小、颜色、边距 */
footer p:first-child {font-size:18px; /* 可以修改: 字体大小 */
    color:#34495e; /* 深蓝色文字 */
    margin-bottom:8px;}
/* 可以修改: 版权文字大小、颜色 */
.copyright {font-size:13px; /* 可以修改: 字体大小 */
    color:#999; /* 可以修改: 文字颜色 */}
/* 响应式设计 */
/* 可以修改: 响应式断点和各元素尺寸 */
@media (max-width:768px) { /* 可以修改: 断点大小 */
    .container {padding:15px; /* 可以修改: 移动端内边距 */}
    header, section {padding:20px; /* 可以修改: 移动端内边距 */
        border-radius:20px; /* 可以修改: 移动端圆角 */}
    .name {font-size:32px; /* 可以修改: 移动端字体大小 */}
    .avatar-frame {width:120px;height:120px; /* 可以修改: 移动端头像大小 */}
    .avatar-text {font-size:48px; /* 可以修改: 移动端文字大小 */}
    .hobby-list, .anime-list {grid-template-columns:1fr 1fr; /* 可以修改: 移动端网格布局 */}
}