#tab-komuta.active {
    display: flex;
    height: 100%;
    min-height: 0;
}

.command-layout {
    display: flex;
    gap: 14px;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.conversation-list {
    width: 300px;
    flex: 0 0 300px;
    padding: 12px;
    display: grid;
    grid-template-rows: auto auto 1fr;
    gap: 10px;
    min-height: 0;
    overflow: hidden;
}

.card-head h2 {
    margin: 0;
    font-size: 16px;
}

.conversation-main {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    min-height: 0;
    flex: 1;
    overflow: hidden;
}

.chat {
    min-height: 0;
    overflow: auto;
    padding: 14px;
    display: grid;
    gap: 10px;
    flex: 1 1 auto;
}

.msg {
    width: fit-content;
    max-width: 64%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px;
    background: var(--panel-2);
}

.msg.ai { justify-self: start; }

.msg.user {
    justify-self: end;
    background: rgba(74, 158, 255, 0.18);
    border-color: rgba(74, 158, 255, 0.5);
}

.msg-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--muted);
    font-size: 12px;
    margin-bottom: 6px;
}

.composer {
    padding: 12px;
}

.textarea {
    resize: none;
    min-height: 60px;
    max-height: 200px;
}

.composer-actions {
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.left-actions, .right-actions, .action-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.filters {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}

.table-wrap {
    overflow: auto;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table th, .table td {
    border-bottom: 1px solid var(--border);
    padding: 10px;
    text-align: left;
    font-size: 13px;
}

.table th {
    color: var(--muted);
    cursor: pointer;
    background: var(--panel-2);
    position: sticky;
    top: 0;
}

.table tbody tr:hover {
    background: rgba(74, 158, 255, 0.08);
}

.activity-feed {
    padding: 12px;
    min-height: 360px;
    max-height: 62vh;
    overflow: auto;
    display: grid;
    gap: 6px;
}

.activity-line {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-2);
    padding: 8px 10px;
    font-size: 13px;
}

.activity-line.learn { border-left: 4px solid var(--ok); }
.activity-line.error { border-left: 4px solid var(--bad); }
.activity-line.analysis { border-left: 4px solid var(--accent); }
.activity-line.warn { border-left: 4px solid var(--warn); }

.health-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.metric-card {
    padding: 12px;
}

.metric-name {
    color: var(--muted);
    font-size: 12px;
}

.metric-value {
    color: var(--text-strong);
    font-size: 22px;
    margin-top: 4px;
}

.chart-card {
    padding: 12px;
    height: 300px;
}

.brain-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
}

.brain-card {
    padding: 12px;
    display: grid;
    gap: 8px;
}

.brain-card h3 {
    margin: 0;
    font-size: 15px;
}

.brain-graph-wrap {
    width: 100%;
    min-height: 520px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-2);
    overflow: hidden;
}

#brainGraphSvg {
    width: 100%;
    height: 520px;
    display: block;
}

.brain-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.brain-metric {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--panel-2);
    padding: 10px;
    display: grid;
    gap: 4px;
}

.brain-metric span {
    color: var(--muted);
    font-size: 12px;
}

.brain-metric strong {
    color: var(--text-strong);
    font-size: 18px;
}

@media (max-width: 1200px) {
    .filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .health-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .brain-grid {
        grid-template-columns: 1fr;
    }

    .brain-metrics {
        grid-template-columns: 1fr;
    }

    .conversation-list {
        width: 260px;
        flex-basis: 260px;
    }
}

@media (max-width: 1199px) {
    .command-layout {
        flex-direction: column;
        overflow: auto;
    }

    .conversation-list {
        width: 100%;
        flex-basis: auto;
        max-height: 260px;
    }

    #tab-komuta.active {
        display: block;
        height: auto;
        min-height: 0;
    }

    .conversation-main {
        overflow: visible;
    }

    .chat {
        min-height: 320px;
    }
}

