.message-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-top:5px}.message-actions button{border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:20px;min-width:36px;min-height:34px;padding:4px 9px;font-size:19px;cursor:pointer}.message-actions button[aria-pressed=true]{color:var(--accent);border-color:var(--accent);background:var(--selected)}.message-actions button span{font-size:11px;margin-left:3px}.own .message-actions{justify-content:flex-end}.stars-nav{width:100%;margin-bottom:10px}.star-card{border-top:1px solid var(--line);padding:18px 0}.star-context{display:flex;flex-direction:column;gap:6px;margin-bottom:10px;font-size:13px}.star-context span{color:var(--muted);font-size:12px}#stars-dialog{max-width:640px}#stars-dialog .bubble{white-space:pre-wrap;overflow-wrap:anywhere}#stars-dialog .photo-thumb{max-width:100%;height:auto}#reaction-dialog{max-width:520px}#reaction-context{white-space:pre-wrap;max-height:110px;overflow:auto;overflow-wrap:anywhere;font-size:13px}#reaction-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}#reaction-choices button{border:1px solid var(--line);border-radius:12px;padding:10px 3px;background:var(--card);color:var(--ink);cursor:pointer}#reaction-choices button[aria-pressed=true]{background:var(--selected);border-color:var(--accent)}#reaction-choices span{display:block;font-size:27px}#reaction-choices small{display:block;font-size:10px;margin-top:7px}#rename-group-form input,.pin-card input,#passkey-pin{display:block;width:100%;font:inherit;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;margin:8px 0 14px}#rename-group-form label{font-size:13px}.pin-settings-buttons{display:flex;gap:10px;flex-wrap:wrap}#pin-screen{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--page)}#pin-screen[hidden]{display:none}.pin-card{max-width:440px;width:100%;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:24px;padding:28px}.pin-card h1{font-size:30px}.pin-card p{font-size:14px;line-height:1.6;color:var(--muted)}.pin-card label{font-size:14px}.pin-card input{font-size:26px;letter-spacing:12px;text-align:center}.pin-card button{margin:6px 6px 6px 0}.pin-card .primary{width:100%}#pin-error,#reaction-status,#stars-status{color:var(--error)}body.pin-locked .shell{display:none}body.privacy-shield>*{visibility:hidden!important}body.privacy-shield{background:var(--surface)}#pin-settings-status{font-size:13px;color:var(--accent)}.message-actions button:focus-visible,#reaction-choices button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media(max-width:600px){#reaction-dialog{padding:24px 16px}#reaction-choices{gap:5px}#reaction-choices small{font-size:9px}#stars-dialog{padding:25px 18px}.pin-card{padding:24px}.message-actions button{min-width:38px;min-height:38px}}

