*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Arial;background:#eef1f5;color:#20242a}.card{background:#fff;border-radius:14px;box-shadow:0 8px 30px #0001}.login{width:min(390px,92vw);margin:12vh auto;padding:28px;display:grid;gap:12px}.login input,.login button,input,textarea,button{font:inherit}.login input,input,textarea{border:1px solid #ccd2da;border-radius:9px;padding:11px}.login button,button{border:0;border-radius:9px;padding:10px 13px;background:#2764d8;color:#fff;cursor:pointer}button:disabled{opacity:.45;cursor:default}.err{color:#b42318}.app{height:100vh;display:grid;grid-template-columns:320px 1fr;background:#fff}.app aside{border-right:1px solid #dde2e8;overflow:auto}.me{padding:18px;display:flex;flex-direction:column;gap:3px;background:#f7f9fb}.me small{color:#68717d}.toolbar{padding:10px;display:flex;gap:6px;flex-wrap:wrap}.toolbar button{font-size:13px;padding:7px 9px}.contact{padding:13px 16px;border-top:1px solid #eee;cursor:pointer}.contact:hover,.contact.active{background:#eef4ff}.contact small{display:block;color:#68717d}.app main{min-width:0;display:grid;grid-template-rows:auto 1fr auto}.chatHead{padding:16px;border-bottom:1px solid #dde2e8;font-weight:700}.messages{padding:16px;overflow:auto;background:#f5f7fa}.msg{max-width:min(75%,700px);padding:10px 12px;margin:7px 0;border-radius:12px;background:#fff;box-shadow:0 1px 3px #0001;white-space:pre-wrap;overflow-wrap:anywhere}.msg.mine{margin-left:auto;background:#dceaff}.msg time{display:block;font-size:11px;color:#78818c;margin-top:4px}.composer{padding:10px;border-top:1px solid #dde2e8;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:end}.composer textarea{resize:none;min-height:48px;max-height:140px}.emojiWrap{position:relative}.emojiBtn{width:48px;height:48px;padding:0;font-size:24px;background:#eef1f5;color:#20242a;border:1px solid #ccd2da}.emojiPicker{position:absolute;left:0;bottom:58px;width:330px;max-width:82vw;padding:8px;background:#202020;border-radius:12px;box-shadow:0 10px 30px #0004;display:grid;grid-template-columns:repeat(7,1fr);gap:3px;z-index:20}.emojiPicker[hidden]{display:none}.emojiChoice{padding:5px;background:transparent;font-size:24px;line-height:1.25;border-radius:7px}.emojiChoice:hover{background:#ffffff18}.modal{position:fixed;inset:0;background:#0007;display:grid;place-items:center;padding:18px;z-index:50}.modalBox{width:min(520px,96vw);max-height:90vh;overflow:auto;background:#fff;border-radius:14px;padding:20px}.modalBox input{width:100%;margin:5px 0 10px}.modalBox hr{border:0;border-top:1px solid #e1e5ea;margin:22px 0}.fieldLabel{display:block;font-size:13px;font-weight:700;margin-top:8px}.userRow{display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-top:1px solid #eee}.sectionTitle{padding:8px 16px;font-size:12px;font-weight:700;text-transform:uppercase;color:#78818c;background:#fafbfc;border-top:1px solid #eee}.dialogLine{display:flex;align-items:center;justify-content:space-between;gap:8px}.badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#2764d8;color:#fff;font-size:12px;display:inline-flex;align-items:center;justify-content:center}.emptySide{padding:16px;color:#78818c;font-size:13px}.hint{font-size:13px;color:#68717d;margin:5px 0 12px}@media(max-width:720px){.app{grid-template-columns:135px 1fr}.toolbar{display:grid}.contact{padding:10px;font-size:13px}.contact small{font-size:11px}.msg{max-width:88%}.composer{grid-template-columns:auto 1fr}.composer #sendBtn{grid-column:1/-1;width:100%}.emojiPicker{grid-template-columns:repeat(6,1fr);width:290px}}@media(max-width:480px){.app{grid-template-columns:105px 1fr}.toolbar button{padding:7px 5px;font-size:11px}.contact{padding:8px;font-size:12px}.chatHead{padding:12px}.messages{padding:10px}.composer{grid-template-columns:auto 1fr}.emojiBtn{width:46px;height:46px}.emojiPicker{position:fixed;left:8px;right:8px;bottom:112px;width:auto;max-width:none;grid-template-columns:repeat(7,1fr)}}.textWrap{position:relative;min-width:0}.textWrap textarea{width:100%;padding-bottom:23px}.charCount{position:absolute;right:9px;bottom:7px;font-size:11px;color:#78818c;pointer-events:none}.charCount.over{color:#b42318;font-weight:700}.attachWrap{position:relative}.attachBtn{width:48px;height:48px;padding:0;font-size:22px;background:#eef1f5;color:#20242a;border:1px solid #ccd2da}.fileStatus{grid-column:1/-1;min-height:0;font-size:12px;color:#68717d;padding-left:2px}.fileCard{display:flex;align-items:center;gap:9px;width:100%;margin-top:6px;padding:9px 10px;background:#f4f6f8;color:#20242a;border:1px solid #d9dfe6;text-align:left}.msg.mine .fileCard{background:#edf4ff}.fileIcon{font-size:22px}.fileInfo{min-width:0;display:flex;flex-direction:column}.fileInfo b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:420px}.fileInfo small{font-size:11px;color:#68717d;font-weight:400}.fileBroken{margin-top:6px;padding:8px;border:1px dashed #c8ced6;border-radius:8px;font-size:13px;color:#68717d}.fileCard.busy{cursor:wait;opacity:.82}.fileCard:disabled{color:#20242a}.fileProgress{display:block;width:100%;height:5px;margin-top:5px;border-radius:999px;background:#d9dfe6;overflow:hidden}.fileProgress[hidden]{display:none}.fileProgressBar{display:block;width:0;height:100%;background:#2b67d9;transition:width .15s linear}.msg.mine .fileProgress{background:#cfddf2}@media(max-width:720px){.composer{grid-template-columns:auto auto 1fr}.composer #sendBtn{grid-column:1/-1}.fileInfo b{max-width:230px}}@media(max-width:480px){.composer{grid-template-columns:auto auto 1fr}.attachBtn{width:46px;height:46px}.fileInfo b{max-width:155px}}.composer{padding:10px;border-top:1px solid #dde2e8;display:grid;grid-template-columns:48px 48px minmax(0,1fr) auto;grid-template-areas:"attach emoji text send" "status status status status";gap:8px;align-items:end;background:#fff}.attachWrap{grid-area:attach;position:relative}.emojiWrap{grid-area:emoji;position:relative}.textWrap{grid-area:text;position:relative;min-width:0}#sendBtn{grid-area:send;min-height:48px;white-space:nowrap}.fileStatus{grid-area:status;min-height:0;font-size:12px;color:#68717d;padding-left:2px}.composer textarea{width:100%;resize:none;min-height:48px;max-height:140px;display:block}.attachBtn,.emojiBtn{width:48px;height:48px}@media(max-width:720px){.composer{grid-template-columns:48px 48px minmax(0,1fr);grid-template-areas:"text text text" "attach emoji send" "status status status"}#sendBtn{width:100%;min-height:48px}}@media(max-width:480px){.composer{padding:8px;grid-template-columns:46px 46px minmax(0,1fr);gap:6px}.attachBtn,.emojiBtn{width:46px;height:46px}#sendBtn{min-height:46px}.composer textarea{min-height:46px}}.inviteRegisterBtn{position:fixed;top:16px;right:16px;width:44px;height:44px;padding:0;border-radius:50%;font-size:28px;line-height:1;z-index:10;box-shadow:0 5px 18px #0002}.welcomeCreds{margin:14px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.welcomeCreds>div{border:1px solid #dce2e9;background:#f7f9fb;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px}.welcomeCreds span{font-size:12px;color:#68717d}.welcomeCreds b{font-size:19px}.adminSection h3{display:flex;align-items:center;gap:8px;margin-bottom:6px}.miniPlus{width:32px;height:32px;padding:0;border-radius:50%;font-size:22px;line-height:1}.inviteList{display:grid;gap:7px;margin-top:10px}.inviteKeyRow{width:100%;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;text-align:left;background:#f3f6fa;color:#20242a;border:1px solid #d8dfe7}.inviteKeyRow:hover{background:#eaf1fb}.inviteKeyRow.used{background:#e9f8ee;border-color:#abd9b8;color:#176b32}.inviteKeyValue{font:700 15px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.4px}.inviteKeyMeta{font-size:12px;color:#68717d;text-align:right}.inviteKeyRow.used .inviteKeyMeta{color:#34814b}.inviteCopyHint{display:none}.inviteEmpty{padding:10px 0;color:#78818c;font-size:13px}@media(max-width:480px){.inviteRegisterBtn{top:10px;right:10px;width:40px;height:40px;font-size:25px}.welcomeCreds{grid-template-columns:1fr}.inviteKeyRow{grid-template-columns:1fr}.inviteKeyMeta{text-align:left}}.inviteKeyMeta.inviteCopyHint{display:block}@media(max-width:720px){.composer{display:grid;grid-template-columns:44px 44px minmax(0,1fr);grid-template-areas:"text text text" "attach emoji send" "status status status";gap:7px;align-items:stretch;padding:8px}.textWrap{grid-area:text;min-width:0;width:100%}.attachWrap{grid-area:attach;min-width:0}.emojiWrap{grid-area:emoji;min-width:0}#sendBtn{grid-area:send;width:100%;min-width:0;max-width:100%;min-height:44px;padding:8px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachBtn,.emojiBtn{width:44px;min-width:44px;max-width:44px;height:44px;padding:0}.composer textarea{width:100%;min-width:0;max-width:100%;min-height:48px}.fileStatus{grid-area:status;min-width:0;overflow-wrap:anywhere}}@media(max-width:360px){.app{grid-template-columns:92px minmax(0,1fr)}.composer{grid-template-columns:40px 40px minmax(0,1fr);gap:5px;padding:6px}.attachBtn,.emojiBtn{width:40px;min-width:40px;max-width:40px;height:40px;font-size:20px}#sendBtn{min-height:40px;padding:7px 6px;font-size:13px}}:root{--app-height:100vh}@supports(height:100dvh){:root{--app-height:100dvh}}.app{height:var(--app-height);max-height:var(--app-height);overflow:hidden}.app main{min-height:0;height:100%;overflow:hidden}.messages{min-height:0}.composer{position:relative;z-index:5;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}@media(max-width:720px){body{overflow:hidden;overscroll-behavior:none}.app{height:var(--app-height);min-height:0}.app aside{min-height:0;max-height:100%;overflow:auto}.app main{grid-template-rows:auto minmax(0,1fr) auto}.composer{padding:8px 8px calc(12px + env(safe-area-inset-bottom,0px));background:#fff}}@media(max-width:480px){.composer{padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}}.mobileBackBtn{display:none;width:40px;height:40px;min-width:40px;padding:0;align-items:center;justify-content:center;border-radius:10px;font-size:25px;line-height:1;background:#eef1f5;color:#20242a;border:1px solid #d7dde5}#chatTitle{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:720px){.app{display:block;width:100%;height:var(--app-height);max-height:var(--app-height);overflow:hidden;background:#fff}.app aside{display:block;width:100%;height:100%;max-height:100%;border-right:0;overflow:auto;background:#fff}.app main{display:none;width:100%;height:100%;min-width:0;min-height:0}.app.mobile-chat-open aside{display:none}.app.mobile-chat-open main{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.chatHead{min-height:57px;display:flex;align-items:center;gap:10px;padding:8px 10px}.mobileBackBtn{display:inline-flex}.me{padding:16px}.toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px}.toolbar button{font-size:14px;padding:10px 8px}.contact{padding:14px 16px;font-size:15px}.contact small{font-size:12px}.sectionTitle{padding:10px 16px}.emptySide{padding:18px 16px}}@media(max-width:360px){.app{display:block}.toolbar{grid-template-columns:1fr 1fr}}@media (max-width:720px){.composer{display:grid !important;grid-template-columns:52px 52px minmax(0,1fr) !important;grid-template-rows:auto 48px auto !important;column-gap:8px !important;row-gap:8px !important;align-items:stretch !important;width:100% !important;min-width:0 !important;overflow:visible !important}.composer .textWrap{grid-column:1 / 4 !important;grid-row:1 !important;width:100% !important;min-width:0 !important;position:relative !important}.composer .attachWrap{grid-column:1 !important;grid-row:2 !important;width:52px !important;min-width:52px !important;max-width:52px !important;position:relative !important;inset:auto !important;margin:0 !important;transform:none !important}.composer .emojiWrap{grid-column:2 !important;grid-row:2 !important;width:52px !important;min-width:52px !important;max-width:52px !important;position:relative !important;inset:auto !important;margin:0 !important;transform:none !important}.composer .attachBtn,.composer .emojiBtn{display:flex !important;align-items:center !important;justify-content:center !important;width:52px !important;min-width:52px !important;max-width:52px !important;height:48px !important;min-height:48px !important;margin:0 !important;padding:0 !important;position:static !important;transform:none !important}.composer #sendBtn{grid-column:3 / 4 !important;grid-row:2 !important;display:block !important;width:100% !important;min-width:0 !important;max-width:none !important;height:48px !important;min-height:48px !important;margin:0 !important;padding:0 14px !important;position:static !important;inset:auto !important;transform:none !important;z-index:auto !important;border-radius:9px !important}.composer .fileStatus{grid-column:1 / 4 !important;grid-row:3 !important;min-width:0 !important;margin:0 !important}}@media (max-width:380px){.composer{grid-template-columns:46px 46px minmax(0,1fr) !important;column-gap:6px !important}.composer .attachWrap,.composer .emojiWrap,.composer .attachBtn,.composer .emojiBtn{width:46px !important;min-width:46px !important;max-width:46px !important}}.profileButton{display:flex;align-items:center;gap:10px;min-width:0;padding:0;background:transparent;color:#20242a;border:0;border-radius:9px;font-weight:700;text-align:left}.profileButton:not(:disabled){cursor:pointer}.profileButton:not(:disabled):hover #chatTitle{text-decoration:underline}.profileButton:disabled{opacity:1;cursor:default}.chatAvatar{width:36px;height:36px;min-width:36px;border-radius:50%;object-fit:cover;border:1px solid #d8dee7;background:#eef1f5}.profileView{text-align:center}.profileAvatar{width:128px;height:128px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 14px;border:1px solid #d8dee7;background:#eef1f5}.profileAvatarPlaceholder{display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:700;color:#7c8591}.profileView h2{margin:4px 0 2px}.profileNumber{color:#68717d;margin-bottom:18px}.profileAboutTitle{font-size:12px;font-weight:700;text-transform:uppercase;color:#78818c;text-align:left;margin:10px 0 6px}.profileAbout{white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;background:#f6f8fa;border:1px solid #e0e5eb;border-radius:10px;padding:12px;min-height:72px;margin-bottom:16px}.profileEditTop{display:grid;grid-template-columns:128px minmax(0,1fr);gap:16px;align-items:center;margin-bottom:16px}.avatarPreview{width:128px;height:128px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#eef1f5;border:1px solid #d8dee7;color:#7c8591;font-size:34px;font-weight:700}.avatarPreview img{width:128px;height:128px;object-fit:cover;display:block}.avatarActions{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.avatarActions small{font-size:12px;color:#68717d;line-height:1.35}.avatarUploadBtn{display:inline-block;border-radius:9px;padding:9px 12px;background:#2764d8;color:#fff;cursor:pointer}.secondaryBtn{background:#eef1f5;color:#20242a;border:1px solid #d4dae2}.aboutWrap{position:relative}.aboutWrap textarea{width:100%;min-height:130px;resize:vertical;padding-bottom:28px}.aboutCount{position:absolute;right:10px;bottom:9px;font-size:11px;color:#78818c;pointer-events:none}@media(max-width:480px){.profileEditTop{grid-template-columns:1fr;justify-items:center}.avatarActions{align-items:stretch;width:100%}.avatarUploadBtn{text-align:center}.profileButton{gap:8px}.chatAvatar{width:34px;height:34px;min-width:34px}}.contact{display:flex;align-items:center;gap:10px}.dialogAvatar{width:44px;height:44px;min-width:44px;border-radius:50%;padding:2px;border:2px solid transparent;background:#eef2f6;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.dialogAvatar.online{border-color:#24b45a;background:#eaf8ef}.dialogAvatarImg{display:block;width:36px;height:36px;border-radius:50%;object-fit:cover;background:#fff}.dialogAvatarPlaceholder{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#dfe5eb;color:#68717d;font-weight:700}.dialogBody{min-width:0;flex:1}.dialogBody .dialogLine{min-width:0}.dialogBody .dialogLine b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.presenceText{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7a838d}.presenceText.online{color:#239b50;font-weight:600}.chatAvatar.online{box-shadow:0 0 0 3px #24b45a}.profilePresence{margin-top:5px;color:#727c87;font-size:13px}.profilePresence.online{color:#239b50;font-weight:700}.privacyBox{margin:16px 0;padding:12px;border:1px solid #dce2e9;border-radius:10px;background:#f8fafc;text-align:left}.privacyBox h3{margin:0 0 10px}.checkRow{display:flex;align-items:flex-start;gap:9px;margin:9px 0;cursor:pointer}.checkRow input{width:18px;height:18px;margin:1px 0 0;flex:0 0 auto}@media(max-width:720px){.dialogAvatar{width:48px;height:48px;min-width:48px}.dialogAvatarImg,.dialogAvatarPlaceholder{width:40px;height:40px}}.successText{min-height:1.2em;margin:6px 0;color:#16803a;font-size:14px;font-weight:600}.pwaSettings{display:grid;gap:10px}.pwaSettings h3{margin-bottom:0}.pwaSettings .secondaryBtn{justify-self:start}.pushStatus{margin-top:4px}@media (display-mode:standalone){body{overscroll-behavior:none}}@media (max-width:720px){html,body{width:100%;height:100%;max-width:100%;max-height:100%;overflow:hidden !important;overscroll-behavior:none !important;position:fixed;inset:0;margin:0;padding:0}body{touch-action:none}.app{position:fixed !important;left:0 !important;top:var(--vv-top,0px) !important;width:100% !important;height:var(--app-height) !important;max-height:var(--app-height) !important;overflow:hidden !important;overscroll-behavior:none !important}.app.mobile-chat-open main{height:100% !important;min-height:0 !important;overflow:hidden !important;overscroll-behavior:none !important;grid-template-rows:auto minmax(0,1fr) auto !important}.chatHead{min-height:0;flex:0 0 auto;touch-action:manipulation}.messages{min-height:0 !important;overflow-y:auto !important;overflow-x:hidden !important;overscroll-behavior-y:contain !important;-webkit-overflow-scrolling:touch;touch-action:pan-y !important}.composer{position:relative !important;flex:0 0 auto;overflow:visible !important;overscroll-behavior:none !important;touch-action:none;transform:none !important}.composer textarea{touch-action:manipulation !important}.composer button,.composer .attachWrap,.composer .emojiWrap{touch-action:manipulation !important}}

