:root{
  --navy:#002d47;--navy-2:#0c405c;--navy-3:#175d7c;--ink:#17232b;--muted:#65727a;
  --line:#d8e0e4;--line-strong:#bcc9cf;--surface:#fff;--surface-2:#f5f7f8;--surface-3:#edf2f4;
  --danger:#a83737;--success:#18734c;--shadow:0 18px 55px rgba(0,45,71,.12);
  --header:68px;--composer:92px;--sidebar:350px;--details:330px;
  font-family:Barlow,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--surface-2);
}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}button,input,textarea,select{font:inherit}button{color:inherit}button,a{-webkit-tap-highlight-color:transparent}.hidden{display:none!important}.mobileOnly{display:none!important}
:focus-visible{outline:2px solid #0c7894;outline-offset:2px}.eyebrow{font-size:11px;line-height:1.2;letter-spacing:.17em;font-weight:700;color:var(--navy-3)}
.authPage{height:100%;display:grid;grid-template-columns:minmax(420px,1.05fr) minmax(420px,.95fr);background:#f8fafb}.authVisual{position:relative;display:flex;align-items:flex-end;padding:clamp(42px,7vw,100px);overflow:hidden;background:var(--navy);color:white}.authVisual::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,transparent 0,#000 25%,#000 100%)}.authVisual::after{content:"";position:absolute;width:50vw;height:50vw;min-width:560px;min-height:560px;border:1px solid rgba(255,255,255,.13);border-radius:50%;top:-28vw;right:-25vw;box-shadow:0 0 0 80px rgba(255,255,255,.025),0 0 0 160px rgba(255,255,255,.02)}.authVisualInner{position:relative;z-index:1;max-width:620px}.authVisual .eyebrow{color:#91c1d5}.authVisual h1{max-width:610px;margin:18px 0 20px;font-family:"Barlow Condensed",Barlow,sans-serif;font-size:clamp(54px,6.3vw,92px);font-weight:600;line-height:.92;letter-spacing:-.045em}.authVisual p{max-width:560px;margin:0;color:#d3e0e5;font-size:18px;line-height:1.65}.authFeatureGrid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:62px;border-top:1px solid rgba(255,255,255,.2)}.authFeatureGrid>div{padding:22px 18px 0 0;display:grid;gap:6px}.authFeatureGrid span{font:600 13px/1 "Barlow Condensed",sans-serif;color:#82b8ce}.authFeatureGrid strong{font-size:15px}.authFeatureGrid small{color:#aebfc7;font-size:12px;line-height:1.4}.authPanel{display:flex;align-items:center;justify-content:center;padding:42px}.authCard{width:min(100%,440px);display:grid;gap:20px}.authLogo,.brand{display:flex;align-items:center;gap:13px;color:var(--navy);font-family:"Barlow Condensed",Barlow,sans-serif;font-size:19px;font-weight:600;text-decoration:none}.logoFrame{position:relative;width:125px;height:34px;display:block;overflow:visible}.logoFrame img{width:100%;height:100%;display:block;object-fit:contain}.logoFrame::after{content:"";position:absolute;inset:0;background:var(--navy);-webkit-mask:url("/assets/afandi-logo.png") center/contain no-repeat;mask:url("/assets/afandi-logo.png") center/contain no-repeat;clip-path:inset(0 0 0 29%);pointer-events:none}.logoDivider{width:1px;height:24px;background:var(--line-strong)}.authHeading{margin:20px 0 4px}.authHeading h2{margin:8px 0 8px;font:600 42px/1 "Barlow Condensed",sans-serif;color:var(--navy);letter-spacing:-.025em}.authHeading p{margin:0;color:var(--muted);line-height:1.55}.authHeading.center{text-align:center}.field{display:grid;gap:8px}.field>span:first-child{font-size:12px;font-weight:700;color:#40515a}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line-strong);border-radius:5px;background:#fff;color:var(--ink);padding:12px 13px;min-height:45px;outline:none;transition:border .15s,box-shadow .15s}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--navy-3);box-shadow:0 0 0 3px rgba(12,120,148,.09)}.field textarea{resize:vertical}.passwordField{display:flex;position:relative}.passwordField input{padding-right:48px}.passwordField .iconBtn{position:absolute;right:4px;top:4px}.primaryBtn,.secondaryBtn,.dangerBtn{min-height:42px;border-radius:5px;padding:10px 16px;border:1px solid var(--navy);display:inline-flex;align-items:center;justify-content:center;gap:12px;font-size:13px;font-weight:700;cursor:pointer;transition:.15s}.primaryBtn{background:var(--navy);color:#fff}.primaryBtn:hover{background:var(--navy-2)}.secondaryBtn{background:#fff;color:var(--navy)}.secondaryBtn:hover{background:var(--surface-3)}.dangerBtn{border-color:var(--danger);background:var(--danger);color:#fff}.fullBtn{width:100%;justify-content:space-between;padding:13px 16px}.textBtn,.dangerTextBtn{border:0;background:transparent;padding:7px 2px;color:var(--navy-3);font-size:13px;font-weight:700;cursor:pointer}.dangerTextBtn{color:var(--danger)}.authHint{margin:3px 0 0;text-align:center;color:var(--muted);font-size:12px}.formMessage{padding:10px 12px;border-left:3px solid var(--danger);background:#fff0f0;color:#7f2424;font-size:13px;line-height:1.45}.formMessage.ok{border-color:var(--success);background:#effaf5;color:#0d5d3b}.mfaShield,.successMark{width:58px;height:58px;margin:0 auto;display:grid;place-items:center;border-radius:50%;background:var(--navy);color:#fff;font-size:24px}.authBack{justify-self:start}
.appShell{height:100%;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);background:var(--surface-2)}.conversationSidebar{height:100%;display:grid;grid-template-rows:var(--header) auto auto minmax(0,1fr) auto;border-right:1px solid var(--line);background:#fff;min-width:0}.sidebarHeader,.chatHeader,.detailsHeader{height:var(--header);display:flex;align-items:center;border-bottom:1px solid var(--line)}.sidebarHeader{justify-content:space-between;padding:0 18px 0 20px}.brand .logoFrame{width:105px;height:29px}.brand{font-size:17px}.brand .logoDivider{height:21px}.iconBtn{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:5px;background:transparent;color:var(--navy);cursor:pointer;font-size:18px;line-height:1}.iconBtn:hover{background:var(--surface-3)}.strongIcon{border:1px solid var(--line);font-size:23px}.sidebarSearch{padding:15px 16px 8px}.sidebarSearch label,.adminToolbar label,.messageSearchBar label{height:42px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--surface-2);border-radius:5px;padding:0 10px;color:var(--muted)}.sidebarSearch input,.adminToolbar input,.messageSearchBar input{border:0;outline:0;background:transparent;min-width:0;flex:1;color:var(--ink)}.sidebarSearch kbd{padding:3px 6px;border:1px solid var(--line);background:#fff;border-radius:3px;font-size:10px;color:#87949b}.searchIcon{font-size:19px}.conversationFilters{display:flex;gap:5px;padding:6px 16px 12px}.filterBtn{border:1px solid transparent;border-radius:4px;background:transparent;padding:6px 11px;font-size:11px;font-weight:700;color:var(--muted);cursor:pointer}.filterBtn.active{border-color:var(--line);background:var(--surface-3);color:var(--navy)}.conversationList{overflow:auto;padding:0 9px 12px}.conversationItem{width:100%;height:74px;border:0;border-radius:6px;background:transparent;padding:9px;display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:10px;text-align:left;cursor:pointer}.conversationItem:hover{background:var(--surface-2)}.conversationItem.active{background:#eaf1f4}.conversationAvatarWrap{position:relative}.avatar{position:relative;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#dce8ed;color:var(--navy);font-size:13px;font-weight:700;flex:0 0 auto}.avatar img{width:100%;height:100%;object-fit:cover}.avatar.large{width:43px;height:43px}.avatar.profileAvatar{width:78px;height:78px}.onlineDot{position:absolute;right:0;bottom:1px;width:12px;height:12px;border:2px solid #fff;border-radius:50%;background:#2d9c6b}.conversationCopy{min-width:0}.conversationTop,.conversationBottom{display:flex;align-items:center;gap:8px;min-width:0}.conversationTop strong{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}.conversationTop time{font-size:10px;color:#89969c}.conversationBottom{margin-top:5px}.conversationBottom p{margin:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:var(--muted)}.unreadBadge{min-width:19px;height:19px;border-radius:10px;display:grid;place-items:center;padding:0 5px;background:var(--navy);color:#fff;font-size:10px;font-weight:700}.sidebarFooter{padding:10px;border-top:1px solid var(--line)}.currentUser{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;border-radius:5px;padding:7px;text-align:left;cursor:pointer}.currentUser:hover{background:var(--surface-2)}.currentUserText{display:grid;gap:2px;flex:1;min-width:0}.currentUserText strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.currentUserText small{font-size:10px;color:var(--muted);text-transform:capitalize}
.chatPanel{height:100%;position:relative;min-width:0;background:var(--surface-2)}.emptyState{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px}.emptyState h2{margin:10px 0 8px;font:600 38px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.emptyState p{max-width:440px;color:var(--muted);line-height:1.55;margin:0 0 20px}.emptyMark{width:80px;height:62px;display:flex;gap:5px;align-items:flex-end;justify-content:center;margin-bottom:25px}.emptyMark span{width:17px;background:var(--navy);border-radius:9px 9px 3px 3px}.emptyMark span:nth-child(1){height:34px}.emptyMark span:nth-child(2){height:54px}.emptyMark span:nth-child(3){height:44px}.activeChat{height:100%;display:grid;grid-template-rows:var(--header) auto minmax(0,1fr) auto;background:#f7f9fa}.chatHeader{padding:0 18px;justify-content:space-between;background:#fff}.chatIdentity{min-width:0;flex:1;display:flex;align-items:center;gap:11px;border:0;background:transparent;text-align:left;cursor:pointer}.chatIdentity>span:last-child{min-width:0;display:grid;gap:2px}.chatIdentity strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chatIdentity small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chatHeaderActions{display:flex;align-items:center;gap:3px}.messageViewport{position:relative;overflow-y:auto;overscroll-behavior:contain;padding:20px clamp(14px,2.8vw,40px) 16px;background-image:linear-gradient(rgba(0,45,71,.025) 1px,transparent 1px);background-size:100% 48px}.messageList{width:min(100%,980px);margin:0 auto;display:flex;flex-direction:column;gap:5px}.dateSeparator{display:flex;align-items:center;gap:14px;margin:18px 0 14px;color:#89959b;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.dateSeparator::before,.dateSeparator::after{content:"";height:1px;background:var(--line);flex:1}.messageRow{display:flex;align-items:flex-end;gap:9px;margin:3px 0;position:relative}.messageRow.mine{justify-content:flex-end}.messageRow.grouped{margin-top:-2px}.messageSenderAvatar{width:30px;height:30px}.messageRow.grouped .messageSenderAvatar{visibility:hidden}.messageColumn{max-width:min(72%,680px);display:grid;gap:3px}.messageRow.mine .messageColumn{justify-items:end}.messageSenderName{margin:0 0 1px 9px;color:var(--muted);font-size:10px;font-weight:700}.messageBubble{position:relative;min-width:72px;border:1px solid var(--line);border-radius:9px 9px 9px 3px;background:#fff;padding:9px 11px 7px;box-shadow:0 2px 6px rgba(19,42,54,.025)}.messageRow.mine .messageBubble{border-color:#c4d7df;border-radius:9px 9px 3px 9px;background:#e7f0f4}.messageBody{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.48}.messageMeta{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:4px;color:#86949b;font-size:9px}.messageEdited{font-style:italic}.readCheck{color:var(--navy-3);font-size:11px}.deletedMessage{color:#8b979d;font-style:italic;font-size:12px}.replyQuote{display:block;width:100%;margin-bottom:7px;padding:6px 8px;border-left:3px solid var(--navy-3);background:rgba(0,45,71,.055);border-radius:2px;text-align:left;cursor:pointer}.replyQuote strong{display:block;font-size:10px;color:var(--navy-3)}.replyQuote span{display:block;margin-top:2px;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.messageAttachment{max-width:360px}.imageAttachment{display:block;max-width:100%;max-height:340px;border-radius:5px;object-fit:cover;cursor:pointer}.fileAttachment{min-width:230px;display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;padding:4px}.fileAttachmentIcon{width:39px;height:39px;display:grid;place-items:center;border-radius:5px;background:var(--surface-3);font-size:20px}.fileAttachmentText{min-width:0;display:grid;gap:3px}.fileAttachmentText strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.fileAttachmentText small{font-size:10px;color:var(--muted)}.audioAttachment{width:min(330px,60vw);height:40px}.messageActions{position:absolute;top:-23px;right:6px;z-index:3;display:none;align-items:center;padding:2px;border:1px solid var(--line);border-radius:5px;background:#fff;box-shadow:0 5px 18px rgba(0,45,71,.12)}.messageRow.mine .messageActions{right:auto;left:6px}.messageRow:hover .messageActions,.messageRow.actionOpen .messageActions{display:flex}.messageActionBtn{width:28px;height:27px;border:0;background:transparent;border-radius:3px;cursor:pointer;font-size:13px}.messageActionBtn:hover{background:var(--surface-3)}.reactionPicker{position:absolute;right:0;bottom:34px;z-index:5;display:flex;gap:2px;padding:5px;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:var(--shadow)}.messageRow.mine .reactionPicker{right:auto;left:0}.reactionPicker button{width:31px;height:31px;border:0;background:transparent;border-radius:4px;font-size:17px;cursor:pointer}.reactionPicker button:hover{background:var(--surface-3)}.messageReactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:1px}.messageReaction{height:25px;display:flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:0 7px;font-size:12px;cursor:pointer}.messageReaction.mine{border-color:#88aebe;background:#e5f0f4}.messageReaction span:last-child{font-size:9px;color:var(--muted)}.typingIndicator{width:min(100%,980px);margin:5px auto;display:flex;align-items:center;gap:4px;color:var(--muted)}.typingIndicator span{width:5px;height:5px;border-radius:50%;background:#8ba1ac;animation:typing 1.2s infinite}.typingIndicator span:nth-child(2){animation-delay:.15s}.typingIndicator span:nth-child(3){animation-delay:.3s}.typingIndicator small{margin-left:5px}@keyframes typing{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}.connectionBanner{padding:7px 12px;text-align:center;background:#fff1ce;color:#735718;font-size:11px;border-bottom:1px solid #ead498}.loadOlder{display:block;margin:0 auto 15px}.jumpBottom{position:absolute;right:26px;bottom:102px;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:#fff;box-shadow:0 6px 20px rgba(0,45,71,.15);cursor:pointer}.jumpBottom span{position:absolute;right:-5px;top:-6px;min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:10px;background:var(--navy);color:#fff;font-size:9px}.messageSearchBar{padding:10px 18px;border-bottom:1px solid var(--line);background:#fff}.messageSearchBar label{width:min(100%,600px);margin:auto}.messageSearchBar button{border:0;background:transparent;font-size:19px;cursor:pointer}.messageSearchResults{position:absolute;z-index:20;top:120px;left:50%;transform:translateX(-50%);width:min(90%,600px);max-height:360px;overflow:auto;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);border-radius:6px}.searchResult{width:100%;display:grid;gap:4px;padding:11px 13px;border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left;cursor:pointer}.searchResult:hover{background:var(--surface-2)}.searchResult strong{font-size:11px;color:var(--navy)}.searchResult span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.searchResult small{font-size:9px;color:var(--muted)}
.composerArea{position:relative;border-top:1px solid var(--line);background:#fff;padding:12px clamp(12px,2.2vw,28px) calc(12px + env(safe-area-inset-bottom))}.composer{width:min(100%,980px);margin:0 auto;display:flex;align-items:flex-end;gap:7px}.composerBtn{margin-bottom:2px}.composerInput{position:relative;flex:1;display:flex;align-items:flex-end;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface-2)}.composerInput:focus-within{border-color:var(--navy-3);box-shadow:0 0 0 3px rgba(12,120,148,.08)}.composer textarea{width:100%;min-height:43px;max-height:140px;border:0;background:transparent;outline:0;resize:none;padding:11px 43px 10px 12px;font-size:14px;line-height:1.45}.composerEmoji{position:absolute;right:3px;bottom:2px}.sendBtn{width:42px;height:42px;border:0;border-radius:6px;background:var(--navy);color:#fff;font-size:20px;cursor:pointer}.sendBtn:hover{background:var(--navy-2)}.replyPreview,.uploadPreview{width:min(100%,980px);margin:0 auto 8px;min-height:47px;display:flex;align-items:center;gap:9px;padding:7px 8px;background:var(--surface-2);border:1px solid var(--line);border-radius:5px}.replyLine{width:3px;align-self:stretch;background:var(--navy-3);border-radius:3px}.replyPreview>div,.uploadPreview>div{flex:1;min-width:0}.replyPreview small{font-weight:700;color:var(--navy-3)}.replyPreview p{margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:11px}.uploadPreview strong,.uploadPreview small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uploadPreview strong{font-size:12px}.uploadPreview small{font-size:10px;color:var(--muted)}.emojiPicker{position:absolute;right:60px;bottom:78px;width:270px;display:grid;grid-template-columns:repeat(7,1fr);gap:3px;padding:9px;border:1px solid var(--line);border-radius:7px;background:#fff;box-shadow:var(--shadow)}.emojiPicker button{height:34px;border:0;border-radius:4px;background:transparent;font-size:19px;cursor:pointer}.emojiPicker button:hover{background:var(--surface-3)}.recordingBar{width:min(100%,980px);margin:0 auto;min-height:48px;display:flex;align-items:center;gap:12px}.recordingBar>span:nth-of-type(2){flex:1;color:var(--muted);font-size:12px}.recordingBar button:not(.primaryBtn){border:0;background:transparent;color:var(--danger);font-weight:700;cursor:pointer}.recordDot{width:10px;height:10px;border-radius:50%;background:#d83f3f;animation:pulse 1.1s infinite}@keyframes pulse{50%{opacity:.35}}
.detailsPanel{position:absolute;z-index:25;right:0;top:0;width:var(--details);height:100%;border-left:1px solid var(--line);background:#fff;box-shadow:-12px 0 30px rgba(0,45,71,.08)}.detailsHeader{padding:0 15px 0 20px;justify-content:space-between}.detailsHeader h2{margin:0;font:600 21px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.detailsContent{height:calc(100% - var(--header));overflow:auto;padding:24px 19px}.detailsHero{text-align:center}.detailsHero .avatar{margin:0 auto 12px;width:82px;height:82px;font-size:20px}.detailsHero h3{margin:0;font-size:17px}.detailsHero p{margin:5px 0 0;color:var(--muted);font-size:11px}.detailsSection{margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}.detailsSectionHeader{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.detailsSectionHeader strong{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.memberList{display:grid;gap:4px}.memberItem{display:flex;align-items:center;gap:9px;padding:7px 3px}.memberItem .avatar{width:36px;height:36px}.memberItem>span:nth-child(2){display:grid;gap:1px;flex:1;min-width:0}.memberItem strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.memberItem small{font-size:9px;color:var(--muted);text-transform:capitalize}.detailsAction{width:100%;min-height:39px;display:flex;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid var(--line);background:#fff;font-size:12px;cursor:pointer}.detailsAction:hover{color:var(--navy-3)}.detailsAction.danger{color:var(--danger)}
.modalDialog{width:min(92vw,560px);max-height:min(90vh,820px);padding:0;border:0;border-radius:8px;background:transparent;box-shadow:var(--shadow)}.modalDialog::backdrop{background:rgba(0,31,48,.48);backdrop-filter:blur(2px)}.wideDialog{width:min(92vw,720px)}.adminDialog{width:min(94vw,900px)}.smallDialog{width:min(92vw,430px)}.modalCard{max-height:min(90vh,820px);overflow:auto;margin:0;padding:0;background:#fff;border:1px solid rgba(255,255,255,.2);border-radius:8px}.modalHeader{position:sticky;z-index:4;top:0;display:flex;align-items:flex-start;justify-content:space-between;padding:20px 22px 16px;border-bottom:1px solid var(--line);background:#fff}.modalHeader h2{margin:5px 0 0;font:600 29px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.modalCard>.field,.modalCard>.formGrid,.modalCard>.modeSwitch,.modalCard>.selectedUsers,.modalCard>.userPickerList,.modalCard>.formMessage,.modalCard>.modalIntro,.modalCard>.profileTop,.modalCard>.securityCard,.modalCard>#mfaEnableView,.modalCard>#mfaDisableView,.modalCard>#recoveryView,.modalCard>.adminToolbar,.modalCard>.adminUserForm,.modalCard>.adminUserList{margin-left:22px;margin-right:22px}.modeSwitch{display:grid;grid-template-columns:1fr 1fr;margin-top:18px;margin-bottom:16px;border:1px solid var(--line);border-radius:5px;padding:3px;background:var(--surface-2)}.modeSwitch button{height:36px;border:0;border-radius:3px;background:transparent;font-size:12px;font-weight:700;cursor:pointer}.modeSwitch button.active{background:#fff;color:var(--navy);box-shadow:0 1px 5px rgba(0,45,71,.1)}.userPickerList{max-height:320px;overflow:auto;margin-top:12px;border:1px solid var(--line);border-radius:5px}.userPickerRow{width:100%;min-height:57px;display:flex;align-items:center;gap:10px;padding:8px 10px;border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left;cursor:pointer}.userPickerRow:hover,.userPickerRow.selected{background:var(--surface-2)}.userPickerRow:last-child{border-bottom:0}.userPickerRow .avatar{width:38px;height:38px}.userPickerRow>span:nth-child(2){display:grid;gap:2px;min-width:0;flex:1}.userPickerRow strong{font-size:12px}.userPickerRow small{font-size:10px;color:var(--muted)}.pickerCheck{width:20px;height:20px;display:grid;place-items:center;border:1px solid var(--line-strong);border-radius:50%;font-size:11px}.selected .pickerCheck{background:var(--navy);color:#fff}.selectedUsers{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.selectedChip{display:flex;align-items:center;gap:5px;border-radius:13px;background:var(--surface-3);padding:5px 8px;font-size:10px}.modalFooter{position:sticky;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:20px;padding:14px 22px;border-top:1px solid var(--line);background:#fff}.footerSpacer{flex:1}.profileTop{display:flex;align-items:center;gap:16px;margin-top:20px;margin-bottom:20px}.profileTop>div{display:grid;gap:8px}.profileTop strong{font-size:18px}.fileLabel{cursor:pointer}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.fullField{grid-column:1/-1}.securityCard{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:17px;padding:14px;border:1px solid var(--line);border-radius:5px;background:var(--surface-2)}.securityCard strong{font-size:13px}.securityCard p{margin:4px 0 0;color:var(--muted);font-size:11px}.mfaQr{width:220px;min-height:220px;margin:18px auto;padding:10px;border:1px solid var(--line);background:#fff}.mfaQr svg{display:block;width:100%;height:auto}.secretOutput{display:block;padding:11px;border:1px solid var(--line);background:var(--surface-2);font:700 13px/1.5 ui-monospace,monospace;overflow-wrap:anywhere;user-select:all}.successMark{margin-top:20px}.modalCard #recoveryView{text-align:center}.modalCard #recoveryView h3{margin-bottom:5px}.modalCard #recoveryView p{color:var(--muted);font-size:12px;line-height:1.5}.modalCard #recoveryView pre{text-align:left;padding:14px;border:1px solid var(--line);background:var(--surface-2);font:700 13px/1.7 ui-monospace,monospace;user-select:all}.adminToolbar{display:flex;gap:10px;margin-top:18px}.adminToolbar label{flex:1}.adminUserForm{margin-top:15px;padding:16px;border:1px solid var(--line);border-radius:5px;background:var(--surface-2)}.adminUserForm .formGrid{margin:0}.adminFormActions{display:flex;justify-content:flex-end;gap:10px;margin-top:15px}.adminUserList{margin-top:17px;margin-bottom:20px;border:1px solid var(--line);border-radius:5px;overflow:hidden}.adminUserRow{display:grid;grid-template-columns:minmax(180px,1fr) 130px 130px;align-items:center;gap:10px;min-height:65px;padding:8px 12px;border-bottom:1px solid var(--line)}.adminUserRow:last-child{border:0}.adminUserIdentity{display:flex;align-items:center;gap:10px;min-width:0}.adminUserIdentity .avatar{width:39px;height:39px}.adminUserIdentity>span{display:grid;gap:2px;min-width:0}.adminUserIdentity strong,.adminUserIdentity small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.adminUserIdentity strong{font-size:12px}.adminUserIdentity small{font-size:10px;color:var(--muted)}.adminUserRow select{height:34px;border:1px solid var(--line);border-radius:4px;background:#fff;font-size:11px}.toastRegion{position:fixed;z-index:200;right:18px;top:18px;display:grid;gap:8px}.toast{min-width:260px;max-width:400px;padding:11px 13px;border-left:3px solid var(--navy-3);border-radius:4px;background:#fff;box-shadow:var(--shadow);font-size:12px;animation:toastIn .2s ease}.toast.error{border-color:var(--danger)}@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}}
@media(max-width:980px){:root{--sidebar:310px}.detailsPanel{width:310px}.messageColumn{max-width:82%}.authPage{grid-template-columns:1fr}.authVisual{display:none}.authPanel{padding:28px}}
@media(max-width:720px){:root{--header:62px;--composer:80px}.mobileOnly{display:grid!important}.appShell{display:block;position:relative}.conversationSidebar{width:100%;position:absolute;inset:0;z-index:3;border:0}.appShell.chatOpen .conversationSidebar{transform:translateX(-100%)}.chatPanel{width:100%;position:absolute;inset:0;z-index:2}.appShell:not(.chatOpen) .chatPanel{transform:translateX(100%)}.conversationSidebar,.chatPanel{transition:transform .22s ease}.detailsPanel{width:100%;z-index:30}.sidebarHeader{padding-left:15px}.sidebarSearch{padding-top:10px}.conversationItem{height:70px}.chatHeader{padding:0 8px}.chatIdentity .avatar{width:40px;height:40px}.messageViewport{padding:14px 9px}.messageList{gap:4px}.messageColumn{max-width:86%}.messageBubble{padding:8px 10px 6px}.messageBody{font-size:13.5px}.messageActions{display:none!important}.messageRow.actionOpen .messageActions{display:flex!important}.composerArea{padding:9px 7px calc(9px + env(safe-area-inset-bottom))}.composer{gap:3px}.composer .composerBtn{width:34px}.sendBtn{width:40px}.composer textarea{padding-left:9px}.emojiPicker{right:10px;bottom:70px}.jumpBottom{right:14px;bottom:88px}.modalDialog,.wideDialog,.adminDialog,.smallDialog{width:100vw;max-width:none;max-height:100dvh;margin:0;border-radius:0}.modalCard{min-height:100dvh;max-height:100dvh;border-radius:0}.formGrid{grid-template-columns:1fr}.fullField{grid-column:auto}.modalHeader{padding:17px 16px 13px}.modalCard>.field,.modalCard>.formGrid,.modalCard>.modeSwitch,.modalCard>.selectedUsers,.modalCard>.userPickerList,.modalCard>.formMessage,.modalCard>.modalIntro,.modalCard>.profileTop,.modalCard>.securityCard,.modalCard>#mfaEnableView,.modalCard>#mfaDisableView,.modalCard>#recoveryView,.modalCard>.adminToolbar,.modalCard>.adminUserForm,.modalCard>.adminUserList{margin-left:16px;margin-right:16px}.modalFooter{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}.adminToolbar{display:grid}.adminUserRow{grid-template-columns:1fr 105px}.adminUserRow select:last-child{grid-column:2}.authPanel{padding:24px 18px}.authHeading h2{font-size:35px}.logoFrame{width:112px;height:31px}}
@media(max-width:430px){.brand .logoFrame{width:92px;height:26px}.brand{gap:9px}.logoDivider{height:18px}.conversationFilters{padding-bottom:8px}.messageColumn{max-width:90%}.messageSenderAvatar{display:none}.messageRow{gap:0}.messageSenderName{margin-left:4px}.messageAttachment{max-width:280px}.securityCard{align-items:flex-start;display:grid}.profileTop{align-items:flex-start}.sidebarSearch kbd{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Kontoverwaltung, Einstellungen und Administration */
.accountLinkLabel{padding:5px 8px;border:1px solid var(--line);border-radius:4px;color:var(--navy);font-size:10px;font-weight:700}.accountNav{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:7px}.accountNavBtn{min-height:35px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--navy);font-size:11px;font-weight:700;cursor:pointer}.accountNavBtn:hover{border-color:var(--navy-3);background:var(--surface-2)}.adminAccountBtn{grid-column:1/-1;background:var(--navy);border-color:var(--navy);color:#fff}.adminAccountBtn:hover{background:var(--navy-2);color:#fff}.settingsIntro,.passwordSettings{margin:20px 22px 0}.settingsIntro{padding-bottom:2px}.settingsIntro strong{font:600 22px/1.1 "Barlow Condensed",sans-serif;color:var(--navy)}.settingsIntro p{margin:5px 0 0;color:var(--muted);font-size:12px}.passwordSettings{padding:19px;border:1px solid var(--line);border-radius:6px;background:#fff}.sectionTitle h3{margin:5px 0 17px;font:600 23px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.passwordSettings .formGrid{margin:0}.settingsFormActions{display:flex;justify-content:flex-end}.adminDialog{width:min(96vw,1040px)}.adminTabs{position:sticky;z-index:3;top:82px;display:flex;gap:4px;padding:10px 22px;border-bottom:1px solid var(--line);background:#fff}.adminTab{min-height:36px;padding:8px 15px;border:1px solid transparent;border-radius:4px;background:transparent;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer}.adminTab:hover{background:var(--surface-2);color:var(--navy)}.adminTab.active{border-color:var(--line);background:var(--navy);color:#fff}.adminTabPanel{margin:20px 22px 24px}.adminStats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.adminStats article{min-height:112px;display:flex;flex-direction:column;justify-content:space-between;padding:15px;border:1px solid var(--line);border-radius:6px;background:var(--surface-2)}.adminStats span{color:var(--muted);font-size:11px;font-weight:700}.adminStats strong{font:600 38px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.adminInfoCard{margin-top:14px;padding:19px;border-left:4px solid var(--navy);background:#eef3f5}.adminInfoCard>strong{font-size:14px;color:var(--navy)}.adminInfoCard p{margin:6px 0 15px;color:var(--muted);font-size:12px;line-height:1.5}.adminTabPanel .adminToolbar,.adminTabPanel .adminUserForm,.adminTabPanel .adminUserList{margin-left:0;margin-right:0}.csvImportCard{border:1px solid var(--line);border-radius:7px;overflow:hidden}.csvImportHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px;border-bottom:1px solid var(--line);background:var(--surface-2)}.csvImportHeader h3{margin:5px 0 6px;font:600 26px/1 "Barlow Condensed",sans-serif;color:var(--navy)}.csvImportHeader p{margin:0;color:var(--muted);font-size:12px}.csvColumns{margin:18px 20px 0;display:grid;gap:7px;padding:14px;border:1px solid var(--line);border-radius:5px;background:#fff}.csvColumns strong{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.csvColumns code{padding:9px;border-radius:4px;background:var(--surface-2);color:var(--navy);font-size:12px;overflow-wrap:anywhere}.csvColumns small{color:var(--muted);font-size:11px;line-height:1.45}.csvDropzone{margin:14px 20px 0;min-height:105px;display:flex;align-items:center;justify-content:center;gap:14px;padding:18px;border:1px dashed var(--navy-3);border-radius:6px;background:#f7fafb;cursor:pointer}.csvDropzone:hover{background:#eef5f7}.csvFileIcon{width:52px;height:52px;display:grid;place-items:center;border-radius:5px;background:var(--navy);color:#fff;font:700 13px/1 "Barlow Condensed",sans-serif}.csvDropzone>span:last-of-type{display:grid;gap:4px}.csvDropzone strong{font-size:13px;color:var(--navy)}.csvDropzone small{font-size:10px;color:var(--muted)}.csvProgress{margin:14px 20px 0;padding:13px;border:1px solid var(--line);border-radius:5px}.csvProgress>div{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px;font-size:11px}.csvProgress span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.csvProgress progress{width:100%;height:8px;accent-color:var(--navy)}.csvImportResult{margin:14px 20px 0;padding:14px;border-left:3px solid var(--success);background:#effaf5}.csvImportResult>strong{display:block;margin-bottom:9px;color:var(--success);font-size:12px}.csvImportResult>div{display:flex;flex-wrap:wrap;gap:7px}.csvImportResult>div span{padding:5px 8px;border:1px solid #c9e4d6;border-radius:4px;background:#fff;font-size:10px}.csvImportResult details{margin-top:10px;font-size:11px}.csvImportResult ul{max-height:160px;overflow:auto;margin:8px 0 0;padding-left:20px}.csvImportActions{display:flex;justify-content:flex-end;padding:18px 20px 20px}.primaryBtn:disabled,.secondaryBtn:disabled,.accountNavBtn:disabled{opacity:.55;cursor:not-allowed}

@media(max-width:720px){.accountNav{grid-template-columns:1fr 1fr}.settingsIntro,.passwordSettings{margin-left:16px;margin-right:16px}.passwordSettings{padding:15px}.adminTabs{top:71px;padding:8px 16px;overflow-x:auto}.adminTab{white-space:nowrap}.adminTabPanel{margin:16px}.adminStats{grid-template-columns:1fr 1fr}.adminStats article{min-height:92px}.adminStats strong{font-size:31px}.csvImportHeader{display:grid;padding:16px}.csvImportHeader .secondaryBtn{width:100%}.csvColumns,.csvDropzone,.csvProgress,.csvImportResult{margin-left:16px;margin-right:16px}.csvDropzone{justify-content:flex-start}.csvImportActions{padding:16px}.csvImportActions .primaryBtn{width:100%}.settingsFormActions .primaryBtn{width:100%}}
@media(max-width:430px){.accountLinkLabel{display:none}.adminStats{grid-template-columns:1fr 1fr}.csvDropzone{align-items:flex-start}.csvFileIcon{width:44px;height:44px}.securityCard .secondaryBtn{width:100%}}
.csvDropzone.dragging{background:#e7f2f6;box-shadow:0 0 0 3px rgba(23,93,124,.1)}

/* Login unter der Portalnavigation sauber ausrichten und Footer sichtbar halten. */
.authPanel{position:relative;padding-bottom:78px}
.authFooter{position:absolute;right:24px;bottom:20px;left:24px;color:var(--muted);font-size:11px;line-height:1.4;text-align:center}
@media(max-width:980px){.authPanel{min-height:100%;padding-bottom:72px}.authFooter{bottom:16px}}
@media(max-width:720px){.authPanel{padding-bottom:66px}.authFooter{right:18px;bottom:14px;left:18px;font-size:10px}}