@font-face{font-family:SferaEmoji;src:url('/fonts/NotoColorEmoji.ttf') format('truetype');font-display:swap}
@font-face{font-family:SferaEmojiText;src:url('/fonts/NotoColorEmoji.ttf') format('truetype');font-display:swap;unicode-range:U+00A9,U+00AE,U+200D,U+203C-3299,U+FE0F,U+1F000-1FAFF,U+E0000-E007F}
:root{--usable-height:100dvh}html,body{height:100%;margin:0}.app-shell{height:var(--usable-height);max-height:var(--usable-height)}.conversation,.active-conversation{min-width:0;min-height:0;height:100%}.active-conversation:not([hidden]){display:flex;flex-direction:column}.conversation-header,.message-search,.pinned-strip,.typing,.composer-wrap{flex-shrink:0}.conversation-header{min-height:60px;height:auto}.message-list{flex:1;min-height:0;overflow-y:auto;overflow-x:auto;overflow-anchor:none}.message-row,.message-bubble{min-width:0}.message-text{overflow-wrap:anywhere;white-space:pre-wrap;font-family:SferaEmojiText,system-ui,sans-serif}.message-bubble{max-width:min(78%,620px)}.attachment-image,.attachment-video{max-width:100%;height:auto;object-fit:contain}.message-row.direct-message>.avatar{display:none}.message-row.grouped-message{margin-top:-4px}.grouped-message:not(.direct-message)>.avatar{visibility:hidden}.grouped-message .message-bubble{border-top-left-radius:4px}.own.grouped-message .message-bubble{border-top-right-radius:4px}.message-meta{gap:5px;flex-wrap:wrap;font-size:.67rem}
.composer{gap:0;min-width:0;align-items:flex-end}.composer textarea{flex:1;min-width:0;resize:none;max-height:160px;min-height:48px;padding:12px 6px;font-family:SferaEmojiText,system-ui,sans-serif;font-size:1rem;line-height:1.4}.composer .icon-button,.composer .send-button{flex:0 0 48px;width:48px;height:48px;min-width:48px}.composer [hidden],#composer-more{display:none!important}.composer-caption{display:none}.composer-wrap{padding:0 10px 6px;background:var(--bg)}.reply-bar{overflow-wrap:anywhere;max-height:100px;overflow:auto}.chat-title-button{min-width:0;flex:1;text-align:left}.chat-title-button strong,.chat-title-button span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-actions{flex-shrink:0}.conversation-header>.avatar{flex-shrink:0}
#emoji-picker{display:flex;flex-direction:column;gap:0;padding:0;position:absolute;left:0;bottom:100%;width:min(430px,calc(100vw - 20px));height:var(--expression-height,320px);max-height:calc(var(--usable-height) - 116px);overflow:visible;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 3px 12px #00000015;font-size:.875rem}#emoji-picker[hidden]{display:none}.expression-tabs{display:flex;flex-wrap:nowrap;gap:0;min-height:48px;flex-shrink:0;border-bottom:1px solid var(--line)}#emoji-picker .expression-tab{height:auto!important;min-height:48px!important;min-width:48px;flex:1;padding:6px;font-size:.875rem;white-space:normal;background:transparent;border-radius:0;color:var(--muted)}#emoji-picker .expression-tab[aria-pressed=true]{color:var(--accent);box-shadow:inset 0 -2px var(--accent)}#emoji-picker .keyboard-return{flex:0 0 48px;font-size:1.4rem}.expression-tools{display:flex;gap:4px;align-items:center;padding:0 4px;min-height:48px;flex-shrink:0}.expression-tools input{min-width:0;flex:1;width:0;height:44px}.expression-tools select{flex:0 1 116px;min-width:70px;max-width:38%;height:44px}.expression-tools .expression-tab{flex:0 0 48px!important}.expression-scroll{overflow-y:auto;overflow-x:auto;min-height:48px;flex:1;overscroll-behavior:contain;padding:4px}.expression-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:0;align-content:start}.expression-grid .expression{position:relative;width:100%!important;min-width:48px;height:48px!important;min-height:48px;padding:2px;border:0;background:transparent;border-radius:5px}.expression-grid .expression:hover{background:var(--panel2)}.emoji-glyph{font-family:SferaEmoji;font-size:28px;line-height:1;display:inline-block}.expression-grid .sticker .emoji-glyph{font-size:34px}.expression-grid img{display:block;width:100%;height:44px;object-fit:contain}.expression-grid .favorite{box-shadow:inset 0 0 0 1px var(--accent)}.has-variants:after{content:'';position:absolute;bottom:5px;right:5px;border-left:4px solid transparent;border-bottom:4px solid var(--muted)}.expression-empty{padding:12px;color:var(--muted);line-height:1.4}.expression-sentinel{height:1px}.emoji-variants{position:fixed;z-index:100;width:min(336px,calc(100vw - 16px));max-width:calc(100vw - 16px);max-height:calc(var(--usable-height) - 16px);display:flex;flex-direction:column;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:4px;box-shadow:0 3px 14px #00000020}.variant-title{font-size:.8rem;color:var(--muted);margin:8px}.variant-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));overflow:auto;min-height:0;gap:0}.variant-option{height:48px;min-width:48px;border-radius:5px;padding:0;background:transparent}.variant-option:hover,.variant-option.preferred{background:var(--panel2)}.emoji-variants>.expression-tab{min-height:48px;background:transparent;color:var(--accent)}
#settings-panel{height:min(760px,calc(var(--usable-height) - 20px));max-height:calc(var(--usable-height) - 20px)}#settings-actions{flex-shrink:0;margin:0;padding:8px 16px;display:flex;justify-content:flex-end;gap:8px;background:var(--panel);border-top:1px solid var(--line)}#settings-actions button{min-height:48px;white-space:normal}.ui-field{min-width:0}.ui-field input,.ui-field textarea{min-width:0;max-width:100%;font-size:1rem}.ui-row-copy,.user-result .details,.drawer-profile>div{min-width:0;overflow-wrap:anywhere}.ui-label,.ui-hint{overflow-wrap:anywhere}.ui-row{min-height:48px}.ui-actions{flex-wrap:wrap}.settings-header h2{min-width:0}.settings-header .icon-button{min-width:48px;min-height:48px}.attachment-menu{max-height:calc(var(--usable-height) - 16px);overflow:auto}.attachment-menu .user-result{min-height:48px;width:100%}
.voice-player{width:260px;max-width:100%;display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:0 6px}.voice-player audio{display:none}.voice-play{width:48px;height:48px;border-radius:50%;background:var(--accent);color:var(--accentText)}.voice-track{position:relative;min-width:0;height:40px}.voice-track canvas{width:100%;height:40px;display:block}.voice-track input{position:absolute;inset:0;width:100%;height:40px;opacity:.25;cursor:pointer;accent-color:var(--accent);margin:0}.voice-time{grid-column:2;font-size:.75rem;color:var(--muted);padding:2px 0}.voice-player:focus-within{outline:1px solid var(--accent);outline-offset:2px}
@media(max-width:780px),(max-height:500px) and (pointer:coarse){.app-shell{grid-template-columns:56px minmax(0,1fr)}.rail{width:56px}.rail-bottom #settings-button{width:56px;min-height:56px}.folder-button{min-height:64px;width:56px}.folder-label{max-width:52px}.app-shell.chat-open{grid-template-columns:minmax(0,1fr)}.app-shell.chat-open>.rail,.app-shell.chat-open>.sidebar{display:none}.app-shell:not(.chat-open)>.conversation{display:none}.app-shell.chat-open>.conversation{grid-column:1;display:block}.conversation-header{padding:2px 4px;gap:4px;min-height:56px}.conversation-header>.icon-button,.header-actions .icon-button{width:48px;min-width:48px;height:48px}.conversation-header>.avatar{width:32px;height:32px}.conversation-header .chat-title-button strong{font-size:1rem;max-width:100%}.conversation-header .chat-title-button span{font-size:.75rem}.header-actions #video-call,.header-actions #search-messages-button{display:none}.header-actions{gap:0}.composer-wrap{padding:0 4px 4px}.composer{padding:0;border-radius:0}.composer textarea{font-size:1rem}.message-list{padding:12px 8px}.message-bubble{max-width:92%;padding:8px 10px 5px}.message-text{font-size:var(--message-font-rem,.9375rem)}.typing{min-height:0;height:auto;font-size:.75rem}.typing:not(:empty){padding:3px 8px}.main-menu{left:0;max-width:min(340px,100vw);width:100vw;height:var(--usable-height)}.sidebar-toolbar{height:56px;padding:4px}.sidebar-toolbar>.icon-button{width:48px;height:48px}.sidebar-toolbar input{height:44px}.chat-card{min-height:68px;height:auto}.chat-card strong,.chat-preview-text{min-width:0}.chat-card-top{min-width:0}.chat-card-top strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-card-top time{flex-shrink:0}.sidebar-footer button{min-height:48px}.auth-form-wrap{min-height:var(--usable-height);height:auto;padding:18px}.auth-form{max-width:100%;width:100%}#emoji-picker{position:relative;flex-shrink:0;left:auto;bottom:auto;width:100%;max-width:100%;border-radius:0;border:0;border-top:1px solid var(--line);box-shadow:none;max-height:calc(var(--usable-height) - 116px)}#settings-panel{width:100%;max-width:100%;height:var(--usable-height);max-height:var(--usable-height);margin:0;border-radius:0}.settings-header{min-height:56px;height:auto}.settings-search{min-height:48px;height:auto;padding:4px 12px}.settings-profile{padding:16px}.ui-group{margin-bottom:8px}.ui-row{padding:10px 14px;min-height:52px}.ui-row-copy{min-width:0}.ui-value{max-width:40%;white-space:normal;overflow-wrap:anywhere}.attachment-menu{margin:auto 0 0;width:100%;max-width:100%;border-radius:12px 12px 0 0;padding:14px;max-height:calc(var(--usable-height) - 16px)}.call-dialog{width:100%;max-width:100%;max-height:var(--usable-height);overflow:auto}.call-actions{gap:8px;flex-wrap:wrap}.call-actions button{min-width:48px;min-height:48px}}
@media(max-height:450px){.expression-tools{min-height:48px}.settings-search{display:none}.settings-profile{padding:8px}.conversation-header>.avatar{display:none}.call-dialog .video-stage{height:35dvh}.composer textarea{max-height:80px}.emoji-variants{max-height:calc(var(--usable-height) - 8px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.message-text,.composer textarea{font-size:var(--message-font-rem,.9375rem)}

.inline-emoji{font-family:SferaEmoji;font-size:1.1em;line-height:1;vertical-align:-.05em}

.voice-track{height:48px}.voice-track canvas{margin-top:4px}.voice-track input{height:48px}
/* Shared rhythm for menus, settings and creation flows. */
:root{--ux-radius:8px;--ux-row:50px;--ux-hover:rgba(130,160,185,.10);--ux-pressed:rgba(90,155,215,.18)}
body.light{--line:#e7ebef;--ux-hover:#f1f4f7;--ux-pressed:#e3edf5}
button:hover{filter:none}button{transition:background-color .12s,color .12s}button:active{background-color:var(--ux-pressed)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ui-group{margin:0 0 8px;padding:8px 0;border-radius:0;border-bottom:1px solid var(--line);box-shadow:none}.ui-group-title{font-size:13px;letter-spacing:0;padding:8px 20px;margin:0;font-weight:600}.ui-row{min-height:var(--ux-row);padding:10px 20px;gap:14px;align-items:center}.ui-row:hover,.ux-menu-item:hover{background:var(--ux-hover)}.ui-row-copy{min-width:0}.ui-label{font-size:14px;line-height:1.35}.ui-hint,.ui-group-hint{font-size:12px;line-height:1.5}.ui-value{max-width:40%;font-size:12px;overflow-wrap:anywhere;text-align:right}.ui-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.ui-icon svg{width:21px;height:21px;stroke-width:1.7}.ui-switch{width:34px!important;height:20px!important;min-width:34px!important;border-radius:12px!important;flex-shrink:0}.ui-field{padding:8px 20px;margin:0;gap:7px;font-size:13px}.ui-field input,.ui-field textarea{width:100%;border-radius:8px;padding:10px 12px;min-height:40px;font-size:14px}.ui-actions{gap:8px;padding:12px 20px;background:var(--panel);border-top:1px solid var(--line)}.primary,.secondary,.danger-button{border-radius:8px;min-height:40px;padding:9px 16px;font-size:14px;gap:8px}.folder-button.active{background:var(--ux-pressed)}.rail,.sidebar{border-right:1px solid var(--line)}.folder-button:not(.active):hover{background:var(--ux-hover)}
#modal{width:440px;max-width:calc(100vw - 24px);max-height:calc(var(--usable-height,100dvh) - 24px);padding:0;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px #0002;background:var(--panel)}#modal[open]{display:flex;flex-direction:column}.modal-heading{flex-shrink:0;padding:10px 16px;margin:0;border-bottom:1px solid var(--line);min-height:56px;gap:12px}.modal-heading h2{font-size:17px;margin:0;flex:1}.modal-heading .icon-button{width:36px;height:36px}#modal-body{min-height:0;overflow:auto;padding:16px;overscroll-behavior:contain}#modal-body:empty{display:none}#modal-body>.ui-group{margin-left:-16px;margin-right:-16px}#modal-body>.ui-field{padding:6px 0 14px}.modal-info{font-size:13px;line-height:1.5;color:var(--muted)}#modal-body>label input,#modal-body>label textarea{width:100%;border-radius:8px}.modal-actions{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.confirm-dialog{border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px #0002}.confirm-dialog h2{font-size:17px}.confirm-dialog .ui-actions{border:0}
.ux-popover{position:fixed;z-index:100;width:264px;max-width:calc(100vw - 16px);overflow:auto;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 4px 18px #0002;overscroll-behavior:contain}.ux-menu-item{display:flex;align-items:center;gap:14px;min-height:42px;width:100%;border-radius:6px;padding:9px 12px;text-align:left;font-size:14px}.ux-menu-item .ui-icon{color:var(--muted)}.ux-menu-item span:last-child{min-width:0;overflow-wrap:anywhere}.context-menu{max-width:calc(100vw - 16px);max-height:calc(var(--usable-height,100dvh) - 16px);overflow:auto;border:1px solid var(--line);box-shadow:0 4px 18px #0002;border-radius:8px}
.ux-footer{flex-shrink:0;display:flex;justify-content:flex-end;margin:0}.ux-step{font-size:12px;color:var(--muted);margin:0 0 12px}.ux-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.ux-chip{border-radius:18px;background:var(--panel2);padding:7px 10px;font-size:12px;max-width:100%;overflow-wrap:anywhere}.ux-photo{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:0 0 12px}.ux-photo .avatar{width:56px;height:56px}.ux-photo .secondary{padding:8px;font-size:13px}.ux-option{display:flex;align-items:center;gap:4px;margin:6px 20px}.ux-option input{flex:1;width:100%;min-width:0;min-height:40px;padding:10px 12px;border-radius:8px}.ux-poll-options+.secondary{margin:8px 20px}.ux-user-results .user-result{width:100%;padding:10px 0;border-bottom:1px solid var(--line);border-radius:0;min-height:52px}
.voice-player{background:transparent!important;border:0!important;box-shadow:none!important;position:relative;padding-bottom:24px}.voice-player>button:first-of-type{border-radius:50%;background:var(--accent);color:var(--accentText);width:40px;height:40px}.voice-player .voice-speed{position:absolute;bottom:0;right:0;min-width:42px;height:28px;font-size:12px;border-radius:6px;color:var(--accent);padding:2px 6px}.voice-player.heard output:after{content:' · ✓';color:var(--accent)}.voice-player input{background:transparent}.voice-player canvas{background:transparent}
.ux-icon-choices{display:flex;flex-wrap:wrap;gap:4px;padding:6px 20px}.ux-icon-choices button{height:40px;width:40px;display:flex;align-items:center;justify-content:center;border-radius:8px}.ux-icon-choices button[aria-pressed=true]{background:var(--ux-pressed);color:var(--accent)}
@media(max-width:780px),(max-height:500px) and (pointer:coarse){:root{--ux-row:52px}#modal{max-width:calc(100vw - 16px);max-height:calc(var(--usable-height,100dvh) - 16px)}.modal-heading{min-height:56px;padding:4px 12px}.modal-heading .icon-button,.ux-option .icon-button{width:48px;height:48px}.ux-menu-item{min-height:48px}.ux-popover{width:300px}.primary,.secondary,.danger-button{min-height:44px}.ux-footer{padding:8px 12px}.ux-footer button{min-height:48px}.ux-option input,.ui-field input{min-height:44px}.voice-player .voice-speed{height:44px;bottom:-8px}.voice-player>button:first-of-type{width:48px;height:48px}.ux-icon-choices button{width:48px;height:48px}}

.ui-row>.ui-icon:first-child{margin-right:0}.ui-row>.ui-icon:last-child:not(:first-child){margin-left:0}.ui-switch:before{top:3px;left:3px}.ui-switch:checked:before{transform:translateX(14px)}.ui-value{white-space:normal}