@media (max-width: 768px) {
    .filters {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .health-cards {
        grid-template-columns: 1fr;
    }

    .msg {
        max-width: 94%;
    }

    .composer-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .left-actions,
    .right-actions {
        width: 100%;
    }

    .left-actions .btn,
    .right-actions .btn {
        width: 100%;
    }
}

.brain-page { display: grid; gap: 12px; }
.brain-svg { width: 100%; max-height: 280px; }
.brain-lobe { filter: drop-shadow(0 0 8px rgba(0,255,136,.35)); cursor: pointer; }
.synapse { stroke: #4a9eff; stroke-width: 2; fill: none; stroke-dasharray: 6 4; opacity: .6; }
.synapse.pulse { animation: synapsePulse 2s ease-in-out infinite; }
@keyframes synapsePulse { 0%,100%{opacity:.35} 50%{opacity:1} }
.brain-metrics-bar { display:flex; gap:16px; flex-wrap:wrap; padding:8px 0; }
.brain-panels { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ceo-chat .ceo-messages { min-width:0; min-height:220px; max-height:360px; overflow-x:hidden; overflow-y:auto; padding:8px; }
.ceo-chat .msg-text { min-width:0; max-width:100%; overflow-wrap:anywhere; word-break:break-word; white-space:pre-wrap; line-height:1.55; }
.ceo-chat .msg-text > :first-child { margin-top: 0; }
.ceo-chat .msg-text > :last-child { margin-bottom: 0; }
.ceo-chat .msg-text h1, .ceo-chat .msg-text h2, .ceo-chat .msg-text h3,
.ceo-chat .msg-text h4, .ceo-chat .msg-text h5, .ceo-chat .msg-text h6 { line-height: 1.25; margin: 14px 0 8px; }
.ceo-chat .msg-text p { margin: 8px 0; }
.ceo-chat .msg-text ul, .ceo-chat .msg-text ol { margin: 8px 0; padding-left: 22px; }
.ceo-chat .msg-text li + li { margin-top: 3px; }
.ceo-chat .msg-text table { width:100%; max-width:100%; table-layout:fixed; border-collapse:collapse; margin:10px 0; font-size:0.92em; }
.ceo-chat .msg-text th, .ceo-chat .msg-text td { overflow-wrap:anywhere; word-break:break-word; border:1px solid var(--border); padding:6px 8px; text-align:left; vertical-align:top; }
.ceo-chat .msg-text th { background: var(--panel); font-weight: 700; }
.ceo-chat .msg-text pre { max-width:100%; box-sizing:border-box; overflow-x:auto; white-space:pre; margin:10px 0; padding:10px; border-radius:8px; background:#0d1117; border:1px solid var(--border); }
.ceo-chat .msg-text code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.9em; }
.ceo-chat .msg-text :not(pre) > code { padding: 1px 4px; border-radius: 4px; background: var(--panel); }
.priority-bar { padding:6px 10px; border-radius:8px; font-size:12px; margin:6px 0; }
.priority-bar.critical { background:#3a1212; color:#ffb4b4; }
.priority-bar.high { background:#3a2410; color:#ffd2a1; }
.priority-bar.medium { background:#2f2f14; color:#fff3a1; }
.priority-bar.low { background:#12321f; color:#b6ffd7; }
.learn-center { display:grid; gap:10px; }
.metric-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.kanban { display:grid; grid-template-columns:repeat(5,minmax(160px,1fr)); gap:8px; overflow:auto; }
.kanban-col { background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:8px; }
.kanban-list { min-height:120px; display:grid; gap:6px; }
.task-card { padding:8px; border-radius:8px; background:var(--panel-2); border-left:4px solid var(--accent); }
.settings-layout, .reports-layout { display:grid; grid-template-columns:220px 1fr; gap:12px; }
.settings-nav { display:flex; flex-direction:column; gap:6px; max-height:calc(100vh - 180px); overflow:auto; }
.settings-tab.active {
  background: rgba(244, 185, 66, 0.22);
  border-color: var(--warn);
  color: var(--text-strong);
}
.settings-tab:hover { background: rgba(74, 158, 255, 0.12); }
.integration-scope-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:16px; }
@media(max-width:900px){ .integration-scope-grid { grid-template-columns:1fr; } }
.integration-scope-tabs .scope-tab.active { background: rgba(244,185,66,.22); border-color: var(--warn); }
.portal-admin-layout, .portal-customer-layout { display:grid; grid-template-columns:200px 1fr; gap:12px; }
.portal-subnav { display:flex; flex-direction:column; gap:6px; }
.portal-link.active { background: rgba(74,158,255,.18); border-color: var(--accent); }
.agents-group-block ul { margin:0; padding-left:1.2rem; }
.log-pre { max-height:420px; overflow:auto; font-size:12px; }

.info-toggle {
  width: 100%;
  margin: 0 0 16px 0;
}
.info-toggle__button {
  min-height: 44px;
  min-width: 44px;
  width: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text);
  padding: 10px 14px;
}
.info-toggle__panel {
  margin-top: 10px;
  padding: 14px;
  border-radius: 12px;
  max-width: 100%;
  position: relative;
}
.info-toggle__panel[hidden] {
  display: none !important;
}
.info-toggle__close {
  min-height: 44px;
  min-width: 44px;
  position: absolute;
  top: 8px;
  right: 8px;
}
.info-toggle__body { padding-top: 8px; padding-right: 72px; }
.admin-full-menu-humanization-card,
.vault-mode-hint,
.tasks-intro-banner,
.tasks-workflow-stats,
.agents-intro {
  display: none !important;
}
@media (max-width: 768px) {
  .info-toggle,
  .info-toggle__button,
  .info-toggle__panel {
    width: 100%;
  }
  .info-toggle__button {
    justify-content: space-between;
    width: 100%;
  }
}
.tabs-horizontal { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-start; }
.tabs-scrollable { overflow-x: auto; flex-wrap: nowrap; }
.tab-pill { min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--panel); white-space: nowrap; cursor: pointer; }
.tab-pill.active { background: rgba(74,158,255,.2); border-color: var(--accent); }
.komuta-tab .komuta-iaos-banner { display: none; }
.komuta-toolbar.tabs-horizontal { justify-content: stretch; width: 100%; padding: 10px; }
.komuta-tab .komuta-workspace { width: 100%; max-width: none; }
.data-center-layout { display: grid; gap: 12px; }
.conv-item-row { display: flex; gap: 4px; width: 100%; }
.conv-item-row .conv-item { flex: 1; min-height: 44px; }
.conv-menu-btn { min-width: 44px; min-height: 44px; }
.rich-editor-toolbar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.rich-editor-body { min-height: 120px; padding: 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 16px; }
.brain-anatomy-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 768px) {
  .brain-anatomy-layout { grid-template-columns: 1fr; }
  .portal-admin-layout, .portal-customer-layout { grid-template-columns: 1fr; }
  .portal-subnav { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; }
}
