.brand button.brand-mark { border: 0; cursor: pointer; flex-shrink: 0; }
.brand button.brand-mark:hover { filter: brightness(.92); }
.personal-shell .main { padding: 0; overflow: hidden; }
.personal-page { display: flex; flex-direction: column; min-height: 0; }
.personal-inbox { display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); height: 100%; flex: 1; min-height: 0; }
.personal-chat-list { background: #fff; border-right: 1px solid #dce3e6; padding: 0 10px 12px; overflow-y: auto; min-width: 0; }
.personal-list-heading { display: flex; align-items: center; justify-content: space-between; padding: 18px 5px 12px; gap: 10px; }
.personal-list-heading h1 { font-size: 16px; margin: 0; color: #25373f; }
.personal-chat-list > input { width: 100%; border: 1px solid #e5ebee; background: #f0f2f5; border-radius: 8px; padding: 11px; margin-bottom: 10px; color: #25373f; font-size: 13px; }
.personal-contact { display: block; width: 100%; padding: 14px 10px; border: 0; background: #fff; border-radius: 7px; cursor: pointer; text-align: left; color: #182127; }
.personal-contact:hover, .personal-contact.active { background: #e8f0f1; }
.personal-contact-row { display: flex; align-items: center; gap: 12px; }
.personal-contact-copy { flex: 1; min-width: 0; }
.personal-contact-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.personal-contact-top strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.personal-contact-top time { font-size: 10px; color: #667b86; }
.personal-message-preview { display: block; font-size: 12px; color: #677a84; margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.personal-chat { min-height: 0; min-width: 0; display: flex; flex-direction: column; background: #efeae2; }
.personal-chat-top { display: flex; align-items: center; gap: 12px; padding: 12px 20px; background: #f0f2f5; border-bottom: 1px solid #dce3e6; }
.personal-chat-title { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; color: #25373f; }
.personal-chat-title strong { font-size: 14px; }
.personal-chat-title small { font-size: 11px; color: #677a84; }
.personal-messages { overflow-y: auto; padding: 18px clamp(16px, 5vw, 85px); flex: 1; min-height: 0; }
.personal-message { display: flex; margin: 7px 0; }
.personal-message.outbound { justify-content: flex-end; }
.personal-bubble { max-width: min(80%, 600px); background: #fff; color: #182127; padding: 10px 12px 6px; border-radius: 9px; box-shadow: 0 1px 1px #172a2b15; overflow-wrap: anywhere; }
.personal-message.outbound .personal-bubble { background: #d9fdd3; }
.personal-bubble .message-text { color: inherit; font-size: 14px; white-space: pre-wrap; margin: 0 0 5px; }
.personal-bubble .sender-name { font-size: 11px; color: #008069; display: block; margin-bottom: 6px; }
.personal-message-meta { display: flex; justify-content: flex-end; align-items: center; gap: 7px; color: #6a7d7f; font-size: 9px; }
.personal-hide-message { border: 0; background: transparent; color: inherit; font-size: 9px; cursor: pointer; padding: 4px; opacity: .15; }
.personal-message:hover .personal-hide-message, .personal-hide-message:focus { opacity: 1; }
.personal-deleted { display: block; font-size: 10px; color: #6e7f7c; margin: 8px 0; }
.personal-composer { display: flex; gap: 12px; padding: 13px 16px; background: #f0f2f5; align-items: flex-end; }
.personal-composer textarea { flex: 1; min-width: 0; resize: none; border: 1px solid #dde5e8; border-radius: 9px; padding: 12px; color: #182127; background: #fff; font-size: 14px; }
.personal-composer .primary-button { background: #008069; color: #fff; }
.personal-empty { margin: auto; text-align: center; padding: 30px; color: #65777d; }
.personal-empty > .icon { width: 55px; height: 55px; color: #00a884; margin-bottom: 15px; }
.personal-empty h2 { font-size: 24px; font-weight: 500; color: #3b535e; }
.personal-empty p { font-size: 13px; line-height: 1.7; margin-top: 12px; }
.personal-connection { width: min(100% - 40px, 560px); margin: 30px auto; padding: 25px; border-radius: 14px; border: 1px solid #dce5e7; background: #fff; overflow-y: auto; color: #25373f; }
.personal-connection h1 { font-size: 22px; }
.personal-connection .subtitle { font-size: 13px; line-height: 1.7; margin: 12px 0 22px; }
.personal-connection-status { display: flex; gap: 9px; align-items: center; font-size: 13px; margin: 20px 0; }
.personal-connection .status-dot.connected { background: #00a884; }
.personal-qr { display: block; width: min(100%, 300px); margin: 15px auto; background: #fff; padding: 8px; border-radius: 10px; }
.personal-privacy-note { font-size: 12px; line-height: 1.7; color: #687b84; margin-top: 24px; }
.personal-error { margin: 0; padding: 10px 20px; background: #fff3df; color: #815422; font-size: 12px; }
.personal-file-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.personal-message-image { max-width: 100%; max-height: 280px; border-radius: 6px; display: block; object-fit: contain; }
.personal-image-button { display: block; padding: 0; border: 0; background: transparent; cursor: pointer; margin: 8px 0; }
.personal-file-link { display: flex; align-items: center; gap: 9px; border: 0; background: #15202508; padding: 12px; color: inherit; font-size: 12px; cursor: pointer; border-radius: 6px; margin: 6px 0; overflow-wrap: anywhere; }
.personal-file-preview { display: block; max-width: 100%; max-height: 65vh; margin: auto; }
.personal-mobile-back { display: none; }
html[data-appearance="dark"] .personal-chat-list, html[data-appearance="dark"] .personal-contact { background: #111b21; color: #e9edef; }
html[data-appearance="dark"] .personal-contact.active, html[data-appearance="dark"] .personal-contact:hover { background: #2a3942; }
html[data-appearance="dark"] .personal-chat-list { border-color: #26343d; }
html[data-appearance="dark"] .personal-chat { background: #0b141a; }
html[data-appearance="dark"] .personal-chat-top, html[data-appearance="dark"] .personal-composer { background: #202c33; border-color: #2a3942; }
html[data-appearance="dark"] .personal-chat-title, html[data-appearance="dark"] .personal-list-heading h1 { color: #e9edef; }
html[data-appearance="dark"] .personal-chat-list > input, html[data-appearance="dark"] .personal-composer textarea { background: #2a3942; color: #e9edef; border-color: #34454d; }
html[data-appearance="dark"] .personal-bubble { background: #202c33; color: #e9edef; }
html[data-appearance="dark"] .personal-message.outbound .personal-bubble { background: #005c4b; }
html[data-appearance="dark"] .personal-connection { background: #202c33; color: #e9edef; border-color: #34454d; }
@media (max-width: 700px) { .personal-inbox { grid-template-columns: 1fr; } .personal-chat { display: none; } .personal-chat-open .personal-chat-list { display: none; } .personal-chat-open .personal-chat { display: flex; } .personal-mobile-back { display: inline-flex; } .personal-bubble { max-width: 92%; } .personal-chat-top { padding: 10px; } .personal-composer { padding: 10px; gap: 8px; } .personal-composer .primary-button { padding: 12px; } }