/* 2026.33.30 — персональные приглашения */
.userInviteSettings{display:grid;gap:9px}.userInviteSettings h3{margin:0}.myInviteCode{display:inline-block;margin-top:5px;font:700 16px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.5px;color:#20242a}.userInviteSettings .secondaryBtn{justify-self:start}.inviteKeyRow.userInviteUsed{background:#eaf2ff;border-color:#9bbcf2;color:#1d56a5}.inviteKeyRow.userInviteUsed .inviteKeyMeta{color:#356fbf}

/* 2026.33.31 — вставка изображений из буфера с превью */
.pastePreview{grid-column:1/-1;display:grid;grid-template-columns:64px minmax(0,1fr) 34px;align-items:center;gap:10px;padding:8px;border:1px solid #d8dfe7;border-radius:10px;background:#f7f9fb;min-width:0}.pastePreview[hidden]{display:none}.pastePreviewImg{width:64px;height:52px;object-fit:cover;border-radius:7px;background:#e8edf2;display:block}.pastePreviewInfo{min-width:0;display:flex;flex-direction:column;gap:3px}.pastePreviewInfo b,.pastePreviewInfo small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pastePreviewInfo small{font-size:11px;color:#68717d}.pastePreviewRemove{width:32px;height:32px;padding:0;border-radius:50%;background:#e9edf2;color:#39414b;border:1px solid #d0d7df;font-size:22px;line-height:1}.composer{grid-template-areas:"preview preview preview preview" "attach emoji text send" "status status status status"}.pastePreview{grid-area:preview}
@media(max-width:720px){.composer{grid-template-rows:auto auto 48px auto !important}.composer .pastePreview{grid-column:1/4 !important;grid-row:1 !important}.composer .textWrap{grid-row:2 !important}.composer .attachWrap,.composer .emojiWrap,.composer #sendBtn{grid-row:3 !important}.composer .fileStatus{grid-row:4 !important}.pastePreviewImg{width:58px;height:48px}}

/* 2026.33.32 — ленивый просмотр зашифрованных изображений внутри QVIK */
.imageAttachment{margin-top:8px;border:1px solid #d9e0e8;border-radius:11px;overflow:hidden;background:#f7f9fb;max-width:420px;white-space:normal}.chatImageOpen{display:block;width:100%;padding:0;border:0;border-radius:0;background:#e8edf2;color:#68717d;overflow:hidden;min-height:150px;position:relative}.chatImagePlaceholder{display:grid;place-items:center;position:absolute;inset:0;font-size:13px}.chatImageThumb{display:none;width:100%;max-height:320px;object-fit:contain;background:#111}.imageAttachment.ready .chatImageThumb{display:block}.imageAttachment.ready .chatImagePlaceholder{display:none}.imageAttachmentMeta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;align-items:center;padding:8px 9px}.imageAttachmentName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}.imageAttachmentMeta small{grid-column:1;font-size:11px;color:#68717d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.imageAttachmentMeta .fileProgress{grid-column:1}.imageDownloadBtn{grid-column:2;grid-row:1/4;align-self:center;padding:6px 9px;font-size:11px;background:#eef1f5;color:#20242a;border:1px solid #d4dae2}.imageAttachment.failed .chatImagePlaceholder{color:#b42318}.imageViewer{position:fixed;inset:0;z-index:120;background:#000e;display:grid;grid-template-rows:auto minmax(0,1fr);touch-action:manipulation}.imageViewerTop{min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;color:#fff;background:#0008}.imageViewerTop>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.imageViewerActions{display:flex;gap:8px;flex:0 0 auto}.imageViewerActions button{background:#ffffff18;border:1px solid #ffffff35;color:#fff}.imageViewerClose{width:40px;height:40px;padding:0;font-size:28px;line-height:1}.imageViewerCanvas{min-height:0;overflow:auto;display:grid;place-items:center;padding:10px;touch-action:pan-x pan-y pinch-zoom}.imageViewerCanvas img{display:block;max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}@media(max-width:720px){.imageAttachment{max-width:100%}.chatImageOpen{min-height:120px}.chatImageThumb{max-height:280px}.imageViewerCanvas{padding:4px}.imageViewerTop{padding:6px 8px}.imageViewerActions .imageViewerDownload{padding:8px 10px}}

/* 2026.33.33 — ответы, меню сообщений и управляемые пустые диалоги */
.msg{position:relative;transition:transform .16s ease,box-shadow .16s ease;touch-action:pan-y}.msg.swipingReply{transition:none}.msg.swipingReply:before{content:'↩';position:absolute;right:100%;top:50%;transform:translate(-10px,-50%);font-size:22px;color:#2764d8}.messageFlash{box-shadow:0 0 0 3px #76a7ff,0 2px 10px #2764d833 !important}.replyQuote{display:flex;flex-direction:column;gap:2px;width:100%;margin:0 0 7px;padding:6px 8px;text-align:left;background:#eef3f8;color:#20242a;border:0;border-left:3px solid #2764d8;border-radius:6px;white-space:normal}.msg.mine .replyQuote{background:#cfddf2}.replyQuote b{font-size:11px;color:#2764d8}.replyQuote span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.replyQuote:disabled{opacity:.72;cursor:default;color:#68717d}.replyComposer{grid-area:reply;grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:8px;align-items:center;padding:7px 8px;border-left:3px solid #2764d8;border-radius:8px;background:#f1f5fa;min-width:0}.replyComposer[hidden]{display:none}.replyComposerBody{display:flex;flex-direction:column;gap:2px;min-width:0}.replyComposerBody b{font-size:11px;color:#2764d8}.replyComposerBody span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.replyComposerClose{width:32px;height:32px;padding:0;border-radius:50%;background:#e4e9ef;color:#39414b;border:1px solid #d0d7df;font-size:21px}.composer{grid-template-areas:"reply reply reply reply" "preview preview preview preview" "attach emoji text send" "status status status status"}.contextMenu{position:fixed;z-index:180;min-width:160px;padding:5px;background:#fff;border:1px solid #d8dee6;border-radius:11px;box-shadow:0 12px 34px #0003;display:grid;gap:2px}.contextMenu button{background:transparent;color:#20242a;text-align:left;padding:9px 11px;border-radius:7px}.contextMenu button:hover{background:#eef3f8}.contextMenu button.danger{color:#b42318}.contact{user-select:none;-webkit-user-select:none}
@media(max-width:720px){.composer{grid-template-rows:auto auto auto 48px auto !important}.composer .replyComposer{grid-column:1/4 !important;grid-row:1 !important}.composer .pastePreview{grid-column:1/4 !important;grid-row:2 !important}.composer .textWrap{grid-row:3 !important}.composer .attachWrap,.composer .emojiWrap,.composer #sendBtn{grid-row:4 !important}.composer .fileStatus{grid-row:5 !important}.contextMenu{min-width:190px}.contextMenu button{padding:12px}}


/* 2026.33.36 — тёмная и цветная темы QVIK */
:root{color-scheme:dark}
html[data-theme="dark"],html[data-theme="color"]{--q-bg:#0e1621;--q-panel:#17212b;--q-panel2:#202b36;--q-line:#2b3947;--q-text:#eef4f8;--q-muted:#8796a5;--q-in:#182533;--q-own:#2b5278;--q-blue:#3390ec;--q-purple:#a23bd0}
html[data-theme="dark"] body,html[data-theme="color"] body{background:var(--q-bg);color:var(--q-text)}
html[data-theme="dark"] .app,html[data-theme="color"] .app{background:var(--q-bg)}
html[data-theme="dark"] .app aside,html[data-theme="color"] .app aside{background:var(--q-panel);border-right-color:var(--q-line)}
html[data-theme="dark"] .me,html[data-theme="color"] .me{background:#121c26;color:var(--q-text)}
html[data-theme="dark"] .me small,html[data-theme="color"] .me small,html[data-theme="dark"] .contact small,html[data-theme="color"] .contact small,html[data-theme="dark"] .presenceText,html[data-theme="color"] .presenceText{color:var(--q-muted)}
html[data-theme="dark"] .sectionTitle,html[data-theme="color"] .sectionTitle{background:#111b25;color:var(--q-muted);border-color:var(--q-line)}
html[data-theme="dark"] .contact,html[data-theme="color"] .contact{border-color:var(--q-line);color:var(--q-text)}
html[data-theme="dark"] .contact:hover,html[data-theme="dark"] .contact.active,html[data-theme="color"] .contact:hover,html[data-theme="color"] .contact.active{background:#202f3f}
html[data-theme="dark"] .chatHead,html[data-theme="color"] .chatHead{background:var(--q-panel);border-color:var(--q-line);color:var(--q-text)}
html[data-theme="dark"] .profileButton,html[data-theme="color"] .profileButton{color:var(--q-text)}
html[data-theme="dark"] .messages,html[data-theme="color"] .messages{background:#0e1621}
html[data-theme="dark"] .msg,html[data-theme="color"] .msg{background:var(--q-in);color:var(--q-text);box-shadow:0 1px 2px #0005}
html[data-theme="dark"] .msg.mine{background:#2b5278;color:#fff}
/* Один и тот же фон привязан к viewport: сообщения перемещаются поверх неподвижной цветовой карты. */
html[data-theme="color"] .msg.mine{background-image:linear-gradient(to top,#2d8cff 0%,#3578eb 30%,#6753d8 62%,#a33bc9 100%);background-attachment:fixed;background-size:100vw 100vh;background-position:center bottom;color:#fff}
html[data-theme="dark"] .msg time,html[data-theme="color"] .msg time{color:#a7b4c0}
html[data-theme="dark"] .composer,html[data-theme="color"] .composer{background:var(--q-panel);border-color:var(--q-line)}
html[data-theme="dark"] textarea,html[data-theme="dark"] input,html[data-theme="color"] textarea,html[data-theme="color"] input{background:#202b36;color:var(--q-text);border-color:#344555}
html[data-theme="dark"] .emojiBtn,html[data-theme="dark"] .attachBtn,html[data-theme="color"] .emojiBtn,html[data-theme="color"] .attachBtn{background:#202b36;color:#c7d2dc;border-color:#344555}
html[data-theme="dark"] .fileCard,html[data-theme="dark"] .imageAttachment,html[data-theme="color"] .fileCard,html[data-theme="color"] .imageAttachment{background:#202b36;color:var(--q-text);border-color:#344555}
html[data-theme="dark"] .msg.mine .fileCard,html[data-theme="color"] .msg.mine .fileCard{background:#ffffff14;color:#fff;border-color:#ffffff24}
html[data-theme="dark"] .replyQuote,html[data-theme="color"] .replyQuote{background:#101b25;color:var(--q-text);border-left-color:#4ea4f6}
html[data-theme="dark"] .msg.mine .replyQuote,html[data-theme="color"] .msg.mine .replyQuote{background:#0003;color:#fff}
html[data-theme="dark"] .replyQuote b,html[data-theme="color"] .replyQuote b{color:#6ab4f8}
html[data-theme="dark"] .replyComposer,html[data-theme="color"] .replyComposer{background:#202b36;color:var(--q-text);border-left-color:#4ea4f6}
html[data-theme="dark"] .modalBox,html[data-theme="color"] .modalBox{background:var(--q-panel);color:var(--q-text)}
html[data-theme="dark"] .privacyBox,html[data-theme="dark"] .themeBox,html[data-theme="color"] .privacyBox,html[data-theme="color"] .themeBox{background:#111b25;border:1px solid var(--q-line);color:var(--q-text)}
.themeBox{margin:16px 0;padding:12px;border-radius:10px;text-align:left}.themeBox h3{margin:0 0 10px}.radioRow{display:flex;align-items:center;gap:9px;margin:10px 0;cursor:pointer}.radioRow input{width:18px;height:18px;margin:0;accent-color:#3390ec}.radioRow span{font-weight:600}
html[data-theme="dark"] .hint,html[data-theme="color"] .hint,html[data-theme="dark"] .aboutCount,html[data-theme="color"] .aboutCount{color:var(--q-muted)}
html[data-theme="dark"] .secondaryBtn,html[data-theme="color"] .secondaryBtn{background:#202b36;color:var(--q-text);border-color:#344555}
html[data-theme="dark"] .contextMenu,html[data-theme="color"] .contextMenu{background:#202b36;border-color:#344555;box-shadow:0 12px 34px #0008}
html[data-theme="dark"] .contextMenu button,html[data-theme="color"] .contextMenu button{color:var(--q-text)}
html[data-theme="dark"] .contextMenu button:hover,html[data-theme="color"] .contextMenu button:hover{background:#2a3948}
html[data-theme="dark"] .contextMenu button.danger,html[data-theme="color"] .contextMenu button.danger{color:#ff7b7b}
html[data-theme="dark"] .dialogAvatar,html[data-theme="color"] .dialogAvatar{background:#243342}
html[data-theme="dark"] .dialogAvatarPlaceholder,html[data-theme="color"] .dialogAvatarPlaceholder{background:#314252;color:#c9d5df}
html[data-theme="dark"] .emptySide,html[data-theme="color"] .emptySide{color:var(--q-muted)}
@media(max-width:720px){html[data-theme="dark"] .composer,html[data-theme="color"] .composer{background:var(--q-panel)}}

/* 2026.33.37 — светлая футуристичная тема QVIK */
html[data-theme="light"]{--q-bg:#f6f7f9;--q-panel:rgba(255,255,255,.86);--q-panel2:#f1f3f5;--q-line:#e3e6ea;--q-text:#1f2328;--q-muted:#737b85;--q-in:#ffffff;--q-accent:#18a98c;--q-accent2:#2b8fdc}
html[data-theme="light"] body{background:linear-gradient(180deg,#fafbfc 0%,#f3f5f7 100%);color:var(--q-text)}
html[data-theme="light"] .app{background:#f6f7f9}
html[data-theme="light"] .app aside{background:rgba(250,251,252,.92);border-right-color:var(--q-line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
html[data-theme="light"] .me{background:rgba(255,255,255,.74);color:var(--q-text);border-bottom:1px solid #edf0f2}
html[data-theme="light"] .me small,html[data-theme="light"] .contact small,html[data-theme="light"] .presenceText,html[data-theme="light"] .hint,html[data-theme="light"] .aboutCount,html[data-theme="light"] .emptySide{color:var(--q-muted)}
html[data-theme="light"] .sectionTitle{background:#f7f8fa;color:#8a929c;border-color:var(--q-line)}
html[data-theme="light"] .contact{border-color:#edf0f2;color:var(--q-text)}
html[data-theme="light"] .contact:hover,html[data-theme="light"] .contact.active{background:linear-gradient(90deg,rgba(24,169,140,.10),rgba(43,143,220,.08))}
html[data-theme="light"] .chatHead{background:rgba(255,255,255,.82);border-color:var(--q-line);color:var(--q-text);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
html[data-theme="light"] .profileButton{color:var(--q-text)}
html[data-theme="light"] .messages{background:radial-gradient(circle at 20% 0%,rgba(43,143,220,.055),transparent 38%),radial-gradient(circle at 90% 100%,rgba(24,169,140,.06),transparent 42%),#f6f7f9}
html[data-theme="light"] .msg{background:rgba(255,255,255,.96);color:var(--q-text);border:1px solid rgba(224,228,232,.85);box-shadow:0 5px 18px rgba(31,35,40,.055)}
html[data-theme="light"] .msg.mine{background:linear-gradient(135deg,#e8f8f4 0%,#eaf5fb 100%);color:#18312c;border-color:#d6ede7;box-shadow:0 5px 18px rgba(24,169,140,.07)}
html[data-theme="light"] .msg time{color:#858d96}
html[data-theme="light"] .composer{background:rgba(255,255,255,.88);border-color:var(--q-line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
html[data-theme="light"] textarea,html[data-theme="light"] input{background:#fff;color:var(--q-text);border-color:#dfe3e7;box-shadow:inset 0 1px 0 rgba(0,0,0,.015)}
html[data-theme="light"] textarea:focus,html[data-theme="light"] input:focus{outline:none;border-color:#9fd8cc;box-shadow:0 0 0 3px rgba(24,169,140,.09)}
html[data-theme="light"] .emojiBtn,html[data-theme="light"] .attachBtn{background:#f4f6f7;color:#56606a;border-color:#dfe3e7}
html[data-theme="light"] button{background:linear-gradient(135deg,#1aa88c,#278ed2);color:#fff;box-shadow:0 5px 14px rgba(39,142,210,.12)}
html[data-theme="light"] .secondaryBtn{background:#f3f5f6;color:#37414a;border:1px solid #dfe3e7;box-shadow:none}
html[data-theme="light"] .fileCard,html[data-theme="light"] .imageAttachment{background:#f5f7f8;color:var(--q-text);border-color:#e0e4e8}
html[data-theme="light"] .msg.mine .fileCard{background:rgba(255,255,255,.48);color:#18312c;border-color:#d7ebe6}
html[data-theme="light"] .replyQuote{background:#f2f6f7;color:var(--q-text);border-left-color:#29a98f}
html[data-theme="light"] .msg.mine .replyQuote{background:rgba(255,255,255,.42);color:#18312c;border-left-color:#239d88}
html[data-theme="light"] .replyQuote b{color:#168d78}
html[data-theme="light"] .replyComposer{background:#f4f7f7;color:var(--q-text);border-left-color:#29a98f}
html[data-theme="light"] .modal{background:rgba(30,37,43,.24);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
html[data-theme="light"] .modalBox{background:rgba(255,255,255,.97);color:var(--q-text);border:1px solid rgba(226,230,233,.9);box-shadow:0 24px 70px rgba(25,34,42,.16)}
html[data-theme="light"] .privacyBox,html[data-theme="light"] .themeBox{background:#f7f8f9;border:1px solid #e4e7ea;color:var(--q-text)}
html[data-theme="light"] .radioRow input,html[data-theme="light"] .checkRow input{accent-color:#1aa88c}
html[data-theme="light"] .contextMenu{background:rgba(255,255,255,.98);border-color:#e0e4e8;box-shadow:0 16px 40px rgba(30,38,45,.16)}
html[data-theme="light"] .contextMenu button{color:var(--q-text);background:transparent;box-shadow:none}
html[data-theme="light"] .contextMenu button:hover{background:#f1f4f5}
html[data-theme="light"] .contextMenu button.danger{color:#d45555}
html[data-theme="light"] .dialogAvatar{background:#edf2f3}
html[data-theme="light"] .dialogAvatarPlaceholder{background:linear-gradient(135deg,#dceee9,#deebf3);color:#46615b}
html[data-theme="light"] .badge{background:linear-gradient(135deg,#1aa88c,#278ed2)}
html[data-theme="light"] .charCount{color:#8a929b}
html[data-theme="light"] .fileProgress{background:#dce3e6}
html[data-theme="light"] .fileProgressBar{background:linear-gradient(90deg,#1aa88c,#278ed2)}
@media(max-width:720px){html[data-theme="light"] .composer{background:rgba(255,255,255,.92)}}

/* 2026.33.38 — close controls for modal windows */
.modalBox{position:relative}
.modalClose{position:sticky;top:0;float:right;z-index:3;width:38px;height:38px;margin:-8px -8px 8px 10px;padding:0;border-radius:50%;font-size:26px;line-height:1;background:#eef1f5;color:#55606c;border:1px solid #d8dee6;box-shadow:none}
.modalClose:hover{filter:brightness(.97)}
html[data-theme="dark"] .modalClose,html[data-theme="color"] .modalClose{background:#202b36;color:#d8e1ea;border-color:#344555}
html[data-theme="light"] .modalClose{background:#f2f4f5;color:#4a545d;border-color:#e0e4e7}
@media(max-width:720px){.modalBox{padding-top:14px}.modalClose{width:40px;height:40px;margin:-4px -4px 8px 10px}}

/* 2026.33.39 — mobile horizontal overflow hardening */
@media (max-width:720px){
  html,body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  .app,
  .app aside,
  .app main,
  .chatHead,
  .messages,
  .composer{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  .app main,
  .messages{
    overflow-x:hidden !important;
  }
  .chatHead>*{
    min-width:0;
  }
  .profileButton{
    flex:1 1 auto;
    max-width:100%;
    overflow:hidden;
  }
  .composer{
    box-sizing:border-box !important;
  }
  .composer>*{
    max-width:100%;
    box-sizing:border-box;
  }
  .composer .textWrap,
  .composer textarea,
  .composer .fileStatus,
  .composer .pastePreview,
  .composer .replyComposer{
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
  }
  .composer textarea{
    box-sizing:border-box !important;
    overflow-x:hidden;
  }
  .pastePreviewInfo,
  .replyComposerBody,
  .fileInfo,
  .dialogBody,
  .dialogLine{
    min-width:0 !important;
    max-width:100%;
  }
  .msg,
  .fileCard,
  .imageAttachment,
  .replyQuote{
    min-width:0;
    max-width:100%;
  }
  .modal{
    width:100% !important;
    max-width:100% !important;
    padding:12px !important;
    overflow-x:hidden !important;
  }
  .modalBox{
    width:100% !important;
    max-width:520px !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
  }
  .modalBox>*{
    max-width:100%;
    box-sizing:border-box;
  }
  .privacyBox,.themeBox,.pwaSettings,.profileEditTop,.welcomeCreds,.inviteList,.userRow{
    min-width:0;
    max-width:100%;
  }
  .contextMenu{
    max-width:calc(100vw - 16px) !important;
  }
  .emojiPicker{
    max-width:calc(100vw - 16px) !important;
  }
}

/* 2026.33.40 — restore content-sized chat bubbles after 33.39 overflow hardening */
@media (max-width:720px){
  .messages .msg{
    width:fit-content !important;
    max-width:88% !important;
  }
  .messages .msg.mine{
    margin-left:auto !important;
    margin-right:0 !important;
  }
  .messages .msg:not(.mine){
    margin-left:0 !important;
    margin-right:auto !important;
  }
}
@media (max-width:360px){
  .messages .msg{max-width:90% !important;}
}

/* 2026.33.41 — compact message expiry countdown */
.msg time .expiryCountdown{white-space:nowrap;font-variant-numeric:tabular-nums;opacity:.9}

/* 2026.33.42 — compact message time, day separators and message info */
.dayDivider{display:flex;align-items:center;justify-content:center;gap:10px;margin:15px 0 11px;color:#697481;font-size:12px;font-weight:650;line-height:1;user-select:none;pointer-events:none}
.dayDivider::before,.dayDivider::after{content:"";height:1px;flex:1;max-width:120px;background:currentColor;opacity:.16}
.dayDivider span{padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.74);border:1px solid rgba(110,120,132,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
html[data-theme="dark"] .dayDivider,html[data-theme="color"] .dayDivider{color:#92a2b2}
html[data-theme="dark"] .dayDivider span,html[data-theme="color"] .dayDivider span{background:rgba(27,39,51,.86);border-color:rgba(150,170,190,.12)}
html[data-theme="light"] .dayDivider{color:#68747d}
html[data-theme="light"] .dayDivider span{background:rgba(255,255,255,.84);border-color:rgba(90,110,120,.10)}
.messageInfoBox{width:min(430px,100%)}
.messageInfoBox h2{margin:4px 0 18px}
.messageInfoRows{display:grid;gap:0;border:1px solid #e1e6eb;border-radius:12px;overflow:hidden}
.messageInfoRow{display:grid;grid-template-columns:minmax(105px,.8fr) minmax(0,1.3fr);gap:14px;padding:12px 14px;border-top:1px solid #e8ecf0;align-items:center}
.messageInfoRow:first-child{border-top:0}
.messageInfoRow span{color:#75808b;font-size:13px}
.messageInfoRow b{font-size:14px;font-weight:650;overflow-wrap:anywhere}
html[data-theme="dark"] .messageInfoRows,html[data-theme="color"] .messageInfoRows{border-color:#344453}
html[data-theme="dark"] .messageInfoRow,html[data-theme="color"] .messageInfoRow{border-color:#2e3e4d}
html[data-theme="dark"] .messageInfoRow span,html[data-theme="color"] .messageInfoRow span{color:#91a0af}
html[data-theme="light"] .messageInfoRows{border-color:#e1e5e8}
html[data-theme="light"] .messageInfoRow{border-color:#e8ecef}
@media(max-width:480px){.dayDivider{margin:13px 0 9px}.dayDivider::before,.dayDivider::after{max-width:80px}.messageInfoRow{grid-template-columns:96px minmax(0,1fr);gap:10px;padding:11px 12px}}

/* 2026.33.43 — unread outgoing status */
.messageUnread{opacity:.72;font-weight:500;white-space:nowrap}


/* 2026.33.45 — pulse the existing peer-avatar border; no extra wrapper/ring */
.chatAvatar[hidden]{display:none !important}
.chatAvatar.polling-active{--qvik-avatar-pulse:#4f8cff}
html[data-theme="dark"] .chatAvatar.polling-active{--qvik-avatar-pulse:#7b9cff}
html[data-theme="color"] .chatAvatar.polling-active{--qvik-avatar-pulse:#8d6dff}
html[data-theme="light"] .chatAvatar.polling-active{--qvik-avatar-pulse:#2d9d8f}
.chatAvatar.polling-active.poll-cycle{animation:qvikAvatarPollPulse 2s ease-in-out}
@keyframes qvikAvatarPollPulse{
  0%{border-color:var(--qvik-avatar-pulse);box-shadow:0 0 0 0 color-mix(in srgb,var(--qvik-avatar-pulse) 0%,transparent)}
  45%{border-color:var(--qvik-avatar-pulse);box-shadow:0 0 0 3px color-mix(in srgb,var(--qvik-avatar-pulse) 22%,transparent)}
  100%{border-color:var(--qvik-avatar-pulse);box-shadow:0 0 0 0 color-mix(in srgb,var(--qvik-avatar-pulse) 0%,transparent)}
}
.chatAvatar.online.polling-active.poll-cycle{animation:qvikAvatarPollPulseOnline 2s ease-in-out}
@keyframes qvikAvatarPollPulseOnline{
  0%{border-color:#24b45a;box-shadow:0 0 0 1px #24b45a}
  45%{border-color:#24b45a;box-shadow:0 0 0 4px rgba(36,180,90,.20)}
  100%{border-color:#24b45a;box-shadow:0 0 0 1px #24b45a}
}
@media(prefers-reduced-motion:reduce){.chatAvatar.polling-active.poll-cycle{animation:none}}


/* 2026.33.46 — real chat refresh status on the existing avatar */
.profileButton{position:relative}
.chatSyncStatus{
  position:absolute;
  left:27px;
  top:1px;
  width:9px;
  height:9px;
  z-index:4;
  pointer-events:none;
  opacity:0;
  transform:scale(.7);
  transition:opacity .12s ease,transform .12s ease;
}
.chatSyncStatus.sync-ok{
  opacity:1;
  transform:scale(1);
  border-radius:50%;
  background:#25c76f;
  box-shadow:0 0 0 2px rgba(13,22,32,.88),0 0 7px rgba(37,199,111,.55);
}
html[data-theme="light"] .chatSyncStatus.sync-ok{box-shadow:0 0 0 2px rgba(255,255,255,.96),0 0 7px rgba(37,199,111,.42)}
.chatSyncStatus.sync-error{
  opacity:1;
  transform:scale(1);
}
.chatSyncStatus.sync-error::before,.chatSyncStatus.sync-error::after{
  content:"";
  position:absolute;
  left:4px;
  top:-1px;
  width:2px;
  height:11px;
  border-radius:2px;
  background:#ff3b46;
  box-shadow:0 0 3px rgba(255,59,70,.65);
}
.chatSyncStatus.sync-error::before{transform:rotate(45deg)}
.chatSyncStatus.sync-error::after{transform:rotate(-45deg)}
@media(max-width:480px){.chatSyncStatus{left:25px;top:0}}

/* 2026.33.49 — encrypted voice messages */
.voiceWrap{grid-area:voice;position:relative}.voiceBtn{width:48px;height:48px;padding:0;font-size:21px;background:#eef1f5;color:#20242a;border:1px solid #ccd2da}.voiceBtn.recording{background:#d93845;color:#fff;border-color:#d93845;font-size:16px}.voiceStatus{grid-area:voiceStatus;display:flex;align-items:center;gap:8px;min-width:0;font-size:12px;color:#68717d}.voiceStatus[hidden]{display:none}.voiceRecDot{width:8px;height:8px;border-radius:50%;background:#e03b48;box-shadow:0 0 0 3px rgba(224,59,72,.12);animation:qvikRecPulse 1s ease-in-out infinite}.voiceCancelBtn{margin-left:auto;width:28px;height:28px;padding:0;border-radius:50%;background:transparent;color:inherit;border:1px solid currentColor;opacity:.7}.voiceAttachment{display:flex;align-items:center;gap:10px;min-width:210px;max-width:330px;margin-top:6px}.voicePlayBtn{flex:0 0 38px;width:38px;height:38px;padding:0;border-radius:50%;font-size:15px}.voicePlayBody{flex:1;min-width:0}.voicePlayBar{height:4px;border-radius:999px;background:rgba(110,125,140,.25);overflow:hidden;cursor:pointer}.voicePlayBarFill{display:block;width:0;height:100%;background:currentColor;transition:width .08s linear}.voicePlayMeta{display:flex;justify-content:space-between;gap:10px;margin-top:5px;font-size:11px;opacity:.76}.msg.mine .voicePlayBtn{background:rgba(255,255,255,.20)}html[data-theme="light"] .voicePlayBtn{background:#e8eeee;color:#1b655b}html[data-theme="dark"] .voiceBtn,html[data-theme="color"] .voiceBtn{background:#202c38;color:#e8edf2;border-color:#3a4b5d}@keyframes qvikRecPulse{50%{opacity:.35;transform:scale(.8)}}
.composer{grid-template-columns:48px 48px 48px minmax(0,1fr) auto;grid-template-areas:"attach emoji voice text send" "status status status status status" "voiceStatus voiceStatus voiceStatus voiceStatus voiceStatus"}
@media(max-width:720px){.composer{grid-template-columns:44px 44px 44px minmax(0,1fr);grid-template-areas:"text text text text" "attach emoji voice send" "status status status status" "voiceStatus voiceStatus voiceStatus voiceStatus"}.voiceBtn{width:44px;height:44px}.voiceAttachment{max-width:min(300px,100%)}}
@media(max-width:480px){.voiceAttachment{min-width:190px;max-width:100%}.voiceBtn{width:44px;height:44px}}

/* 2026.33.50 — composer capabilities */
.sendPrefsBox{margin:16px 0;padding:12px;border:1px solid #dce2e9;border-radius:10px;background:#f8fafc;text-align:left}
.sendPrefsBox h3{margin:0 0 10px}
.subCheckRow{margin-left:27px;font-size:13px}
.checkRow.disabled{opacity:.42;cursor:default}
.checkRow.disabled span{cursor:default}
html[data-theme="dark"] .sendPrefsBox,html[data-theme="color"] .sendPrefsBox{background:#111b25;border-color:var(--q-line);color:var(--q-text)}
html[data-theme="light"] .sendPrefsBox{background:#f7f8f9;border-color:#e4e7ea;color:var(--q-text)}
html[data-theme="light"] .sendPrefsBox input{accent-color:#1aa88c}
.imageNoPreview{cursor:default;gap:9px;flex-wrap:wrap}
.imageNoPreview .fileInfo{flex:1 1 140px}
.imageNoPreviewActions{display:flex;gap:6px;margin-left:auto}
.imageNoPreviewActions button{padding:6px 9px;font-size:12px;white-space:nowrap}
html[data-theme="dark"] .imageNoPreview .secondaryBtn,html[data-theme="color"] .imageNoPreview .secondaryBtn{background:#202c38;color:#e8edf2;border-color:#3a4b5d}
@media(max-width:480px){.subCheckRow{margin-left:18px}.imageNoPreviewActions{width:100%;margin-left:31px}.imageNoPreviewActions button{flex:1}}

/* 2026.33.52 — definitive mobile composer layout incl. voice button */
@media (max-width:720px){
  .composer{
    display:grid !important;
    grid-template-columns:44px 44px 44px minmax(0,1fr) !important;
    grid-template-rows:auto auto auto 48px auto auto auto !important;
    column-gap:7px !important;
    row-gap:7px !important;
    align-items:stretch !important;
  }
  .composer .replyComposer{grid-column:1/5 !important;grid-row:1 !important}
  .composer .pastePreview{grid-column:1/5 !important;grid-row:2 !important}
  .composer .textWrap{grid-column:1/5 !important;grid-row:3 !important}
  .composer .attachWrap{grid-column:1 !important;grid-row:4 !important;width:44px !important;min-width:44px !important;max-width:44px !important}
  .composer .emojiWrap{grid-column:2 !important;grid-row:4 !important;width:44px !important;min-width:44px !important;max-width:44px !important}
  .composer .voiceWrap{grid-column:3 !important;grid-row:4 !important;width:44px !important;min-width:44px !important;max-width:44px !important;position:relative !important;margin:0 !important}
  .composer .attachBtn,.composer .emojiBtn,.composer .voiceBtn{width:44px !important;min-width:44px !important;max-width:44px !important;height:48px !important;min-height:48px !important;margin:0 !important;padding:0 !important;display:flex !important;align-items:center !important;justify-content:center !important}
  .composer #sendBtn{grid-column:4 !important;grid-row:4 !important;width:100% !important;min-width:0 !important;height:48px !important;min-height:48px !important;margin:0 !important}
  .composer .fileStatus{grid-column:1/5 !important;grid-row:5 !important}
  .composer .voiceStatus{grid-column:1/5 !important;grid-row:6 !important}
}
@media (max-width:380px){
  .composer{grid-template-columns:40px 40px 40px minmax(0,1fr) !important;column-gap:5px !important}
  .composer .attachWrap,.composer .emojiWrap,.composer .voiceWrap,
  .composer .attachBtn,.composer .emojiBtn,.composer .voiceBtn{width:40px !important;min-width:40px !important;max-width:40px !important}
  .composer #sendBtn{padding-left:6px !important;padding-right:6px !important;font-size:13px !important}
}
\n\n/* 2026.33.57 — mobile message feed scroll rebuilt for stable touch scrolling */\n.messages{scroll-behavior:auto;overflow-anchor:none}\n@media (max-width:720px){\n  .messages{\n    overflow-y:auto !important;\n    overflow-x:hidden !important;\n    overscroll-behavior-y:contain;\n    -webkit-overflow-scrolling:touch;\n    touch-action:pan-y;\n    scroll-behavior:auto !important;\n  }\n  .messages .msg{overflow-anchor:none}\n}\n
/* 2026.33.59 — compact one-line composer textarea with growth up to 10 lines */
.composer textarea{
  min-height:48px;
  height:48px;
  max-height:none;
  line-height:20px;
  overflow-y:hidden;
}
.textWrap textarea{
  padding:13px 66px 13px 11px;
}
.charCount{
  right:9px;
  bottom:50%;
  transform:translateY(50%);
  white-space:nowrap;
}
@media(max-width:720px){
  .composer textarea{
    min-height:48px !important;
    height:48px;
    line-height:20px;
  }
  .textWrap textarea{padding:13px 64px 13px 11px}
}


/* 2026.33.61 — paginated chat history + loading skeletons */
.messages{position:relative}
.historySkeleton{display:flex;flex-direction:column;gap:10px;width:100%;padding:4px 0;pointer-events:none}
.historySkeleton.compact{gap:7px;padding:4px 0 8px}
.historySkeletonBubble{height:48px;max-width:78%;border-radius:13px;background:linear-gradient(100deg,#e4e8ed 20%,#f1f3f6 38%,#e4e8ed 56%);background-size:220% 100%;animation:qvikHistoryShimmer 1.25s linear infinite;box-shadow:0 1px 3px #0000000a}
.historySkeletonBubble.mine{margin-left:auto}
.historySkeleton.compact .historySkeletonBubble{height:34px;max-width:68%;opacity:.85}
.historyLoadError{margin:auto;padding:16px 18px;max-width:360px;text-align:center;color:#8b4b4b;font-size:13px}
@keyframes qvikHistoryShimmer{0%{background-position:200% 0}100%{background-position:-20% 0}}
html[data-theme="dark"] .historySkeletonBubble,html[data-theme="color"] .historySkeletonBubble{background:linear-gradient(100deg,#182533 20%,#263747 38%,#182533 56%);background-size:220% 100%;box-shadow:0 1px 2px #0004}
html[data-theme="dark"] .historyLoadError,html[data-theme="color"] .historyLoadError{color:#d98c8c}
html[data-theme="light"] .historySkeletonBubble{background:linear-gradient(100deg,#e5e9ed 20%,#f5f7f8 38%,#e5e9ed 56%);background-size:220% 100%}
@media(max-width:720px){.historySkeletonBubble{height:44px}.historySkeleton{gap:8px}.historySkeleton.compact .historySkeletonBubble{height:30px}}

/* 2026.33.62 — locked composer while a text/caption message is being sent */
#sendBtn.sending,
#sendBtn.sending:disabled{
  opacity:1 !important;
  cursor:wait !important;
  color:#fff !important;
  background:linear-gradient(105deg,#245fcf 18%,#5b91f2 38%,#245fcf 58%) !important;
  background-size:240% 100% !important;
  animation:qvikSendShimmer .95s linear infinite !important;
  box-shadow:none !important;
}
html[data-theme="color"] #sendBtn.sending,
html[data-theme="color"] #sendBtn.sending:disabled{
  background:linear-gradient(105deg,#6552d9 18%,#3388ef 40%,#6552d9 62%) !important;
  background-size:240% 100% !important;
}
html[data-theme="light"] #sendBtn.sending,
html[data-theme="light"] #sendBtn.sending:disabled{
  background:linear-gradient(105deg,#15967f 18%,#42b8b4 38%,#278ed2 58%,#15967f 78%) !important;
  background-size:260% 100% !important;
}
.composer textarea[aria-busy="true"]{
  cursor:wait;
  opacity:.82;
}
@keyframes qvikSendShimmer{0%{background-position:190% 0}100%{background-position:-55% 0}}
@media (prefers-reduced-motion:reduce){#sendBtn.sending{animation:none !important}}


/* 2026.34.2 — live microphone visualizer inside the STOP button */
.voiceBtn{position:relative;overflow:hidden;isolation:isolate}
.voiceBtnGlyph{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none}
.voiceViz{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;z-index:1;pointer-events:none;border-radius:inherit}
.voiceBtn.recording .voiceBtnGlyph{opacity:0}
.voiceBtn.recording .voiceViz{opacity:1}
.voiceBtn.recording::after{
  content:"";
  position:absolute;
  z-index:4;
  left:50%;top:46%;
  width:9px;height:9px;
  transform:translate(-50%,-50%);
  border-radius:2px;
  background:#fff;
  box-shadow:0 0 0 4px rgba(91,9,18,.30),0 1px 3px rgba(0,0,0,.24);
  pointer-events:none;
}
.voiceBtn.recording{background:#b92f3d;color:#fff;border-color:#d94b58}
html[data-theme="dark"] .voiceBtn.recording,html[data-theme="color"] .voiceBtn.recording{background:#a92735;border-color:#d94b58;color:#fff}
html[data-theme="light"] .voiceBtn.recording{background:#c83b48;border-color:#d95b66;color:#fff}
@media (prefers-reduced-motion:reduce){.voiceViz{transition:none}}


/* 2026.34.3 — voice loudness analysis / normalization metadata */
.voiceNormInfo{font-weight:650;opacity:.92;white-space:nowrap}
html[data-theme="light"] .voiceNormInfo{color:#176f63}
html[data-theme="dark"] .voiceNormInfo,html[data-theme="color"] .voiceNormInfo{color:#b9d9ff}

/* 2026.34.4 — listen to a voice note before sending */
.voicePreview{grid-area:voicePreview;display:flex;align-items:center;gap:9px;min-width:0;padding:8px 9px;border-radius:12px;border:1px solid #d5dbe2;background:#f5f7f9}
.voicePreview[hidden]{display:none}
.voicePreviewPlayBtn{flex:0 0 36px;width:36px;height:36px;padding:0;border-radius:50%;font-size:14px}
.voicePreviewBody{flex:1;min-width:0}
.voicePreviewBar{height:5px;border-radius:999px;background:rgba(110,125,140,.23);overflow:hidden;cursor:pointer}
.voicePreviewBarFill{display:block;width:0;height:100%;background:currentColor;transition:width .08s linear}
.voicePreviewMeta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:5px;font-size:11px;opacity:.76;min-width:0}
.voicePreviewMeta>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voicePreviewStats{margin-top:3px;font-size:10px;line-height:1.25;opacity:.58;white-space:normal;overflow-wrap:anywhere}
.voicePreviewSendBtn{flex:0 0 auto;height:36px;padding:0 12px;font-size:12px}
.voicePreviewDeleteBtn{flex:0 0 30px;width:30px;height:30px;padding:0;border-radius:50%;background:transparent;color:inherit;border:1px solid currentColor;opacity:.68}
html[data-theme="dark"] .voicePreview,html[data-theme="color"] .voicePreview{background:#111b25;border-color:var(--q-line);color:var(--q-text)}
html[data-theme="light"] .voicePreview{background:#f6f8f9;border-color:#e0e5e8;color:var(--q-text)}
html[data-theme="dark"] .voicePreviewPlayBtn,html[data-theme="color"] .voicePreviewPlayBtn{background:#263748;color:#fff}
html[data-theme="light"] .voicePreviewPlayBtn{background:#e4eeec;color:#176f63}
.composer{grid-template-areas:"attach emoji voice text send" "status status status status status" "voiceStatus voiceStatus voiceStatus voiceStatus voiceStatus" "voicePreview voicePreview voicePreview voicePreview voicePreview"}
@media(max-width:720px){
  .composer{grid-template-areas:"text text text text" "attach emoji voice send" "status status status status" "voiceStatus voiceStatus voiceStatus voiceStatus" "voicePreview voicePreview voicePreview voicePreview"}
  .composer .voicePreview{grid-column:1/5 !important;grid-row:7 !important}
}
@media(max-width:480px){.voicePreview{gap:7px;padding:7px}.voicePreviewSendBtn{padding:0 9px}.voicePreviewMeta{font-size:10px}}

/* 2026.34.7 — читаемость блока «О себе» в профиле собеседника */
.profileAbout{color:#20242a}
html[data-theme="dark"] .profileAbout,
html[data-theme="color"] .profileAbout{
  background:#111b25;
  color:var(--q-text);
  border-color:var(--q-line);
}
html[data-theme="dark"] .profileAboutTitle,
html[data-theme="color"] .profileAboutTitle{
  color:var(--q-muted);
}
html[data-theme="light"] .profileAbout{
  background:rgba(255,255,255,.94);
  color:var(--q-text);
  border-color:var(--q-line);
}
html[data-theme="light"] .profileAboutTitle{
  color:var(--q-muted);
}

/* 2026.34.8 — compact mobile composer vertical spacing */
@media (max-width:720px){
  /* Empty grid rows must not leave vertical gaps around the composer. */
  .composer{
    row-gap:0 !important;
    padding-top:2px !important;
    padding-left:8px !important;
    padding-right:8px !important;
    padding-bottom:max(4px, calc(env(safe-area-inset-bottom, 0px) - 8px)) !important;
  }
  /* Keep only intentional spacing between elements that are actually visible. */
  .composer .replyComposer:not([hidden]),
  .composer .pastePreview:not([hidden]){margin-bottom:6px !important}
  .composer .textWrap{margin-bottom:6px !important}
  .composer .fileStatus:not(:empty){margin-top:5px !important}
  .composer .voiceStatus:not([hidden]){margin-top:5px !important}
  .composer .voicePreview:not([hidden]){margin-top:6px !important}

  /* Bring the last message closer to the composer without touching side padding. */
  .messages{padding-bottom:2px !important}
  .messages>.msg:last-child{margin-bottom:0 !important}
}
@media (max-width:380px){
  .composer{
    padding-left:6px !important;
    padding-right:6px !important;
  }
}


/* 2026.34.9 — single-row mobile composer: attachment | text | voice | send */
@media (max-width:720px){
  .composer{
    grid-template-columns:48px minmax(0,1fr) 48px 48px !important;
    grid-template-rows:auto auto 48px auto auto auto !important;
    column-gap:6px !important;
    row-gap:0 !important;
    align-items:stretch !important;
  }
  .composer .replyComposer{
    grid-column:1/5 !important;
    grid-row:1 !important;
  }
  .composer .pastePreview{
    grid-column:1/5 !important;
    grid-row:2 !important;
  }
  .composer .attachWrap{
    grid-column:1 !important;
    grid-row:3 !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    margin:0 !important;
  }
  .composer .textWrap{
    grid-column:2 !important;
    grid-row:3 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }
  .composer .emojiWrap{
    display:none !important;
  }
  .composer .voiceWrap{
    grid-column:3 !important;
    grid-row:3 !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    margin:0 !important;
  }
  .composer #sendBtn{
    grid-column:4 !important;
    grid-row:3 !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:48px !important;
    min-height:48px !important;
    padding:0 !important;
    margin:0 !important;
    overflow:hidden !important;
    font-size:0 !important;
    line-height:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .composer #sendBtn::before{
    content:'➤';
    display:block;
    font-size:22px;
    line-height:1;
    transform:translateX(1px);
  }
  .composer .attachBtn,
  .composer .voiceBtn{
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:48px !important;
    min-height:48px !important;
    margin:0 !important;
    padding:0 !important;
  }
  .composer textarea{
    height:48px !important;
    min-height:48px !important;
  }
  .composer .fileStatus{
    grid-column:1/5 !important;
    grid-row:4 !important;
  }
  .composer .voiceStatus{
    grid-column:1/5 !important;
    grid-row:5 !important;
  }
  .composer .voicePreview{
    grid-column:1/5 !important;
    grid-row:6 !important;
  }
}
@media (max-width:380px){
  .composer{
    grid-template-columns:44px minmax(0,1fr) 44px 44px !important;
    column-gap:5px !important;
  }
  .composer .attachWrap,
  .composer .voiceWrap,
  .composer .attachBtn,
  .composer .voiceBtn,
  .composer #sendBtn{
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
  }
}

/* 2026.34.10 — mobile contextual action: voice when empty, send when text exists */
@media (max-width:720px){
  .composer{
    grid-template-columns:48px minmax(0,1fr) 48px !important;
    grid-template-rows:auto auto 48px auto auto auto !important;
  }
  .composer .replyComposer,
  .composer .pastePreview,
  .composer .fileStatus,
  .composer .voiceStatus,
  .composer .voicePreview{grid-column:1/4 !important}
  .composer .attachWrap{grid-column:1 !important;grid-row:3 !important}
  .composer .textWrap{grid-column:2 !important;grid-row:3 !important}
  .composer .voiceWrap,
  .composer #sendBtn{grid-column:3 !important;grid-row:3 !important}
  .composer .voiceWrap{display:block !important}
  .composer #sendBtn{display:none !important}
  .composer.mobile-send-active .voiceWrap{display:none !important}
  .composer.mobile-send-active #sendBtn{display:flex !important}
  .composer .charCount{display:none !important}
  .composer .textWrap textarea{
    padding:13px 11px !important;
  }
  .composer .fileStatus{grid-row:4 !important}
  .composer .voiceStatus{grid-row:5 !important}
  .composer .voicePreview{grid-row:6 !important}
}
@media (max-width:380px){
  .composer{grid-template-columns:44px minmax(0,1fr) 44px !important}
}


/* 2026.34.11 — staged attachments and contextual mobile composer */
@media (max-width:720px){
  /* Empty: attachment | text | microphone. Active text/attachment: text expands left, send on right. */
  .composer.mobile-send-active .attachWrap{display:none !important}
  .composer.mobile-send-active .textWrap{grid-column:1/3 !important}
  .composer.mobile-send-active #sendBtn{grid-column:3 !important;display:flex !important}
  .composer.mobile-send-active .voiceWrap{display:none !important}
  .pastePreview.pendingFile{grid-template-columns:minmax(0,1fr) 34px !important}
  .pastePreview.pendingFile .pastePreviewInfo::before{content:"📎";margin-right:7px}
}

/* 2026.34.13 — clean image previews + bidirectional swipe-to-close image viewer */
.imageAttachmentPreviewOnly{background:transparent !important;border:0 !important;border-radius:10px;margin-top:7px;box-shadow:none;overflow:hidden}
.imageAttachmentPreviewOnly .chatImageOpen{border-radius:10px;min-height:110px}
.imageCaption{margin-top:7px;white-space:pre-wrap;overflow-wrap:anywhere}
.imageViewer{background:rgba(0,0,0,.93);transition:background-color .16s ease,opacity .18s ease}
.imageViewerCanvas img{will-change:transform;transform-origin:center center;transition:none}
.imageViewerCanvas img.imageViewerReturning{transition:transform .20s cubic-bezier(.2,.8,.2,1)}
.imageViewer.imageViewerClosing{opacity:0;pointer-events:none}
.imageViewerInfo{padding:8px 10px}.imageFileInfoModal{z-index:190}
@media(max-width:720px){
  .imageViewerCanvas{touch-action:pan-x pinch-zoom;overscroll-behavior:contain;overflow:hidden}
  .imageViewerCanvas img{max-width:100%;max-height:100%;touch-action:none}
  .imageViewerTop>span{display:none}
  .imageViewerActions{margin-left:auto}
  .imageViewerActions .imageViewerInfo,.imageViewerActions .imageViewerDownload{padding:8px 9px;font-size:12px}
}

/* 2026.34.16 — HACKER / CRT terminal theme */
html[data-theme="hacker"]{
  --q-bg:#020704;
  --q-panel:#041009;
  --q-panel2:#06170d;
  --q-line:#0a7f39;
  --q-text:#35ff72;
  --q-muted:#12a84c;
  --q-in:#031108;
  --q-own:#07391b;
  --q-blue:#00ff66;
  --q-purple:#7dff9e;
  --q-hacker:#00ff66;
  --q-hacker-dim:#0ba446;
  --q-hacker-deep:#001f0c;
  color-scheme:dark;
}
html[data-theme="hacker"],html[data-theme="hacker"] body,
html[data-theme="hacker"] button,html[data-theme="hacker"] input,html[data-theme="hacker"] textarea,
html[data-theme="hacker"] select,html[data-theme="hacker"] .app{
  font-family:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono","Courier New",monospace !important;
}
html[data-theme="hacker"] body{
  background:#020704;
  color:var(--q-text);
  text-shadow:0 0 4px rgba(0,255,102,.22);
}
html[data-theme="hacker"] body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:repeating-linear-gradient(to bottom,rgba(0,255,90,.025) 0,rgba(0,255,90,.025) 1px,transparent 1px,transparent 4px);
  mix-blend-mode:screen;
}
html[data-theme="hacker"] ::selection{background:#00ff66;color:#001506;text-shadow:none}
html[data-theme="hacker"] *{scrollbar-color:#0aa746 #031108;scrollbar-width:thin}
html[data-theme="hacker"] *::-webkit-scrollbar{width:8px;height:8px}
html[data-theme="hacker"] *::-webkit-scrollbar-track{background:#031108}
html[data-theme="hacker"] *::-webkit-scrollbar-thumb{background:#0aa746;border:2px solid #031108;border-radius:0}

html[data-theme="hacker"] .app{background:#020704;color:var(--q-text)}
html[data-theme="hacker"] .app aside{background:#030c07;border-right:1px solid #0a6c32;box-shadow:inset -1px 0 0 #002d13}
html[data-theme="hacker"] .me{background:#020a05;color:#4aff80;border-bottom:1px solid #087337}
html[data-theme="hacker"] .me small,html[data-theme="hacker"] .contact small,html[data-theme="hacker"] .presenceText,
html[data-theme="hacker"] .hint,html[data-theme="hacker"] .aboutCount,html[data-theme="hacker"] .emptySide{color:#12a84c}
html[data-theme="hacker"] .sectionTitle{background:#001d0b;color:#00d957;border-color:#075f2d;letter-spacing:.08em;text-transform:uppercase}
html[data-theme="hacker"] .sectionTitle::before{content:"// ";color:#087d39}
html[data-theme="hacker"] .contact{border-color:#052f17;color:#27ed68;background:#020804}
html[data-theme="hacker"] .contact:hover{background:#042513}
html[data-theme="hacker"] .contact.active{background:#06351a;box-shadow:inset 3px 0 0 #00ff66;color:#7dff9e}
html[data-theme="hacker"] .contact.active .dialogLine::before{content:">";color:#00ff66;margin-right:5px}
html[data-theme="hacker"] .badge{background:#00ff66;color:#001707;border-radius:0;font-weight:800;box-shadow:0 0 8px #00ff6666}
html[data-theme="hacker"] .dialogAvatar,html[data-theme="hacker"] .chatAvatar{background:#001b0c;border:1px solid #0ab54c;box-shadow:0 0 7px #00ff663d}
html[data-theme="hacker"] .dialogAvatarPlaceholder{background:#002812;color:#4aff80}

html[data-theme="hacker"] .chatHead{background:#020a05;border-bottom:1px solid #0a7f39;color:#48ff80;box-shadow:0 1px 0 #001f0d,inset 0 -8px 18px #001b0a55}
html[data-theme="hacker"] .chatHead::after{content:"[SECURE_LINK]";margin-left:auto;padding-left:10px;font-size:10px;font-weight:600;letter-spacing:.08em;color:#087d39;white-space:nowrap}
html[data-theme="hacker"] .profileButton{color:#42ff7c;background:transparent;box-shadow:none}
html[data-theme="hacker"] .mobileBackBtn{background:#001b0c;color:#35ff72;border:1px solid #0a8c3e;border-radius:0;box-shadow:none}
html[data-theme="hacker"] .messages{
  background-color:#010603;
  background-image:linear-gradient(rgba(0,255,85,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,85,.018) 1px,transparent 1px),radial-gradient(circle at 50% 15%,rgba(0,255,102,.055),transparent 45%);
  background-size:4px 4px,40px 40px,100% 100%;
}
html[data-theme="hacker"] .msg{background:#031108;color:#31ef6b;border:1px solid #075d2b;border-radius:2px;box-shadow:0 0 0 1px #001708,0 0 12px rgba(0,255,102,.045);text-shadow:0 0 3px rgba(0,255,102,.18)}
html[data-theme="hacker"] .msg.mine{background:#073219;color:#79ff9e;border-color:#0fb653;box-shadow:0 0 10px rgba(0,255,102,.09)}
html[data-theme="hacker"] .msg time{color:#0e9a43}
html[data-theme="hacker"] .dayDivider{color:#0db54c}
html[data-theme="hacker"] .dayDivider span{background:#001b0c;border:1px solid #087f39;border-radius:0;padding:3px 8px;box-shadow:0 0 8px #00ff6614}
html[data-theme="hacker"] .replyQuote{background:#001c0c;color:#35ff72;border-left:2px solid #00ff66;border-radius:0}
html[data-theme="hacker"] .replyQuote b{color:#83ffa5}
html[data-theme="hacker"] .msg.mine .replyQuote{background:#001708;color:#79ff9e;border-left-color:#42ff7c}
html[data-theme="hacker"] .replyComposer{background:#001a0b;color:#42ff7c;border-left-color:#00ff66;border-radius:0}

html[data-theme="hacker"] .composer{background:#020a05;border-top:1px solid #0a7f39;box-shadow:0 -1px 12px rgba(0,255,102,.045)}
html[data-theme="hacker"] textarea,html[data-theme="hacker"] input{background:#010904;color:#51ff82;border:1px solid #087d39;border-radius:0;caret-color:#00ff66;box-shadow:inset 0 0 12px rgba(0,255,102,.035)}
html[data-theme="hacker"] textarea::placeholder,html[data-theme="hacker"] input::placeholder{color:#087a38;opacity:1}
html[data-theme="hacker"] textarea:focus,html[data-theme="hacker"] input:focus{outline:none;border-color:#00ff66;box-shadow:0 0 0 1px #00ff6655,inset 0 0 14px rgba(0,255,102,.06)}
html[data-theme="hacker"] button{background:#00220f;color:#3dff77;border:1px solid #0b9c45;border-radius:0;box-shadow:inset 0 0 12px rgba(0,255,102,.035),0 0 7px rgba(0,255,102,.04);text-shadow:0 0 4px rgba(0,255,102,.25)}
html[data-theme="hacker"] button:hover:not(:disabled){background:#07371a;border-color:#00ff66;color:#8affaa;box-shadow:0 0 10px rgba(0,255,102,.15)}
html[data-theme="hacker"] button:disabled{opacity:.34}
html[data-theme="hacker"] .attachBtn,html[data-theme="hacker"] .emojiBtn,html[data-theme="hacker"] .voiceBtn{background:#00180a;color:#35ff72;border-color:#0a7f39;border-radius:0}
html[data-theme="hacker"] .voiceBtn.recording{background:#063218 !important;border-color:#35ff72 !important;color:#baffca !important;box-shadow:inset 0 0 18px #00ff6628,0 0 9px #00ff6630}
html[data-theme="hacker"] .voiceViz{filter:hue-rotate(80deg) saturate(1.5) brightness(1.35)}
html[data-theme="hacker"] #sendBtn.sending,html[data-theme="hacker"] #sendBtn.sending:disabled{background:linear-gradient(90deg,#00260f 0%,#0b6f32 50%,#00260f 100%);background-size:220% 100%;animation:qvikSendShimmer 1.1s linear infinite;color:#baffcc;border-color:#1aff70}
html[data-theme="hacker"] .charCount{color:#0a8c3e}
html[data-theme="hacker"] .fileStatus,html[data-theme="hacker"] .voiceStatus{color:#16bc50}

html[data-theme="hacker"] .fileCard,html[data-theme="hacker"] .imageAttachment,html[data-theme="hacker"] .imageNoPreview{background:#031108;color:#39ef70;border:1px solid #075d2b;border-radius:0}
html[data-theme="hacker"] .msg.mine .fileCard{background:#052814;color:#75ff99;border-color:#0d9844}
html[data-theme="hacker"] .fileInfo small{color:#0d9942}
html[data-theme="hacker"] .fileProgress{background:#001407;border-radius:0}
html[data-theme="hacker"] .fileProgressBar{background:#00ff66;box-shadow:0 0 8px #00ff6666}
html[data-theme="hacker"] .pastePreview{background:#001509;color:#42ff7b;border:1px solid #087b38;border-radius:0}
html[data-theme="hacker"] .imageAttachmentPreviewOnly{border-radius:0 !important;filter:saturate(.82) contrast(1.04)}
html[data-theme="hacker"] .imageAttachmentPreviewOnly .chatImageOpen{border-radius:0}
html[data-theme="hacker"] .imageCaption{color:#50ff82}

html[data-theme="hacker"] .modal{background:rgba(0,5,2,.88);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-theme="hacker"] .modalBox{background:#020a05;color:#36ef70;border:1px solid #0aa547;border-radius:0;box-shadow:0 0 0 1px #001909,0 0 34px rgba(0,255,102,.13)}
html[data-theme="hacker"] .modalBox h2,html[data-theme="hacker"] .modalBox h3{color:#75ff99;text-transform:uppercase;letter-spacing:.04em}
html[data-theme="hacker"] .modalBox h2::before{content:"[ ";color:#0a8e3e}html[data-theme="hacker"] .modalBox h2::after{content:" ]";color:#0a8e3e}
html[data-theme="hacker"] .modalBox hr{border-top-color:#075d2b}
html[data-theme="hacker"] .modalClose{background:#001509;color:#3cff76;border:1px solid #0a8f3e;border-radius:0;box-shadow:none}
html[data-theme="hacker"] .privacyBox,html[data-theme="hacker"] .themeBox,html[data-theme="hacker"] .sendPrefsBox{background:#001006;border:1px solid #075f2c;border-radius:0;color:#36ef70}
html[data-theme="hacker"] .radioRow input,html[data-theme="hacker"] .checkRow input{accent-color:#00ff66}
html[data-theme="hacker"] .fieldLabel{color:#5dff8c;text-transform:uppercase;font-size:12px;letter-spacing:.05em}
html[data-theme="hacker"] .secondaryBtn{background:#001207;color:#36ef70;border:1px solid #087b38;border-radius:0;box-shadow:none}
html[data-theme="hacker"] .contextMenu{background:#020a05;border:1px solid #0a8f3f;border-radius:0;box-shadow:0 0 22px rgba(0,255,102,.12)}
html[data-theme="hacker"] .contextMenu button{background:transparent;color:#35ef6d;border:0;border-bottom:1px solid #04341a;border-radius:0;box-shadow:none;text-align:left}
html[data-theme="hacker"] .contextMenu button:hover{background:#052714}
html[data-theme="hacker"] .contextMenu button.danger{color:#ff5c6a;text-shadow:0 0 4px #ff243c44}

html[data-theme="hacker"] .profileAbout{background:#001107 !important;color:#42ff7a !important;border:1px solid #087837 !important;border-radius:0 !important}
html[data-theme="hacker"] .profileAboutTitle{color:#7cff9d !important}
html[data-theme="hacker"] .messageInfoRows,html[data-theme="hacker"] .messageInfoRow{border-color:#075c2a}
html[data-theme="hacker"] .messageInfoRow span{color:#0fa347}
html[data-theme="hacker"] .inviteKeyRow{background:#001308;color:#45ff7b;border:1px solid #087a37;border-radius:0}
html[data-theme="hacker"] .inviteKeyRow.used{background:#052a15;color:#7cff9d;border-color:#10a64a}

html[data-theme="hacker"] .historySkeletonBubble{background:linear-gradient(100deg,#021008 20%,#0a4a23 38%,#021008 56%);background-size:220% 100%;border:1px solid #074e25;border-radius:1px;box-shadow:none}
html[data-theme="hacker"] .historyLoadError{color:#ff6271}
html[data-theme="hacker"] .voicePreview{background:#001107;border:1px solid #087a37;border-radius:0;color:#45ff7c}
html[data-theme="hacker"] .voicePreviewPlayBtn{background:#002411;color:#61ff8e;border-color:#0b9d45}
html[data-theme="hacker"] .voicePreviewBar,html[data-theme="hacker"] .voicePlayBar{background:#001407;border-radius:0}
html[data-theme="hacker"] .voicePreviewBarFill,html[data-theme="hacker"] .voicePlayBarFill{background:#00ff66;box-shadow:0 0 8px #00ff6670}
html[data-theme="hacker"] .voiceNormInfo,html[data-theme="hacker"] .voicePreviewStats{color:#16bc50}

html[data-theme="hacker"] .chatAvatar.polling-active{--qvik-avatar-pulse:#00ff66}
html[data-theme="hacker"] .chatSyncStatus.sync-ok{background:#00ff66;box-shadow:0 0 0 2px #020704,0 0 10px #00ff66}
html[data-theme="hacker"] .chatSyncStatus.sync-error{color:#ff3045;text-shadow:0 0 7px #ff304577}

html[data-theme="hacker"] .imageViewer{background:rgba(0,4,2,.97)}
html[data-theme="hacker"] .imageViewerTop{background:linear-gradient(#001b0d,#020704);border-bottom:1px solid #087a37;color:#42ff7b}
html[data-theme="hacker"] .imageViewerActions button{background:#00170a;color:#48ff7e;border:1px solid #087b38;border-radius:0}
html[data-theme="hacker"] .imageViewerCanvas{background:#000}

@media(max-width:720px){
  html[data-theme="hacker"] .composer{background:#020a05}
  html[data-theme="hacker"] .chatHead::after{content:"LINK";font-size:9px}
  html[data-theme="hacker"] .msg{border-radius:1px}
}

/* 2026.34.17 — immersive mobile image viewer: tap UI toggle, pan / pinch / rotate */
@media(max-width:720px),(pointer:coarse){
  .imageViewer{transition:grid-template-rows .18s ease,background-color .18s ease,opacity .18s ease}
  .imageViewerTop{overflow:hidden;transition:opacity .16s ease,transform .18s ease,min-height .18s ease,padding .18s ease,border-color .18s ease}
  .imageViewerCanvas{transition:padding .18s ease;touch-action:none;overscroll-behavior:none}
  .imageViewerCanvas img{transform-origin:center center;will-change:transform;backface-visibility:hidden}
  .imageViewerCanvas img.imageViewerTransforming{transition:transform .20s cubic-bezier(.2,.8,.2,1)}
  .imageViewer.imageViewerImmersive{grid-template-rows:0 minmax(0,1fr);background:#000!important}
  .imageViewer.imageViewerImmersive .imageViewerTop{min-height:0;height:0;padding-top:0;padding-bottom:0;opacity:0;transform:translateY(-12px);pointer-events:none;border-color:transparent}
  .imageViewer.imageViewerImmersive .imageViewerCanvas{padding:0;overflow:hidden;touch-action:none;display:grid;place-items:center;background:#000}
  .imageViewer.imageViewerImmersive .imageViewerCanvas img{max-width:100vw;max-height:100vh;width:auto;height:auto;object-fit:contain}
}

/* 2026.34.19 — mobile keyboard follows the visual viewport + jump-to-latest control */
.app main{position:relative}
.jumpToBottomBtn{display:none}
@media(max-width:720px){
  /* Keep the whole chat inside the *visible* viewport when the OS keyboard opens. */
  .app{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    top:var(--vv-top,0px) !important;
    height:var(--app-height) !important;
    max-height:var(--app-height) !important;
  }
  .jumpToBottomBtn{
    position:absolute;
    right:14px;
    bottom:calc(var(--composer-height,58px) + 10px);
    z-index:24;
    width:42px;
    height:42px;
    padding:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    line-height:1;
    font-weight:700;
    background:#2764d8;
    color:#fff;
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 5px 18px rgba(0,0,0,.28);
    opacity:0;
    transform:translateY(8px) scale(.92);
    pointer-events:none;
    transition:opacity .16s ease,transform .16s ease,background .16s ease;
  }
  .jumpToBottomBtn.visible{opacity:.96;transform:translateY(0) scale(1);pointer-events:auto}
  html[data-theme="dark"] .jumpToBottomBtn{background:#25394d;color:#dceaf7;border-color:#3b556d}
  html[data-theme="color"] .jumpToBottomBtn{background:linear-gradient(145deg,#7b4de0,#2d8cff);color:#fff;border-color:#8da8ee}
  html[data-theme="light"] .jumpToBottomBtn{background:rgba(255,255,255,.96);color:#167f82;border-color:#c8dde0;box-shadow:0 5px 18px rgba(41,69,76,.18)}
  html[data-theme="hacker"] .jumpToBottomBtn{background:#020a05;color:#00ff66;border-color:#00c851;box-shadow:0 0 13px rgba(0,255,102,.28);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
}
@media(max-width:380px){.jumpToBottomBtn{right:10px;width:40px;height:40px;font-size:22px}}


/* 2026.34.20 — growing mobile composer + fullscreen editor control */
.composerExpandBtn{display:none}
@media(max-width:720px){
  /* The message row grows with textarea up to ten lines; action buttons remain at the bottom. */
  .composer{
    grid-template-rows:auto auto minmax(48px,auto) auto auto auto !important;
    align-items:stretch !important;
  }
  .composer .textWrap{align-self:stretch !important}
  .composer textarea{
    height:auto !important;
    min-height:48px !important;
    max-height:none !important;
    display:block !important;
    resize:none !important;
  }
  .composer .attachWrap,
  .composer .voiceWrap,
  .composer #sendBtn{align-self:end !important}
  .composerExpandBtn:not([hidden]){
    grid-column:3 !important;
    grid-row:3 !important;
    align-self:start !important;
    justify-self:stretch !important;
    display:flex !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:40px !important;
    min-height:40px !important;
    margin:0 !important;
    padding:0 !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:10px !important;
    font-size:22px !important;
    line-height:1 !important;
    z-index:8;
    background:#25394d;
    color:#dceaf7;
    border:1px solid #3b556d;
    box-shadow:0 3px 12px rgba(0,0,0,.18);
  }
  .composer.mobile-text-expanded .textWrap{min-height:0 !important}
  .composer.mobile-text-expanded textarea{overscroll-behavior:contain;touch-action:pan-y}
  html[data-theme="color"] .composerExpandBtn:not([hidden]){background:linear-gradient(145deg,#7550db,#2d8cff);color:#fff;border-color:#8da8ee}
  html[data-theme="light"] .composerExpandBtn:not([hidden]){background:rgba(255,255,255,.97);color:#167f82;border-color:#c8dde0;box-shadow:0 3px 12px rgba(41,69,76,.14)}
  html[data-theme="hacker"] .composerExpandBtn:not([hidden]){background:#020a05;color:#00ff66;border-color:#00c851;border-radius:0 !important;box-shadow:0 0 11px rgba(0,255,102,.22);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
}
@media(max-width:380px){
  .composer{grid-template-rows:auto auto minmax(44px,auto) auto auto auto !important}
  .composer textarea{min-height:44px !important}
  .composerExpandBtn:not([hidden]){width:44px !important;min-width:44px !important;max-width:44px !important;height:38px !important;min-height:38px !important}
}

/* 2026.34.24 — «Избранное» + закреплённые и перетаскиваемые диалоги */
.dialogTools{display:inline-flex;align-items:center;justify-content:flex-end;gap:5px;flex:0 0 auto;min-width:0}
.pinDragHandle{display:inline-flex;align-items:center;justify-content:center;width:22px;height:28px;margin:-5px -5px -5px 0;border-radius:6px;color:#7a8490;font:700 14px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:-3px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.pinDragHandle:active,.draggingDialog .pinDragHandle{cursor:grabbing}
.contact.pinnedDialog{position:relative}
.contact.pinnedDialog.draggingDialog{opacity:.58;transform:scale(.992);box-shadow:0 7px 18px #0002;z-index:7}
.contact.favoriteDialog{font-weight:600;border-top:1px solid #dfe5eb;border-bottom:1px solid #dfe5eb;background:#f8fbff}
.contact.favoriteDialog:hover,.contact.favoriteDialog.active{background:#edf5ff}
.dialogAvatar.favoriteAvatar{background:#e6f0ff;border-color:#b9d2f6}
.favoriteAvatarGlyph{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;font-size:22px;line-height:1;color:#2d6dcc;background:#f5f9ff}
html[data-theme="dark"] .contact.favoriteDialog,html[data-theme="color"] .contact.favoriteDialog{background:#111e2a;border-color:#293949;color:#eef5fb}
html[data-theme="dark"] .contact.favoriteDialog:hover,html[data-theme="dark"] .contact.favoriteDialog.active,html[data-theme="color"] .contact.favoriteDialog:hover,html[data-theme="color"] .contact.favoriteDialog.active{background:#182938}
html[data-theme="dark"] .dialogAvatar.favoriteAvatar,html[data-theme="color"] .dialogAvatar.favoriteAvatar{background:#172b3d;border-color:#315b7d}
html[data-theme="dark"] .favoriteAvatarGlyph,html[data-theme="color"] .favoriteAvatarGlyph{background:#20384c;color:#75b9ff}
html[data-theme="dark"] .pinDragHandle,html[data-theme="color"] .pinDragHandle{color:#9bb1c3}
html[data-theme="light"] .contact.favoriteDialog{background:linear-gradient(90deg,#f0fbf8,#f2f8fc);border-color:#dcebe7;color:#26313a}
html[data-theme="light"] .contact.favoriteDialog:hover,html[data-theme="light"] .contact.favoriteDialog.active{background:linear-gradient(90deg,#e6f7f1,#e8f3fa)}
html[data-theme="light"] .dialogAvatar.favoriteAvatar{background:#e6f6f1;border-color:#b9e0d5}
html[data-theme="light"] .favoriteAvatarGlyph{background:#f5fcfa;color:#159477}
html[data-theme="light"] .pinDragHandle{color:#74818b}
html[data-theme="hacker"] .contact.favoriteDialog{background:#00170a;border-color:#087c35;color:#63ff94;box-shadow:inset 3px 0 0 #00ff66}
html[data-theme="hacker"] .contact.favoriteDialog:hover,html[data-theme="hacker"] .contact.favoriteDialog.active{background:#00220e}
html[data-theme="hacker"] .dialogAvatar.favoriteAvatar{background:#001f0d;border-color:#00ff66;box-shadow:0 0 8px #00ff6655}
html[data-theme="hacker"] .favoriteAvatarGlyph{background:#002b12;color:#00ff66;text-shadow:0 0 7px #00ff66}
html[data-theme="hacker"] .pinDragHandle{color:#00d957;text-shadow:0 0 5px #00ff6655}
@media(max-width:720px){
  .pinDragHandle{width:28px;height:34px;margin:-7px -6px -7px 0;font-size:15px}
  .favoriteAvatarGlyph{width:40px;height:40px;font-size:23px}
}

/* 2026.34.29 — desktop composer: keep pending attachment/reply previews out of implicit grid columns */
@media (min-width:721px){
  .composer{
    grid-template-columns:48px 48px 48px minmax(0,1fr) auto !important;
    grid-template-areas:
      "reply reply reply reply reply"
      "preview preview preview preview preview"
      "attach emoji voice text send"
      "status status status status status"
      "voiceStatus voiceStatus voiceStatus voiceStatus voiceStatus"
      "voicePreview voicePreview voicePreview voicePreview voicePreview" !important;
  }
  .composer .replyComposer{
    grid-area:reply !important;
    grid-column:1/-1 !important;
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
  }
  .composer .pastePreview{
    grid-area:preview !important;
    grid-column:1/-1 !important;
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
  }
  .composer .pastePreviewInfo{min-width:0 !important;overflow:hidden}
  .composer .pastePreviewImg{flex:none}
  .composer .attachWrap{grid-area:attach !important}
  .composer .emojiWrap{grid-area:emoji !important}
  .composer .voiceWrap{grid-area:voice !important}
  .composer .textWrap{grid-area:text !important;min-width:0 !important}
  .composer #sendBtn{grid-area:send !important;justify-self:end}
  .composer .fileStatus{grid-area:status !important}
  .composer .voiceStatus{grid-area:voiceStatus !important}
  .composer .voicePreview{grid-area:voicePreview !important}
}


/* 2026.34.30 — mobile system app lock (WebAuthn platform authenticator) */
html.device-lock-pending #app,
html.device-lock-active #app{visibility:hidden!important}
.deviceLockOverlay[hidden]{display:none!important}
.deviceLockOverlay{position:fixed;inset:0;z-index:30000;display:flex;align-items:center;justify-content:center;padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#0e1621;color:#e7eef5}
.deviceLockPanel{width:min(420px,100%);display:flex;flex-direction:column;gap:12px;text-align:center;align-items:stretch;padding:24px 20px;border:1px solid #31465a;border-radius:18px;background:#152231;box-shadow:0 18px 60px rgba(0,0,0,.42)}
.deviceLockMark{font:800 26px/1 system-ui,sans-serif;letter-spacing:.08em;color:#8fc7ff;margin-bottom:2px}
.deviceLockPanel h2{margin:2px 0 0;font-size:21px}.deviceLockPanel p{margin:0;color:#b8c7d4}.deviceLockPanel small{display:block;color:#8fa1b2;line-height:1.4}.deviceLockStatus{min-height:20px;color:#f0c982;font-size:13px;line-height:1.35}
.deviceLockPanel button{min-height:48px}.deviceLockBox{margin:14px 0;padding:12px;border:1px solid #33485b;border-radius:12px;background:rgba(255,255,255,.025)}.deviceLockBox h3{margin:0 0 9px}
html[data-theme="color"] .deviceLockOverlay{background:linear-gradient(145deg,#11182b,#18142c)}
html[data-theme="color"] .deviceLockPanel{background:#17233a;border-color:#4d5f86}
html[data-theme="light"] .deviceLockOverlay{background:#f2f5f6;color:#26323b}
html[data-theme="light"] .deviceLockPanel{background:#fff;border-color:#cfdee1;box-shadow:0 18px 50px rgba(42,66,72,.18)}
html[data-theme="light"] .deviceLockMark{color:#168b84}html[data-theme="light"] .deviceLockPanel p{color:#5c6b73}html[data-theme="light"] .deviceLockPanel small{color:#75858c}html[data-theme="light"] .deviceLockStatus{color:#8a651d}html[data-theme="light"] .deviceLockBox{border-color:#d6e5e5;background:#f8fbfb}
html[data-theme="hacker"] .deviceLockOverlay{background:#020704;color:#00ff66;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;text-shadow:0 0 7px rgba(0,255,102,.35)}
html[data-theme="hacker"] .deviceLockPanel{background:#020a05;border:1px solid #00c851;border-radius:0;box-shadow:0 0 22px rgba(0,255,102,.18),inset 0 0 28px rgba(0,255,102,.035)}
html[data-theme="hacker"] .deviceLockMark,html[data-theme="hacker"] .deviceLockPanel h2{color:#00ff66}html[data-theme="hacker"] .deviceLockPanel p,html[data-theme="hacker"] .deviceLockPanel small{color:#75e99e}html[data-theme="hacker"] .deviceLockStatus{color:#b6ffca}html[data-theme="hacker"] .deviceLockBox{border-color:#087c35;border-radius:0;background:#001309}
@media(min-width:721px){.deviceLockBox{opacity:.78}}
