.chat-viewport { position: relative; min-height: 0; flex: 1; display: flex; }
.chat-viewport > .chat-messages { min-width: 0; width: 100%; }
.chat-floats { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.chat-red-pins { position: absolute; top: 6px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: calc(100% - 24px); max-height: 40%; overflow-y: auto; pointer-events: auto; }
.chat-red-pin { display: inline-flex; align-items: center; gap: 7px; width: max-content; max-width: 100%; border: 1px solid #dfa958; border-radius: 12px; padding: 8px 12px; background: #b82129; color: white; box-shadow: 0 4px 16px #0005; cursor: pointer; }
.chat-red-pin span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.chat-activity-pins { position: absolute; right: 0; top: 70px; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; max-width: min(260px, 65%); max-height: calc(100% - 78px); overflow-y: auto; pointer-events: auto; }
.chat-life-pin, .chat-cici-pin, .chat-life-tab { border: 1px solid #77d8e94d; border-right: 0; border-radius: 13px 0 0 13px; background: #10283cf2; box-shadow: 0 4px 16px #0004; color: #eef6fa; }
.chat-life-pin { display: flex; width: fit-content; max-width: 100%; }
.chat-life-pin > button:first-child { display: flex; flex-direction: column; gap: 5px; min-width: 0; text-align: left; border: 0; background: transparent; color: inherit; padding: 10px; cursor: pointer; }
.chat-life-pin span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 195px; }
.chat-life-pin b, .chat-life-tab { color: #87ddeb; }
.chat-collapse { align-self: stretch; border: 0; background: transparent; color: #87ddeb; padding: 6px; cursor: pointer; }
.chat-life-tab { padding: 12px 9px; cursor: pointer; }
.chat-cici-pin { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; width: max-content; max-width: 100%; padding: 10px 12px; cursor: pointer; }
.chat-cici-pin b { color: #f4ce75; }
.chat-activity-pins small { font-size: 11px; color: #abc2ce; }
.chat-activity-dialog { box-sizing: border-box; width: min(440px, calc(100vw - 24px)); max-height: 85vh; max-height: 85dvh; border: 1px solid #7997a9; border-radius: 20px; padding: 0; background: #102435; color: #edf6fc; box-shadow: 0 20px 80px #0008; }
.chat-activity-dialog::backdrop { background: #0009; }
.chat-activity-dialog header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid #ffffff20; }
.chat-activity-dialog button { color: inherit; cursor: pointer; }
.chat-activity-dialog header button { background: transparent; border: 0; font-size: 20px; }
.chat-detail-body { padding: 20px; text-align: center; overflow-wrap: anywhere; }
.chat-detail-body p { line-height: 1.6; }
.chat-detail-body button { border: 1px solid #ffffff30; border-radius: 10px; background: #254559; padding: 10px 14px; }
.chat-detail-body button:disabled { opacity: .5; cursor: default; }
.chat-detail-body .chat-claim { display: block; width: 100%; background: #bb2731; font-weight: 700; }
.chat-red-icon { font-size: 44px; }
.chat-claim-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; text-align: left; border-bottom: 1px solid #ffffff15; }
.chat-claim-row b { color: #f4ce75; white-space: nowrap; }
.chat-drop-buttons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.chat-life-choice { display: block; width: 100%; margin: 8px 0; text-align: left; }
.chat-detail-text { white-space: pre-wrap; text-align: left; }