/* NAI画廊 - 页面和网格容器 */
           #nai-gallery-grid-container {
               flex-grow: 1;
               position: relative;
               overflow: hidden;
               /* 隐藏未激活的页面 */
           }

           .nai-gallery-page {
               position: absolute;
               top: 0;
               left: 0;
               width: 100%;
               height: 100%;
               overflow-y: auto;
               padding: 15px;
               box-sizing: border-box;

               display: grid;
               /* 两个页面都使用 grid 布局 */
               grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
               gap: 15px;
               align-content: flex-start;
               /* 确保内容从顶部开始排列 */

               /* 默认隐藏 */
               opacity: 0;
               visibility: hidden;
               transition: opacity 0.2s ease, visibility 0.2s;
           }

           .nai-gallery-page.active {
               opacity: 1;
               visibility: visible;
               z-index: 1;
           }

           /* 移除旧的 #nai-gallery-grid 布局，因为它现在被 .nai-gallery-page 替代了 */
           #nai-gallery-grid {
               padding: 0;
               display: contents;
               /* 让旧ID失效，布局由父级 .nai-gallery-page 控制 */
           }

           .nai-gallery-page.management-mode .nai-image-container {
               position: relative;
               /* 关键：为伪元素提供定位锚点 */
           }

           /* 选中项的蓝色半透明遮罩 */
           .nai-gallery-page.management-mode .nai-gallery-item.selected .nai-image-container::after {
               content: '';
               position: absolute;
               top: 0;
               left: 0;
               right: 0;
               bottom: 0;
               background-color: rgba(0, 122, 255, 0.4);
               /* 半透明蓝色 */
               border: 3px solid #007aff;
               /* 蓝色实线边框 */
               box-sizing: border-box;
               border-radius: 8px;
               /* 匹配 .nai-image-container 的圆角 */
               z-index: 1;
           }

           /* 选中项右上角的“✔”对勾 */
           .nai-gallery-page.management-mode .nai-gallery-item.selected .nai-image-container::before {
               content: '✔';
               /* 使用 Unicode 对勾 */
               position: absolute;
               top: 6px;
               right: 6px;
               width: 22px;
               height: 22px;
               background-color: #007aff;
               /* 蓝色背景 */
               color: white;
               /* 白色对勾 */
               border-radius: 50%;
               display: flex;
               align-items: center;
               justify-content: center;
               font-size: 14px;
               font-weight: bold;
               z-index: 2;
               /* 确保在遮罩之上 */
               border: 2px solid white;
               /* 白色描边，更清晰 */
               box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
           }

           #playlist-action-bar {
               display: none;
               flex-shrink: 0;
               padding: 10px 15px;
               padding-bottom: calc(10px + env(safe-area-inset-bottom));
               background-color: rgba(247, 247, 247, 0.9);
               backdrop-filter: blur(10px);
               -webkit-backdrop-filter: blur(10px);
               border-top: 1px solid var(--border-color);
               justify-content: space-between;
               align-items: center;
           }

           #playlist-action-bar .select-all-label {
               font-size: 16px;
               color: var(--text-primary);
               cursor: pointer;
           }

           #playlist-action-bar .action-bar-btn {
               padding: 10px 20px;
               border-radius: 20px;
               border: none;
               font-size: 15px;
               font-weight: 600;
               cursor: pointer;
               background-color: #007bff;
               color: white;
           }

           /* 播放列表选择模式样式 */
           #music-playlist-panel.management-mode .playlist-item-checkbox {
               display: block;
               margin-right: 10px;
               flex-shrink: 0;
               width: 18px;
               height: 18px;
           }

           #music-playlist-panel.management-mode .playlist-item-actions {
               display: none;
               /* 管理模式下隐藏歌曲的单独操作按钮 */
           }

           #music-playlist-panel.management-mode .playlist-item.selected {
               background-color: rgba(0, 123, 255, 0.2);
           }

           /* 暗黑模式适配 */
           #phone-screen.dark-mode #playlist-action-bar {
               background-color: rgba(28, 28, 30, 0.9);
               border-top-color: #38383a;
           }

           #phone-screen.dark-mode #playlist-action-bar .select-all-label {
               color: #f0f0f0;
           }

           #phone-screen.dark-mode #music-playlist-panel.management-mode .playlist-item.selected {
               background-color: rgba(0, 123, 255, 0.3);
           }

           .playlist-header {
               display: flex;
               justify-content: space-between;
               align-items: center;
               padding: 14px 18px;
               position: relative;
               box-sizing: border-box;
               min-height: 48px;
           }

           .playlist-header .playlist-title,
           .playlist-header>span {
               position: absolute;
               left: 50%;
               transform: translateX(-50%);
               font-weight: 600;
               font-size: 16px;
               pointer-events: none;
               white-space: nowrap;
           }

           .playlist-header .header-left-actions {
               display: flex;
               align-items: center;
               gap: 10px;
               z-index: 2;
           }

           .playlist-header .header-right-actions {
               display: flex;
               align-items: center;
               gap: 14px;
               z-index: 2;
           }

           .playlist-header .panel-btn {
               cursor: pointer;
               font-size: 15px;
               font-weight: 500;
               color: var(--accent-color, #007aff);
               user-select: none;
               padding: 2px 4px;
           }

           #phone-screen.dark-mode .playlist-header .panel-btn {
               color: var(--accent-color, #0a84ff);
           }

           #sticker-action-bar button {
               width: auto;
               /* 修改：不再是100%宽度 */
               padding: 10px 20px;
               /* 修改：使用内边距来自动调整宽度 */
               border-radius: 20px;
               /* 修改：改为圆角按钮，更美观 */
               border: none;
               font-size: 16px;
               font-weight: 600;
               cursor: pointer;
               background-color: #ff3b30;
               color: white;
           }


           #sticker-action-bar #export-selected-stickers-btn {
               background-color: #007bff;
               /* 导出按钮设为蓝色 */
           }

           #sticker-action-bar #delete-selected-stickers-btn {
               background-color: #ff3b30;
               /* 删除按钮保持红色 */
           }

           /* Bilibili 列表样式 */
           #char-bilibili-screen {
               background-color: #f0f2f5;
           }

           #phone-screen.dark-mode #char-bilibili-screen {
               background-color: #000;
           }

           .bilibili-item {
               display: flex;
               gap: 10px;
               padding: 10px;
               background-color: var(--secondary-bg);
               border-radius: 8px;
               margin-bottom: 10px;
               box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
               cursor: pointer;
               transition: transform 0.1s;
           }

           .bilibili-item:active {
               transform: scale(0.98);
           }

           .bili-cover {
               width: 120px;
               height: 75px;
               background-size: cover;
               background-position: center;
               border-radius: 6px;
               flex-shrink: 0;
               position: relative;
               background-color: #ddd;
           }

           .bili-duration {
               position: absolute;
               bottom: 4px;
               right: 4px;
               background-color: rgba(0, 0, 0, 0.6);
               color: white;
               font-size: 10px;
               padding: 1px 4px;
               border-radius: 4px;
           }

           .bili-info {
               flex-grow: 1;
               display: flex;
               flex-direction: column;
               justify-content: space-between;
           }

           .bili-title {
               font-size: 14px;
               font-weight: 500;
               line-height: 1.4;
               color: var(--text-primary);
               display: -webkit-box;
               -webkit-line-clamp: 2;
               -webkit-box-orient: vertical;
               overflow: hidden;
           }

           .bili-author {
               font-size: 12px;
               color: var(--text-secondary);
           }

           /* 搜索框适配 */
           #char-bilibili-search-input:focus {
               border-color: #FB7299;
               outline: none;
           }

           /* 暗黑模式适配 */
           #phone-screen.dark-mode #char-bilibili-player-screen .list-container {
               background-color: #1c1c1e;
           }

           #lock-screen {
               position: absolute;
               top: 0;
               left: 0;
               width: 100%;
               height: 100%;
               z-index: 3000;
               /* 确保在最上层 */
               background-color: #000;
               background-size: cover;
               background-position: center;
               color: white;
               display: flex;
               flex-direction: column;
               overflow: hidden;
               transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s ease;
               visibility: hidden;
               opacity: 0;
               transform: translateY(-100%);
               /* 默认藏在上面或者隐藏 */
           }

           #lock-screen.active {
               visibility: visible;
               opacity: 1;
               transform: translateY(0);
           }

           #lock-screen.unlocking {
               transform: translateY(-100%);
               opacity: 0;
           }

           #lock-screen-content {
               width: 100%;
               height: 100%;
               backdrop-filter: blur(0px);
               transition: backdrop-filter 0.3s;
               display: flex;
               flex-direction: column;
               align-items: center;
               padding-top: 60px;
               box-sizing: border-box;
               background: rgba(0, 0, 0, 0.2);
               /* 轻微遮罩让文字更清晰 */
           }

           #lock-screen.input-mode #lock-screen-content {
               backdrop-filter: blur(20px);
               background: rgba(0, 0, 0, 0.4);
           }

           .lock-icon {
               font-size: 20px;
               margin-bottom: 10px;
               opacity: 0;
               transition: opacity 0.3s;
           }

           #lock-screen.input-mode .lock-icon {
               opacity: 0;
           }

           .lock-time-container {
               text-align: center;
               transition: transform 0.3s, opacity 0.3s;
           }

           #lock-screen.input-mode .lock-time-container {
               transform: scale(0.8) translateY(-20px);
               opacity: 0;
               /* 输入密码时隐藏时间 */
               pointer-events: none;
           }

           #lock-date {
               font-size: 18px;
               font-weight: 500;
               margin-bottom: 5px;
               text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
           }

           #lock-time {
               font-size: 80px;
               font-weight: 600;
               line-height: 1;
               letter-spacing: -2px;
               font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
               text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
           }

           /* 密码输入区域 */
           #lock-password-area {
               flex-grow: 1;
               display: flex;
               flex-direction: column;
               align-items: center;
               justify-content: center;
               width: 100%;
               margin-top: 20px;
               animation: fadeIn 0.3s ease;
           }

           .lock-instruction {
               font-size: 16px;
               margin-bottom: 20px;
               font-weight: 500;
           }

           .lock-dots {
               display: flex;
               gap: 15px;
               margin-bottom: 30px;
           }

           .dot {
               width: 12px;
               height: 12px;
               border-radius: 50%;
               border: 1px solid white;
               box-sizing: border-box;
               transition: background-color 0.2s;
           }

           .dot.filled {
               background-color: white;
           }

           .lock-keypad {
               display: grid;
               grid-template-columns: repeat(3, 1fr);
               column-gap: 25px;
               row-gap: 15px;
               margin-bottom: 20px;
           }

           .key {
               width: 75px;
               height: 75px;
               border-radius: 50%;
               background-color: rgba(255, 255, 255, 0.15);
               backdrop-filter: blur(10px);
               display: flex;
               flex-direction: column;
               align-items: center;
               justify-content: center;
               font-size: 32px;
               font-weight: 400;
               line-height: 1;
               cursor: pointer;
               transition: background-color 0.1s;
               user-select: none;
           }

           .key:active {
               background-color: rgba(255, 255, 255, 0.4);
           }

           .key span {
               font-size: 10px;
               font-weight: 600;
               letter-spacing: 2px;
               margin-top: 2px;
               opacity: 0.8;
           }

           .key.empty {
               background: transparent;
               cursor: default;
           }

           .key.delete {
               background: transparent;
               font-size: 24px;
           }

           .lock-cancel-btn {
               margin-top: 20px;
               font-size: 16px;
               font-weight: 600;
               cursor: pointer;
           }

           /* 底部滑动条 */
           #lock-swipe-area {
               position: absolute;
               bottom: 25px;
               /* 调整这个值来控制离底边的距离 */
               left: 0;
               width: 100%;
               height: 30px;
               display: flex;
               justify-content: center;
               align-items: center;
               z-index: 20;
               cursor: grab;

           }

           @keyframes swipe-hint {

               0%,
               100% {
                   transform: translateY(0);
                   opacity: 0.8;
               }

               50% {
                   transform: translateY(-10px);
                   opacity: 1;
               }
           }

           /* 确保横条样式正确 */
           .swipe-bar {
               width: 130px;
               height: 5px;
               background-color: white;
               border-radius: 100px;
               box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
           }

           @keyframes shake {

               0%,
               100% {
                   transform: translateX(0);
               }

               20%,
               60% {
                   transform: translateX(-10px);
               }

               40%,
               80% {
                   transform: translateX(10px);
               }
           }

           .shake-animation {
               animation: shake 0.4s ease;
           }