#settings-preview-area .message-bubble .avatar {
               width: 30px;
               height: 30px;
           }

           #settings-preview-area .message-bubble .timestamp {
               display: none;
           }

           .existing-group-item {
               display: flex;
               justify-content: space-between;
               align-items: center;
               padding: 12px;
               background-color: #f9f9f9;
               border-radius: 8px;
               border: 1px solid var(--border-color);
           }

           .existing-group-item .group-name {
               font-weight: 500;
           }

           .existing-group-item .delete-group-btn {
               color: #ff3b30;
               font-size: 20px;
               cursor: pointer;
               padding: 5px;
           }

           .chat-group-container {
               border-bottom: 1px solid var(--border-color);
           }

           .chat-group-container:first-child {
               border-top: 1px solid var(--border-color);
           }

           .chat-group-header {
               display: flex;
               align-items: center;
               padding: 12px 15px;
               cursor: pointer;
               background-color: #f7f7f7;
           }

           .chat-group-header .arrow {
               font-size: 14px;
               margin-right: 8px;
               transition: transform 0.2s ease;
           }

           .chat-group-header.collapsed .arrow {
               transform: rotate(-90deg);
           }

           .chat-group-header .group-name {
               font-weight: 600;
               font-size: 15px;
           }

           .chat-group-content {
               max-height: 1000px;
               overflow: hidden;
               transition: max-height 0.3s ease-in-out;
           }

           .chat-group-content.collapsed {
               max-height: 0;
           }

           .format-helpers {
               display: flex;
               gap: 10px;
               margin-bottom: 15px;
               flex-wrap: wrap;
           }

           .format-btn {
               background-color: #e9ecef;
               color: var(--text-primary);
               border: none;
               padding: 6px 12px;
               border-radius: 16px;
               font-size: 13px;
               font-weight: 500;
               cursor: pointer;
               transition: background-color 0.2s;
           }

           .format-btn:hover {
               background-color: #dcdfe3;
           }

           .post-actions-btn {
               margin-left: auto;
               padding: 5px 10px;
               font-size: 20px;
               font-weight: bold;
               color: var(--text-secondary);
               cursor: pointer;
               border-radius: 50%;
               line-height: 1;
           }

           .post-actions-btn:hover {
               background-color: #f0f0f0;
           }

           #post-actions-modal .custom-modal-footer button {
               width: 100%;
               border: none;
               border-bottom: 1px solid #dbdbdb;
               padding: 14px;
               font-size: 18px;
           }

           #post-actions-modal .custom-modal-footer button:last-child {
               border-bottom: none;
           }

           #post-actions-modal #cancel-post-action-btn {
               margin-top: 8px;
               border-radius: 8px;
               background-color: #f0f0f0;
           }

           #chat-messages .transfer-card .transfer-title,
           #chat-messages .transfer-card .transfer-amount,
           #chat-messages .transfer-card .transfer-note {
               text-shadow: none !important;
               color: white !important;
           }

           #chat-messages .transfer-card .transfer-title {
               font-size: 16px !important;
               font-weight: 600 !important;
           }

           #chat-messages .transfer-card .transfer-amount {
               font-size: 28px !important;
               font-weight: bold !important;
           }

           #chat-messages .transfer-card .transfer-note {
               font-size: 13px !important;
               opacity: 0.9 !important;
           }

           .header>span:nth-child(2),
           #chat-header-title {
               position: absolute;
               left: 50%;
               transform: translateX(calc(-50% - 2px));
               max-width: 60%;
               white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;
           }

           #message-editor-container {
               display: flex;
               flex-direction: column;
               gap: 15px;
           }

           .message-editor-block {
               background-color: #f9f9f9;
               border: 1px solid var(--border-color);
               border-radius: 8px;
               padding: 12px;
           }

           .message-editor-block textarea {
               width: 100%;
               min-height: 60px;
               resize: vertical;
               border: 1px solid #ccc;
               border-radius: 6px;
               padding: 8px;
               font-size: 16px;
               box-sizing: border-box;
           }

           .message-editor-block .format-helpers {
               margin-top: 8px;
               margin-bottom: 0;
           }

           .message-editor-block .delete-block-btn {
               float: right;
               margin-top: -5px;
               background: none;
               border: none;
               color: #ff3b30;
               font-size: 20px;
               cursor: pointer;
           }

           .contact-picker-item {
               display: flex;
               align-items: center;
               padding: 10px 15px;
               cursor: pointer;
               border-bottom: 1px solid var(--border-color);
           }

           .contact-picker-item .checkbox {
               width: 20px;
               height: 20px;
               border: 2px solid #ccc;
               border-radius: 50%;
               margin-right: 15px;
               transition: all 0.2s ease;
           }

           .contact-picker-item.selected .checkbox {
               background-color: var(--accent-color);
               border-color: var(--accent-color);
               content: '✔';
               color: white;
               font-size: 14px;
               text-align: center;
               line-height: 20px;
           }

           .contact-picker-item .avatar {
               width: 40px;
               height: 40px;
               border-radius: 50%;
               margin-right: 12px;
           }

           .contact-picker-item .name {
               font-weight: 500;
           }

           #member-management-list {
               padding: 0;
           }

           .member-management-item {
               display: flex;
               align-items: center;
               padding: 12px 15px;
               border-bottom: 1px solid var(--border-color);
           }

           .member-management-item .avatar {
               width: 40px;
               height: 40px;
               border-radius: 50%;
               margin-right: 12px;
           }

           .member-management-item .name {
               flex-grow: 1;
               font-weight: 500;
           }

           .member-management-item .remove-member-btn {
               background-color: #ff3b30;
               color: white;
               border: none;
               width: 28px;
               height: 28px;
               border-radius: 50%;
               font-size: 20px;
               line-height: 28px;
               text-align: center;
               cursor: pointer;
               flex-shrink: 0;
           }

           #member-management-actions {
               flex-shrink: 0;
               padding: 15px;
               border-top: 1px solid var(--border-color);
               background-color: #f7f7f7;
               display: flex;
               flex-direction: column;
               gap: 10px;
           }

           #member-management-actions button {
               width: 100%;
               padding: 15px;
               background-color: var(--accent-color);
               color: white;
               border: none;
               border-radius: 8px;
               font-size: 16px;
               font-weight: 600;
               cursor: pointer;
           }

           #member-management-actions #create-new-member-btn {
               background-color: #4cd964;
           }

           .waimai-card {
               width: 240px;
               border-radius: 12px;
               overflow: hidden;
               background-color: var(--secondary-bg);
               box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
               font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
           }

           .waimai-header {
               display: flex;
               align-items: center;
               gap: 8px;
               padding: 10px 12px;
               border-bottom: 1px solid #f0f0f0;
           }

           .waimai-header .icon {
               width: 20px;
               height: 20px;
           }

           .waimai-header .title-group {
               display: flex;
               align-items: baseline;
               font-size: 14px;
               color: #8a8a8a;
           }

           .waimai-header .title-group .brand {
               font-weight: 600;
               color: #555;
               margin-right: 5px;
           }

           .waimai-header .title-group .separator {
               margin: 0 5px;
           }

           .waimai-catchphrase {
               font-size: 13px;
               color: #1f1f1f;
               padding: 12px;
           }

           .waimai-main {
               background-color: #FFD66B;
               padding: 12px;
               text-align: center;
           }

           .waimai-main .request-title {
               font-size: 12px;
               color: #856404;
               margin-bottom: 8px;
           }

           .waimai-main .payment-box {
               background-color: var(--secondary-bg);
               border-radius: 8px;
               padding: 15px 10px;
           }

           .waimai-main .payment-label {
               font-size: 13px;
               color: #8a8a8a;
           }

           .waimai-main .amount {
               font-size: 32px;
               font-weight: 700;
               color: #1f1f1f;
               margin: 4px 0 12px 0;
           }

           .waimai-main .countdown-label {
               font-size: 13px;
               color: #8a8a8a;
           }

           .waimai-main .countdown-timer {
               display: inline-flex;
               align-items: center;
               gap: 2px;
               margin-left: 5px;
           }

           .waimai-main .countdown-timer span {
               background-color: #333;
               color: white;
               padding: 2px 4px;
               border-radius: 2px;
               font-weight: bold;
               font-size: 12px;
           }

           .waimai-details-btn {
               width: 100%;
               padding: 10px 0;
               margin-top: 15px;
               border: none;
               border-radius: 6px;
               background-color: #FFC33A;
               color: #49380a;
               font-size: 14px;
               font-weight: 600;
               cursor: pointer;
           }

           .message-bubble.status-paid .waimai-card {
               border: 2px solid #28a745;
           }

           .message-bubble.status-paid .waimai-main .request-title::before {
               content: '✅  ';
           }

           .message-bubble.status-paid .waimai-main .request-title {
               color: #155724;
               font-weight: 600;
               content: "我已为您买单，请尽情享用吧～" !important;
               display: block;
               margin-bottom: 15px;
           }

           .message-bubble.status-paid .payment-box {
               display: none;
           }

           .message-bubble.status-paid .waimai-details-btn {
               background-color: #28a745;
               color: white;
           }

           .message-bubble.status-rejected .waimai-card {
               border: 2px solid #dc3545;
               opacity: 0.8;
           }

           .message-bubble.status-rejected .waimai-main {
               background-color: #e9ecef;
           }

           .message-bubble.status-rejected .waimai-main .request-title::before {
               content: '❌ ';
           }

           .message-bubble.status-rejected .waimai-main .request-title {
               color: #721c24;
               font-weight: 600;
               content: "我拒绝了您的代付请求" !important;
               display: block;
               margin-bottom: 15px;
           }

           .message-bubble.status-rejected .payment-box {
               display: none;
           }

           .message-bubble.status-rejected .waimai-details-btn {
               background-color: #6c757d;
               color: white;
           }

           .message-bubble[class*="status-"] .request-title {
               font-size: 0;
           }

           .message-bubble[class*="status-"] .request-title::after {
               font-size: 14px;
           }

           .message-bubble.status-paid .request-title::after {
               content: "我已为您买单，请尽情享用吧～";
           }

           .message-bubble.status-rejected .request-title::after {
               content: "我拒绝了您的代付请求";
           }

           .waimai-user-actions {
               display: flex;
               gap: 10px;
               padding: 0 12px 12px 12px;
               background-color: var(--secondary-bg);
           }

           .waimai-user-actions button {
               flex: 1;
               padding: 10px;
               border-radius: 8px;
               border: 1.5px solid;
               font-size: 14px;
               font-weight: 600;
               cursor: pointer;
               transition: all 0.2s ease;
           }

           .waimai-pay-btn {
               background-color: #28a745;
               border-color: #1f7a33;
               color: white;
           }

           .waimai-pay-btn:hover {
               background-color: #218838;
           }

           .waimai-decline-btn {
               background-color: #f8f9fa;
               border-color: #ced4da;
               color: #495057;
           }

           .waimai-decline-btn:hover {
               background-color: #e2e6ea;
           }

           #api-settings-screen,
           #font-settings-screen,
           #wallpaper-screen,
           #memories-view,
           #contact-picker-screen,
           #member-management-screen,
           #world-book-editor-screen {
               background-color: var(--secondary-bg);
           }

           #api-settings-screen .form-container,
           #font-settings-screen .form-container,
           #wallpaper-screen .form-container {
               padding-top: 100px;
               margin-top: -80px;
               background-color: var(--secondary-bg);
           }

           #wallpaper-screen .form-container {
               align-items: center;
           }

           #incoming-call-modal .incoming-call-content {
               background-color: rgba(40, 40, 40, 0.85);
               backdrop-filter: blur(20px);
               -webkit-backdrop-filter: blur(20px);
               border-radius: 20px;
               width: 280px;
               padding: 30px 20px;
               text-align: center;
               color: white;
               box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
           }

           .caller-avatar {
               width: 80px;
               height: 80px;
               border-radius: 50%;
               object-fit: cover;
               margin-bottom: 12px;
               border: 3px solid rgba(255, 255, 255, 0.5);
           }

           .caller-name {
               font-size: 20px;
               font-weight: 600;
               margin-bottom: 5px;
           }

           .caller-text {
               font-size: 14px;
               color: #ccc;
               margin-bottom: 30px;
           }

           .incoming-call-actions {
               display: flex;
               justify-content: space-around;
               align-items: center;
           }

           .action-button-wrapper {
               display: flex;
               flex-direction: column;
               align-items: center;
               gap: 8px;
               font-size: 13px;
               color: #e0e0e0;
           }

           .call-action-btn {
               width: 60px;
               height: 60px;
               border-radius: 50%;
               border: none;
               cursor: pointer;
               background-size: 50%;
               background-repeat: no-repeat;
               background-position: center;
               transition: transform 0.2s, box-shadow 0.2s;
               box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
           }

           .call-action-btn:active {
               transform: scale(0.9);
           }

           .call-action-btn.decline {
               background-color: #ff3b30;
               background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13.5 16.5L3 6m18 6l-5.6-5.6a1.2 1.2 0 0 0-1.7 0L3 18.2a1.2 1.2 0 0 0-.3 1.2l1.2 3.6a1.2 1.2 0 0 0 1.2.9h15.6a1.2 1.2 0 0 0 1.2-1.2V7.7a1.2 1.2 0 0 0-.3-1.1z"/></svg>');
           }

           .call-action-btn.accept {
               background-color: #4cd964;
               background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>');
               animation: pulse 1.5s infinite;
           }

           @keyframes pulse {
               0% {
                   box-shadow: 0 0 0 0 rgba(76, 217, 100, 0.7);
               }

               70% {
                   box-shadow: 0 0 0 15px rgba(76, 217, 100, 0);
               }

               100% {
                   box-shadow: 0 0 0 0 rgba(76, 217, 100, 0);
               }
           }

           #video-call-screen {
               background-color: #1c1c1e;
               color: white;
               display: flex;
               flex-direction: column;
               overflow: hidden;
           }

           .video-call-top-bar {
               position: absolute;
               top: 0;
               left: 0;
               width: 100%;
               padding: 15px 20px;
               padding-top: 50px;
               background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent);
               z-index: 100;
               text-align: center;
               box-sizing: border-box;
               pointer-events: none;
           }

           #call-timer {
               font-size: 16px;
               font-weight: 500;
               letter-spacing: 1px;
           }

           .video-call-controls {
               position: absolute;
               bottom: 0;
               left: 0;
               width: 100%;
               display: flex;
               justify-content: space-around;
               align-items: center;
               padding: 20px;
               padding-bottom: 40px;
               background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
               z-index: 100;
               box-sizing: border-box;
           }

           .video-call-avatar-area {
               flex-grow: 1;
               display: flex;
               justify-content: center;
               align-items: center;
               padding: 20px;
               padding-top: 80px;
               box-sizing: border-box;
               overflow-y: auto;
           }

           #participant-avatars-grid {
               display: flex;
               flex-wrap: wrap;
               justify-content: center;
               align-items: center;
               gap: 15px;
               max-width: 100%;
           }

           .participant-avatar-wrapper {
               position: relative;
               text-align: center;
               flex-shrink: 0;
           }

           .participant-avatar {
               width: 70px;
               height: 70px;
               border-radius: 50%;
               object-fit: cover;
               border: 3px solid rgba(255, 255, 255, 0.2);
               transition: all 0.3s ease;
           }

           .participant-name {
               margin-top: 8px;
               font-size: 12px;
               color: #ccc;
           }

           .participant-avatar.speaking {
               border-color: #4cd964;
               box-shadow: 0 0 20px rgba(76, 217, 100, 0.6);
               transform: scale(1.05);
           }