:root{--bg:#11171f;--panel:#19222d;--panel2:#202c3a;--panel3:#2b3a4b;--text:#edf2f8;--muted:#a0afc1;--line:#ffffff0d;--accent:#78b5ff;--accentText:#10253d;--bubble:#202d3b;--own:#244669;--shadow:0 8px 28px #0002;--modern-radius:18px}
body.light{--bg:#eef2f6;--panel:#fff;--panel2:#f3f6fa;--panel3:#e8eef6;--text:#192b40;--muted:#63778d;--line:#14283f0c;--accent:#317ed1;--accentText:#fff;--bubble:#fff;--own:#dcecff}
button{transition:background-color .14s,color .14s,opacity .14s,transform .12s}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.48}button:focus-visible{outline-offset:2px}
.rail{padding-top:18px;background:var(--panel)}.rail-logo{width:34px;height:34px;margin-bottom:16px}.folder-button{margin:3px 6px;width:60px;border-radius:14px}.folder-button.active{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}.folder-label{font-size:10px;font-weight:600}.rail-bottom #settings-button{border-radius:14px;margin:0 4px;width:64px}
.sidebar-toolbar{height:72px;padding:12px 10px;gap:4px}.search-wrap input{height:40px;border:0;border-radius:12px;background:var(--panel2)}.sidebar-toolbar .icon-button{border-radius:12px}.chat-card{height:76px;padding:10px 14px;gap:12px;border:0;border-radius:0}.chat-card .avatar{width:48px;height:48px;font-weight:600;letter-spacing:-.4px}.chat-card-top strong{font-weight:600;font-size:14px;letter-spacing:-.1px}.chat-card-top time{font-size:11px;color:var(--muted)}.chat-preview-text{font-size:13px;line-height:20px;color:var(--muted)}.chat-card.selected{background:color-mix(in srgb,var(--accent) 14%,var(--panel));box-shadow:inset 3px 0 var(--accent)}.chat-card:hover:not(.selected){background:var(--panel2)}.sidebar-footer{border-top:1px solid var(--line);font-size:11px;opacity:.8}.avatar{border:1px solid var(--line)}
.conversation{background:var(--bg)}.conversation-header{min-height:72px;padding:10px 24px;background:var(--panel);border-bottom:1px solid var(--line);gap:12px}.conversation-header>.avatar{width:42px;height:42px}.chat-title-button strong{font-size:15px;font-weight:650;letter-spacing:-.25px}.chat-title-button span{font-size:12px;margin-top:3px;color:var(--muted)}.header-actions{gap:4px}.header-actions .icon-button{border-radius:12px;color:var(--muted)}
.message-list{padding:22px 30px 14px;scrollbar-width:thin;scrollbar-color:var(--panel3) transparent}.message-row{margin:7px 0;gap:8px}.message-bubble{border:1px solid var(--line);border-radius:18px 18px 18px 5px;padding:11px 14px 7px;box-shadow:none;max-width:min(78%,560px)}.own .message-bubble{border-radius:18px 18px 5px 18px;background:var(--own)}.message-text{line-height:1.5;font-size:var(--message-font-rem,.9375rem)}.message-meta{font-size:10px;margin-top:4px;opacity:.8;justify-content:flex-end;min-height:13px}.message-author{font-size:12px;font-weight:650;display:block;margin-bottom:4px;color:var(--accent)}.date-separator{margin:18px 0}.date-separator span{font-size:11px;padding:5px 11px;border-radius:20px;background:var(--panel2);color:var(--muted);border:1px solid var(--line)}.message-more{opacity:0;transition:opacity .15s;border-radius:50%;width:24px;height:24px;padding:0}.message-row:hover .message-more,.message-row:focus-within .message-more{opacity:1}
.composer-wrap{padding:8px 24px 18px;background:var(--bg)}.composer{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:4px 6px;box-shadow:0 3px 10px #00000006;align-items:flex-end}.composer textarea{background:transparent;border:0;min-height:44px;padding:12px 8px;font-size:15px}.composer .icon-button{height:44px;width:44px;min-width:44px;flex-basis:44px;border-radius:14px;color:var(--muted)}.composer .send-button{height:40px;width:40px;min-width:40px;flex-basis:40px;border-radius:14px;margin:2px;background:var(--accent);color:var(--accentText)}.reply-bar{border-radius:14px;margin-bottom:8px;border-left:3px solid var(--accent);background:var(--panel)}.typing:empty{display:none}
.attachment-image,.attachment-video{border-radius:12px;display:block;max-height:420px}.message-album{gap:3px;border-radius:16px;overflow:hidden}.message-album .message-bubble{border-radius:0!important;border:0;padding:3px 3px 6px}.message-album .attachment-image,.message-album .attachment-video{border-radius:0;height:190px;object-fit:cover}.message-album .message-text{padding:0 8px}.message-album .message-meta{padding-right:8px}.media-preview-item{border:0;background:var(--panel2);border-radius:14px;padding:8px}.media-preview-item img,.media-preview-item video{border-radius:10px}.media-preview-item p{color:var(--muted)}.media-preview-item audio{display:none}.media-preview-item .voice-preview{display:flex;align-items:center;gap:10px;padding:18px 4px}.voice-preview input{min-width:0;flex:1;width:100%;accent-color:var(--accent)}.voice-preview output{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}.voice-preview button{width:40px;height:40px;border-radius:50%;background:var(--accent);color:var(--accentText);padding:0;flex-shrink:0}
.voice-player{width:280px;gap:0 12px}.voice-play{width:44px;height:44px;background:var(--accent);color:var(--accentText);font-size:0;position:relative}.voice-play:before{content:'';display:block;position:absolute;inset:14px 15px 14px 18px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}.voice-player.is-playing .voice-play:before{inset:14px 16px;clip-path:polygon(0 0,35% 0,35% 100%,0 100%,0 0,65% 0,100% 0,100% 100%,65% 100%,65% 0)}.voice-track input{opacity:.12}.voice-track input:hover,.voice-track input:focus{opacity:.6}.voice-time{font-size:11px}.voice-speed{border-radius:8px!important;color:var(--muted);font-size:11px}
.pending-media{position:relative;overflow:hidden;min-width:190px}.pending-media progress{height:5px;accent-color:var(--accent);border:0;border-radius:5px;overflow:hidden}.pending-media [role=status]{padding:8px 0;color:var(--muted)}.media-duration{color:var(--muted);padding-top:4px}.recording-panel{background:var(--panel);border-radius:16px;padding:8px 12px}.recording-dot{box-shadow:0 0 0 4px #ed55651a}.recording-panel meter{flex:1;max-width:160px}
.profile-panel{padding:22px 24px;width:min(430px,100vw)}.profile-screen>.media-actions:first-child{margin-top:0;margin-bottom:18px}.profile-avatar-button{display:block;margin:0 auto}.profile-avatar-button .avatar{width:104px;height:104px;font-size:34px}.profile-screen>h2{text-align:center;font-size:23px;letter-spacing:-.5px;margin:12px 0 4px}.profile-screen>button:not(.profile-avatar-button){display:block;margin:0 auto;background:transparent;color:var(--accent);padding:5px}.profile-screen>p{text-align:center;line-height:1.5;margin:4px 0 12px}.profile-screen>.media-actions:not(:first-child){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:20px 0}.profile-screen>.media-actions:not(:first-child) button{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--panel2);padding:13px 5px;font-size:12px;min-width:0;border-radius:14px;color:var(--accent)}.profile-panel h3{font-size:13px;color:var(--muted);font-weight:600;margin:24px 0 12px}.profile-panel details{border-bottom:1px solid var(--line);padding:8px 0}.profile-panel details summary{cursor:pointer;color:var(--muted);font-size:13px}.profile-panel details button{display:block;width:100%;text-align:left;background:transparent;margin-top:5px}.profile-tabs{display:flex;gap:0;flex-wrap:nowrap;border-bottom:1px solid var(--line)}.profile-tabs button{padding:12px 2px;font-size:11px;flex:1;border-radius:0;background:transparent;min-width:0}.profile-tabs [aria-pressed=true]{color:var(--accent);background:transparent;box-shadow:inset 0 -2px var(--accent)}.profile-material{border-radius:10px;overflow:hidden;margin:4px 0;padding:10px;font-size:13px}.profile-material img,.profile-material video{width:100%;height:116px;object-fit:cover;border-radius:8px;margin-bottom:8px}.profile-material small{font-size:10px;margin-top:4px}.profile-materials-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.profile-materials-grid .profile-material{padding:4px;white-space:nowrap;text-overflow:ellipsis;background:var(--panel2)}
#call-dialog{width:min(800px,calc(100vw - 32px));padding:24px;border-radius:24px;background:var(--panel);border:1px solid var(--line)}.call-top{padding:8px 0 14px;text-align:center}.call-top .eyebrow{font-size:10px;color:var(--muted);letter-spacing:1.5px}.call-top h2{font-size:24px;letter-spacing:-.5px;margin:12px 0 6px}#call-status{font-size:16px;color:var(--muted);margin:0}.video-stage{border-radius:18px;background:var(--bg);min-height:260px;overflow:hidden}.call-avatar{width:116px;height:116px;border-radius:50%;background:var(--panel2);color:var(--accent);font-size:40px;display:grid;place-items:center;border:1px solid var(--line)}#remote-video{object-fit:contain}#local-video{border-radius:12px;border:2px solid var(--panel);right:14px;bottom:14px;max-width:25%}.call-actions{padding:20px 0 0;gap:14px}.call-actions .icon-button{width:52px;height:52px;border-radius:18px;background:var(--panel2)}#hangup{border-radius:18px;min-height:52px;background:#e55a68;color:white;padding:0 24px}#accept-call{border-radius:18px;min-height:52px;background:#288b67;color:white}.call-device-controls{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.call-device-controls label{font-size:11px;flex:1;min-width:130px;color:var(--muted)}.call-device-controls select{width:100%;margin-top:4px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:8px;color:var(--text)}
@media(hover:none){.message-more{display:none}.message-row:focus-within .message-more{display:block;opacity:1}}
@media(max-width:780px){.folder-button{width:48px;margin:3px 4px;border-radius:12px}.rail-bottom #settings-button{width:48px;margin:0 4px}.sidebar-toolbar{height:64px;padding:8px 6px}.conversation-header{min-height:62px;padding:5px 6px;gap:5px}.conversation-header>.avatar{width:36px;height:36px}.message-list{padding:14px 10px}.message-bubble{max-width:88%;padding:10px 12px 6px}.composer-wrap{padding:6px 8px max(8px,env(safe-area-inset-bottom))}.composer{border-radius:20px;padding:3px 4px}.composer textarea{font-size:16px;padding:11px 3px}.composer .icon-button{min-width:40px;width:40px;flex-basis:40px}.profile-panel{width:100vw;max-width:100vw;padding:18px}.profile-screen>.media-actions:not(:first-child){margin:16px 0}.message-album .attachment-image,.message-album .attachment-video{height:150px}.voice-player{width:244px;gap:0 8px}#call-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:18px;box-sizing:border-box}.video-stage{min-height:180px;height:45dvh}.call-actions{gap:10px}.call-top h2{font-size:22px}.message-row>.avatar{width:28px;height:28px;font-size:11px}.chat-card{height:76px}.profile-tabs button{font-size:11px}}
@media(max-height:520px){#call-dialog{overflow:auto}.call-top{padding:0}.call-top h2{font-size:18px;margin:6px}.video-stage{min-height:120px;height:36dvh}.call-actions{padding-top:12px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}

.composer:focus-within{box-shadow:0 0 0 1px var(--accent)}.composer textarea:focus-visible{outline:0;box-shadow:none}.archive-row.ui-row{background:transparent}.archive-row.ui-row:hover{background:var(--panel2)}