/* 移动端样式 */
@media screen and (max-device-width: 768px), 
       screen and (max-device-height: 768px) and (orientation: landscape) {
    /* 移动端背景样式 */
    body {
        background: none !important;
        background-color: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 100vh;
    }

    body::before {
        display: none;
    }

    /* 深色模式样式 */
    body[data-theme="dark"] {
        background-color: #1a1a1a !important;
    }

    [data-theme="dark"] .navbar-container {
        background-color: #2c2c2c !important;
    }

    [data-theme="dark"] .navbar a {
        color: #e1e1e1 !important;
    }

    [data-theme="dark"] .music-player {
        background-color: #2c2c2c !important;
        border-bottom-color: rgba(255, 255, 255, 0.1) !important;
    }

    [data-theme="dark"] .music-controls button {
        color: #e1e1e1 !important;
    }

    /* 容器样式 */
    .container {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background-color: #fff;
        box-sizing: border-box;
    }

    [data-theme="dark"] .container {
        background-color: #1a1a1a !important;
    }

    /* 导航栏样式 */
    .navbar-container {
        width: 100% !important;
        margin: 0 !important;
        position: sticky !important;
        top: 0 !important;
        left: 0 !important;
        background-color: #fff !important;
        border-radius: 0 !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
        z-index: 1000;
        height: 100px;
    }
    
    .navbar {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr);
        padding: 0;
        height: 100%;
    }
    
    .navbar a {
        width: 100%;
        height: 100%;
        text-align: center;
        padding: 0;
        border: none;
        font-size: 0.9em;
        display: flex;
        align-items: center;
        justify-content: center;
        border-right: 1px solid rgba(0, 0, 0, 0.05);
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    .navbar a:nth-child(3n) {
        border-right: none;
    }

    .navbar a:nth-child(n+4) {
        border-bottom: none;
    }

    .navbar a.active {
        background-color: var(--primary-color);
        color: white;
    }

    /* 隐藏语言切换按钮 */
    .language-switch {
        display: none;
    }
    
    /* 个人资料部分样式 */
    .profile {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        padding: 20px !important;
        margin-bottom: 0.5px;
    }
    
    .profile img {
        height: 150px !important;
        width: auto !important;
        margin: 0 auto 20px !important;
    }
    
    .profile-info {
        width: 100% !important;
        max-width: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding-bottom: 10px;
    }
    
    .profile-info h1 {
        margin-bottom: 15px !important;
    }

    .profile-info p {
        margin: 8px 0 !important;
        width: 100% !important;
        justify-content: center !important;
    }
    
    /* 内容区块样式 */
    .sections {
        padding: 15px;
        margin: 0;
        background-color: #fff;
        border-radius: 0;
        box-shadow: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        width: 100%;
        box-sizing: border-box;
    }
    
    .sections h2 {
        font-size: 1.5em;
        margin: 0 0 7px 0;
        padding: 5px 0px 0px;
    }

    .sections h3 {
        font-size: 1.3em;
        margin: 0 0 7px 0;
        padding: 20px 0px 0px;
    }
    
    .sections li {
        padding: 10px;
        font-size: 0.9em;
        background-color: #f8f8f8;
        margin-bottom: 8px;
    }

    /* 音乐播放器样式 */
    .music-player {
        width: 100% !important;
        margin: 0 !important;
        padding: 15px !important;
        background-color: #fff !important;
        border-radius: 0 !important;
        border: none !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
        box-sizing: border-box !important;
    }

    .album-container {
        width: 120px;
        height: 120px;
    }

    /* 浮动按钮容器：移动端固定在右下角，内部水平排布 */
    .float-actions {
        position: fixed;
        right: 10px;
        bottom: 20px;
        gap: 8px;
        z-index: 1001;
        /* 竖排以减少遮挡正文右侧空间 */
        /*flex-direction: column; */
        /*align-items: flex-end; */
    }

    .theme-switch,
    .back-to-top {
        padding: 8px;
        font-size: 0.9em;
    }

    /* 移动端中，返回顶部按钮在容器内，不再单独固定定位 */
    .float-actions .back-to-top {
        position: static;
        right: auto;
        bottom: auto;
    }

    /* 移动端中，主题切换按钮同样在容器内，不再单独固定定位 */
    .float-actions .theme-switch {
        position: static;
        right: auto;
        bottom: auto;
    }

    /* 网站分类样式 */
    .website-category {
        margin-bottom: 25px !important;
        padding: 0 15px;
    }

    .website-category h3 {
        font-size: 1.1em !important;
        margin-bottom: 10px !important;
    }

    /* 网站图标网格布局样式 */
    .website-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 15px !important;
        padding: 10px 15px !important;
    }

    .website-icon {
        width: 60px !important;
        height: 60px !important;
        margin-bottom: 5px !important;
    }

    .website-name {
        font-size: 12px !important;
    }

    .aligncenter {
        clear: both;
        display: block;
        margin: auto;
    } /*图片水平居中类*/

    .bigger {
        font-size: larger;
      }

    figure {
        text-align: center;
        padding: 10px;
        margin: auto;
      }

    figcaption {
        margin-top: 10px; /* 数值越大，间距越大 */
    }  
       

    /* 深色模式下的sections样式 */
    [data-theme="dark"] .profile,
    [data-theme="dark"] .sections {
        background-color: #2c2c2c !important;
        border-bottom-color: rgba(255, 255, 255, 0.1) !important;
    }

    [data-theme="dark"] .sections a {
        color: var(--primary-color) !important;
    }

    [data-theme="dark"] .sections h2 {
        color: #e1e1e1 !important;
        border-bottom-color: var(--primary-color) !important;
    }

    [data-theme="dark"] .sections ul {
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    [data-theme="dark"] .sections li {
        background-color: #383838 !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
        color: #e1e1e1 !important;
    }

    [data-theme="dark"] .sections li a {
        color: var(--primary-color) !important;
    }

    [data-theme="dark"] .profile-info h1,
    [data-theme="dark"] .profile-info p {
        color: #e1e1e1 !important;
    }

    [data-theme="dark"] .profile-info a {
        color: var(--primary-color) !important;
    }
}