/* Quiet group conversation, using the approved direct-message surfaces. */
.crab-h5 .event-group-entry { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 18px; }
.crab-h5 .event-group-entry .ghost-button { display:flex; align-items:center; gap:10px; min-height:48px; flex:1; margin:0; font-size:15px; border:1px solid #201c2238; background:#FFF9EF; box-shadow:none; }
.crab-h5 .event-group-entry .ghost-button > span { flex:1; min-width:0; text-align:left; }
.crab-h5 .event-group-entry svg { width:22px; height:22px; }
.crab-h5 .event-group-entry .text-button { min-height:44px; padding:10px; font-size:13px; }
.crab-h5 .event-group-entry b { min-width:22px; padding:2px 6px; border-radius:12px; background:var(--coral); font-size:12px; }
.crab-h5 .event-group-symbol { display:grid; place-items:center; flex:none; width:44px; height:44px; color:var(--ink); }
.crab-h5 .event-group-symbol svg { width:28px; height:28px; }
.crab-h5 .event-group-heading { border:0; background:transparent; text-align:left; font:inherit; }
.crab-h5 .event-group-heading { flex:1; }
.crab-h5 .event-group-avatar-open { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--ink); }
.crab-h5 .event-group-view .event-group-members { display:grid; place-items:center; flex:none; width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:12px; background:transparent; color:var(--ink); box-shadow:none; }
.crab-h5 .event-group-view .event-group-members svg { width:24px; height:24px; }
.crab-h5 .event-group-view .event-group-members:hover { background:#201C2208; }
.crab-h5 .event-group-view .event-group-members:active { background:#201C2210; }
.crab-h5 .event-group-heading .chat-peer-copy h1 { font-size:16px; line-height:1.45; overflow-wrap:anywhere; }
.crab-h5 .event-group-heading .chat-peer-copy { min-width:0; }
.crab-h5 .event-group-author { margin:0 4px 5px; font-size:12px; line-height:1.5; color:var(--ink-2); overflow-wrap:anywhere; }
.crab-h5 .chat-row.is-mine .event-group-author { text-align:right; }
.crab-h5 .event-group-view .chat-row { gap:8px; }
.crab-h5 .event-group-avatar { display:grid; place-items:center; align-self:flex-start; flex:none; width:44px; min-height:44px; border-radius:50%; }
.crab-h5 .event-group-avatar-image { display:block; width:36px; height:36px; border:1px solid #201c2228; border-radius:50%; object-fit:cover; background:var(--sand); }
.crab-h5 .event-group-view .chat-row.is-mine .event-group-avatar { order:2; }
.crab-h5 .event-group-view .chat-message { max-width:min(calc(100% - 52px),300px); }
.crab-h5 .event-group-avatar:focus-visible { outline:3px solid #236CAF; outline-offset:2px; }
.crab-h5 .event-group-view .is-announcement .chat-bubble { background:#FFF0BC; }
/* Latest notice belongs to the fixed conversation header, outside history. */
.crab-h5 .event-group-announcement { flex:none; width:100%; padding:0 12px; border-bottom:1px solid #E6D8AE; background:#FFF5D6; }
.crab-h5 .event-group-announcement-inner { display:flex; align-items:center; gap:6px; min-width:0; height:44px; }
.crab-h5 .event-announcement-icon { display:grid; place-items:center; flex:none; width:36px; height:40px; color:#A45236; }
.crab-h5 .event-announcement-icon svg { width:25px; height:25px; }
.crab-h5 .event-group-announcement .event-announcement-icon { width:22px; height:44px; }
.crab-h5 .event-group-announcement .event-announcement-icon svg { width:20px; height:20px; }
.crab-h5 .event-group-announcement-open { display:flex; align-items:center; gap:8px; flex:1; min-width:0; height:44px; padding:0; border:0; background:transparent; color:var(--ink); font:inherit; text-align:left; }
.crab-h5 .event-group-announcement-label { flex:none; max-width:42%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:800 13px/1.5 var(--sans); }
.crab-h5 .event-group-announcement-preview { display:block; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#4F4635; font:400 14px/1.55 var(--sans); }
.crab-h5 .event-group-announcement-arrow { flex:none; padding-inline:2px; color:#796C4D; font:400 20px/1 var(--sans); }
.crab-h5 .event-group-announcement-edit { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:13px; border:0; border-radius:8px; background:transparent; color:#675634; }
.crab-h5 .event-group-announcement-edit:hover { background:#F2E4BA; }
.crab-h5 .event-group-announcement-edit svg { width:18px; height:18px; }
.crab-h5 .event-group-announcement-bubble { min-height:44px; font:inherit; color:var(--ink); text-align:left; cursor:pointer; }
.crab-h5 .event-group-edited { margin-left:6px; color:#78736C; font:400 11px/1.4 var(--sans); }
/* A stable reading surface with native modal focus and Escape handling. */
.crab-h5 .event-announcement-dialog { position:fixed; inset:auto 0 0; width:min(100%,600px); max-width:100%; max-height:calc(100dvh - var(--h5-safe-top,20px) - 20px); margin:0 auto; padding:0; border:1px solid #D3CCBC; border-bottom:0; border-radius:24px 24px 0 0; background:#FFFCF7; color:var(--ink); box-shadow:0 -12px 40px #201C2214; overflow:hidden; }
.crab-h5 .event-announcement-dialog::backdrop { background:#201C225C; }
.crab-h5 .event-announcement-sheet { display:flex; flex-direction:column; max-height:inherit; }
.crab-h5 .event-announcement-heading { display:flex; align-items:center; gap:8px; flex:none; padding:16px 20px 14px; border-bottom:1px solid #E7DDBF; background:#FFF5D6; }
.crab-h5 .event-announcement-heading h2 { flex:1; min-width:0; margin:0; font:800 21px/1.4 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-announcement-close { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:11px; border:1px solid #DACEAE; border-radius:50%; background:#FFFCF2; color:var(--ink); }
.crab-h5 .event-announcement-close svg { width:22px; height:22px; }
.crab-h5 .event-announcement-reading { min-height:0; padding:22px 24px 24px; overflow-y:auto; overscroll-behavior:contain; }
.crab-h5 .event-announcement-byline { display:flex; align-items:center; gap:10px; margin:0 0 20px; }
.crab-h5 .event-announcement-avatar { display:block; flex:none; width:36px; height:36px; border:1px solid #201c2228; border-radius:50%; background:var(--sand); object-fit:cover; }
.crab-h5 .event-announcement-byline > span { display:grid; gap:2px; min-width:0; overflow-wrap:anywhere; }
.crab-h5 .event-announcement-byline strong { font:600 13px/1.5 var(--sans); }
.crab-h5 .event-announcement-byline > span > span { color:var(--ink-2); font:400 12px/1.5 var(--sans); }
.crab-h5 .event-announcement-body { margin:0; font:400 16px/1.85 var(--sans); white-space:pre-wrap; overflow-wrap:anywhere; }
.crab-h5 .event-announcement-footer { flex:none; padding:12px 24px calc(16px + env(safe-area-inset-bottom,0px)); border-top:1px solid #E6E0D3; }
.crab-h5 .event-announcement-footer button { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:46px; padding:10px 16px; border:1px solid #C4D7E1; border-radius:12px; background:#E9F2F7; color:#294F68; font:700 14px/1.5 var(--sans); }
.crab-h5 .event-announcement-footer svg { width:18px; height:18px; }
.crab-h5 #event-announcement-edit label { display:block; margin-bottom:10px; font:600 14px/1.5 var(--sans); }
.crab-h5 #event-announcement-body { display:block; width:100%; min-height:200px; max-height:45dvh; padding:14px; border:1px solid #C8C1B4; border-radius:12px; background:#FFFEFB; color:var(--ink); font:400 16px/1.7 var(--sans); resize:vertical; }
.crab-h5 .event-announcement-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; margin-top:20px; }
.crab-h5 .event-announcement-actions button { min-height:46px; max-width:100%; padding:10px 18px; border:1px solid #C8C1B4; border-radius:12px; background:#FFFEFB; color:var(--ink); font:700 14px/1.5 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-announcement-actions .event-announcement-save { border-color:transparent; background:var(--coral); }
.crab-h5 .event-announcement-actions button:disabled { opacity:.6; }
.crab-h5 .event-announcement-error { margin:12px 0 0; color:#A23D32; font:400 14px/1.7 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-announcement-dialog :is(button,textarea):focus-visible { outline:3px solid #236CAF; outline-offset:2px; }
.crab-h5 .event-group-archive { flex:none; margin:0 0 20px; font-size:14px; line-height:1.7; color:var(--ink-2); }
.crab-h5 .event-group-earlier { align-self:center; flex:none; min-height:44px; padding:10px 14px; margin:0 0 18px; border:0; background:transparent; color:var(--ink-2); font:inherit; font-size:14px; text-decoration:underline; }
.crab-h5 .event-group-compose { display:block; }
.crab-h5 .event-group-input-row { display:flex; align-items:flex-end; gap:10px; }
.crab-h5 .event-group-view button:focus-visible,.crab-h5 .event-group-announcement button:focus-visible { outline:3px solid #236CAF; outline-offset:2px; }
@media(min-width:768px) { .crab-h5 .event-group-view > .mobile-scroll { padding-inline:24px; } }