/* Consecutive messages share one header and sender avatar. */
.message-group{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:8px;row-gap:4px;width:fit-content;max-width:min(94%,620px);margin:16px 0}
.message-group.own{grid-template-columns:minmax(0,1fr) 28px;margin-left:auto}
.message-group .message-author{grid-column:2;grid-row:1;display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-size:11px;line-height:1.4;margin:0 2px}
.message-author time{font-size:10px;font-weight:400;white-space:nowrap}
.group-avatar{grid-column:1;grid-row:2;align-self:end;margin-bottom:3px}.group-avatar .avatar{width:28px;height:28px}
.message-stack{grid-column:2;grid-row:2;min-width:0;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.own .message-author,.own .message-stack{grid-column:1}.own .group-avatar{grid-column:2}.own .message-stack{align-items:flex-end}
.message,.message.own{display:block;width:fit-content;max-width:100%;min-width:0;margin:0;position:relative}
.message-surface{position:relative}.message .bubble{display:block;padding:9px 12px;line-height:1.4;font-size:16px;min-width:42px;max-width:100%;text-align:left;font-family:inherit;font-weight:400;letter-spacing:normal}
.message-select{cursor:pointer;white-space:pre-wrap}.message-select:hover{filter:brightness(.97)}.message-select:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.message-select .photo-caption{display:block}.message-select .photo-thumb{max-width:100%;height:auto}
.message-stack .message:not(:first-child) .bubble{border-top-left-radius:5px}.own .message-stack .message:not(:first-child) .bubble{border-top-left-radius:16px;border-top-right-radius:5px}
.message-stack .message:not(:last-child) .bubble{border-bottom-left-radius:5px}.own .message-stack .message:not(:last-child) .bubble{border-bottom-right-radius:5px}
.message.has-badges{margin-bottom:10px}.message-badges{display:flex;gap:3px;justify-content:flex-end;flex-wrap:wrap}
.message-surface>.message-badges{position:relative;z-index:1;margin:-6px 7px -9px 12px}
.message-badge{display:inline-flex;align-items:center;gap:3px;min-width:24px;min-height:24px;padding:1px 5px;border:1px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);font-size:15px;line-height:20px;box-shadow:0 1px 2px #0001}
.message-badge span{font-size:10px}.star-badge{color:var(--accent)}
.message-read-position{display:flex;justify-content:flex-end;margin-top:4px}.receipt-people{display:flex;align-items:center;gap:5px;padding:1px;min-height:24px;max-width:100%;border:0;border-radius:12px;background:none;color:var(--muted);font:inherit;text-align:left}.receipt-avatars{display:flex;align-items:center;gap:3px;flex:none}.receipt-names{min-width:0;font-size:12px;line-height:18px;overflow-wrap:anywhere}
.message .receipt-people .avatar{width:18px;height:18px;border:1px solid var(--surface)}.receipt-people:focus-visible{outline:3px solid var(--accent)}
.message .message-meta{margin:3px 2px;font-size:10px}.date-label{margin:12px 0 18px}
#message-dialog{max-width:520px;max-height:calc(100dvh - 32px);overflow-y:auto}#message-dialog h2{margin-top:6px}#message-dialog h3{font-size:14px}
#message-preview{white-space:pre-wrap;overflow-wrap:anywhere;max-height:200px;overflow:auto;padding:12px;background:var(--subtle);border-radius:12px;line-height:1.5}
#message-preview .photo-thumb{max-width:100%;height:auto}#message-menu-status{font-size:12px;color:var(--accent)}#message-details{border-top:1px solid var(--line);padding-top:15px;margin-top:16px}#message-details summary{cursor:pointer;font-size:14px;padding:6px 0}
#receipts-list{padding:0;list-style:none}#receipts-list li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}#receipts-list strong,#receipts-list div>span{display:block}#receipts-list strong{font-size:14px}#receipts-list div>span{font-size:12px;color:var(--muted);margin-top:4px}
#stars-list .message-select{width:100%;text-align:left}#stars-list .message-badges{margin-top:4px}
@media(max-width:600px){.messages{padding:12px}.message-group{max-width:97%;column-gap:7px}.message .bubble{padding:8px 11px}#message-dialog{padding:24px 18px}#reaction-choices{gap:5px}#reaction-choices small{font-size:9px}}

/* Keep the group avatar level with its final bubble, above receipt/badge rows. */
.message-group:has(.message:last-child.has-badges) .group-avatar{margin-bottom:22px}
.message-group:has(.message:last-child .message-read-position) .group-avatar{margin-bottom:31px}
.message-group:has(.message:last-child.has-badges .message-read-position) .group-avatar{margin-bottom:50px}

.composer-emoji{width:32px;height:40px;flex:none;border:0;border-radius:10px;background:none;color:var(--accent);font-size:23px;padding:0}.composer-emoji:hover{background:var(--subtle)}
.reaction-toolbar{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.reaction-toolbar #reaction-choices{display:contents}.reaction-toolbar #reaction-choices button,.reaction-toolbar .more-reactions{min-width:0;min-height:44px;margin:0;padding:7px 0;border-radius:12px}.reaction-toolbar #reaction-choices span{font-size:25px}.reaction-toolbar .more-reactions{width:100%;font-size:25px;line-height:1}.more-reactions:focus-visible{outline:3px solid var(--accent);outline-offset:2px}#emoji-dialog{max-width:460px;padding:24px 18px;max-height:calc(100dvh - 24px);overflow-y:auto}#emoji-dialog h2{margin:8px 0 12px;font-size:27px}#emoji-status{font-size:12px;line-height:1.5;color:var(--muted);margin-bottom:12px}
#emoji-host emoji-picker{width:100%;height:min(420px,60dvh);--num-columns:8;--emoji-size:1.4rem;--emoji-padding:.4rem;--background:var(--surface);--border-color:var(--line);--border-radius:12px;--indicator-color:var(--accent);--input-border-color:var(--line);--input-font-color:var(--ink);--input-placeholder-color:var(--muted);--outline-color:var(--accent);--category-font-color:var(--ink);--button-active-background:var(--selected);--button-hover-background:var(--subtle)}
@media(max-width:380px){#emoji-host emoji-picker{--num-columns:7;--emoji-padding:.3rem;--category-emoji-padding:.25rem}.composer{gap:5px}.composer-emoji{width:27px}}
#emoji-host emoji-picker{--category-emoji-padding:.25rem}
@media(max-width:380px){#emoji-host emoji-picker{--category-emoji-size:1.1rem;--category-emoji-padding:.2rem}}

#device-unlock-screen{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--page)}
#device-unlock-screen[hidden]{display:none}

/* Messaging tools share the existing dialog and theme system. */
#search-dialog{max-width:600px;max-height:calc(100dvh - 24px);overflow:auto}#search-form,#quiet-form,#leave-form,#membership-form{display:grid;gap:10px;margin:14px 0}#search-form input,#search-form select,#quiet-form input:not([type=checkbox]),#group-successor{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit}.search-result{display:flex;flex-direction:column;gap:8px;width:100%;text-align:left;margin:8px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);overflow-wrap:anywhere}.search-result span{white-space:pre-wrap}.search-result small,.session-item small{color:var(--muted)}.session-item{padding:14px 0;border-top:1px solid var(--line)}.session-item p{font-size:12px;overflow-wrap:anywhere}.session-item button{display:block;margin-top:10px}.person-choice{overflow-wrap:anywhere}#group-controls fieldset{min-width:0}#group-controls input[type=checkbox],#quiet-form input[type=checkbox]{flex:none}#preferences-status,#chat-controls-status,#sessions-status{font-size:13px;color:var(--accent)}
html[data-text-size=large]{--reading-size:19px;--control-size:17px}html[data-text-size=larger]{--reading-size:22px;--control-size:19px}
html[data-text-size=large] .message .bubble,html[data-text-size=larger] .message .bubble,html[data-text-size=large] #message-input,html[data-text-size=larger] #message-input,html[data-text-size=large] #message-preview,html[data-text-size=larger] #message-preview,html[data-text-size=large] .search-result span,html[data-text-size=larger] .search-result span{font-size:var(--reading-size);line-height:1.45}
html[data-text-size=large] dialog p,html[data-text-size=larger] dialog p,html[data-text-size=large] dialog label,html[data-text-size=larger] dialog label,html[data-text-size=large] dialog summary,html[data-text-size=larger] dialog summary{font-size:var(--control-size)}

/* Compact chat navigation: bounded grid tracks prevent long previews from widening rows. */
#chat-picker{padding:18px 16px 16px;width:calc(100% - 24px);max-width:440px;overflow-x:hidden}
#chat-picker h2{font-family:inherit;font-size:23px;font-weight:650;line-height:1.3;margin:0 44px 12px 0;color:var(--ink)}
#chat-picker .close-dialog{position:absolute;top:9px;right:9px;float:none;margin:0;width:40px;height:40px}
.chat-toolbar{display:flex;gap:8px;align-items:center;margin:0 0 12px}
.chat-tool{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink)}
.chat-tool svg{width:22px;height:22px;pointer-events:none}.chat-tool:hover,.chat-tool[aria-pressed=true]{background:var(--selected);border-color:var(--accent);color:var(--accent)}
.chat-tool:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.conversation-list{grid-template-columns:minmax(0,1fr);min-width:0;overflow-x:hidden;gap:6px}
#chat-picker .conversation-list{margin:0;max-height:60dvh}
.conversation-choice{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;min-width:0;max-width:100%;min-height:64px;padding:10px;border-radius:12px;line-height:1.35}
.conversation-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--subtle);color:var(--accent)}
.conversation-avatar svg{width:22px;height:22px}.conversation-avatar .avatar{width:34px;height:34px;margin:0}
.conversation-copy{display:block;min-width:0;overflow:hidden}.conversation-choice strong{font-size:14px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.conversation-choice small{font-size:12px;line-height:1.4;margin-top:3px;color:var(--muted)}.conversation-choice .unread-count{min-width:20px;justify-self:end;flex:none}
html[data-text-size=large] .conversation-choice strong,html[data-text-size=larger] .conversation-choice strong{font-size:16px}
html[data-text-size=large] .conversation-choice small,html[data-text-size=larger] .conversation-choice small{font-size:14px}

/* Settings starts as a compact accordion, with one category open at a time. */
#user-settings{width:calc(100% - 24px);max-width:560px;padding:18px 16px 16px;overflow-x:hidden}
#user-settings>h2{font-family:inherit;font-size:23px;line-height:1.3;font-weight:650;margin:0 44px 16px 0}
#user-settings>.close-dialog{position:absolute;top:9px;right:9px;float:none;margin:0;width:40px;height:40px}
#settings-status:empty,#preferences-status:empty{display:none}
#user-settings .setting-section{margin:8px 0 0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--card);min-width:0}
#user-settings .setting-section>summary{display:flex;align-items:center;gap:12px;min-height:54px;padding:12px 14px;margin:0;border:0;font-size:15px;line-height:1.4;list-style:none}
#user-settings .setting-section>summary::-webkit-details-marker{display:none}
#user-settings .setting-section>summary svg{width:21px;height:21px;flex:none;color:var(--accent)}
#user-settings .setting-section>summary span{flex:1;min-width:0}
#user-settings .setting-section>summary::after{content:'';width:7px;height:7px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 3px 4px 0;color:var(--muted)}
#user-settings .setting-section[open]>summary::after{transform:rotate(225deg);margin-top:6px}
#user-settings .setting-section[open]>summary{border-bottom:1px solid var(--line)}
#user-settings .setting-content{padding:4px 14px 14px;min-width:0}
html[data-text-size=large] #user-settings .setting-section>summary,html[data-text-size=larger] #user-settings .setting-section>summary{font-size:17px}

/* Small reading size keeps touch targets unchanged. */
html[data-text-size=small]{--reading-size:14px;--control-size:13px}
html[data-text-size=small] .message .bubble,html[data-text-size=small] #message-input,html[data-text-size=small] #message-preview,html[data-text-size=small] .search-result span{font-size:var(--reading-size);line-height:1.45}
html[data-text-size=small] dialog p,html[data-text-size=small] dialog label,html[data-text-size=small] dialog summary,html[data-text-size=small] #user-settings .setting-section>summary{font-size:var(--control-size)}
html[data-text-size=small] .conversation-choice strong{font-size:13px}
html[data-text-size=small] .conversation-choice small{font-size:11px}

/* Location cards fit the same compact message and settings surfaces. */
.location-card{display:flex;gap:9px;align-items:flex-start;max-width:100%}.location-card>svg{width:22px;height:25px;flex:none;color:var(--accent)}.location-card strong,.location-card small{display:block}.location-card small{font-size:12px;line-height:1.5;color:var(--muted);margin-top:3px}
#location-dialog{width:calc(100% - 24px);max-width:460px;padding:20px 16px;overflow-x:hidden}#location-dialog h2{font-family:inherit;font-size:23px;margin:0 40px 16px 0}#location-dialog .close-dialog{position:absolute;right:9px;top:9px}#location-dialog p,#location-message-actions p{overflow-wrap:anywhere;line-height:1.5}
#location-target,#login-location-chat{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit}#login-location-form{display:grid;gap:10px;margin:12px 0}.location-point{display:grid;gap:7px;margin:14px 0;overflow-wrap:anywhere}.location-point small{color:var(--muted);line-height:1.5}#location-message-actions:empty{display:none}#location-message-actions{border-bottom:1px solid var(--line);padding:10px 0 14px}#location-message-actions button{margin:4px 4px 4px 0;max-width:100%;white-space:normal}#location-status,#location-detail-status,#location-settings-status{font-size:13px;color:var(--accent);line-height:1.5}

.chat-people-button{display:block;padding:0;border:0;background:none;color:var(--muted);font:inherit;font-size:12px;text-align:left;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:24px}.mention{color:var(--accent);font-weight:650;background:var(--selected);border-radius:4px;padding:0 2px}#mention-suggestions{display:flex;flex-wrap:wrap;gap:6px;padding:6px 0}#mention-suggestions button{display:flex;align-items:center;gap:6px;padding:6px 10px;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink)}#mention-suggestions button[aria-selected=true]{border-color:var(--accent);background:var(--selected)}#mention-suggestions .avatar{width:26px;height:26px}.person-presence{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.person-presence strong,.person-presence small{display:block}.person-presence small{color:var(--muted);font-size:12px;margin-top:4px}.map-options{margin:12px 0}.map-options summary{cursor:pointer;min-height:44px;padding:10px 0}.map-options a{display:inline-block;margin:4px 4px 4px 0;text-decoration:none}

.message-player{display:block;width:100%;max-width:100%;max-height:50dvh;background:#111;border-radius:10px}audio.message-player{min-width:0;height:48px}.media-download{display:block;margin:8px 0;font-size:12px;color:var(--accent)}#record-dialog{width:calc(100% - 24px);max-width:460px;padding:20px 16px}#record-dialog h2{font-family:inherit;font-size:23px;margin:0 40px 16px 0}#record-dialog video,#record-dialog audio{width:100%;max-height:45dvh;margin:10px 0}#record-dialog button{margin:5px 5px 5px 0}#record-dialog .close-dialog{position:absolute;right:8px;top:8px}#record-clock{font-variant-numeric:tabular-nums}#record-facing{padding:9px;margin:5px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:8px}#record-status{font-size:13px;line-height:1.5;color:var(--accent)}

.call-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border:1px solid var(--accent);border-radius:12px;background:var(--selected);font-size:13px;margin-bottom:8px}#call-dialog{width:calc(100% - 24px);max-width:640px;padding:20px 16px}#call-dialog h2{font-family:inherit;font-size:23px;margin:0 40px 16px 0}#call-dialog .close-dialog{position:absolute;right:8px;top:8px}#call-dialog button{margin:4px 4px 4px 0}#call-dialog video{width:100%;max-height:40dvh;background:#111;border-radius:10px}#call-self{max-width:180px!important;max-height:120px!important}#call-remote{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:8px;margin:8px 0}.call-tile{min-width:0}.call-tile small{display:block;color:var(--muted)}.call-invite{border-top:1px solid var(--line);padding:12px 0}#call-status{font-size:13px;color:var(--accent);line-height:1.5}
#message-preview:has(.message-player){max-height:none}#call-dialog audio{width:100%;max-width:100%}

/* Position restoration is immediate: never animate through unread messages. */
.messages{scroll-behavior:auto;overflow-anchor:none}
#reading-spacer{height:0;pointer-events:none}
.chat,.messages{min-height:0}

/* A slim shortcut below the message viewport, above the composer. */
.jump-latest{position:static;align-self:center;flex:none;transform:none;margin:2px 0 4px;padding:6px 14px;min-height:32px;font-size:12px;line-height:1.3;max-width:calc(100% - 24px)}

/* Inline media: playback and expansion are separate from message actions. */
.media-bubble{position:relative;width:min(360px,100%);padding:8px 8px 38px!important;white-space:normal}
.media-bubble audio{width:100%;min-width:210px;background:transparent}
.media-bubble video{width:320px;max-height:260px;object-fit:contain}
.media-bubble .photo-thumb{width:320px;max-width:100%}
.media-actions,.media-expand{position:absolute;bottom:0;right:2px;border:0;background:transparent;color:inherit;width:44px;height:36px;font-size:24px;line-height:1;display:grid;place-items:center;border-radius:8px}
.media-expand{right:46px;font-size:21px}.media-caption{display:block;width:100%;padding:8px 4px 0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;white-space:pre-wrap}
#photo-viewer,.expanded-media{max-width:none;width:calc(100vw - 12px);height:calc(100dvh - 12px);max-height:calc(100dvh - 12px);padding:14px;border-radius:14px;overflow:auto}
#photo-viewer>img{max-height:calc(100dvh - 170px);width:100%;height:calc(100dvh - 170px);object-fit:contain}
.viewer-toolbar{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px}.expanded-media video{width:100%;height:calc(100% - 65px);object-fit:contain;background:#080d10;border-radius:8px}
#photo-viewer:fullscreen,.expanded-media:fullscreen{width:100vw;height:100dvh;max-height:none;border-radius:0}
/* Audio remains in the conversation; video expands without a modal dialog. */
.active-call{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:8px 10px;margin-bottom:8px;box-shadow:0 2px 16px #0001}
.call-heading{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px}.call-heading strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}#call-people{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:11px}
.call-toolbar{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.call-control{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--subtle);color:var(--ink);font-size:22px;flex:none}.call-control[aria-pressed=true]{background:var(--selected);border-color:var(--accent)}.call-hangup{background:#b93540;color:white;border-color:#b93540;transform:rotate(135deg)}
#call-status{font-size:11px;margin:4px 0;line-height:1.4}#call-limit{font-size:10px;color:var(--muted)}#call-end-all{font-size:11px;margin:0 0 0 auto;padding:8px;max-width:90px;text-align:center}
.audio-call .call-stage{display:none}.audio-call:has(.needs-play) .call-stage{display:block}.audio-call .call-tile:not(.needs-play){display:none}.audio-call audio{width:100%;height:35px}.audio-call #call-limit{display:none}
.video-call .call-stage{position:relative;background:#080d10;border-radius:10px;overflow:hidden;height:135px}.video-call #call-remote{height:100%;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:4px}.video-call .call-tile{position:relative;min-height:0;height:100%}.video-call .call-tile video{width:100%;height:100%;object-fit:contain;background:#080d10}.video-call .call-tile small{position:absolute;left:8px;top:6px;color:#fff;background:#0008;padding:3px 6px;border-radius:5px;font-size:11px;pointer-events:none}
.video-call #call-self{position:absolute;right:10px;top:10px;width:100px;height:75px;object-fit:cover;border:1px solid #ffffff50;border-radius:9px;background:#111}
.video-call:not(.expanded) #call-self{display:none}.video-call:not(.expanded) .call-tile:not(:first-child){display:none}.video-call:not(.expanded) #call-remote{grid-template-columns:1fr}.video-call:not(.expanded) #call-limit{display:none}.video-call:not(.expanded) #call-status{display:none}
.active-call.expanded{position:fixed;inset:0;z-index:100;width:100vw;height:100dvh;margin:0;border:0;border-radius:0;display:flex;flex-direction:column;padding:max(10px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));background:#10171c;color:#f2f6f9}.expanded .call-heading{font-size:15px;min-height:44px;margin-bottom:8px}.expanded #call-people{color:#c3ced5}.expanded .call-stage{flex:1;min-height:0;height:auto}.expanded .call-toolbar{justify-content:center;padding-top:12px;gap:10px}.expanded #call-end-all{margin:0}.expanded #call-status,.expanded #call-limit{color:#c3ced5;text-align:center}.expanded .call-control{background:#26343e;border-color:#43515b;color:#fff}.expanded .call-hangup{background:#b93540;border-color:#b93540}.expanded #call-self{max-width:180px!important;max-height:120px!important;width:25%;height:auto;aspect-ratio:4/3}.expanded #call-minimize{margin-left:auto}.call-expanded .messages{visibility:hidden}

#full-photo:fullscreen,#full-video:fullscreen{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;object-fit:contain;background:#080d10;margin:0;border-radius:0}

.media-bubble video{aspect-ratio:4/3;height:auto}

.call-control svg{width:22px;height:22px}.call-hangup{transform:none}

/* A shared position appears as a compact map card, with no coordinates in asset URLs. */
.location-map-bubble{padding:0!important;overflow:hidden;width:320px;max-width:100%;white-space:normal}
.location-map-open{display:block;border:0;background:none;color:inherit;text-align:left;padding:0;width:100%;font:inherit;cursor:pointer}
.location-map-card{display:block;width:320px;max-width:100%;white-space:normal}.location-map-preview{display:block;position:relative;height:180px;overflow:hidden;background:var(--panel);color:var(--muted)}
.location-map-surface{display:block;position:absolute;left:50%;top:0;transform:translateX(-50%);overflow:hidden;background:#e6e9e1}.location-map-surface img{position:absolute;max-width:none!important;width:256px!important;height:256px!important;border-radius:0!important;margin:0!important}
.location-map-placeholder{display:grid;place-items:center;height:100%;padding:20px;text-align:center;font-size:13px}
.location-map-pin{position:absolute;left:50%;top:50%;width:24px;height:24px;border:3px solid white;border-radius:50% 50% 50% 0;background:#ce3446;box-shadow:0 2px 5px #0006;transform:translate(-50%,-100%) rotate(-45deg);z-index:1}.location-map-pin:after{content:'';position:absolute;width:6px;height:6px;top:6px;left:6px;border-radius:50%;background:white}
.location-map-caption{display:block;padding:9px 12px 4px;font-size:13px}.location-map-caption strong,.location-map-caption small{display:block}.location-map-caption small{font-size:11px;opacity:.8;margin-top:3px}.location-map-attribution{display:block;padding:2px 12px 7px;font-size:10px;color:inherit;text-decoration:underline}

.location-map-pin{width:28px;height:36px;border:0;border-radius:0;background:none;box-shadow:none;transform:translate(-50%,-100%);filter:drop-shadow(0 2px 2px #0005)}.location-map-pin:after{display:none}.location-map-pin svg{display:block;width:100%;height:100%}

.member-person{width:100%;border:0;background:none;color:inherit;text-align:left;padding:0;min-height:36px;cursor:pointer}.member-person:hover{color:var(--accent)}
.presence-dot{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:#8a9098;box-shadow:0 0 0 1px #0002;vertical-align:middle}.presence-dot.active{background:#23a764}.presence-dot.recent{background:#dfad25}.presence-dot.offline{background:#91969c}.presence-dot.dnd{background:#df4b57;position:relative}.presence-dot.dnd:after{content:'';position:absolute;left:2px;right:2px;top:3px;height:2px;background:#fff;border-radius:1px}
.member-person>.presence-dot{margin-left:auto}.member-person small{margin-left:0}.header-person{display:inline-flex;align-items:center;gap:4px;margin-right:8px}.chat-people-button{display:flex;gap:0;align-items:center;min-height:24px}.person-presence strong .presence-dot{margin-left:8px}
.chat-people-button{flex-wrap:wrap;white-space:normal;row-gap:2px;line-height:1.25}

.presence-dot.hidden{background:#111;box-shadow:0 0 0 1px var(--muted)}

/* Compact, progressively disclosed composer actions. */
.attachment-menu{padding:10px 14px;max-height:min(440px,65dvh);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 8px 30px #0003}
.share-menu-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-left:4px}.share-menu-heading strong{font:600 13px var(--font-body, sans-serif)}
.share-menu-heading button{display:grid;place-items:center;min-width:44px;height:44px;padding:0;background:none;border:0;color:var(--muted);font-size:24px;border-radius:8px}
.share-section{border-top:1px solid var(--line)}.share-section summary{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 4px;cursor:pointer;list-style:none;color:var(--ink);font-size:14px;font-weight:600}.share-section summary::-webkit-details-marker{display:none}
.share-section svg{width:20px;height:20px;flex:none}.share-section summary>svg:first-child{color:var(--accent)}.share-section .share-chevron{margin-left:auto;width:16px;height:16px;color:var(--muted)}.share-section[open] .share-chevron{transform:rotate(90deg)}
.share-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:2px 0 10px}.share-choices button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:62px;padding:8px 2px;border:1px solid var(--line);border-radius:10px;background:var(--subtle);color:var(--ink);font:500 12px var(--font-body,sans-serif);cursor:pointer}.share-choices button:hover{background:var(--selected);border-color:var(--accent)}.share-choices button:disabled{opacity:.5;cursor:wait}
.attachment-menu .share-menu-hint{font-size:11px;line-height:1.4;color:var(--muted);margin:10px 4px 3px;padding:0}.share-section summary:focus-visible,.share-choices button:focus-visible,.share-menu-heading button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.attachment-menu .share-section{margin:0;padding:0;border:0;border-top:1px solid var(--line);border-radius:0;background:none}.attachment-menu .share-section>summary{margin:0;border:0}

/* Transcripts stay collapsed and separate from playback/message actions. */
.audio-transcript{border-top:1px solid currentColor;margin:7px 0 0;padding:2px 0 0;border-color:color-mix(in srgb,currentColor 18%,transparent);white-space:normal}
.audio-transcript button{display:inline-flex;align-items:center;min-height:44px;padding:5px 0;background:none;border:0;color:inherit;font-family:inherit;font-size:12px;font-weight:600;text-decoration:underline;cursor:pointer}.audio-transcript button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.transcript-disclosure{display:block;font-size:10px;line-height:1.4;opacity:.8;margin:-2px 0 6px}.transcript-status{display:block;font-size:12px;line-height:1.5;padding:8px 0}.transcript-copy small{display:block;font-size:10px;line-height:1.4;opacity:.8}.transcript-copy p{font:inherit;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;margin:7px 0 8px;user-select:text;cursor:text}

/* The empty composer's sparkle occupies Send's existing space. */
.compose-suggestion{display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;width:41px;height:41px;padding:0;flex:none;background:var(--subtle);color:var(--accent);cursor:pointer}.compose-suggestion svg{width:23px;height:23px}.compose-suggestion:hover{background:var(--selected)}.compose-suggestion:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.typing-indicator{height:18px;line-height:16px;padding:0 4px 2px;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* A quoted reply stays attached to its message, with no extra action row. */
.reply-message{display:flex;flex-direction:column;max-width:100%;min-width:0}
.reply-quote{display:flex;flex-direction:column;gap:3px;min-width:0;max-width:100%;margin:0 0 3px;padding:7px 10px;border:0;border-left:3px solid var(--accent);border-radius:9px 9px 3px 3px;background:var(--subtle);color:var(--ink);text-align:left;font:inherit;font-size:12px;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
.reply-quote strong{font-size:11px;color:var(--accent)}
.reply-quote span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.reply-message>.bubble{max-width:100%;border-top-left-radius:4px;border-top-right-radius:4px}
.reply-composer{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 10px;border-left:3px solid var(--accent);background:var(--subtle);border-radius:8px;margin:0 0 3px}
.reply-composer>div{min-width:0;flex:1}.reply-composer strong,.reply-composer span{display:block;font-size:12px;line-height:1.4}.reply-composer strong{color:var(--accent)}.reply-composer span{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reply-composer button{flex:none;background:transparent;border:0;color:var(--muted);width:32px;height:32px;font-size:22px}
#menu-reply{padding:10px 16px;margin-right:6px}.reply-highlight .bubble{outline:2px solid var(--accent);outline-offset:3px}

.ai-reply-entry{display:block;width:100%;text-align:left;border:0;border-top:1px solid var(--line);background:transparent;color:var(--accent);padding:10px 4px;font-size:14px;font-weight:600}
#menu-ai-reply{padding:10px 12px;margin:4px 6px 4px 0}
#ai-reply-dialog{width:min(520px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:24px}
#ai-reply-dialog h2{font-family:inherit;font-size:22px;margin:8px 28px 6px 0;letter-spacing:-.4px}
#ai-reply-dialog p{font-size:13px;line-height:1.5}.ai-chat-name{font-weight:650;color:var(--accent);margin:0}#ai-scope{margin:5px 0}
#ai-context-details{font-size:12px;border:1px solid var(--line);padding:10px;border-radius:9px}#ai-context-details summary{cursor:pointer}#ai-context-list{padding-left:18px;max-height:180px;overflow:auto}#ai-context-list li{margin:8px 0}#ai-context-list strong,#ai-context-list span{display:block;white-space:pre-wrap;overflow-wrap:anywhere}
.ai-controls{display:grid;gap:12px;margin:14px 0}.ai-controls label{display:block;font-size:12px}.ai-controls select,.ai-controls textarea{display:block;font:inherit;font-size:14px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:9px;width:100%;margin-top:5px}.ai-controls textarea{resize:vertical;min-height:60px;max-height:140px}
#ai-results{display:grid;gap:8px}.ai-option{font:inherit;font-size:14px;line-height:1.45;text-align:left;color:var(--ink);background:var(--card);padding:12px;border:1px solid var(--line);border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere}.ai-option[aria-pressed=true]{border-color:var(--accent);background:var(--selected);outline:1px solid var(--accent)}
.ai-replace-row{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:1.5;margin:12px 0}#ai-use{margin-top:12px;width:100%}#ai-status{color:var(--muted)}
#ai-options{font-size:12px;margin:12px 0}#ai-options summary{cursor:pointer;color:var(--muted);padding:4px 0}
#ai-reply-dialog{padding:20px}#ai-context-details{padding:0 10px}#ai-options{padding:0 10px;margin:8px 0}#ai-context-details>summary,#ai-options>summary{min-height:40px;padding:10px 0;line-height:18px}

/* The inbox is the app's landing screen; listing chats never reads them. */
.chat-home{display:flex;flex:1;flex-direction:column;min-height:0;background:var(--surface)}
.home-toolbar{padding:12px 20px 6px;border-bottom:1px solid var(--line)}.home-toolbar .chat-toolbar{margin:0;justify-content:flex-end}
.home-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px 20px max(20px,env(safe-area-inset-bottom));scrollbar-width:thin}
.home-list-title{font-size:12px;line-height:1.4;font-weight:600;letter-spacing:.03em;color:var(--muted);margin:6px 0 12px}
.home-conversations{display:grid;gap:8px;max-width:900px;margin:0 auto}.inbox-chat{min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden}
.inbox-open{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;border:0;background:transparent;color:var(--ink);padding:13px 12px;text-align:left}
.inbox-open:hover{background:var(--selected)}.inbox-avatar,.inbox-avatar>.avatar{width:40px;height:40px}.inbox-group-icon{display:flex;width:42px;flex-wrap:wrap;gap:0}.inbox-group-icon .avatar{width:23px;height:23px;font-size:10px;margin:-2px -2px 0 0;border:1px solid var(--card)}
.inbox-copy{display:flex;min-width:0;flex-direction:column;gap:5px}.inbox-copy strong{font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inbox-copy>span{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inbox-meta{display:flex;flex-direction:column;align-items:flex-end;gap:7px}.inbox-meta time{font-size:10px;color:var(--muted);white-space:nowrap}.chat-badges{display:flex;align-items:center;gap:6px}.chat-badges:empty{display:none}.chat-badges .unread-count{min-width:22px;min-height:22px;display:grid;place-items:center;border-radius:12px;font-size:12px;font-weight:700;padding:2px 5px;background:var(--accent);color:var(--on-accent,#fff)}.missed-call-badge{display:flex;color:#ce4550}.missed-call-badge svg{width:18px;height:18px}
.inbox-action{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.inbox-action>div{display:flex;gap:6px;flex-wrap:wrap}.inbox-action>span{min-width:0}.inbox-action button{white-space:nowrap}
.action-accept,.action-decline{border:1px solid transparent!important;border-radius:9px;padding:9px 12px;font-size:12px;font-weight:650;min-height:40px;line-height:1.3;cursor:pointer}.action-accept{background:#197044!important;color:#fff!important;border-color:#197044!important}.action-decline{background:#b32f3b!important;color:#fff!important;border-color:#b32f3b!important}.action-accept:hover{background:#125a36!important}.action-decline:hover{background:#93232e!important}.action-accept:disabled,.action-decline:disabled{opacity:.6}
.incoming-card{max-width:900px;margin:0 auto 12px;border:1px solid #258b58;background:var(--card);border-radius:14px;padding:14px;display:flex;align-items:center;justify-content:space-between;gap:12px}.incoming-card strong,.incoming-card span{display:block}.incoming-card strong{font-size:15px;color:var(--ink)}.incoming-card span{font-size:12px;color:var(--muted);margin-top:5px}.incoming-buttons{display:flex;gap:8px}.home-empty{font-size:14px;color:var(--muted)}#home-notice{margin:8px 20px}
@media(max-width:600px){.home-scroll{padding-left:12px;padding-right:12px}.home-toolbar{padding:10px 12px 6px}.inbox-action{flex-wrap:wrap}.incoming-card{flex-direction:column;align-items:stretch}.incoming-buttons button{flex:1}.inbox-open{padding:12px 10px;gap:8px}}
#accept-invite,#location-send{background:#197044!important;color:#fff!important;border-color:#197044!important}

#home-incoming{flex:none;max-height:35dvh;overflow:auto;padding:12px 20px 0}#home-incoming .incoming-card{margin-bottom:0}#home-incoming .incoming-card+.incoming-card{margin-top:8px}@media(max-width:600px){#home-incoming{padding-left:12px;padding-right:12px}}