.chat-shell{display:flex;height:calc(100dvh - 235px);min-height:560px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--paper);color:var(--ink)}.chat-shell button,.chat-shell input,.chat-shell textarea{font:inherit;color:inherit}.chat-shell button{cursor:pointer}.chat-shell button:disabled{cursor:default;opacity:.55}.chat-roster{display:flex;flex-direction:column;width:280px;flex-shrink:0;border-right:1px solid var(--line);background:var(--surface-subtle)}.chat-roster>header{display:flex;align-items:center;justify-content:space-between;padding:20px 18px 12px}.chat-roster h2,.chat-head h2{font-size:16px;margin:0}.chat-muted{color:var(--muted);font-size:11px}.chat-roster>input{margin:0 16px 12px;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:var(--paper);min-width:0}.chat-people{overflow:auto;flex:1;min-height:0;padding-bottom:8px}.chat-person{width:calc(100% - 16px);margin:2px 8px;padding:12px 9px;display:flex;align-items:center;gap:10px;text-align:left;border:1px solid transparent;border-radius:7px;background:none}.chat-person:hover{background:var(--soft)}.chat-person[aria-pressed=true]{background:var(--accent-soft);border-color:var(--line)}.chat-avatar{width:35px;height:35px;display:grid;place-items:center;flex-shrink:0;border:1px solid var(--line);border-radius:11px;background:var(--soft);color:var(--accent);font-size:11px;font-weight:600}.chat-person-copy{min-width:0;flex:1}.chat-person-top,.chat-person-bottom{display:flex;justify-content:space-between;align-items:center;gap:5px}.chat-person-top strong{font-size:13px}.chat-person-top small{color:var(--muted);font-size:9px;white-space:nowrap}.chat-person-bottom{margin-top:5px}.chat-person-bottom>span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-unread{padding:0 5px;min-width:17px;border-radius:10px;background:var(--accent);color:var(--paper);font-size:10px;text-align:center}.chat-roster>footer{padding:15px;border-top:1px solid var(--line)}.chat-main{flex:1;min-width:0;display:flex;flex-direction:column}.chat-head{display:flex;align-items:center;gap:12px;padding:16px 23px;border-bottom:1px solid var(--line);flex-shrink:0}.chat-head small{font-size:11px;color:var(--muted)}.chat-connection{padding:7px 23px;font-size:11px;color:var(--muted);background:var(--surface-subtle);border-bottom:1px solid var(--line)}.chat-connection.error{color:var(--amber);background:var(--amber-soft)}.chat-messages{flex:1;min-height:0;overflow:auto;padding:20px 25px;scrollbar-width:thin}.chat-message{display:flex;margin-bottom:20px}.chat-message.mine{justify-content:flex-end}.chat-message-body{max-width:85%;min-width:0}.chat-message-meta{font-size:10px;color:var(--muted);margin-bottom:6px}.mine .chat-message-meta{text-align:right}.chat-bubble{padding:10px 14px;border:1px solid var(--line);background:var(--surface-subtle);border-radius:0 9px 9px 9px;font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.mine .chat-bubble{background:var(--accent-soft);border-color:var(--accent-soft);border-radius:9px 0 9px 9px}.chat-message-status{text-align:right;font-size:10px;color:var(--muted);margin-top:4px}.chat-image{display:block;padding:0;margin-top:7px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--soft);max-width:100%}.chat-image img{display:block;width:270px;max-width:100%;max-height:220px;min-height:70px;object-fit:contain}.chat-file{margin-top:7px;display:flex;align-items:center;gap:12px;padding:12px;background:var(--surface-subtle);border:1px solid var(--line);border-radius:7px;text-decoration:none;color:var(--ink);max-width:350px;overflow-wrap:anywhere}.chat-file strong{display:block;font-size:12px;font-weight:500}.chat-file small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.chat-file-icon{font-size:10px;background:var(--accent-soft);padding:8px;border-radius:4px;white-space:nowrap}.chat-empty{margin:40px 10px;text-align:center;color:var(--muted);font-size:13px}.chat-earlier{display:block;margin:0 auto 20px;background:none;border:0;color:var(--accent)!important;font-size:12px!important}.chat-composer{border-top:1px solid var(--line);padding:10px 20px 14px;flex-shrink:0}.chat-tools{display:flex;align-items:center;gap:10px}.chat-button{border:0;background:var(--soft);padding:5px 9px;border-radius:4px;font-size:12px!important}.chat-composer textarea{display:block;width:100%;resize:vertical;min-height:70px;max-height:170px;padding:10px 0;background:transparent;border:0;line-height:1.6;font-size:13px!important}.chat-composer textarea:focus{outline:none}.chat-composer textarea:focus-visible{box-shadow:inset 0 -2px var(--accent)}.chat-composer>footer{display:flex;justify-content:space-between;align-items:center}.chat-send{border:0;border-radius:5px;background:var(--accent);color:var(--paper)!important;padding:8px 24px;font-size:13px!important}.chat-send-error{font-size:12px;color:var(--danger);margin:5px 0}.chat-upload-list{max-height:130px;overflow:auto}.chat-upload{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0;background:var(--soft);padding:8px;border-radius:5px;font-size:11px}.chat-upload>span{flex:1;overflow-wrap:anywhere;min-width:0}.chat-upload progress{width:100%;height:5px;accent-color:var(--accent)}.chat-upload small{color:var(--danger);width:100%}.chat-back{display:none;border:0;background:none;font-size:25px!important}.chat-image-dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:14px;max-width:90vw;max-height:90dvh}.chat-image-dialog::backdrop{background:#14251e88}.chat-image-dialog img{display:block;max-width:80vw;max-height:76dvh;object-fit:contain;margin-top:10px}html[data-color-mode=dark] .chat-send,html[data-color-mode=dark] .chat-unread{color:var(--canvas)!important}@media(max-width:1050px){.chat-roster{width:235px}.chat-shell{min-height:580px}.chat-messages{padding:18px}.chat-head{padding:14px 18px}.chat-tools{gap:6px}}@media(max-width:700px){.chat-shell{height:calc(100dvh - 190px);min-height:560px}.chat-roster{display:none}.chat-shell.show-roster .chat-roster{display:flex;width:100%;border:0}.chat-shell.show-roster .chat-main{display:none}.chat-back{display:block}.chat-head{padding:12px}.chat-connection{padding:6px 12px}.chat-messages{padding:14px 12px}.chat-message-body{max-width:94%}.chat-composer{padding:8px 12px 12px}.chat-tools .chat-muted{font-size:9px}.chat-tools{gap:5px}.chat-tools .chat-button{font-size:11px!important;padding:5px 7px}.chat-composer>footer .chat-muted{font-size:9px}.chat-send{padding:7px 17px}.chat-composer textarea{min-height:65px}.chat-bubble{font-size:12px}.chat-file{max-width:270px}}
#chat-nav.top-chat-button{position:relative;display:inline-grid;place-items:center;justify-content:center;flex-shrink:0;gap:0;width:34px;height:32px;padding:0;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer}.top-chat-button:hover{background:var(--soft)}#chat-nav .message-unread-badge{position:absolute;right:-7px;top:-7px;min-width:18px;height:18px;padding:0 4px;border-radius:10px;background:#b4232f;color:#fff;font-size:10px;line-height:18px;text-align:center;font-weight:700;box-shadow:0 0 0 2px var(--paper)}
.chat-popup{width:min(1080px,calc(100vw - 48px));height:min(760px,calc(100dvh - 72px));max-width:none;max-height:none;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:0 24px 80px #14251e44;overflow:hidden}.chat-popup::backdrop{background:#14251e66}.chat-popup[open]{display:flex;flex-direction:column}.chat-popup>.chat-shell{height:auto;flex:1;min-height:0;border:0;border-radius:0}.chat-popup .chat-roster{width:280px}.chat-popup .chat-composer textarea{max-height:140px}
@media(max-width:700px){.chat-popup{width:calc(100vw - 16px);height:calc(100dvh - 24px);border-radius:10px}}
.chat-popup-bar{flex-shrink:0;display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--surface-subtle)}.chat-popup-bar h2{margin:0;font-size:15px}.chat-popup-bar .chat-muted{margin-left:auto}.chat-popup-close{cursor:pointer;flex-shrink:0;width:30px;height:30px;padding:0;border:0;background:transparent;color:var(--ink);font-size:24px;line-height:1}.top-chat-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

#chat-nav:focus-visible,.chat-popup-close:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.chat-popup-close:hover{background:var(--soft);border-radius:5px}.chat-popup .chat-roster>footer{flex-shrink:0}.chat-popup .chat-composer{max-height:48%;overflow:auto}
