:root { color-scheme:dark; font-family:Inter,"Segoe UI",sans-serif; background:#080d18; color:#edf3ff; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 12% -10%,#183d43 0,transparent 31%),radial-gradient(circle at 88% 0,#17274a 0,transparent 34%),#080d18; }
button,input,select,textarea { font:inherit; }
button { border:0; border-radius:10px; padding:11px 16px; background:#65e6b0; color:#06140e; font-weight:750; cursor:pointer; }
button:hover { filter:brightness(1.06); }
button:disabled { opacity:.5; cursor:wait; }
.page { width:min(1480px,calc(100% - 28px)); margin:auto; padding:22px 0 30px; }
.topbar,.brand,.sectionTitle,.caseHeader,.composerFooter,.service { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.topbar { display:grid; grid-template-columns:minmax(230px,auto) minmax(340px,1fr) auto; gap:18px; margin-bottom:18px; }
.brand { grid-column:1; grid-row:1; justify-content:flex-start; color:inherit; text-decoration:none; }
.brand:focus-visible { outline:2px solid #65e6b0; outline-offset:5px; border-radius:8px; }
.brand h1 { margin:0 0 2px; font-size:23px; }
.brand p { margin:0; color:#94a2bc; font-size:13px; }
.mark { display:block; width:48px; height:48px; object-fit:contain; filter:drop-shadow(0 0 14px rgba(28,202,242,.2)); }
.topbarContext { grid-column:2; grid-row:1; display:flex; align-items:center; justify-content:space-between; gap:14px; min-width:0; padding:7px 11px; border:1px solid #26334c; border-radius:13px; background:rgba(16,24,41,.82); }
.topbarContext>div:first-child { min-width:0; }
.topbarContext h2 { margin:2px 0; overflow:hidden; font-size:16px; text-overflow:ellipsis; white-space:nowrap; }
.service { grid-column:3; grid-row:1; justify-content:flex-end; color:#a9b5c9; font-size:13px; }
.logoutButton { padding:7px 11px; background:#202d43; color:#cbd5e6; font-size:12px; }
.dot,.clientDot { width:9px; height:9px; border-radius:50%; background:#78859c; }
.dot.online,.clientDot.online { background:#65e6b0; box-shadow:0 0 0 4px rgba(101,230,176,.1); }
.dot.warning { background:#ffc45c; box-shadow:0 0 0 4px rgba(255,196,92,.12); }
.dot.errorDot { background:#ff7f7f; }
.card { background:rgba(16,24,41,.94); border:1px solid #26334c; border-radius:17px; box-shadow:0 18px 55px rgba(0,0,0,.22); }
.login { max-width:520px; margin:80px auto; padding:28px; }
.sessionLoading { display:flex; align-items:center; justify-content:center; gap:12px; color:#aebbd0; }
.login h2 { margin:4px 0 8px; }
.login button { width:100%; margin-top:6px; }
.mfaSetup { display:grid; gap:8px; margin:12px 0; padding:12px; border:1px solid #3e806d; border-radius:10px; background:#0b1e22; }
.mfaSetup span { color:#aebbd0; font-size:12px; line-height:1.45; }
.mfaSetup code { padding:9px; overflow-wrap:anywhere; border-radius:7px; color:#65e6b0; background:#08101d; font:600 14px Consolas,monospace; letter-spacing:1px; user-select:all; }
.workspace { display:grid; grid-template-columns:290px minmax(480px,1fr) 265px; gap:14px; min-height:calc(100vh - 102px); }
.sidebar,.statusPanel { padding:18px; overflow:hidden; }
.conversation { min-height:650px; overflow:hidden; }
h2,h3,p { margin-top:0; }
.sectionTitle h2,.statusPanel h2 { margin:2px 0 0; }
.statusPanel h3 { font-size:14px; color:#bfc9da; }
.eyebrow { margin:0; color:#65e6b0; font-size:11px; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.muted,.emptySmall { color:#8f9bb0; }
.error { color:#ffad75; font-size:13px; min-height:18px; }
label { display:block; color:#b9c5d8; margin:16px 0; font-size:13px; }
input,select,textarea { display:block; width:100%; margin-top:7px; padding:11px 12px; border-radius:10px; border:1px solid #35425b; background:#0a1221; color:#eff4ff; }
input[readonly] { color:#aebbd0; background:#101827; cursor:default; }
input:focus,select:focus,textarea:focus { outline:2px solid #3c9678; border-color:transparent; }
textarea { resize:none; line-height:1.45; }
.iconButton,.closeButton { width:38px; height:38px; padding:0; font-size:22px; }
.closeButton { background:#1d2940; color:#b9c5d8; }
.caseList { margin-top:15px; display:grid; gap:8px; max-height:calc(100vh - 190px); overflow:auto; }
.caseTabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-top:15px; padding:4px; border-radius:11px; background:#09111f; }
.caseTab { padding:8px 10px; color:#8997ad; background:transparent; font-size:12px; }
.caseTab.active { color:#07150f; background:#65e6b0; }
.archiveFilters { display:grid; grid-template-columns:1fr; gap:8px; margin-top:10px; }
.archiveFilters label { margin:0; color:#8f9bb0; font-size:11px; }
.archiveFilters input,.archiveFilters select { margin-top:4px; padding:8px 9px; font-size:12px; }
.compactField { margin:10px 0 0; color:#8f9bb0; font-size:11px; }
.compactField select { margin-top:4px; padding:8px 9px; font-size:12px; }
.caseItem { display:grid; gap:7px; width:100%; padding:12px; background:#0c1628; color:#e9effb; border:1px solid transparent; text-align:left; font-weight:500; }
.caseItem:hover,.caseItem.active { border-color:#3e806d; background:#122337; }
.caseItem.needsAttention { border-color:#ffbf69; animation:caseAttention 1s ease-in-out infinite; }
@keyframes caseAttention { 50% { background:#3a291c; border-color:#fff0b3; } }
.caseItem strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.caseItem small { display:block; overflow:hidden; color:#8795ac; text-overflow:ellipsis; white-space:nowrap; }
.caseItemTop { display:flex; justify-content:space-between; gap:8px; color:#93a2b9; font-size:11px; }
.caseStatus { color:#aeb8ca; }
.caseStatus.working { color:#72dcff; }
.caseStatus.waiting_client,.caseStatus.error { color:#ffb06d; }
.caseStatus.resolved { color:#65e6b0; }
.caseView { position:relative; display:grid; grid-template-rows:1fr auto auto; height:100%; min-height:650px; }
.clientChatPanel { position:absolute; z-index:2; top:12px; right:18px; width:min(340px,calc(100% - 36px)); border:1px solid #39435f; border-radius:10px; background:#0d1728; box-shadow:0 10px 28px rgba(0,0,0,.35); overflow:hidden; }
.clientChatPanel summary { padding:8px 10px; color:#c8c4ff; cursor:pointer; font-size:12px; font-weight:700; }
.clientChatLog { display:grid; gap:6px; max-height:150px; overflow:auto; padding:0 10px 10px; }
.clientChatEntry { display:grid; gap:3px; padding:7px 9px; border-radius:8px; background:#173b35; color:#dff5e9; font-size:12px; }
.clientChatEntry.client { background:#222044; color:#e4e1ff; }
.clientChatEntry strong { font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.clientChatEntry time { color:#9da9c0; font-size:10px; }
.clientTyping { margin:0; padding:2px 4px; color:#65e6b0; font-size:12px; font-style:italic; }
.caseHeader { align-items:center; }
.assignment { display:grid; justify-items:end; gap:7px; color:#9dacbf; font-size:11px; text-align:right; }
.assignment>div { display:flex; gap:5px; }
.compactButton { padding:6px 9px; font-size:11px; }
.presence { margin:0; color:#8e9bb0; font-size:12px; }
.presence.online { color:#65e6b0; }
.caseControls { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; padding:12px 18px; border-top:1px solid #26334c; background:#0d1728; }
.caseControls label { margin:0; }
.caseControls select { margin-top:4px; padding:8px 10px; }
.archiveCaseButton { margin-top:9px; padding:9px 10px; }
.archiveCaseCompact { display:none; grid-column:1 / -1; }
.compactDirectoryButton { display:none; width:100%; margin-top:10px; padding:8px 10px; font-size:12px; }
.dashboardMetrics { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:12px 0; }
.dashboardMetrics span { display:flex; justify-content:space-between; gap:6px; padding:7px 8px; border:1px solid #293750; border-radius:8px; color:#95a3b8; font-size:10px; }
.dashboardMetrics b { color:#65e6b0; }
.messages { padding:22px; overflow:auto; min-height:300px; max-height:calc(100vh - 245px); display:flex; flex-direction:column; gap:13px; }
.message { position:relative; max-width:85%; padding:13px 15px; border-radius:15px; background:#111d31; border:1px solid #283650; }
.message.operator { align-self:flex-end; background:#173b35; border-color:#285f53; }
.message.client { align-self:flex-start; background:#222044; border-color:#5951a3; }
.message.system { align-self:center; max-width:92%; padding:8px 12px; color:#96a4ba; background:transparent; border-style:dashed; }
.messageLabel { color:#65e6b0; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; margin-bottom:7px; }
.message.operator .messageLabel { color:#a9f2d4; }
.message.client .messageLabel { color:#c8c4ff; }
.message.system .messageLabel { display:none; }
.messageText { white-space:pre-wrap; line-height:1.55; color:#e3eaf7; }
.copyMessageButton { position:absolute; top:7px; right:7px; width:29px; height:29px; padding:0; border:1px solid #3a4a65; border-radius:7px; opacity:0; pointer-events:none; background:#0b1727; color:#b9c7dc; transition:opacity .12s ease,background .12s ease,color .12s ease,border-color .12s ease; }
.message:hover>.copyMessageButton,.message:focus-within>.copyMessageButton,.copyMessageButton:focus-visible { opacity:1; pointer-events:auto; }
.copyMessageButton:hover,.copyMessageButton:focus-visible { outline:none; border-color:#65e6b0; background:#153229; color:#8ef0c7; }
.copyMessageButton.copied { opacity:1; border-color:#65e6b0; color:#65e6b0; }
.copyMessageIcon { position:relative; display:block; width:15px; height:15px; margin:auto; }
.copyMessageIcon::before,.copyMessageIcon::after { content:""; position:absolute; width:8px; height:8px; border:1.5px solid currentColor; border-radius:2px; }
.copyMessageIcon::before { left:1px; top:4px; }
.copyMessageIcon::after { left:5px; top:1px; background:#0b1727; }
.copyMessageButton.copied .copyMessageIcon::before { content:"✓"; inset:-2px 0 0 0; width:auto; height:auto; border:0; font-size:16px; font-weight:900; line-height:15px; }
.copyMessageButton.copied .copyMessageIcon::after { display:none; }
.clipboardFallback { position:fixed; left:-10000px; top:0; width:1px; height:1px; opacity:0; }
.inlineIp { display:inline; margin:0 1px; padding:1px 4px; border:1px solid #3f806f; border-radius:5px; background:#102b2a; color:#83efc4; font:inherit; font-weight:650; vertical-align:baseline; transition:background .15s ease,color .15s ease,border-color .15s ease; }
.inlineIp:hover,.inlineIp:focus-visible { background:#19483f; border-color:#65e6b0; color:#d8ffef; outline:none; }
.inlineIp.inserted { background:#65e6b0; color:#06140e; }
.messageAttachments { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:10px; }
.messageImageCard { overflow:hidden; border:1px solid #3a4a65; border-radius:10px; background:#08101d; }
.messageImage { display:block; width:100%; padding:0; overflow:hidden; border:0; border-radius:0; background:#08101d; }
.messageImage img { display:block; width:100%; max-height:250px; object-fit:contain; }
.resendImage { display:block; width:100%; max-height:0; overflow:hidden; padding:0 9px; border:0; border-top:1px solid transparent; border-radius:0; opacity:0; background:#0b1727; color:#baf5dc; font-size:11px; transition:max-height .15s ease,padding .15s ease,opacity .15s ease,border-color .15s ease; }
.messageImageCard:hover .resendImage,.messageImageCard:focus-within .resendImage { max-height:38px; padding:7px 9px; border-top-color:#355c53; opacity:1; }
.message time { display:block; margin-top:8px; color:#748199; font-size:10px; text-align:right; }
.unreadDivider { position:sticky; top:0; z-index:3; display:flex; align-items:center; gap:10px; width:100%; padding:7px 4px; color:#92f0ca; background:linear-gradient(90deg,rgba(8,16,29,.97),rgba(8,16,29,.9)); font-size:11px; font-weight:800; letter-spacing:.04em; }
.unreadDivider::before,.unreadDivider::after { content:""; height:1px; flex:1; background:#3e806d; }
.historyFold { position:sticky; top:0; z-index:4; display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:9px 11px; border:1px solid #314158; border-radius:10px; color:#9eacc1; background:rgba(9,17,31,.97); font-size:11px; }
.historyFold.expanded { position:static; }
.historyToggle { flex:0 0 auto; padding:6px 9px; color:#baf5dc; background:#13273a; font-size:11px; }
.technical { border-top:1px solid #2b3850; margin-top:12px; padding-top:9px; }
.technical summary { cursor:pointer; color:#91a0b7; font-size:12px; }
.technical pre { max-height:260px; overflow:auto; white-space:pre-wrap; word-break:break-word; font:11px/1.5 Consolas,monospace; color:#abb8cc; }
.technicalTimeline { display:grid; gap:7px; margin-top:9px; }
.technicalStep { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:8px; padding:8px 9px; border:1px solid #293b54; border-radius:8px; background:#0b1424; font-size:12px; }
.technicalStep.ok { border-color:#285d50; }.technicalStep.failed { border-color:#743b48; }
.technicalStep strong { min-width:0; overflow-wrap:anywhere; }.technicalStep small { color:#91a0b7; }.technicalStep .risk { padding:3px 6px; border-radius:99px; color:#aebed1; background:#182841; font-size:10px; }
.fleetHealthDialog { width:min(780px,calc(100% - 28px)); max-height:calc(100vh - 28px); overflow:hidden; }
.fleetHealthBody { max-height:calc(100vh - 28px); overflow-y:auto; }.fleetHealthSummary { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin:14px 0; }
.fleetHealthSummary article { display:grid; gap:3px; padding:10px; border:1px solid #2b3952; border-radius:9px; background:#0c1525; }.fleetHealthSummary strong { color:#65e6b0; font-size:19px; }.fleetHealthSummary span { color:#95a4ba; font-size:11px; }
.fleetFilter { display:flex; align-items:center; gap:9px; width:max-content; margin:0 0 10px; font-size:12px; }.fleetFilter select { width:auto; min-width:210px; margin:0; }
.fleetHealthList { display:grid; gap:8px; }.fleetHealthEntry { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px; border:1px solid #2c3b55; border-radius:10px; background:#0b1424; }.fleetHealthEntry.attention { border-color:#75583a; }.fleetHealthEntry strong,.fleetHealthEntry small { display:block; overflow-wrap:anywhere; }.fleetHealthEntry small { margin-top:3px; color:#95a4ba; font-size:11px; }.fleetHealthEntry time { color:#aebbd0; font-size:11px; text-align:right; }
.spinner { width:15px; height:15px; border:2px solid #33425a; border-top-color:#65e6b0; border-radius:50%; animation:spin .75s linear infinite; }
.activityMessage { align-self:flex-start; max-width:92%; border-style:dashed; background:#0c1728; }
.activityMessage .messageLabel { color:#88d9ed; }
.activityState { display:flex; align-items:center; gap:9px; color:#b8c7dc; line-height:1.45; }
.activityMessage.working { border-color:#3f7f78; }
.activityMessage.compacting { border-color:#6b5ca5; background:#17162d; }
.activityMessage.compacting .messageLabel { color:#c8b9ff; }
.activityMessage.idle,.activityMessage.done { opacity:.82; }
.activityMessage.waiting { border-color:#7e6c3a; }
.activityMessage.error { border-color:#984c58; }
.activityMessage.error .activityState { color:#ffabb7; }
.activityMessage.error { max-width:min(92%,620px); }
.activityAction { align-self:flex-start; margin-top:9px; padding:7px 12px; font-size:12px; }
@keyframes spin { to { transform:rotate(360deg); } }
.composer { position:relative; border-top:1px solid #26334c; padding:14px 18px 17px; }
.composer textarea { margin:0 0 10px; }
.slashMenu { position:absolute; left:18px; right:18px; bottom:78px; z-index:8; max-height:310px; overflow:auto; padding:6px; border:1px solid #354967; border-radius:12px; background:#101a2d; box-shadow:0 14px 36px rgba(0,0,0,.42); }
.slashCommand { display:grid; grid-template-columns:150px 1fr; gap:12px; width:100%; padding:9px 11px; border:0; border-radius:8px; color:#dbe7f7; background:transparent; text-align:left; }
.slashCommand:hover,.slashCommand.selected { background:#19334a; }
.slashCommand code { color:#65e6b0; font:600 13px/1.4 Consolas,monospace; }
.slashCommand span { color:#aab8cd; font-size:12px; line-height:1.4; }
.composerFooter { justify-content:flex-end; }
.composerFooter .error { flex:1; margin:0; }
.composerTools { display:flex; align-items:center; gap:8px; }
.composerChannelControl { display:flex; align-items:center; flex:0 1 300px; min-width:0; }
.composerChannelControl select { width:300px; max-width:100%; min-width:0; margin:0; padding:7px 28px 7px 9px; font-size:12px; }
.attachButton { padding:8px 11px; font-size:12px; }
.pasteHint { color:#76849a; font-size:11px; white-space:nowrap; }
.attachmentPreview { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; }
.pendingAttachment { position:relative; width:92px; height:70px; overflow:hidden; border:1px solid #3d4e69; border-radius:10px; background:#08101d; }
.pendingAttachment img { width:100%; height:100%; object-fit:cover; }
.pendingAttachment button { position:absolute; top:4px; right:4px; width:22px; height:22px; padding:0; border-radius:50%; color:#fff; background:rgba(4,9,18,.84); font-size:14px; }
.emptyConversation { display:grid; place-items:center; align-content:center; height:100%; min-height:650px; text-align:center; color:#91a0b7; padding:30px; }
.emptyWorkspace { width:min(100%,760px); display:grid; justify-items:center; gap:10px; }
.emptyConversation h2 { color:#e6edf9; margin:15px 0 7px; }
.emptyConversation p { max-width:420px; }
.emptyIcon { display:grid; place-items:center; width:64px; height:64px; border:1px solid #3c685f; border-radius:20px; color:#65e6b0; font-size:37px; background:#102b2a; }
.workspaceSummary { width:100%; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:12px; }
.workspaceMetric { padding:11px 8px; border:1px solid #2b3952; border-radius:10px; background:#0c1525; }
.workspaceMetric strong { display:block; color:#65e6b0; font-size:20px; }
.workspaceMetric span { color:#9dabc0; font-size:11px; }
.workspaceAttention { width:100%; display:grid; gap:7px; margin-top:6px; text-align:left; }
.workspaceAttention h3 { margin:4px 0 0; color:#c8d3e3; font-size:13px; }
.workspaceAttentionEmpty { margin:0; color:#9aacbf; font-size:13px; text-align:center; }
.workspaceCase { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; width:100%; padding:9px 11px; border:1px solid #2b3952; border-radius:9px; background:#0c1525; color:#e7edf8; text-align:left; font-weight:600; }
.workspaceCase small { overflow:hidden; color:#9dacbf; text-overflow:ellipsis; white-space:nowrap; font-weight:400; }
.workspaceCase .caseStatus { font-size:11px; }
.workspaceActions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:8px; }
.workspaceActions button { padding:9px 12px; font-size:12px; }
.emptyConversation { display:block; height:auto; min-height:650px; text-align:left; padding:22px; }
.emptyWorkspace { width:100%; max-width:none; justify-items:stretch; gap:16px; }
.dashboardHeader { text-align:left; }
.dashboardHeader h2 { margin:4px 0; }
.dashboardHeader p { max-width:none; margin:0; }
.emptyIcon { display:none; }
.workspaceSummary { grid-template-columns:repeat(6,minmax(0,1fr)); margin:0; }
.workspaceMetric { min-width:0; text-align:left; }
.workspaceMetric strong { font-size:22px; }
.workspaceMetric span { display:block; min-height:2.4em; line-height:1.2; }
.dashboardSections { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.dashboardSection { min-width:0; padding:14px; border:1px solid #263750; border-radius:12px; background:#0a1423; }
.dashboardSectionHeading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 12px; margin-bottom:9px; }
.dashboardSectionHeading h3 { margin:0; color:#d9e4f3; font-size:14px; }
.dashboardSectionHeading small { color:#8090a9; font-size:11px; }
.workspaceAttention,.workspaceConnectedClients { display:grid; gap:7px; margin:0; text-align:left; }
.dashboardQuickCase { display:flex; flex-direction:column; align-items:flex-start; gap:4px; width:100%; min-width:0; padding:9px 10px; border:1px solid #2b3952; border-radius:8px; color:#e7edf8; background:#0c1525; text-align:left; }
.dashboardQuickCase strong,.dashboardClientTitle { overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap; }
.dashboardQuickCase small,.dashboardConnectedClient small { color:#9dacbf; font-size:11px; font-weight:400; }
.dashboardConnectedClient { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:4px 8px; padding:8px 9px; border:1px solid #2b3952; border-radius:8px; background:#0c1525; }
.dashboardClientTitle { padding:0; border:0; color:#e7edf8; background:transparent; text-align:left; }
.dashboardConnectedClient>small { grid-column:1; }
.dashboardClientActions { grid-column:2; grid-row:1 / span 2; display:flex; align-items:center; gap:5px; }
.dashboardClientActions button { padding:6px 8px; font-size:11px; white-space:nowrap; }
.workspaceServerStrip { display:grid; grid-template-columns:auto auto minmax(0,1fr); align-items:center; gap:8px 14px; padding:10px 13px; border:1px solid #2d6456; border-radius:10px; color:#d9e7e2; background:#0b211f; }
.workspaceServerStrip>span { color:#93a8a7; font-size:11px; }
.workspaceServerStrip>strong { font-size:12px; }
.workspaceServerStrip>small { overflow:hidden; color:#9aacbf; text-overflow:ellipsis; white-space:nowrap; }
.workspaceServerStrip.warning { border-color:#796539; background:#251d0e; }
.workspaceServerStrip.critical { border-color:#753d47; background:#281217; }
.workspaceServerStrip.noData { border-color:#3b4b60; background:#111a28; }
.workspaceServerStrip.stale,.workspaceServerStrip.unknown { border-color:#5b536e; background:#1c1926; }
.workspaceActions { justify-content:flex-start; margin-top:0; }
@media(max-width:1080px) { .workspaceSummary { grid-template-columns:repeat(3,minmax(0,1fr)); } }
dl { font-size:13px; }
dt { color:#8f9db3; }
dd { margin:0; }
.statusSummary { display:grid; gap:15px; }
.statusMetric { min-width:0; }
.statusMetricInline { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.statusMetricInline dd { flex:0 0 auto; text-align:right; }
.statusMetricStacked { display:grid; gap:6px; }
.statusMetricStacked dd { min-width:0; text-align:left; overflow-wrap:anywhere; }
.statusMetricClients dd { font-size:1.5em; line-height:1; color:#edf3ff; }
.providerStateList { display:grid; gap:4px; }
.providerStateLine { display:block; white-space:nowrap; }
.good { color:#65e6b0; }
.warn { color:#ffb06d; }
.divider { height:1px; background:#26334c; margin:18px 0; }
.clientList { display:grid; gap:6px; margin-bottom:14px; }
.clientRow { display:flex; align-items:center; gap:4px; width:100%; min-height:32px; padding:3px 5px; border:1px solid transparent; border-radius:10px; background:transparent; color:#edf3ff; }
.clientRow:hover,.clientRow.active { filter:none; border-color:#3e806d; background:#122337; }
.clientRowMain { display:flex; align-items:center; gap:8px; min-width:0; flex:1 1 auto; padding:2px; border:0; background:transparent; color:inherit; text-align:left; font-weight:500; }
.clientCardButton { flex:0 0 auto; width:29px; min-width:29px; height:25px; padding:0; border:1px solid #36516a; border-radius:7px; background:#1a2b42; color:#9deccc; font-size:10px; font-weight:800; }
.clientCardButton:hover,.clientCardButton:focus-visible { border-color:#65e6b0; background:#173b37; color:#d7ffed; outline:none; }
.clientRowText { display:flex; align-items:baseline; gap:6px; min-width:0; width:100%; }
.clientRow strong { min-width:0; flex:1 1 auto; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.clientRow small { flex:0 0 auto; color:#7f8ca2; font-size:10px; white-space:nowrap; }
.statusPanel .full+.full { margin-top:9px; }
.intakeButton { padding:10px 12px; border:1px solid #8a7134; background:#342b18; color:#ffd98b; }
.intakeButton:hover { border-color:#d2a84d; background:#44371d; }
.clientsDirectory { padding:22px; min-height:calc(100vh - 102px); }
.clientFilters { display:grid; grid-template-columns:1fr 2fr 1fr 1fr 1fr; gap:10px; margin:0 0 6px; }
.clientFilters label { margin:0; }
.clientFilters input,.clientFilters select { margin-top:5px; }
.clientTableWrap { overflow:hidden; border:1px solid #2b3952; border-radius:12px; }
.clientTable { width:100%; min-width:0; border-collapse:collapse; table-layout:fixed; }
.clientAccessMenu { position:relative; display:inline-block; margin-left:6px; }
.clientAccessMenu summary { cursor:pointer; color:#aebbd0; font-weight:700; }
.clientAccessMenu[open] { padding:7px; border:1px solid #334560; border-radius:8px; background:#0b1423; }
.clientAccessMenu button { display:block; width:100%; margin-top:6px; white-space:nowrap; }
.clientIdColumn { width:17%; }
.clientAliasColumn { width:31%; }
.clientTicketsColumn { width:17%; }
.clientLastSeenColumn { width:26%; }
.clientActionColumn { width:9%; }
.mergeClient { width:100%; padding:6px 5px; font-size:11px; white-space:nowrap; }
.clientTable th,.clientTable td { padding:11px 12px; border-bottom:1px solid #26334c; text-align:left; vertical-align:middle; }
.clientTable th { color:#92a0b6; background:#0b1424; font-size:12px; font-weight:700; }
.clientTable tbody tr:last-child td { border-bottom:0; }
.clientTable tbody tr:hover { background:#111f33; }
.clientIdentity { display:flex; align-items:center; gap:9px; }
.clientIdLink { padding:5px 7px; border:0; color:#84ebc2; background:transparent; font:600 13px Consolas,monospace; }
.clientIdLink:hover { background:#15352d; }
.clientAliasInput { margin:0; padding:8px 9px; }
.clientAliasDisplay { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:8px 9px; border:1px solid transparent; color:#b8c4d7; background:transparent; text-align:left; font-weight:500; }
.clientAliasDisplay::after { content:"✎"; flex:0 0 auto; color:#64748b; opacity:0; transition:opacity .12s ease,color .12s ease; }
.clientAliasDisplay:hover,.clientAliasDisplay:focus-visible { border-color:#3e806d; background:#122337; outline:none; }
.clientAliasDisplay:hover::after,.clientAliasDisplay:focus-visible::after { color:#65e6b0; opacity:1; }
.clientAliasDisplay.custom { color:#edf3ff; }
.directorySummary { margin:12px 0 0; color:#8694aa; font-size:12px; text-align:right; }
.directoryPager { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:12px; }
.directoryPager button { padding:7px 10px; }
.directoryPager .directorySummary { margin:0; }
.pageSizeControl { display:flex; align-items:center; gap:8px; margin:0; color:#8f9bb0; font-size:12px; }
.pageSizeControl select { width:auto; min-width:76px; margin:0; padding:7px 28px 7px 10px; }
.intakeActions { display:flex; gap:8px; }
.intakeActions button { flex:1; padding:8px; font-size:12px; }
.auditDialog { width:min(680px,calc(100% - 28px)); overflow:hidden; }
.auditBody { width:auto; min-width:0; }
.auditList { display:grid; gap:8px; max-height:60vh; overflow-x:hidden; overflow-y:auto; }
.auditEntry { padding:10px; border:1px solid #2d3b54; border-radius:9px; background:#0b1424; }
.auditEntry strong,.auditEntry time,.auditOperator { display:block; overflow-wrap:anywhere; }
.auditOperator { margin-top:4px; color:#aeb9ca; font-size:12px; }
.auditEntry time { margin-top:4px; color:#8492a8; font-size:10px; }
.secondary { background:#233047; color:#d9e1ef; }
.full { width:100%; }
dialog { width:min(480px,calc(100% - 28px)); padding:0; color:#edf3ff; background:#101829; border:1px solid #33415b; border-radius:17px; box-shadow:0 30px 100px rgba(0,0,0,.6); }
dialog::backdrop { background:rgba(2,6,14,.72); backdrop-filter:blur(4px); }
.dialogBody { padding:22px; }
.dialogActions { display:flex; justify-content:flex-end; gap:9px; margin-top:20px; }
.caseNewMeta { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.caseNewMeta label { margin:0; }
.successorNote { margin:12px 0 2px; padding:11px 12px; border-left:3px solid #65e6b0; border-radius:7px; background:#0b1e22; line-height:1.45; }
.clientCardDialog { width:min(560px,calc(100% - 28px)); }
.clientCardFacts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:14px 0; }
.clientCardFact { min-width:0; padding:10px; border:1px solid #2b3952; border-radius:9px; background:#0c1525; }
.clientCardFact span { display:block; color:#8290a7; font-size:10px; }
.clientCardFact strong { display:block; margin-top:4px; overflow-wrap:anywhere; color:#d6e1f1; font-size:12px; }
.clientCardActions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.clientCardAccess { margin-top:16px; padding:11px; border:1px solid #34445f; border-radius:10px; background:#0b1423; }
.clientCardAccess summary { cursor:pointer; color:#c7d4e6; font-weight:700; }
.clientCardAccess .clientCardActions { margin-top:9px; }
.adminDialog { width:min(1040px,calc(100% - 28px)); max-height:calc(100vh - 28px); overflow:hidden; }
.adminDialog .dialogBody { max-height:calc(100vh - 28px); overflow-x:hidden; overflow-y:auto; }
.imageDialog { width:calc(100vw - 24px); max-width:none; height:calc(100vh - 24px); max-height:none; overflow:hidden; border:0; border-radius:10px; background:#050912; }
.imageViewport { display:grid; place-items:center; width:100%; height:100%; overflow:hidden; cursor:zoom-in; touch-action:none; }
.imageViewport.zoomed { cursor:grab; }
.imageViewport.zoomed:active { cursor:grabbing; }
.imageDialog img { display:block; max-width:100%; max-height:100%; object-fit:contain; transform-origin:center; user-select:none; will-change:transform; }
.imageClose { position:fixed; z-index:2; top:22px; right:22px; width:38px; height:38px; padding:0; border:1px solid rgba(255,255,255,.24); border-radius:50%; background:rgba(6,10,18,.82); color:#fff; font-size:24px; }
.adminIntro { margin:12px 0 20px; line-height:1.5; }
.adminTabs { position:sticky; z-index:2; top:-22px; display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 18px; padding:10px 54px 10px 0; background:#101829; border-bottom:1px solid #263650; }
.stickyAdminClose { position:absolute; top:8px; right:0; width:38px; height:38px; padding:0; }
.adminTab { padding:8px 12px; color:#aebbd0; background:transparent; border:1px solid transparent; }
.adminTab:hover { color:#edf3ff; background:#16243a; }
.adminTab.active { color:#06150f; background:#65e6b0; border-color:#65e6b0; }
.adminPanel { min-height:400px; }
.adminPanelHeading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:14px; }
.adminPanelHeading h3 { margin:0 0 5px; font-size:19px; }
.adminPanelHeading p { margin:0; }
.compactInput { width:min(260px,100%); margin:0; }
.providerCard { padding:18px; border:1px solid #2b3952; border-radius:14px; background:#0c1525; }
.providerCard+.providerCard { margin-top:14px; }
.providerHeading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.providerHeading h3 { margin:4px 0 0; font-size:17px; }
.providerBadge { padding:5px 9px; border-radius:999px; background:#162d31; color:#7ce7bc; font-size:11px; font-weight:750; }
.keyStatus { display:grid; grid-template-columns:1fr auto; gap:4px 14px; width:100%; margin-top:15px; padding:13px 14px; text-align:left; color:#e8effb; background:#101e32; border:1px solid #31425d; }
.keyStatus:hover { border-color:#54b995; }
.keyStatus strong { color:#65e6b0; }
.keyStatus time,.keyStatus small { color:#8e9db4; font-size:11px; }
.keyStatus code { grid-row:1 / span 2; grid-column:2; align-self:center; padding:5px 8px; border-radius:7px; color:#c9d4e7; background:#08101d; font:12px Consolas,monospace; }
.keyForm { margin-top:14px; padding-top:2px; }
.keyForm label { margin:0 0 12px; }
.keyActions { display:flex; justify-content:flex-end; gap:9px; }
.keyForm .error { margin:8px 0 0; }
.portalUsers { display:grid; gap:9px; margin:14px 0; }
.portalUserRow { display:grid; grid-template-columns:minmax(190px,1.1fr) minmax(150px,.8fr) minmax(210px,1.2fr) auto auto; align-items:center; gap:8px; padding:12px; border:1px solid #263650; border-radius:10px; background:#101e32; }
.portalUserHeading { display:grid; gap:3px; min-width:0; }
.portalUserHeading { grid-column:1 / -1; }
.portalUserHeading strong { overflow:hidden; text-overflow:ellipsis; }
.portalUserHeading small { color:#8e9db4; font-size:10px; }
.portalUserRow input,.portalUserRow select { margin:0; min-width:0; }
.portalUserRow input[type="password"] { grid-column:auto; }
.portalUserRow button { padding:9px 11px; }
.inlineCheck { display:flex; align-items:center; gap:4px; margin:0 !important; color:#aebbd0; font-size:11px; white-space:nowrap; }
.inlineCheck input { width:auto; }
.userCreateForm { display:grid; grid-template-columns:1fr 1.4fr 150px auto auto; align-items:end; gap:9px; padding-top:14px; border-top:1px solid #263650; }
.userCreateForm label,.userCreateForm .keyActions { margin:0; }
.userCreateForm .error { grid-column:1 / -1; }
.createMfa { align-self:center; padding-top:18px; }
.roleMatrix { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.roleCard { padding:17px; border:1px solid #2b3952; border-radius:12px; background:#0c1525; }
.roleCard h4 { margin:0 0 12px; color:#65e6b0; font-size:16px; }
.roleCard ul { display:grid; gap:8px; margin:0; padding-left:18px; color:#bdc8d9; line-height:1.4; }
.settingsGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.settingsGrid label { margin:0; }
.settingsGrid small { display:block; margin-top:6px; color:#8391a7; font-weight:400; line-height:1.35; }
.settingToggle { grid-column:1 / -1; display:flex !important; align-items:flex-start; gap:10px; padding:13px; border:1px solid #2b3952; border-radius:10px; background:#0c1525; }
.settingToggle input { width:auto; margin:3px 0 0; }
.settingToggle strong { display:block; }
.settingsActions { grid-column:1 / -1; display:flex; align-items:center; justify-content:flex-end; gap:12px; }
.settingsGrid .error { grid-column:1 / -1; margin:0; }
.recoveryGuide { grid-column:1 / -1; padding:12px; border:1px solid #2b3952; border-radius:10px; background:#0c1525; }
.recoveryGuide summary { color:#bcd0ea; font-weight:700; cursor:pointer; }
.recoveryGuide p { margin:10px 0 0; line-height:1.45; }
.recoveryGuide ol { display:grid; gap:7px; margin:12px 0 0; padding-left:21px; color:#bdc8d9; line-height:1.4; }
.recoveryGuide code { color:#a7f3d0; }
.fail2banBans { display:grid; gap:8px; margin-top:10px; }
.fail2banBan { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 10px; border:1px solid #2b3952; border-radius:8px; background:#0c1525; }
.fail2banBan code { color:#a7f3d0; overflow-wrap:anywhere; }
.infrastructureForm { display:grid; gap:14px; }
.nestedSettings { grid-column:1 / -1; padding:12px; border:1px solid #263650; border-radius:10px; background:#0b1423; }
.infrastructureSave { padding:4px 0 12px; }
.savedNote { color:#65e6b0; font-size:12px; }
.securityMetrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.securityMetric { display:grid; gap:4px; padding:14px; border:1px solid #2b3952; border-radius:11px; background:#0c1525; }
.securityMetric strong { color:#65e6b0; font-size:23px; }
.securityMetric span { color:#96a4ba; font-size:11px; }
.clientUpdateForm { align-items:end; margin-top:16px; }
.clientUpdateForm .settingsActions { grid-column:auto; align-self:end; }
.clientUpdateForm+.updateWarning { margin-top:16px; }
#clientUpdateSummary .securityMetric:nth-child(3) strong { overflow-wrap:anywhere; font-size:14px; line-height:1.35; }
.securityChecks { display:grid; gap:7px; margin-top:14px; }
.securityCheck { padding:10px 12px; border-radius:9px; font-size:13px; }
.securityCheck:has(.clientReleaseDownload) { display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.clientReleaseDownload { color:inherit; font-weight:800; text-decoration:underline; text-underline-offset:3px; }
.compactButton { margin-left:auto; padding:5px 9px; min-height:0; font-size:12px; }
.securityCheck.ok { color:#a7f3d0; background:#0d2924; }
.securityCheck.warning { color:#ffd08a; background:#302313; }
.dangerZone { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:20px; padding:15px; border:1px solid #71383e; border-radius:11px; background:#26151b; }
.dangerZone p { margin:5px 0 0; }
.dangerButton { color:#fff; background:#a33442; white-space:nowrap; }
.aiBoundaryBox { margin-bottom:14px; padding:14px; border:1px solid #31584d; border-radius:11px; background:#0d211f; }
.aiBoundaryBox strong { color:#7ce7bc; }
.aiBoundaryBox ul { display:grid; gap:5px; margin:9px 0 0; padding-left:20px; color:#b8c8c3; font-size:12px; line-height:1.4; }
.aiSettingsBlock { margin-top:12px; border:1px solid #2b3952; border-radius:12px; background:#0c1525; }
.aiSettingsBlock>summary { padding:14px 16px; color:#dce6f4; cursor:pointer; font-weight:750; }
.aiSettingsBlock>form,.aiSettingsBlock>.aiModelProfiles,.aiSettingsBlock>.adminIntro,.aiSettingsBlock>.providerCard { margin:0 14px 14px; }
.aiStartupContract { display:grid; gap:12px; margin:0 14px 14px; }
.aiStartupContract>p { margin:0; }
.aiPreviewControls { display:grid; grid-template-columns:2fr 1fr; gap:10px; }
.aiPreviewControls label,.aiPromptPreviewLabel { margin:0; }
.aiPromptPreviewLabel textarea { width:100%; margin-top:7px; overflow-x:hidden; resize:vertical; font:12px/1.45 Consolas,"Courier New",monospace; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.aiContractGroup { border:1px solid #293850; border-radius:10px; background:#0b1423; }
.aiContractGroup>summary { padding:11px 13px; cursor:pointer; color:#bfcde0; font-weight:700; }
.aiContextBlocks,.aiContractList { display:grid; gap:8px; padding:0 11px 11px; }
.aiContractCard { display:grid; gap:4px; min-width:0; padding:10px 12px; border:1px solid #26364e; border-radius:9px; background:#101e32; }
.aiContractCard strong { color:#dce6f4; }
.aiContractCard small { color:#8293ab; }
.aiContractCard p { margin:2px 0 0; color:#b7c5d8; font-size:12px; line-height:1.45; white-space:pre-line; }
.aiContractCard details { margin-top:5px; }
.aiContractCard summary { cursor:pointer; color:#63e6be; font-size:12px; }
.aiContractCard pre { max-width:100%; overflow-x:hidden; overflow-y:auto; margin:8px 0 0; padding:9px; border-radius:7px; background:#08111f; color:#aebdd1; font-size:11px; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.toolSchemaEditor { width:100%; margin-top:8px; resize:vertical; font:11px/1.5 Consolas,"Courier New",monospace; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.toolSchemaActions { display:flex; justify-content:flex-end; gap:9px; margin-top:9px; }
.toolSchemaActions button { width:auto; }
.aiSettingsGrid { padding-top:4px; }
.wideSetting { grid-column:1 / -1; }
.wideSetting textarea { width:100%; margin-top:7px; resize:vertical; }
.newAiProfile { display:grid; grid-template-columns:1.1fr 1.2fr 140px auto; align-items:end; gap:9px; padding:14px; border:1px solid #2b3952; border-radius:10px; background:#101e32; }
.newAiProfile label { margin:0; }
.newAiProfile .error { grid-column:1 / -1; margin:0; }
.aiModelProfiles { display:grid; gap:12px; }
.aiModelCard { padding:14px; border:1px solid #2b3952; border-radius:11px; background:#101e32; }
.aiModelHeading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px; }
.aiModelHeading>div { display:grid; gap:4px; }
.aiModelHeading small { color:#8e9db4; }
.aiOverrideGrid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.aiInstructionEditor { margin-top:12px; }
.aiInstructionEditor label { display:grid; grid-template-columns:1fr minmax(180px,260px); align-items:center; gap:10px; margin:0 0 6px; }
.aiInstructionEditor select { margin:0; }
.aiInstructionEditor textarea { margin:0; }
.aiEffective { margin-right:auto; color:#8e9db4; }
.aiModelCard .settingsActions { margin-top:18px; padding-top:5px; }
.profileDeleteConfirm { display:inline-flex; align-items:center; gap:8px; }
.profileDeleteConfirm strong { color:#ffb2ba; font-size:13px; }
.profileDeleteConfirm button { padding:9px 13px; }
.providerConnectionStatus { margin:12px 0; color:#b8c6da; }
.oauthFlow { margin-top:14px; padding:13px; border:1px solid #2b3952; border-radius:10px; background:#0a1423; }
.oauthFlow>p { margin:0 0 10px; white-space:pre-wrap; overflow-wrap:anywhere; }
.oauthLink { display:inline-block; margin-bottom:8px; color:#65e6b0; }
.adminTooltip { position:fixed; z-index:10000; width:min(390px,calc(100vw - 16px)); padding:10px 12px; border:1px solid #4a657e; border-radius:9px; background:#07111f; box-shadow:0 12px 36px rgba(0,0,0,.45); color:#e3ebf7; font-size:12px; line-height:1.45; pointer-events:none; }
[data-help] { cursor:help; }
[hidden] { display:none !important; }
@media(max-width:1200px) { .brand p,#serviceText { display:none; } }
@media(max-width:1080px) { .workspace { grid-template-columns:250px 1fr; } .statusPanel { display:none; } .archiveCaseCompact,.compactDirectoryButton { display:block; } }
@media(max-width:1080px) { .composerFooter { flex-wrap:wrap; justify-content:space-between; } .composerChannelControl { flex:1 1 300px; } .composerChannelControl select { width:300px; max-width:100%; } }
@media(max-width:760px) { .page { width:min(100% - 16px,680px); padding:10px 0; } .topbar { grid-template-columns:minmax(0,1fr) auto; padding:6px; } .brand { grid-column:1; grid-row:1; } .service { grid-column:2; grid-row:1; } .topbarContext { grid-column:1 / -1; grid-row:2; } .workspace { grid-template-columns:1fr; } .sidebar { max-height:240px; } .caseList { max-height:160px; } .conversation,.caseView,.emptyConversation { min-height:610px; } .emptyConversation { padding:14px; } .workspaceSummary { grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboardSections { grid-template-columns:1fr; } .dashboardConnectedClient { grid-template-columns:minmax(0,1fr); } .dashboardConnectedClient>small,.dashboardClientActions { grid-column:1; grid-row:auto; } .dashboardClientActions { flex-wrap:wrap; } .workspaceServerStrip { grid-template-columns:1fr; gap:4px; } .workspaceServerStrip>small { white-space:normal; } .caseControls { grid-template-columns:1fr; } .messages { max-height:505px; } .message { max-width:94%; } .service { font-size:0; } .service .dot { display:block; } .composerFooter { flex-wrap:wrap; justify-content:space-between; } .composerChannelControl { flex:1 1 100%; } .composerChannelControl select { width:300px; max-width:100%; } .composerFooter .error { order:3; flex-basis:100%; } .clientFilters { grid-template-columns:1fr; } .directoryPager { flex-wrap:wrap; } .pageSizeControl { flex-basis:100%; justify-content:center; } .adminPanelHeading,.dangerZone,.aiModelHeading { align-items:stretch; flex-direction:column; } .compactInput { width:100%; } .portalUserRow,.userCreateForm,.settingsGrid,.roleMatrix,.securityMetrics,.newAiProfile,.aiOverrideGrid,.aiPreviewControls,.clientCardFacts { grid-template-columns:1fr; } .settingToggle,.settingsActions,.wideSetting { grid-column:auto; } .aiInstructionEditor label { grid-template-columns:1fr; } .fleetHealthSummary { grid-template-columns:repeat(2,minmax(0,1fr)); }.fleetHealthEntry { grid-template-columns:auto minmax(0,1fr); }.fleetHealthEntry time { grid-column:2; text-align:left; } }
