.group-avatar{width:30px;height:30px;border-radius:50%;object-fit:cover;margin-right:8px}.group-notice{flex:none;padding:9px 14px;background:#fff9e9;color:#785e22;font-size:12px;white-space:pre-wrap;max-height:100px;overflow:auto}.group-predictions{display:flex;gap:8px;flex:none;padding:5px 12px;background:#eef5ff}.group-predictions button,.group-history{border:1px solid #d3e0ec;border-radius:16px;background:white;color:#3b7cc1;padding:5px 12px;font-size:12px}.group-history{display:block;margin:0 auto}.group-layout [hidden]{display:none!important}.group-compose input{color:#34414f!important;-webkit-text-fill-color:#34414f!important}.group-compose input::placeholder{color:#8b9aad;-webkit-text-fill-color:#8b9aad}
.group-packet-message{--packet-unit:clamp(24px,7.46667vw,28.7467px);margin:0 0 24px;max-width:100%;text-align:left;font-size:var(--packet-unit)}
.group-packet-time{display:block;text-align:center;font-size:10px;color:#8c9fbb;margin:0 0 8px}
.group-packet-row{display:flex;align-items:flex-start;gap:10px}.group-packet-avatar{width:34px;height:34px;object-fit:contain;border-radius:50%;flex:none;background:#fff;border:1px solid #fff}
.group-packet-main{min-width:0;flex:1}.group-packet-sender{display:flex;gap:5px;align-items:center;margin:0 0 5px;font-size:10px;color:#8298b8}.group-packet-sender b{color:#3478f6;font-weight:600}
.group-layout .group-packet{display:block;width:calc(var(--packet-unit)*7.14286);max-width:100%;padding:0;margin:0;border:1px solid #efb8b8;border-radius:calc(var(--packet-unit)*.35714);overflow:hidden;cursor:pointer;background:#fff;text-align:left;box-shadow:0 6px 20px #b91c1c38,0 2px 6px #00000014;font:inherit;opacity:1}
.group-packet-cover{display:block;position:relative;background:linear-gradient(145deg,#b91c1c,#dc2626 42%,#ef4444);padding:calc(var(--packet-unit)*.35714) calc(var(--packet-unit)*.35714) calc(var(--packet-unit)*.42857);overflow:hidden}
.group-packet-shine{position:absolute;top:-40%;right:-15%;width:calc(var(--packet-unit)*3.57143);height:calc(var(--packet-unit)*3.57143);background:radial-gradient(circle,#ffffff47 0%,transparent 70%);pointer-events:none}
.group-packet-header{position:relative;z-index:1;display:flex;align-items:center;gap:calc(var(--packet-unit)*.42857)}.group-packet-icon{width:calc(var(--packet-unit)*1.28571);height:calc(var(--packet-unit)*1.28571);flex:none;display:flex;align-items:center;justify-content:center;background:#ffffff26;border-radius:50%;border:1px solid #ffffff40}.group-packet-icon img{width:calc(var(--packet-unit)*.78571);height:calc(var(--packet-unit)*.78571);object-fit:contain}
.group-packet-content{min-width:0}.group-packet-title{display:block;font-size:calc(var(--packet-unit)*.46429);font-weight:700;color:#fff;line-height:1.3;text-shadow:0 1px 2px #00000026;overflow-wrap:anywhere}.group-packet-subtitle{display:block;margin-top:calc(var(--packet-unit)*.07143);font-size:calc(var(--packet-unit)*.35714);line-height:1.5;color:#ffffffe0}
.group-packet-seal{position:absolute;right:calc(var(--packet-unit)*.28571);bottom:calc(var(--packet-unit)*.21429);width:var(--packet-unit);height:var(--packet-unit);border-radius:50%;border:1.5px solid #f5d78e;color:#f5d78e;font-size:calc(var(--packet-unit)*.46429);font-weight:700;display:flex;align-items:center;justify-content:center;opacity:.55;transform:rotate(-12deg)}
.group-packet-footer{display:flex;align-items:center;gap:calc(var(--packet-unit)*.21429);padding:calc(var(--packet-unit)*.21429) calc(var(--packet-unit)*.35714);background:#fff;border-top:1px solid #e2e8f0;color:#64748b;font-size:calc(var(--packet-unit)*.39286);line-height:1.5}.group-packet-badge{flex:none;padding:calc(var(--packet-unit)*.07143) calc(var(--packet-unit)*.21429);border-radius:4px;font-size:calc(var(--packet-unit)*.35714);font-weight:600;color:#b45309;background:#fff0c9}.group-packet:disabled{cursor:default}.group-packet.received .group-packet-cover,.group-packet.ended .group-packet-cover{background:linear-gradient(145deg,#c77867,#d88e7d 42%,#e7aa9b)}.group-packet:not(:disabled):active{transform:scale(.98)}

.group-layout .group-chat-feed{padding-left:10px;padding-right:10px}.group-packet-row{gap:8px}.group-packet-avatar{width:35px;height:35px}
