/* debug — painel debug.utilsbr.com (tema Utils v2) */
@import url("tokens.css");

* { box-sizing: border-box; }

body.control-app {
  margin: 0;
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg-app);
  min-height: 100vh;
}

/* Scrollbar — paleta do tema (espelha utilsbr.com) */
html {
  overflow-x: hidden;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

html::-webkit-scrollbar {
  width: 14px;
}

html::-webkit-scrollbar-track {
  background-color: var(--scrollbar-track);
}

html::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: 0;
}

html::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover);
}

html::-webkit-scrollbar-button {
  background-color: var(--scrollbar-track);
  height: 14px;
}

.control-app-scroll,
.agents-chat-stream,
.agents-workers-list,
.agents-command-form--inline textarea,
.agents-terminal,
.cron-box {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

.control-app-scroll::-webkit-scrollbar,
.agents-chat-stream::-webkit-scrollbar,
.agents-workers-list::-webkit-scrollbar,
.agents-command-form--inline textarea::-webkit-scrollbar,
.agents-terminal::-webkit-scrollbar,
.cron-box::-webkit-scrollbar {
  width: 14px;
  height: 14px;
}

.control-app-scroll::-webkit-scrollbar-track,
.agents-chat-stream::-webkit-scrollbar-track,
.agents-workers-list::-webkit-scrollbar-track,
.agents-command-form--inline textarea::-webkit-scrollbar-track,
.agents-terminal::-webkit-scrollbar-track,
.cron-box::-webkit-scrollbar-track {
  background-color: var(--scrollbar-track);
}

.control-app-scroll::-webkit-scrollbar-thumb,
.agents-chat-stream::-webkit-scrollbar-thumb,
.agents-workers-list::-webkit-scrollbar-thumb,
.agents-command-form--inline textarea::-webkit-scrollbar-thumb,
.agents-terminal::-webkit-scrollbar-thumb,
.cron-box::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: 0;
}

.control-app-scroll::-webkit-scrollbar-thumb:hover,
.agents-chat-stream::-webkit-scrollbar-thumb:hover,
.agents-workers-list::-webkit-scrollbar-thumb:hover,
.agents-command-form--inline textarea::-webkit-scrollbar-thumb:hover,
.agents-terminal::-webkit-scrollbar-thumb:hover,
.cron-box::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover);
}

a,
a:visited { color: var(--brand-primary); }
[data-theme="dark"] a,
[data-theme="dark"] a:visited { color: var(--brand-secondary); }

.muted { color: var(--text-muted); }
.error { color: var(--danger); }
.notice { color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); padding: var(--space-sm) var(--space-md); border-radius: var(--radius-sm); margin-bottom: var(--space-md); }

/* —— Topbar (desktop + mobile, uma linha) —— */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: var(--topbar-h);
  height: var(--topbar-h);
  padding: 0 14px;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  flex-wrap: nowrap;
}

.brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  min-width: 0;
  text-decoration: none;
  line-height: 1;
  padding: 4px 0;
}

.brand strong {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--brand-primary);
  letter-spacing: -0.02em;
}

[data-theme="dark"] .brand strong { color: var(--brand-secondary); }

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: center;
  flex-wrap: nowrap;
}

.main-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--topbar-touch);
  padding: 0 10px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--text-muted);
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}

.main-nav a:hover {
  background: var(--hover-tint);
  color: var(--text);
}

.main-nav a.active {
  background: var(--hover-tint);
  color: var(--brand-primary);
  font-weight: 600;
}

[data-theme="dark"] .main-nav a.active { color: var(--brand-secondary); }

.nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  margin-left: 4px;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1;
  background: color-mix(in srgb, var(--brand-primary) 22%, var(--bg-surface));
  color: var(--brand-primary);
}

.debug-search-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  min-height: var(--topbar-touch);
  padding: 0 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.8125rem;
  transition: border-color 0.15s, color 0.15s;
}

.debug-search-trigger:hover {
  border-color: color-mix(in srgb, var(--brand-primary) 35%, var(--border));
  color: var(--text);
}

.debug-search-trigger__text {
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.debug-search-kbd,
.debug-palette__esc {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.65rem;
  padding: 2px 5px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg-surface);
  color: var(--text-muted);
  line-height: 1.2;
}

.debug-palette-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding-top: 10vh;
  background: rgba(15, 20, 30, 0.42);
}

.debug-palette-overlay.is-open {
  display: flex;
}

.debug-palette-overlay[hidden] {
  display: none;
}

.debug-palette-overlay.is-open[hidden] {
  display: flex;
}

body.debug-search-open {
  overflow: hidden;
}

.debug-palette {
  width: min(520px, 92vw);
  background: var(--bg-surface);
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);
  overflow: hidden;
  border: 1px solid var(--border);
}

.debug-palette__head {
  position: relative;
}

.debug-palette__head input {
  width: 100%;
  padding: 16px 52px 16px 18px;
  border: none;
  border-bottom: 1px solid var(--border);
  background: var(--bg-surface);
  color: var(--text-primary);
  font-size: 16px;
  outline: none;
}

.debug-palette__esc {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.55;
  pointer-events: none;
}

.debug-palette__results {
  max-height: 320px;
  overflow-y: auto;
  padding: 6px 0;
}

.debug-palette__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.debug-palette__item:hover,
.debug-palette__item.is-selected {
  background: var(--hover-tint);
}

.debug-palette__item-title {
  font-size: 0.92rem;
  font-weight: 600;
}

.debug-palette__item-meta {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.debug-palette__empty {
  padding: 12px 16px;
  margin: 0;
}

.topbar-tools {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  padding-left: 8px;
  border-left: 1px solid var(--border);
}

.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--topbar-touch);
  height: var(--topbar-touch);
  min-width: var(--topbar-touch);
  min-height: var(--topbar-touch);
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-app);
  color: var(--text-muted);
  cursor: pointer;
  transition: border-color .15s, color .15s;
}

.btn-icon:hover {
  border-color: var(--brand-primary);
  color: var(--brand-primary);
}

.btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--topbar-touch);
  height: var(--topbar-touch);
  padding: 0 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
}

.btn-ghost:hover {
  border-color: var(--danger);
  color: var(--danger);
}

.logout-form {
  display: inline-flex;
  margin: 0;
  flex-shrink: 0;
}

.logout-form button.btn-logout {
  cursor: pointer;
  font-family: inherit;
}

.nav-toggle {
  display: none;
  flex-shrink: 0;
}

.nav-toggle-icon {
  display: block;
}

.nav-toggle-icon[hidden] {
  display: none !important;
}

body.nav-open {
  overflow: hidden;
}

.topbar-tools .btn-icon--ghost,
.topbar-tools #btn-theme.btn-icon {
  border: none;
  background: transparent;
}

.topbar-tools .btn-icon--ghost:hover,
.topbar-tools #btn-theme.btn-icon:hover {
  background: var(--hover-tint);
}

#btn-theme svg[hidden] {
  display: none !important;
}

#btn-theme svg:not([hidden]) {
  display: block;
}

.dash-personalize-btn {
  flex-shrink: 0;
  color: var(--text-muted);
}

.dash-personalize-btn svg {
  display: block;
}

/* theme icons: utils-kernel/assets/design-system/theme-icons.css via Utils::themeIconsCss() */

/* —— Page —— */
.page {
  max-width: var(--page-max);
  margin: 0 auto;
  padding: var(--space-lg);
}

.section-head { margin-bottom: var(--space-md); }
.section-head h2 { margin: 0 0 var(--space-xs); font-size: 1.15rem; font-weight: 600; }

/* —— Summary —— */
.summary-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.summary-card {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.summary-card .label { font-size: 0.8rem; color: var(--text-muted); }
.summary-card strong { font-size: 1.6rem; color: var(--brand-primary); font-weight: 700; }
[data-theme="dark"] .summary-card strong { color: var(--brand-secondary); }
.summary-card strong.small { font-size: 0.95rem; color: var(--text); font-weight: 600; }
.summary-card .sub { font-size: 0.75rem; color: var(--text-muted); }

/* —— Project grid —— */
.project-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-md);
}

.project-card {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
  border-left-width: 3px;
}

.project-card.health-online { border-left-color: var(--ok); }
.project-card.health-partial { border-left-color: var(--brand-secondary); }
.project-card.health-offline { border-left-color: var(--danger); }
.project-card.health-unknown { border-left-color: var(--border); }

.project-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-sm); }
.project-head h3 { margin: 0; font-size: 1rem; font-weight: 600; }
.project-domain { font-size: 0.85rem; margin: var(--space-xs) 0; }
.project-notes { font-size: 0.8rem; margin: 0 0 var(--space-sm); }
.project-meta { display: grid; gap: var(--space-xs); margin: 0; font-size: 0.85rem; }
.project-meta div { display: flex; gap: var(--space-sm); }
.project-meta dt { color: var(--text-muted); min-width: 4.5rem; margin: 0; }
.project-meta dd { margin: 0; }

/* —— Painel (home / overview) —— */
.page--painel {
  max-width: none;
  padding: 6px 10px;
  margin: 0;
}

.painel-dash-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  flex-shrink: 0;
}

.painel-dash-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.painel-dash-sub {
  margin: 2px 0 0;
}

.dash-layout {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  flex: 1 1 auto;
}

.dash-layout--bento {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 8px;
  align-content: start;
}

.dash-bento-span-2 {
  grid-column: 1 / -1;
}

@media (max-width: 900px) {
  .dash-layout--bento {
    grid-template-columns: 1fr;
  }

  .dash-bento-tasks,
  .dash-bento-capacity {
    grid-column: 1 / -1;
  }
}

@media (min-width: 901px) {
  .dash-bento-tasks {
    grid-column: 1;
    grid-row: auto;
    min-width: 0;
  }

  .dash-bento-capacity {
    grid-column: 2;
    grid-row: auto;
    min-width: 0;
  }
}

.dash-widget-chat {
  margin-bottom: 8px;
  flex-shrink: 0;
}

.agent-chat-module--compact .agents-chat-panel {
  max-height: 280px;
}

.agent-chat-module--compact .agents-chat-stream {
  max-height: 180px;
}

.agent-chat-module {
  min-height: 0;
}

.agent-chat-module .agents-chat-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}

.agent-chat-module .panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 4px 6px;
  border-bottom: 1px solid var(--border);
}

.agent-chat-module .panel-head h3 {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
}

.agent-chat-fab {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 120;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand-primary) 40%, var(--border));
  background: color-mix(in srgb, var(--brand-primary) 18%, var(--bg-surface));
  color: var(--text);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.agent-chat-fab[hidden] {
  display: none !important;
}

.agent-chat-fab:hover {
  background: color-mix(in srgb, var(--brand-primary) 28%, var(--bg-surface));
}

/* Dock flutuante — não bloqueia o painel com backdrop fullscreen */
.agent-chat-overlay {
  position: fixed;
  right: 16px;
  bottom: 72px;
  left: auto;
  top: auto;
  z-index: 130;
  width: min(380px, calc(100vw - 32px));
  max-height: min(42vh, 360px);
  background: transparent;
  display: none;
  flex-direction: column;
  pointer-events: none;
  padding: 0;
}

.agent-chat-overlay.is-open {
  display: flex;
  pointer-events: auto;
}

.agent-chat-overlay[hidden] {
  display: none !important;
  pointer-events: none;
}

.agent-chat-overlay__panel {
  width: 100%;
  max-height: min(42vh, 360px);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  min-height: 0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

.agent-chat-overlay__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}

.agent-chat-overlay .agent-chat-module,
.agent-chat-overlay .agents-chat-panel {
  border: none;
  border-radius: 0;
  flex: 1 1 auto;
  min-height: 0;
}

.agent-chat-overlay .agents-chat-stream {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: min(28vh, 220px);
}

.page--painel.has-agent-chat-fab {
  padding-bottom: 56px;
}

.page--painel.has-agent-chat-fab.agent-chat-dock-open {
  padding-bottom: calc(min(42vh, 360px) + 72px);
}

.dash-personalize-body {
  display: grid;
  gap: 10px;
}

.dash-personalize-fieldset {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  margin: 0;
}

.dash-personalize-legend {
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0 4px;
}

.dash-personalize-check {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.85rem;
  margin-top: 8px;
  cursor: pointer;
}

.dash-personalize-check--indent {
  margin-left: 18px;
  font-size: 0.8rem;
  color: var(--text-muted);
}

.dash-personalize-check input {
  margin-top: 2px;
}

@media (min-width: 961px) {
  .page--painel {
    height: calc(100vh - var(--topbar-h));
    max-height: calc(100vh - var(--topbar-h));
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .page--painel .project-grid--painel {
    flex: 1 1 auto;
    min-height: 120px;
    overflow: hidden;
  }
}

.painel-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 8px;
  flex-shrink: 0;
}

.summary-card--compact {
  padding: 6px 8px;
  gap: 2px;
  border-radius: var(--radius-sm);
}

.summary-card--compact .label {
  font-size: 0.68rem;
  line-height: 1.2;
}

.summary-card--compact strong {
  font-size: 1.15rem;
  line-height: 1.2;
}

.summary-card--compact strong.small {
  font-size: 0.78rem;
}

.summary-card--compact .sub {
  font-size: 0.65rem;
  line-height: 1.2;
}

.painel-projects-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
  flex-shrink: 0;
}

.painel-projects-head h2 {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
}

.painel-projects-head .muted {
  font-size: 0.68rem;
}

.project-grid--painel {
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 6px;
  align-content: start;
}

.project-card--compact {
  padding: 6px 8px;
  border-radius: var(--radius-sm);
  border-left-width: 2px;
}

.project-card--compact .project-head {
  gap: 4px;
  align-items: center;
}

.project-card--compact .project-head h3 {
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.25;
  flex: 1;
  min-width: 0;
}

.project-card--compact .prio {
  font-size: 0.58rem;
  padding: 1px 5px;
  flex-shrink: 0;
}

.project-card--compact .project-domain {
  font-size: 0.62rem;
  margin: 2px 0 0;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.project-foot {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 0.62rem;
  line-height: 1.25;
  flex-wrap: wrap;
}

.project-foot-health {
  flex: 1;
  min-width: 0;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.project-foot-bugs {
  font-weight: 600;
  white-space: nowrap;
}

.project-foot-state {
  color: var(--text-muted);
  white-space: nowrap;
}

.project-card--compact .health-dot {
  width: 6px;
  height: 6px;
  margin-right: 2px;
}

.painel-empty {
  font-size: 0.8rem;
  grid-column: 1 / -1;
}

.project-card--clickable {
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.project-card--clickable:hover {
  border-color: var(--brand-secondary);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.project-card--clickable:focus-visible {
  outline: 2px solid var(--brand-secondary);
  outline-offset: 1px;
}

.project-card--clickable.is-favorite {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand-secondary) 35%, transparent);
}

.project-card__fav {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--text-muted);
  font-size: 0.85rem;
  line-height: 1;
  cursor: pointer;
}

.project-card__fav.is-fav,
.painel-modal-fav.is-fav {
  color: var(--brand-secondary);
}

.modal-dialog--painel {
  max-width: 520px;
}

.painel-modal-inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
}

.painel-modal-head {
  align-items: flex-start;
}

.painel-modal-title-wrap h3 {
  margin: 0;
}

.painel-modal-head-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

.painel-modal-fav {
  min-width: 32px;
  font-size: 1rem;
  line-height: 1;
}

.painel-modal-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: min(60vh, 420px);
  overflow: auto;
  font-size: 0.8rem;
}

.painel-modal-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  margin: 0;
}

.painel-modal-meta > div {
  display: grid;
  gap: 2px;
}

.painel-modal-meta dt {
  margin: 0;
  font-size: 0.68rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.painel-modal-meta dd {
  margin: 0;
}

.painel-modal-notes {
  grid-column: 1 / -1;
}

.painel-modal-section h4 {
  margin: 0 0 4px;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.painel-modal-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0 0 6px;
}

.painel-modal-stats strong {
  font-size: 0.95rem;
}

.painel-modal-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}

.painel-modal-list li {
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-app);
  line-height: 1.35;
}

.painel-modal-list-title {
  font-weight: 500;
}

.painel-modal-list--errors li {
  font-size: 0.72rem;
  word-break: break-word;
}

.painel-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.painel-modal-foot {
  margin-top: 0;
}

/* Modal projetos/painel — contraste de botões (anula cor global de links em <a.btn-*>) */
.modal-dialog--painel .painel-modal-actions .btn-primary,
.modal-dialog--painel .painel-modal-actions a.btn-primary,
.modal-dialog--painel .painel-modal-actions a.btn-primary:visited {
  background: var(--brand-primary);
  color: var(--text-on-brand);
  border: none;
}

.modal-dialog--painel .painel-modal-actions .btn-primary:hover,
.modal-dialog--painel .painel-modal-actions a.btn-primary:hover {
  filter: brightness(1.06);
}

[data-theme="dark"] .modal-dialog--painel .painel-modal-actions .btn-primary,
[data-theme="dark"] .modal-dialog--painel .painel-modal-actions a.btn-primary,
[data-theme="dark"] .modal-dialog--painel .painel-modal-actions a.btn-primary:visited {
  background: var(--brand-secondary);
  color: #1a1a2e;
}

.modal-dialog--painel .painel-modal-head-actions .btn-ghost,
.modal-dialog--painel .painel-modal-actions .btn-ghost,
.modal-dialog--painel .painel-modal-actions a.btn-ghost,
.modal-dialog--painel .painel-modal-actions a.btn-ghost:visited {
  background: var(--bg-app);
  color: var(--text);
  border: 1px solid var(--border);
}

.modal-dialog--painel .painel-modal-head-actions .btn-ghost:hover,
.modal-dialog--painel .painel-modal-actions .btn-ghost:hover,
.modal-dialog--painel .painel-modal-actions a.btn-ghost:hover {
  border-color: var(--brand-primary);
  color: var(--brand-primary);
  background: var(--hover-tint);
}

[data-theme="dark"] .modal-dialog--painel .painel-modal-head-actions .btn-ghost:hover,
[data-theme="dark"] .modal-dialog--painel .painel-modal-actions .btn-ghost:hover,
[data-theme="dark"] .modal-dialog--painel .painel-modal-actions a.btn-ghost:hover {
  border-color: var(--brand-secondary);
  color: var(--brand-secondary);
}

/* Página /projetos — lista do ecossistema */
.page--projects .section-head {
  margin-bottom: 1rem;
}

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

.projects-table th,
.projects-table td {
  padding: 10px 12px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid var(--border);
}

.projects-table th {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}

.projects-row--clickable {
  cursor: pointer;
  transition: background 0.12s ease;
}

.projects-row--clickable:hover,
.projects-row--clickable:focus-visible {
  background: var(--bg-hover, rgba(255, 255, 255, 0.04));
  outline: none;
}

.projects-table__name {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.projects-table__bugs {
  color: var(--accent, #5b9cff);
  font-weight: 600;
  text-decoration: none;
}

.projects-table__bugs:hover {
  text-decoration: underline;
}

.projects-table__progress {
  min-width: 140px;
}

.projects-progress {
  display: inline-block;
  vertical-align: middle;
  width: 72px;
  height: 6px;
  background: var(--border);
  border-radius: 3px;
  overflow: hidden;
  margin-right: 6px;
}

.projects-progress__bar {
  height: 100%;
  background: var(--accent, #5b9cff);
  border-radius: 3px;
  min-width: 2px;
}

.projects-progress__label {
  font-size: 13px;
  font-weight: 600;
}

.projects-table-foot {
  margin-top: 0.75rem;
}

@media (max-width: 960px) {
  .projects-table thead {
    display: none;
  }

  .projects-table tr {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
  }

  .projects-table td {
    display: block;
    border: none;
    padding: 4px 0;
  }

  .projects-table td::before {
    content: attr(data-label);
    display: inline-block;
    font-size: 11px;
    text-transform: uppercase;
    color: var(--text-muted);
    min-width: 90px;
    margin-right: 8px;
  }
}

@media (max-width: 960px) {
  .page--painel {
    height: auto;
    max-height: none;
    overflow: visible;
    padding: 8px;
  }

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

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

  .project-card--compact .project-head h3 {
    font-size: 0.82rem;
  }
}

@media (max-width: 480px) {
  .painel-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* —— Dashboard tasks (home pendências) —— */
.dash-tasks.panel {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 8px;
  flex-shrink: 0;
}

.dash-tasks-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}

.dash-tasks-head h2 {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 600;
}

.dash-tasks-meta {
  display: block;
  font-size: 0.72rem;
  margin-top: 2px;
}

.dash-tasks-links {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.btn-ghost--sm {
  font-size: 0.72rem;
  padding: 3px 8px;
  min-height: 0;
}

.dash-tasks-error {
  margin: 8px 10px 0;
  font-size: 0.82rem;
}

.dash-focus {
  border-bottom: 1px solid var(--border);
}

.dash-focus__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  cursor: pointer;
  list-style: none;
}

.dash-focus__summary::-webkit-details-marker {
  display: none;
}

.dash-focus__summary::before {
  content: '▸';
  margin-right: 6px;
  color: var(--text-muted);
  transition: transform 0.15s ease;
}

.dash-focus[open] .dash-focus__summary::before {
  transform: rotate(90deg);
}

.dash-focus__title-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.dash-focus__title-wrap strong {
  font-size: 0.85rem;
  font-weight: 600;
}

.dash-focus__progress {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  flex-shrink: 0;
}

.dash-focus__bar {
  display: inline-block;
  width: 56px;
  height: 5px;
  background: var(--border);
  border-radius: 999px;
  overflow: hidden;
}

.dash-focus__bar-fill {
  display: block;
  height: 100%;
  background: var(--brand-secondary);
  border-radius: 999px;
  transition: width 0.2s ease;
}

.dash-focus__summary-text {
  margin: 0 10px 6px;
  font-size: 0.78rem;
}

.dash-task-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 0 10px 8px;
}

.dash-task-columns--main {
  padding-top: 8px;
}

.dash-task-col__title {
  margin: 0 0 4px;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.dash-task-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dash-task {
  background: color-mix(in srgb, var(--bg-app) 55%, transparent);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}

.dash-task__label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 8px;
  cursor: pointer;
  margin: 0;
}

.dash-task__check {
  margin-top: 3px;
  flex-shrink: 0;
  accent-color: var(--brand-primary);
}

.dash-task__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.dash-task__title {
  font-size: 0.82rem;
  line-height: 1.35;
}

.dash-task__notes {
  font-size: 0.7rem;
  line-height: 1.3;
}

.dash-task__prio {
  flex-shrink: 0;
  font-size: 0.65rem;
}

.dash-task-list--done .dash-task__title {
  text-decoration: line-through;
  color: var(--text-muted);
}

.dash-task-empty {
  font-size: 0.78rem;
  padding: 4px 0;
}

.dash-completed-wrap {
  margin: 0;
}

.dash-completed__summary {
  display: flex;
  align-items: baseline;
  gap: 4px;
  cursor: pointer;
  list-style: none;
  margin-bottom: 4px;
}

.dash-completed__summary::-webkit-details-marker {
  display: none;
}

.dash-completed__summary .dash-task-col__title {
  margin: 0;
}

@media (max-width: 720px) {
  .dash-task-columns {
    grid-template-columns: 1fr;
  }

  .dash-tasks-head {
    flex-direction: column;
    align-items: stretch;
  }

  .dash-focus__summary {
    flex-wrap: wrap;
  }
}

/* —— Telegram + modal config —— */
.page--telegram .telegram-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.page--telegram .telegram-head h2 {
  margin: 0;
  font-size: 1rem;
}

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

.telegram-api-error { margin-bottom: 8px; }

.telegram-toast {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 1200;
  max-width: 360px;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  font-size: 0.85rem;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.telegram-toast.is-ok {
  color: var(--ok);
  background: color-mix(in srgb, var(--ok) 14%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--ok) 40%, transparent);
}

.telegram-toast.is-error {
  color: var(--danger, #f87171);
  background: color-mix(in srgb, var(--danger, #f87171) 12%, var(--bg-surface));
  border: 1px solid color-mix(in srgb, var(--danger, #f87171) 35%, transparent);
}

.telegram-form-feedback {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.8rem;
}

.telegram-form-feedback.is-ok {
  color: var(--ok);
  background: color-mix(in srgb, var(--ok) 10%, transparent);
}

.telegram-form-feedback.is-error {
  color: var(--danger, #f87171);
  background: color-mix(in srgb, var(--danger, #f87171) 10%, transparent);
}

.modal-field-row {
  display: flex;
  gap: 6px;
  align-items: center;
}

.modal-field-row input {
  flex: 1;
  min-width: 0;
}

.field-hint {
  font-size: 0.72rem;
  color: var(--text-muted, var(--muted));
  line-height: 1.35;
}

.btn-sm {
  padding: 6px 8px;
  font-size: 0.75rem;
  white-space: nowrap;
}

.env-catalog {
  margin-top: var(--space-md);
  font-size: 0.8rem;
}

.env-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
  margin-top: 8px;
}

.env-catalog-item {
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-surface);
}

.modal-dialog {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0;
  max-width: 480px;
  width: calc(100% - 24px);
  background: var(--bg-surface);
  color: var(--text);
}

.modal-dialog::backdrop {
  background: rgba(0, 0, 0, 0.45);
}

.modal-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
}

.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.modal-head h3 {
  margin: 0;
  font-size: 0.95rem;
}

.modal-field {
  display: grid;
  gap: 4px;
  font-size: 0.8rem;
}

.modal-field input {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text);
  font-size: 0.85rem;
}

.modal-check {
  font-size: 0.8rem;
  display: flex;
  gap: 6px;
  align-items: center;
}

.modal-foot {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 4px;
  border-top: 1px solid var(--border);
}

/* —— Manual de comandos (livro topbar + modal) —— */
.btn-manual-book {
  padding: 6px 7px;
}

.btn-manual-book:hover .icon-book-open {
  transform: scale(1.06);
}

.icon-book-open {
  display: block;
  transition: transform .15s ease;
}

.modal-dialog--manual {
  max-width: min(920px, calc(100vw - 24px));
  width: calc(100% - 24px);
  max-height: calc(100vh - 32px);
}

.manual-modal-inner {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 48px);
}

.manual-modal-head {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}

.manual-modal-body {
  padding: 12px 14px 16px;
  overflow: auto;
  flex: 1;
  min-height: 200px;
}

.manual-modal-foot {
  padding: 8px 14px 12px;
  border-top: 1px solid var(--border);
}

.manual-content h2 {
  margin: 0 0 10px;
  font-size: 1.15rem;
  color: var(--brand-primary);
}

.manual-content h3 {
  margin: 18px 0 8px;
  font-size: 0.95rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 4px;
}

.manual-content h4 {
  margin: 12px 0 6px;
  font-size: 0.88rem;
}

.manual-content p {
  margin: 0 0 8px;
  font-size: 0.85rem;
}

.manual-ul {
  margin: 0 0 10px;
  padding-left: 1.2rem;
  font-size: 0.85rem;
}

.manual-ul li { margin-bottom: 4px; }

.manual-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
  margin: 8px 0 12px;
}

.manual-table th,
.manual-table td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  text-align: left;
  vertical-align: top;
}

.manual-table th {
  background: var(--bg-app);
  font-weight: 600;
}

.manual-table tr:nth-child(even) td {
  background: color-mix(in srgb, var(--bg-app) 55%, transparent);
}

.manual-code {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  padding: 1px 5px;
  border-radius: 4px;
  background: var(--bg-app);
  border: 1px solid var(--border);
}

.manual-pre {
  margin: 8px 0 12px;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  background: var(--bg-app);
  border: 1px solid var(--border);
  overflow-x: auto;
  font-size: 0.78rem;
  line-height: 1.45;
}

.manual-hr {
  border: none;
  border-top: 1px solid var(--border);
  margin: 14px 0;
}

/* Arquitetura & Docs — /arquitetura */
.arquitetura-page .arquitetura-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.arquitetura-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.arquitetura-meta {
  margin: 0 0 12px;
}

.arquitetura-doc {
  padding: 16px 18px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.arquitetura-doc .mermaid {
  margin: 16px 0;
  padding: 12px;
  background: var(--bg-app);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow-x: auto;
}

.arquitetura-doc table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
  font-size: 0.88rem;
}

.arquitetura-doc table th,
.arquitetura-doc table td {
  border: 1px solid var(--border);
  padding: 6px 10px;
  text-align: left;
}

.arquitetura-doc table th {
  background: var(--bg-app);
}

.arquitetura-error {
  padding: 16px 18px;
}

@media (max-width: 640px) {
  .telegram-status-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.prio {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--bg-app);
  border: 1px solid var(--border);
}
.prio-P1 { color: var(--danger); }
.prio-P2 { color: var(--brand-secondary); }

.health-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 6px;
  vertical-align: middle;
}
.health-dot.health-online { background: var(--ok); }
.health-dot.health-partial { background: var(--brand-secondary); }
.health-dot.health-offline { background: var(--danger); }
.health-dot.health-unknown { background: var(--text-muted); }

/* —— Filters / stats chips —— */
.stats, .filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.stat {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: var(--text);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  font-size: 0.875rem;
  transition: border-color .15s, background .15s;
}

.stat:hover { border-color: var(--brand-primary); }
.stat.active { border-color: var(--brand-primary); background: var(--hover-tint); }
.stat span { font-weight: 700; color: var(--brand-secondary); }

.bugs-site-filter {
  margin: var(--space-xs) 0 0;
  font-size: 0.875rem;
}

.bugs-table .msg { max-width: 280px; word-break: break-word; }

@media (max-width: 720px) {
  .bugs-page .filters {
    gap: var(--space-xs);
  }

  .bugs-page .stat {
    flex: 1 1 calc(50% - var(--space-xs));
    justify-content: center;
    min-width: 0;
    padding: var(--space-sm);
    font-size: 0.8rem;
  }

  .bugs-page .feed {
    padding: var(--space-sm);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 640px) {
  .bugs-table thead { display: none; }

  .bugs-table tr {
    display: block;
    padding: var(--space-sm) 0;
    border-bottom: 1px solid var(--border);
  }

  .bugs-table td {
    display: block;
    border: none;
    padding: var(--space-xs) 0;
  }

  .bugs-table td::before {
    content: attr(data-label);
    display: inline-block;
    font-size: 0.68rem;
    text-transform: uppercase;
    color: var(--text-muted);
    min-width: 72px;
    margin-right: 8px;
    font-weight: 600;
  }

  .bugs-table .msg {
    max-width: none;
  }
}

.feedback-table .msg { max-width: 280px; word-break: break-word; }

@media (max-width: 640px) {
  .page--feedback .feed {
    padding: var(--space-sm);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .feedback-table thead { display: none; }

  .feedback-table tr {
    display: block;
    padding: var(--space-sm) 0;
    border-bottom: 1px solid var(--border);
  }

  .feedback-table td {
    display: block;
    border: none;
    padding: var(--space-xs) 0;
  }

  .feedback-table td::before {
    content: attr(data-label);
    display: inline-block;
    font-size: 0.68rem;
    text-transform: uppercase;
    color: var(--text-muted);
    min-width: 72px;
    margin-right: 8px;
    font-weight: 600;
  }

  .feedback-table .msg {
    max-width: none;
  }
}

/* —— Tables —— */
.feed {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
}

table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
th, td {
  padding: var(--space-sm) var(--space-sm);
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}
th { color: var(--text-muted); font-weight: 600; font-size: 0.8rem; }
.msg { max-width: 280px; word-break: break-word; }

code {
  font-size: 0.85em;
  background: var(--bg-app);
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid var(--border);
}

.tag, .sev {
  font-size: 0.7rem;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 6px;
  font-weight: 600;
}
.tag-spam { background: #fde8e8; color: #b71c1c; }
.tag-bug { background: #f3e8fd; color: #6a1b9a; }
.tag-suggestion { background: #e3f2fd; color: #1565c0; }
.tag-service_opportunity { background: #e8f5e9; color: #2e7d32; }
.tag-unknown { background: var(--bg-app); color: var(--text-muted); }

[data-theme="dark"] .tag-spam { background: #4a2020; color: #ff8a80; }
[data-theme="dark"] .tag-bug { background: #3a2848; color: #ce93d8; }
[data-theme="dark"] .tag-suggestion { background: #1e3348; color: #90caf9; }
[data-theme="dark"] .tag-service_opportunity { background: #1e3320; color: #a5d6a7; }

.sev-critical { background: #fde8e8; color: #b71c1c; }
.sev-high { background: #fff3e0; color: #e65100; }
.sev-medium { background: var(--bg-app); color: var(--text-muted); }
.sev-low { background: #e8f5e9; color: #2e7d32; }
.sev-info { background: #e3f2fd; color: #1565c0; }

[data-theme="dark"] .sev-critical { background: #4a2020; color: #ff8a80; }
[data-theme="dark"] .sev-high { background: #3d3018; color: #ffcc80; }
[data-theme="dark"] .sev-info { background: #1e3348; color: #90caf9; }

/* —— Auth —— */
body.auth-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: var(--space-lg);
  background: var(--bg-app);
}

.auth-card {
  width: min(100%, 400px);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-xl);
  box-shadow: 0 8px 32px rgba(0, 0, 0, .06);
}

[data-theme="dark"] .auth-card { box-shadow: 0 8px 32px rgba(0, 0, 0, .25); }

.auth-card h1 {
  margin: 0 0 var(--space-xs);
  font-size: 1.35rem;
  color: var(--brand-primary);
}

[data-theme="dark"] .auth-card h1 { color: var(--brand-secondary); }

.auth-top {
  display: flex;
  justify-content: flex-end;
  margin-bottom: var(--space-md);
}

.auth-card form { display: grid; gap: var(--space-md); margin-top: var(--space-md); }
.auth-card label { display: grid; gap: var(--space-xs); font-size: 0.9rem; font-weight: 500; }

.auth-card input {
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text);
}

.auth-card input:focus {
  outline: 2px solid color-mix(in srgb, var(--brand-primary) 35%, transparent);
  border-color: var(--brand-primary);
}

.auth-card button[type="submit"] {
  padding: 12px;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--brand-primary);
  color: var(--text-on-brand);
  font-weight: 600;
  cursor: pointer;
  margin-top: var(--space-xs);
}

[data-theme="dark"] .auth-card button[type="submit"] {
  background: var(--brand-secondary);
  color: #1a1a2e;
}

.auth-card button[type="submit"]:disabled { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 720px) {
  :root {
    --topbar-h: 44px;
    --topbar-touch: 34px;
  }

  .topbar {
    gap: 6px;
    padding: 0 10px;
    flex-wrap: nowrap;
  }

  .brand strong {
    font-size: 0.875rem;
  }

  .topbar-actions {
    gap: 4px;
    min-width: 0;
    flex-shrink: 1;
  }

  .debug-search-trigger__text,
  .debug-search-kbd {
    display: none;
  }

  .debug-search-trigger {
    padding: 0 8px;
  }

  .nav-toggle {
    display: inline-flex;
  }

  .main-nav {
    display: none;
    position: fixed;
    top: var(--topbar-h);
    left: 0;
    right: 0;
    z-index: 180;
    flex: none;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    max-height: calc(100dvh - var(--topbar-h));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 10px 12px;
    background: var(--bg-surface);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
  }

  .main-nav.is-open {
    display: flex;
  }

  .main-nav a {
    justify-content: flex-start;
    width: 100%;
    padding: 10px 12px;
    font-size: 0.85rem;
  }

  body.nav-open {
    overflow: hidden;
  }

  .topbar-tools {
    padding-left: 6px;
    gap: 4px;
  }

  .btn-ghost.btn-logout {
    padding: 0 8px;
    font-size: 0.75rem;
  }

  .page { padding: var(--space-md); }
}

@media (max-width: 390px) {
  .topbar {
    padding: 0 8px;
    gap: 4px;
  }

  .topbar-tools .btn-manual-book {
    display: none;
  }

  .btn-ghost.btn-logout {
    padding: 0 6px;
    min-width: var(--topbar-touch);
    font-size: 0.7rem;
  }
}

@media (max-width: 640px) {
  table, thead, tbody, th, td, tr { display: block; }
  thead { display: none; }
  td { border: none; padding: var(--space-xs) 0; }
}

/* —— Settings / Coleta —— */
.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.settings-panel {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
}

.settings-panel h3 { margin: 0 0 var(--space-md); font-size: 1rem; }

.settings-form {
  display: grid;
  gap: var(--space-md);
}

.settings-form label {
  display: grid;
  gap: var(--space-xs);
  font-size: 0.9rem;
  font-weight: 500;
}

.settings-form .small { font-size: 0.8rem; margin: 0; }

.btn-secondary {
  padding: 10px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-app);
  color: var(--text);
  font-weight: 600;
  cursor: pointer;
}

/* —— Botões e campos de formulário (padrão UtilsBR) —— */
.btn,
.btn-primary,
button.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: var(--topbar-touch);
  padding: 0 16px;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--brand-primary);
  color: var(--text-on-brand);
  font: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: filter 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.btn:hover,
.btn-primary:hover,
button.btn:hover {
  filter: brightness(1.06);
}

[data-theme="dark"] .btn,
[data-theme="dark"] .btn-primary,
[data-theme="dark"] button.btn {
  background: var(--brand-secondary);
  color: #1a1a2e;
}

[data-theme="dark"] .btn:hover,
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] button.btn:hover {
  filter: brightness(1.08);
}

.control-app .form-control,
.contratos-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.contratos-field select,
.contratos-field textarea,
.financeiro-filters select,
.settings-form input[type="number"],
.settings-form input[type="text"],
.approval-form input[type="text"],
.approval-form--inline input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text);
  font: inherit;
  font-size: 0.875rem;
  line-height: 1.35;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.contratos-field select,
.financeiro-filters select,
.control-app .form-control--select,
.control-app select.form-control {
  width: auto;
  min-width: 140px;
  padding-right: 32px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235c6370' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px;
  cursor: pointer;
}

[data-theme="dark"] .contratos-field select,
[data-theme="dark"] .financeiro-filters select,
[data-theme="dark"] .control-app select.form-control {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23b4bac4' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
}

.contratos-field input[type="date"],
.contratos-field input[type="month"],
.contratos-field input[type="datetime-local"],
.contratos-golive input[type="month"],
.financeiro-filters input[type="date"],
.control-app input[type="date"].form-control,
.control-app input[type="month"].form-control {
  min-height: 36px;
  color-scheme: light;
}

[data-theme="dark"] .contratos-field input[type="date"],
[data-theme="dark"] .contratos-field input[type="month"],
[data-theme="dark"] .contratos-field input[type="datetime-local"],
[data-theme="dark"] .contratos-golive input[type="month"],
[data-theme="dark"] .financeiro-filters input[type="date"],
[data-theme="dark"] .control-app input[type="date"].form-control,
[data-theme="dark"] .control-app input[type="month"].form-control {
  color-scheme: dark;
}

.contratos-field input:focus,
.contratos-field select:focus,
.contratos-field textarea:focus,
.financeiro-filters select:focus,
.financeiro-filters input:focus,
.control-app .form-control:focus {
  outline: none;
  border-color: var(--brand-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-primary) 22%, transparent);
}

.contratos-field input[type="date"]::-webkit-calendar-picker-indicator,
.contratos-field input[type="month"]::-webkit-calendar-picker-indicator,
.contratos-golive input[type="month"]::-webkit-calendar-picker-indicator,
.financeiro-filters input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.75;
}

[data-theme="dark"] .contratos-field input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] .contratos-field input[type="month"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] .contratos-golive input[type="month"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] .financeiro-filters input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.85);
}

.contratos-dialog__foot .btn,
.contratos-dialog__foot .btn-ghost,
.contratos-dialog__foot .btn-primary {
  min-height: 36px;
}

body.control-app {
  color-scheme: light;
}

[data-theme="dark"] body.control-app {
  color-scheme: dark;
}

.inline-top { margin-top: var(--space-md); }

.cron-box {
  background: var(--bg-app);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: var(--space-sm);
  font-size: 0.75rem;
  overflow-x: auto;
  word-break: break-all;
  white-space: pre-wrap;
}

.msg-cell { max-width: 420px; font-size: 0.8rem; }

.tag-ok { background: #e8f5e9; color: #2e7d32; }
.tag-error { background: #fde8e8; color: #b71c1c; }
.tag-running { background: #e3f2fd; color: #1565c0; }

/* —— Relatório —— */
.report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
}

.report-head-actions {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
}

.report-progress-row { margin-bottom: var(--space-md); }

.report-errors-head {
  margin-top: var(--space-lg);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.report-progress-table .progress-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 72px;
}

.progress-mini {
  flex: 1;
  height: 5px;
  background: color-mix(in srgb, var(--text-muted) 20%, transparent);
  border-radius: 999px;
  overflow: hidden;
  max-width: 48px;
}

.progress-mini-bar {
  display: block;
  height: 100%;
  background: var(--ok);
  border-radius: 999px;
}

.report-sync-note { margin: var(--space-sm) 0 0; }

.report-recent-fixed { margin-bottom: var(--space-md); }

.report-fixed-list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.85rem;
}

.report-fixed-list li {
  padding: 4px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}

.tag-fixed {
  background: color-mix(in srgb, var(--ok) 18%, transparent);
  font-size: 0.72rem;
  margin-right: 4px;
}

.report-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.report-panel {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
}

.report-panel h3 { margin: 0 0 var(--space-md); font-size: 0.95rem; }

.compact-table { width: 100%; font-size: 0.85rem; }
.compact-table th, .compact-table td { padding: var(--space-xs) var(--space-sm); text-align: left; }

.report-filters { margin-bottom: var(--space-md); }
.filters-label {
  font-size: 0.8rem;
  color: var(--text-muted);
  margin-right: var(--space-xs);
  margin-left: var(--space-sm);
}
.filters-label:first-child { margin-left: 0; }

.count-badge { font-size: 0.85rem; font-weight: 500; }

.msg-expand {
  max-width: 480px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 0.8rem;
  line-height: 1.4;
}

.row-active { background: color-mix(in srgb, var(--brand-primary) 6%, transparent); }

code.small { font-size: 0.75rem; }

/* Agents terminal */
.agents-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
  margin-bottom: var(--space-md);
}

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

.agents-kv {
  display: grid;
  gap: var(--space-sm);
  margin: 0;
}

.agents-kv > div {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: var(--space-xs);
}

.agents-kv dt { margin: 0; color: var(--text-muted); font-size: 0.85rem; }
.agents-kv dd { margin: 0; font-size: 0.9rem; }

.badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
}

.badge-ok { background: #d8ede0; color: #1e6b3a; }
.badge-off { background: #e4e6ea; color: #5c6370; }

[data-theme="dark"] .badge-ok { background: #2a4532; color: #8fd4a8; }
[data-theme="dark"] .badge-off { background: #454a55; color: #b4bac4; }

.agents-next h4,
.agents-recent-commands h4 {
  margin: var(--space-md) 0 var(--space-xs);
  font-size: 0.85rem;
}

.agents-next-list,
#agents-commands-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
  font-size: 0.85rem;
}

.agents-command-form {
  display: grid;
  gap: var(--space-sm);
}

.agents-command-form textarea {
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text);
  font-family: inherit;
  resize: vertical;
}

.agents-terminal {
  margin: 0;
  padding: var(--space-md);
  min-height: 280px;
  max-height: 480px;
  overflow: auto;
  background: #1a1228;
  color: #e8e0f0;
  border-radius: var(--radius-sm);
  font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.agents-terminal-panel .panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Agents live — homeserver (full viewport, compact, no page scroll) */
body.control-app:has(.agents-page--live) {
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

body.control-app:has(.agents-page--live) .topbar {
  flex-shrink: 0;
}

.agents-page--live.page {
  max-width: none;
  margin: 0;
  padding: 4px 6px;
  flex: 1;
  min-height: 0;
  height: auto;
  max-height: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.agents-page--live .agents-live-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 2px;
  padding: 2px 0;
  min-height: 0;
  flex-shrink: 0;
  line-height: 1.25;
}

/* Agent capacity — core slots grid */
.agents-capacity-panel {
  flex-shrink: 0;
  margin-bottom: 4px;
  padding: 4px 8px;
}

.agents-capacity-panel .panel-head {
  margin-bottom: 2px;
  min-height: 0;
}

.agents-capacity-panel h3 {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
}

.agents-capacity-meta {
  font-size: 0.65rem;
}

.agents-capacity-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
  font-size: 0.65rem;
}

.agents-capacity-summary .badge {
  font-size: 0.6rem;
  padding: 1px 6px;
}

.agents-core-slots {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3px;
}

@media (max-width: 960px) {
  .agents-core-slots {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 520px) {
  .agents-core-slots {
    grid-template-columns: repeat(3, 1fr);
  }
}

.core-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 3px 4px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--bg-app);
  font-size: 0.58rem;
  line-height: 1.2;
  min-height: 2.6rem;
  overflow: hidden;
}

.core-slot--free {
  border-style: dashed;
  opacity: 0.75;
}

.core-slot--free .core-slot-label {
  color: var(--text-muted);
  font-style: italic;
}

.core-slot--live {
  border-color: color-mix(in srgb, var(--brand-primary) 55%, var(--border));
  background: color-mix(in srgb, var(--brand-primary) 8%, var(--bg-app));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand-primary) 20%, transparent);
}

.core-slot-num {
  font-weight: 700;
  font-size: 0.55rem;
  color: var(--text-muted);
}

.core-slot-prio {
  position: absolute;
  top: 2px;
  right: 3px;
  font-size: 0.5rem;
  font-weight: 700;
  color: var(--brand-primary);
}

.core-slot-label {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.core-slot-agents {
  font-size: 0.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.core-slot-live {
  position: absolute;
  bottom: 2px;
  right: 3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: transparent;
}

.core-slot--live .core-slot-live {
  background: #1e6b3a;
  box-shadow: 0 0 4px #1e6b3a;
}

[data-theme="dark"] .core-slot--live .core-slot-live {
  background: #8fd4a8;
  box-shadow: 0 0 4px #8fd4a8;
}

.agents-job-queue {
  margin: 0.65rem 0 0;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg-surface) 92%, var(--brand-primary));
}

.agents-job-queue-title {
  margin: 0 0 0.35rem;
}

.agents-job-queue-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.agents-job-queue-item {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.72rem;
  min-width: 0;
}

.agents-job-queue-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agents-job-queue-agents {
  font-size: 0.65rem;
  max-width: 42%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.badge-warn {
  background: color-mix(in srgb, var(--brand-primary) 18%, var(--bg-surface));
  color: var(--brand-primary);
  border: 1px solid color-mix(in srgb, var(--brand-primary) 35%, var(--border));
}

.agents-ondemand-details {
  margin-top: 4px;
  font-size: 0.65rem;
}

.agents-ondemand-details summary {
  cursor: pointer;
  font-weight: 600;
  user-select: none;
}

.agents-ondemand-note {
  margin: 4px 0;
  font-size: 0.6rem;
}

.agents-ondemand-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  font-size: 0.6rem;
}

.agents-ondemand-list code {
  font-size: 0.58rem;
}

.agents-live-head-title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.agents-live-head-meta {
  font-size: 0.68rem;
  font-weight: 400;
}

.agents-page--live .agents-live-head .badge {
  font-size: 0.62rem;
  padding: 1px 6px;
  flex-shrink: 0;
}

.agents-live-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.agents-live-layout > .agent-chat-module {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.agents-live-layout > .agent-chat-module .agents-chat-panel {
  flex: 1 1 auto;
}

.agents-workers-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 2px;
}

.agents-panel-toggle {
  display: none;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--bg-app);
  color: var(--text-muted);
  font-size: 0.62rem;
  cursor: pointer;
  line-height: 1.2;
}

.agents-panel-toggle:hover {
  color: var(--text);
  border-color: color-mix(in srgb, var(--brand-primary) 40%, var(--border));
}

.agents-panel-toggle-chevron {
  font-size: 0.55rem;
}

.agents-workers-head-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.agents-workers-head-actions .btn-workers-toggle-all {
  padding: 2px 6px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--bg-app);
  color: var(--text-muted);
  font-size: 0.62rem;
  cursor: pointer;
  line-height: 1.2;
  white-space: nowrap;
}

.agents-workers-head-actions .btn-workers-toggle-all:hover {
  color: var(--text);
  border-color: color-mix(in srgb, var(--brand-primary) 40%, var(--border));
}

.agents-workers-head-actions .btn-workers-toggle-all[hidden] {
  display: none;
}

.agents-mobile-bar {
  display: none;
  width: 100%;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-surface);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  flex-shrink: 0;
}

.agents-mobile-bar-summary {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  font-size: 0.68rem;
}

.agents-mobile-bar-summary strong {
  font-weight: 600;
}

.badge-xs {
  font-size: 0.58rem;
  padding: 1px 5px;
}

.agents-mobile-workers {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.agents-mobile-worker {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  font-size: 0.62rem;
  white-space: nowrap;
}

.agents-mobile-worker-name {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 7rem;
}

.agents-mobile-worker-pct {
  color: var(--text-muted);
  flex-shrink: 0;
}

.agents-mobile-bar-chevron {
  flex-shrink: 0;
  font-size: 0.55rem;
  color: var(--text-muted);
}

.agent-priority-shield {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14px;
  height: 14px;
  padding: 0 2px;
  font-size: 0.55rem;
  font-weight: 700;
  line-height: 1;
  border-radius: 2px 2px 4px 4px;
  background: color-mix(in srgb, var(--brand-primary) 18%, var(--bg-app));
  border: 1px solid color-mix(in srgb, var(--brand-primary) 35%, var(--border));
  color: var(--brand-primary);
  flex-shrink: 0;
}

.agent-priority-shield--urgent {
  background: color-mix(in srgb, #f44336 20%, var(--bg-app));
  border-color: color-mix(in srgb, #f44336 40%, var(--border));
  color: #c62828;
}

.agent-priority-shield--low {
  background: color-mix(in srgb, var(--text-muted) 15%, var(--bg-app));
  border-color: var(--border);
  color: var(--text-muted);
}

.agent-accordion-pct {
  font-weight: 400;
  font-size: 0.62rem;
  color: var(--text-muted);
  margin-left: 3px;
}

@media (max-width: 960px) {
  .agents-live-layout {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  }

  .agents-chat-panel,
  .agents-live-layout > .agent-chat-module { order: 1; }
  .agents-workers-wrap { order: 2; }

  .agents-panel-toggle {
    display: inline-flex;
  }

  .agents-live-layout.is-workers-collapsed {
    grid-template-rows: minmax(0, 1fr) auto;
  }

  .agents-live-layout.is-workers-collapsed .agents-workers-panel {
    display: none;
  }

  .agents-live-layout.is-workers-collapsed .agents-mobile-bar {
    display: flex;
  }
}

.agents-page--live .panel {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  min-height: 0;
}

.agents-chat-panel,
.agents-workers-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.agents-page--live .panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 4px 6px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.agents-page--live .panel-head h3 {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
}

.agents-page--live .panel-head .muted {
  font-size: 0.68rem;
}

.agents-chat-stream {
  flex: 1;
  overflow: auto;
  padding: 4px 6px;
  display: grid;
  gap: 4px;
  min-height: 0;
  background: var(--bg-app);
  border: none;
  border-radius: 0;
}

.chat-line {
  padding: 4px 6px;
  border-radius: 3px;
  font-size: 0.75rem;
  line-height: 1.35;
}

.chat-line--user {
  background: color-mix(in srgb, var(--brand-primary) 12%, transparent);
  border-left: 2px solid var(--brand-primary);
}

.chat-line--agent {
  background: color-mix(in srgb, var(--brand-secondary) 10%, transparent);
  border-left: 2px solid var(--brand-secondary);
}

.chat-line--system {
  background: color-mix(in srgb, var(--text-muted) 8%, transparent);
}

.chat-ts {
  display: block;
  font-size: 0.62rem;
  color: var(--text-muted);
  line-height: 1.2;
}

.chat-who {
  font-weight: 700;
  font-size: 0.68rem;
  margin-right: 4px;
}

.chat-text {
  margin: 2px 0 0;
  white-space: pre-wrap;
  word-break: break-word;
}

.agents-command-form--inline {
  margin: 0;
  padding: 4px 6px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.agents-command-input-row {
  display: flex;
  align-items: stretch;
  gap: 6px;
}

.agents-command-form--inline textarea {
  flex: 1;
  min-width: 0;
  font-size: 0.78rem;
  line-height: 1.5;
  padding: 6px 8px;
  /* 1 line: 0.78rem × 1.5 + vertical padding (6+6) */
  min-height: calc(0.78rem * 1.5 + 12px);
  /* 5 lines max, then vertical scroll only */
  max-height: calc(0.78rem * 1.5 * 5 + 12px);
  resize: none;
  overflow-x: hidden;
  overflow-y: auto;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

@supports (field-sizing: content) {
  .agents-command-form--inline textarea {
    field-sizing: content;
    height: auto;
  }
}

.agents-command-input-row .btn-primary {
  flex-shrink: 0;
  align-self: stretch;
  padding: 4px 10px;
  font-size: 0.75rem;
  white-space: nowrap;
}

.agents-command-input-row .btn-send {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.agents-command-input-row .btn-send .icon-send {
  flex-shrink: 0;
}

.agents-command-feedback {
  margin: 0;
  font-size: 0.68rem;
  line-height: 1.2;
}

.agents-workers-list {
  flex: 1;
  overflow: auto;
  display: grid;
  gap: 3px;
  min-height: 0;
  padding: 4px;
}

.agent-accordion {
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--bg-app);
}

.agent-accordion-title {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) minmax(0, 1.5fr) 48px 58px;
  align-items: center;
  gap: 6px;
  padding: 3px 6px;
  cursor: pointer;
  list-style: none;
  font-size: 0.75rem;
  line-height: 1.3;
}

.agent-accordion-title::-webkit-details-marker { display: none; }

.agent-accordion-chevron {
  flex-shrink: 0;
  width: 10px;
  font-size: 0.65rem;
  color: var(--text-muted);
  transition: transform 0.15s ease;
  line-height: 1;
}

.agent-accordion[open] .agent-accordion-chevron {
  transform: rotate(90deg);
}

.agent-accordion-name {
  font-weight: 600;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-accordion-activity {
  min-width: 0;
  font-size: 0.68rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-progress {
  width: 48px;
  height: 4px;
  background: color-mix(in srgb, var(--text-muted) 25%, transparent);
  border-radius: 999px;
  overflow: hidden;
}

.agent-progress-bar {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--brand-primary), var(--brand-secondary));
  border-radius: 999px;
  transition: width 0.4s ease;
}

.agent-state,
.agent-child-state {
  box-sizing: border-box;
  font-size: 0.58rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  font-variant-numeric: tabular-nums;
  text-align: center;
  padding: 2px 5px;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  white-space: nowrap;
  text-transform: uppercase;
  border: 1px solid transparent;
}

.agent-state {
  min-width: 58px;
  width: 58px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-state.tag-running,
.agent-child-state.tag-running { background: #d8ede0; color: #1e6b3a; border-color: #b8dcc4; }
.agent-state.tag-open,
.agent-child-state.tag-open { background: #dce8f5; color: #1a5080; border-color: #b8cfe8; }
.agent-state.tag-paused,
.agent-child-state.tag-paused,
.agent-state.tag-stale,
.agent-child-state.tag-stale { background: #f0e4d4; color: #8a5a18; border-color: #e0cfb8; }
.agent-state.tag-idle,
.agent-child-state.tag-idle,
.agent-state.tag-offline,
.agent-child-state.tag-offline,
.agent-state.tag-ended,
.agent-child-state.tag-ended { background: #e4e6ea; color: #5c6370; border-color: #d0d4da; }

[data-theme="dark"] .agent-state.tag-running,
[data-theme="dark"] .agent-child-state.tag-running { background: #2a4532; color: #8fd4a8; border-color: #3a5a42; }
[data-theme="dark"] .agent-state.tag-open,
[data-theme="dark"] .agent-child-state.tag-open { background: #2a3548; color: #8eb8e8; border-color: #3a4a60; }
[data-theme="dark"] .agent-state.tag-paused,
[data-theme="dark"] .agent-child-state.tag-paused,
[data-theme="dark"] .agent-state.tag-stale,
[data-theme="dark"] .agent-child-state.tag-stale { background: #4a4030; color: #e8c88a; border-color: #5a5040; }
[data-theme="dark"] .agent-state.tag-idle,
[data-theme="dark"] .agent-child-state.tag-idle,
[data-theme="dark"] .agent-state.tag-offline,
[data-theme="dark"] .agent-child-state.tag-offline,
[data-theme="dark"] .agent-state.tag-ended,
[data-theme="dark"] .agent-child-state.tag-ended { background: #454a55; color: #b4bac4; border-color: #5a6170; }

.agent-kind {
  font-size: 0.6rem;
  color: var(--text-muted);
  margin-left: 4px;
}

.agent-accordion-body {
  padding: 2px 6px 4px 20px;
  font-size: 0.68rem;
  line-height: 1.35;
  border-top: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
}

.agent-meta {
  margin: 0 0 2px;
  color: var(--text-muted);
  font-size: 0.62rem;
}

.agent-summary {
  margin: 0 0 2px;
  color: var(--text-muted);
  font-size: 0.65rem;
  word-break: break-word;
}

.agent-lines {
  margin: 0;
  padding-left: 0.9rem;
  color: var(--text);
}

.agent-lines li { margin-bottom: 1px; }

/* ─── Specs & Brainstorm ─────────────────────────────────────────────────── */

.specs-page .specs-head,
.brainstorm-page .specs-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.specs-subtitle { margin: 4px 0 0; max-width: 42rem; }

.specs-head-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.specs-catalog-updated { font-size: 0.82rem; }

.specs-filters {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}

.specs-filter-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.specs-filter-label {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-right: 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.specs-chip {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  text-decoration: none;
}

.specs-chip:hover { border-color: var(--accent); color: var(--accent); }
.specs-chip.active {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  border-color: var(--accent);
  color: var(--accent);
}

.specs-search-wrap { margin-bottom: 16px; }

.specs-search {
  width: 100%;
  max-width: 420px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

/* Specs compact — ideias + subspecs */
.specs-page--compact .specs-head--compact { margin-bottom: 10px; }
.specs-page--compact .specs-subtitle { font-size: 0.82rem; margin: 2px 0 0; }
.specs-opt-meta { font-size: 0.72rem; }
.specs-filters-panel { margin-bottom: 10px; font-size: 0.82rem; }
.specs-filters-panel summary { cursor: pointer; color: var(--accent); padding: 4px 0; }
.specs-filters-panel[open] .specs-filters { margin-top: 8px; }
.specs-compact-list { display: flex; flex-direction: column; gap: 6px; }
.idea-row, .spec-row {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 8px 10px;
}
.idea-row--critical { border-color: color-mix(in srgb, #c0392b 30%, var(--border)); }
.idea-row-main { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.idea-title { margin: 0; font-size: 0.88rem; font-weight: 600; flex: 1 1 160px; }
.idea-count { font-size: 0.68rem; color: var(--text-muted); }
.subspec-list {
  list-style: none;
  margin: 6px 0 0;
  padding: 4px 0 0 4px;
  border-top: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.subspec-item { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 0.78rem; }
.subspec-link {
  color: var(--text);
  text-decoration: none;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.subspec-link:hover { color: var(--accent); }
.subspec-meta { font-size: 0.68rem; color: var(--text-muted); display: flex; gap: 4px; flex-shrink: 0; }
.prio--xs { font-size: 0.6rem; padding: 1px 5px; }
.subspec-brain { color: var(--text-muted); text-decoration: none; padding: 0 4px; }
.subspec-brain:hover { color: var(--accent); }
.spec-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.spec-row-title {
  flex: 1 1 180px;
  font-size: 0.84rem;
  font-weight: 500;
  color: var(--text);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.spec-row-title:hover { color: var(--accent); }
.spec-row .spec-project, .spec-row .spec-status { font-size: 0.65rem; padding: 1px 6px; }

.specs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}

.specs-grid--brainstorm { margin-top: 14px; }

.spec-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  min-height: 160px;
}

.spec-card--critical { border-color: color-mix(in srgb, #c0392b 35%, var(--border)); }

.spec-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.spec-card-title {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--text);
  text-decoration: none;
  line-height: 1.3;
}

.spec-card-title:hover { color: var(--accent); }

.spec-card-summary {
  margin: 0;
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.45;
  flex: 1;
}

.spec-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.spec-status {
  font-size: 0.68rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--border));
  text-transform: lowercase;
}

.spec-type {
  font-size: 0.68rem;
  color: var(--text-muted);
}

.spec-project {
  font-size: 0.68rem;
  padding: 2px 8px;
  border-radius: 4px;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text-muted);
}

.spec-critical {
  font-size: 0.65rem;
  font-weight: 700;
  color: #c0392b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.spec-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.spec-tag {
  font-size: 0.68rem;
  padding: 2px 7px;
  border-radius: 4px;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text-muted);
  text-decoration: none;
}

.spec-tag:hover { color: var(--accent); border-color: var(--accent); }

.spec-card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.spec-id { font-size: 0.72rem; }

.spec-path {
  font-size: 0.72rem;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spec-card-actions {
  margin-left: auto;
  display: flex;
  gap: 6px;
}

.btn-sm {
  padding: 4px 10px;
  font-size: 0.78rem;
}

.specs-breadcrumb {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-bottom: 12px;
  font-size: 0.85rem;
}

.specs-breadcrumb a { color: var(--accent); }

.specs-detail-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.specs-detail-summary {
  margin: 6px 0 0;
  color: var(--text-muted);
  max-width: 48rem;
}

.specs-detail-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.specs-detail-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 16px;
  align-items: start;
}

@media (max-width: 900px) {
  .specs-detail-layout { grid-template-columns: 1fr; }
}

.specs-detail-sidebar h3,
.specs-detail-sidebar h4 {
  margin: 0 0 8px;
  font-size: 0.85rem;
}

.specs-detail-sidebar h4 { margin-top: 14px; }

.specs-kv {
  margin: 0;
  display: grid;
  gap: 8px;
}

.specs-kv > div {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px;
  font-size: 0.82rem;
}

.specs-kv dt { margin: 0; color: var(--text-muted); }
.specs-kv dd { margin: 0; }

.specs-files-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.75rem;
}

.specs-files-list li {
  margin-bottom: 6px;
  word-break: break-all;
}

.specs-files-list li.missing { opacity: 0.6; }

.specs-file-key {
  display: inline-block;
  min-width: 52px;
  color: var(--text-muted);
  text-transform: uppercase;
  font-size: 0.65rem;
}

.specs-file-missing {
  color: #c0392b;
  font-size: 0.65rem;
  margin-left: 4px;
}

.specs-detail-body {
  padding: 16px 18px;
  max-height: none;
}

.specs-markdown {
  font-size: 0.88rem;
  line-height: 1.55;
}

.specs-markdown h2 { font-size: 1.15rem; margin: 1.2em 0 0.5em; }
.specs-markdown h3 { font-size: 1rem; margin: 1em 0 0.4em; }
.specs-markdown h4 { font-size: 0.92rem; margin: 0.8em 0 0.35em; }
.specs-markdown p { margin: 0.5em 0; }
.specs-markdown ul { margin: 0.4em 0; padding-left: 1.2em; }

.specs-json-preview {
  font-size: 0.75rem;
  overflow: auto;
  max-height: 480px;
  padding: 12px;
  border-radius: 8px;
  background: var(--bg);
  border: 1px solid var(--border);
}

.brainstorm-intro {
  padding: 12px 14px;
  margin-bottom: 14px;
  font-size: 0.88rem;
}

.brainstorm-notice {
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 0.82rem;
  border-left: 3px solid var(--accent);
}

.brainstorm-live-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.brainstorm-live-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.brainstorm-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  min-height: 60vh;
}

@media (max-width: 960px) {
  .brainstorm-split { grid-template-columns: 1fr; min-height: auto; }
}

.brainstorm-editor,
.brainstorm-preview {
  display: flex;
  flex-direction: column;
  min-height: 320px;
}

.brainstorm-source {
  flex: 1;
  width: 100%;
  min-height: 420px;
  padding: 12px;
  border: none;
  border-top: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  resize: vertical;
}

.brainstorm-preview #brainstorm-preview {
  flex: 1;
  overflow: auto;
  padding: 12px 14px;
  min-height: 420px;
}

.brainstorm-page--live .panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
}

.brainstorm-page--live .panel-head h3 {
  margin: 0;
  font-size: 0.85rem;
}

/* —— Agent approvals —— */
.page--approvals .specs-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.approvals-list {
  display: grid;
  gap: 10px;
}

.approval-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.approval-card__head h2 {
  margin: 0 0 4px;
  font-size: 1rem;
}

.approval-status {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  flex-shrink: 0;
}

.approval-status--pending_approval {
  border-color: color-mix(in srgb, var(--brand-primary) 50%, var(--border));
  color: var(--brand-primary);
}

.approval-status--approved {
  border-color: color-mix(in srgb, #4caf50 40%, var(--border));
  color: #8fd4a8;
}

.approval-status--rejected {
  border-color: color-mix(in srgb, #e57373 40%, var(--border));
  color: #f0a0a0;
}

.approval-card__summary {
  margin: 0 0 8px;
  line-height: 1.45;
}

.approval-card__rec {
  margin: 0 0 8px;
  font-size: 0.88rem;
}

.approval-form {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
  display: grid;
  gap: 8px;
}

.approval-form input[type="text"] {
  width: 100%;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
  color: var(--text-primary);
}

.approval-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.approval-btn-reject {
  color: #f0a0a0;
}

.badge--warn {
  border-color: color-mix(in srgb, var(--brand-primary) 45%, var(--border));
  color: var(--brand-primary);
}

/* —— Painel widgets (agents, atalhos, notificações) —— */
.main-nav--compact {
  gap: 0;
}

.dash-quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 8px;
}

.dash-quick-link {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 72px;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-surface);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease;
}

.dash-quick-link:hover {
  border-color: color-mix(in srgb, var(--brand-primary) 40%, var(--border));
}

.dash-quick-link__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}

.dash-quick-link--warn {
  border-color: color-mix(in srgb, var(--brand-primary) 50%, var(--border));
}

.dash-agents-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
  min-height: 0;
}

@media (max-width: 960px) {
  .dash-agents-row {
    grid-template-columns: 1fr;
  }
}

.dash-widget-panel {
  margin-bottom: 8px;
}

.agents-workers-list--dash {
  max-height: 280px;
  overflow-y: auto;
}

.agent-accordion--compact .agent-accordion-title {
  padding: 6px 8px;
  font-size: 0.82rem;
}

.approvals-list--compact .approval-card--compact {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}

.approval-form--inline {
  margin-top: 6px;
}

.approval-form--inline input[type="text"] {
  margin-bottom: 6px;
}

.dash-approvals-empty {
  padding: 8px 10px;
}

.notif-wrap {
  position: relative;
}

.notif-bell {
  position: relative;
}

.notif-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  background: var(--brand-primary);
  color: var(--text-on-brand, #fff);
}

.notif-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 200;
  width: min(320px, 90vw);
  padding: 8px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-surface);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.notif-dropdown__head {
  margin: 0 0 6px;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}

.notif-item {
  display: block;
  padding: 8px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
}

.notif-item:hover {
  background: color-mix(in srgb, var(--brand-primary) 8%, transparent);
}

.notif-dropdown__more {
  display: block;
  margin-top: 6px;
  font-size: 0.78rem;
}

.notif-mute[aria-pressed="true"] {
  opacity: 0.55;
}

/* —— Revisar layout (/revisar-layout) —— */
.layout-review__explain.card {
  margin-bottom: var(--space-lg);
}

.layout-review__diff {
  display: grid;
  gap: var(--space-md);
  margin: var(--space-md) 0 0;
}

.layout-review__diff dt {
  font-weight: 600;
  margin-bottom: 0.15rem;
}

.layout-review__diff dd {
  margin: 0;
  color: var(--text-muted);
}

.layout-review__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.stat-card {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--space-md);
  text-align: center;
}

.stat-card__n {
  display: block;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--accent);
}

.stat-card__label {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.layout-review__grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  margin-bottom: var(--space-lg);
}

.layout-review__table tr.is-pending {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}

.layout-review__queue {
  list-style: none;
  padding: 0;
  margin: 0;
}

.layout-review__queue li {
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--border);
}

.layout-review__queue li.is-pending .badge {
  background: var(--accent-soft, #f3e8ff);
  color: var(--accent);
}

.badge-warn {
  background: #fff3e0;
  color: #e65100;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.8rem;
}

[data-theme="dark"] .badge-warn {
  background: #3d3018;
  color: #ffcc80;
}

.layout-review__docs {
  margin-top: var(--space-xl);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.page--painel-live .agents-capacity-panel {
  margin-bottom: 8px;
}

/* AME — calendário fiscal (embed) */
.ame-page .ame-calendario {
  margin-top: var(--space-md);
}

.ame-page .ame-calendario .layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 1rem;
  max-width: 1400px;
}

@media (max-width: 960px) {
  .ame-page .ame-calendario .layout {
    grid-template-columns: 1fr;
  }
}

.ame-page .ame-calendario__filter-label {
  color: var(--muted);
  font-size: 0.85rem;
}

.ame-page .ame-calendario .sidebar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.ame-page .ame-calendario #detail[hidden] {
  display: none;
}

.trainer-page .trainer-stats-row {
  margin-bottom: var(--space-lg);
}

.trainer-iframe-panel {
  min-height: 72vh;
  display: flex;
  flex-direction: column;
}

.trainer-frame {
  flex: 1;
  width: 100%;
  min-height: 65vh;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #0a0e14;
}

.trainer-fallback {
  padding: var(--space-md);
}

.trainer-fallback code {
  font-size: 0.85em;
}

/* --- Contratos / Financeiro (fiscal interno) --- */
.page--contratos .fiscal-tabs,
.page--financeiro .fiscal-tabs,
.page--contratos .contratos-tabs,
.page--financeiro .contratos-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: var(--space-md);
  border-bottom: 1px solid var(--border);
  padding-bottom: 0;
}

.fiscal-tabs__item,
.contratos-tabs__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  margin-bottom: -1px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 500;
}

.fiscal-tabs__item.is-active,
.contratos-tabs__item.is-active {
  color: var(--text);
  background: var(--bg-surface);
  border-color: var(--border);
  border-bottom-color: var(--bg-surface);
}

.fiscal-tabs__item--soon,
.contratos-tabs__item--soon {
  cursor: not-allowed;
  opacity: 0.65;
}

.fiscal-tabs__item--soon small,
.contratos-tabs__item--soon small {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.contratos-future-note,
.financeiro-beta-note {
  margin: 0 0 var(--space-md);
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--text-muted) 6%, var(--bg-surface));
}

.financeiro-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.financeiro-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: flex-end;
  margin-bottom: var(--space-md);
  padding: var(--space-sm) var(--space-md);
}

.financeiro-filters label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 140px;
}

.financeiro-filters select {
  min-width: 140px;
}

.financeiro-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.financeiro-table th,
.financeiro-table td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  vertical-align: middle;
}

.financeiro-table th {
  background: var(--bg-app);
  font-size: 0.78rem;
  color: var(--text-muted);
}

.financeiro-table .num {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.financeiro-table td strong {
  display: block;
}

.financeiro-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.financeiro-status--draft { background: color-mix(in srgb, var(--text-muted) 18%, var(--bg-surface)); color: var(--text-muted); }
.financeiro-status--issued { background: color-mix(in srgb, var(--brand-primary) 20%, var(--bg-surface)); color: var(--brand-primary); }
.financeiro-status--overdue { background: color-mix(in srgb, var(--danger) 20%, var(--bg-surface)); color: var(--danger); }
.financeiro-status--paid { background: color-mix(in srgb, var(--ok) 22%, var(--bg-surface)); color: var(--ok); }
.financeiro-status--cancelled { background: color-mix(in srgb, var(--text-muted) 12%, var(--bg-surface)); color: var(--text-muted); }

.financeiro-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.financeiro-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}

.contratos-list {
  display: grid;
  gap: var(--space-sm);
}

.contratos-card {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.contratos-card:hover {
  border-color: color-mix(in srgb, var(--brand-primary) 40%, var(--border));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--brand-primary) 8%, transparent);
}

.contratos-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.contratos-card__head h2 {
  margin: 0 0 4px;
  font-size: 1.05rem;
}

.contratos-card__arrow {
  color: var(--text-muted);
  font-size: 1.1rem;
  line-height: 1;
}

.contratos-card__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-sm);
}

.contratos-card__foot {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: var(--space-sm);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--border);
}

.contratos-back {
  margin: 0 0 4px;
}

.contratos-back a {
  color: var(--text-muted);
  text-decoration: none;
}

.contratos-back a:hover {
  color: var(--brand-primary);
}

.page--contratos .contratos-block {
  margin-bottom: var(--space-lg);
}

.contratos-block__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.contratos-block__head h2 {
  margin: 0 0 4px;
  font-size: 1.1rem;
}

.contratos-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
  align-items: end;
}

.contratos-summary__item {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--bg-surface);
}

.contratos-summary__item .k {
  display: block;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  margin-bottom: 2px;
}

.contratos-golive__row {
  display: flex;
  gap: 6px;
  align-items: center;
}

.contratos-golive input[type="month"] {
  min-width: 148px;
}

.contratos-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.contratos-table th,
.contratos-table td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  vertical-align: middle;
}

.contratos-table th {
  background: var(--bg-app);
  font-size: 0.78rem;
  color: var(--text-muted);
}

.contratos-table .num {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.contratos-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

.contratos-status--received {
  background: color-mix(in srgb, var(--ok) 22%, var(--bg-surface));
  color: var(--ok);
}

.contratos-status--pending {
  background: color-mix(in srgb, var(--brand-secondary) 22%, var(--bg-surface));
  color: var(--brand-secondary);
}

.contratos-status--recurring {
  background: color-mix(in srgb, var(--text-muted) 18%, var(--bg-surface));
  color: var(--text-muted);
}

.contratos-status--proof {
  background: color-mix(in srgb, var(--brand-primary) 20%, var(--bg-surface));
  color: var(--brand-primary);
}

.contratos-status--warn {
  background: color-mix(in srgb, var(--danger) 20%, var(--bg-surface));
  color: var(--danger);
}

.contratos-actions .btn-sm {
  font-size: 0.78rem;
  padding: 4px 8px;
}

.contratos-dialog {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0;
  max-width: 420px;
  width: calc(100% - 24px);
  background: var(--bg-surface);
  color: var(--text);
}

.contratos-dialog::backdrop {
  background: rgba(0, 0, 0, 0.55);
}

.contratos-dialog form {
  padding: var(--space-md);
}

.contratos-dialog__head h3 {
  margin: 0 0 4px;
  color: var(--text);
}

.contratos-dialog__head .muted {
  color: var(--text-muted);
}

.contratos-dialog__foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: var(--space-md);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--border);
}

.contratos-field {
  display: block;
  margin-top: var(--space-sm);
}

.contratos-field span {
  display: block;
  font-size: 0.82rem;
  margin-bottom: 4px;
  color: var(--text-muted);
}

.contratos-field select {
  width: 100%;
  min-width: 0;
}

.contratos-field input[type="file"] {
  width: 100%;
  padding: 8px 10px;
}

.contratos-proof-link {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.contratos-proof-link:hover .contratos-status--proof {
  filter: brightness(1.08);
}

.contratos-dialog--view {
  max-width: min(92vw, 720px);
  padding: var(--space-md);
}

.contratos-dialog--view .contratos-dialog__head {
  margin-bottom: var(--space-sm);
}

.contratos-dialog--view .contratos-dialog__foot {
  margin-top: var(--space-md);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--border);
}

.contratos-view__body {
  padding: 0;
}

.contratos-view__image {
  display: block;
  max-width: 100%;
  max-height: min(70vh, 640px);
  margin: 0 auto;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-app);
}

.contratos-view__note,
.contratos-view__pdf {
  margin: 0;
  line-height: 1.5;
}

.contratos-view__open {
  display: inline-block;
  margin-top: var(--space-sm);
}

.contratos-field input[type="file"]::file-selector-button {
  margin-right: 8px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-surface);
  color: var(--text);
  font: inherit;
  cursor: pointer;
}

.notif-section-label {
  margin: 8px 0 4px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  font-weight: 700;
}

.notif-dropdown__links {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-top: 1px solid var(--border);
  margin-top: 6px;
  padding-top: 6px;
}

@media (max-width: 900px) {
  .contratos-summary,
  .contratos-card__stats,
  .financeiro-summary,
  .fluxo-summary {
    grid-template-columns: 1fr 1fr;
  }

  .fluxo-layout {
    grid-template-columns: 1fr;
  }
}

/* --- Fluxo de caixa --- */
.page--fluxo-caixa .fluxo-head__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.fluxo-positive {
  color: var(--ok);
}

.fluxo-negative {
  color: var(--danger);
}

.fluxo-layout {
  display: grid;
  grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
  gap: var(--space-md);
  align-items: start;
}

.fluxo-panel-title {
  margin: 0 0 var(--space-sm);
  font-size: 0.9rem;
}

.fluxo-account-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.fluxo-account-item {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
  border: 1px solid transparent;
}

.fluxo-account-item:hover,
.fluxo-account-item.is-active {
  background: color-mix(in srgb, var(--brand-primary) 10%, var(--bg-surface));
  border-color: color-mix(in srgb, var(--brand-primary) 25%, var(--border));
}

.fluxo-account-item__name {
  font-size: 0.88rem;
}

.fluxo-account-item__bal {
  font-size: 0.82rem;
  color: var(--text-muted);
}

.fluxo-imports {
  margin-top: var(--space-md);
  padding: var(--space-sm) var(--space-md);
}

.fluxo-imports summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 0.88rem;
}

.fluxo-import-list {
  margin: var(--space-sm) 0 0;
  padding-left: 1.2rem;
  font-size: 0.85rem;
}

.fluxo-import-list li {
  margin-bottom: 4px;
}

/* --- Home (lista de ferramentas) --- */
.page--home {
  max-width: 1100px;
}

.home-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}

.home-head h1 {
  margin: 0 0 4px;
}

.home-group {
  margin-bottom: var(--space-lg);
}

.home-group__title {
  margin: 0 0 var(--space-sm);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

.home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--space-sm);
}

.home-card {
  display: block;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--bg-surface);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, transform 0.15s;
}

.home-card:hover {
  border-color: var(--brand, #663399);
  transform: translateY(-1px);
}

.home-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.home-card__title {
  font-size: 1rem;
  line-height: 1.25;
}

.home-card__badge {
  flex-shrink: 0;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  background: #fdf6e3;
  color: #7a5a12;
  white-space: nowrap;
}

.home-card__desc {
  margin: 0;
  line-height: 1.35;
}

.main-nav--compact a {
  font-weight: 600;
}

/* —— Usuários app (ops) —— */
.flash-ok {
  color: #1b5e20;
  background: #e8f5e9;
  border: 1px solid #c8e6c9;
  border-radius: var(--radius);
  padding: var(--space-sm) var(--space-md);
}

[data-theme="dark"] .flash-ok {
  color: #a5d6a7;
  background: #1e3320;
  border-color: #2e4a30;
}

.usuarios-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  align-items: flex-end;
  margin: var(--space-md) 0;
  padding: var(--space-md);
}

.usuarios-filters label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 140px;
  flex: 1 1 140px;
}

.usuarios-filters input[type="search"],
.usuarios-filters select,
.usuarios-action-form select,
.usuarios-action-form input[type="date"] {
  font: inherit;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-app);
  color: var(--text);
}

.usuarios-filters .btn-primary,
.usuarios-filters .btn-ghost {
  align-self: flex-end;
}

.usuarios-stats {
  margin-bottom: 0;
}

.usuarios-schema-note {
  margin: 0.5rem 0 0;
}

.usuarios-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-md);
}

.usuarios-billing {
  grid-column: 1 / -1;
}

.usuarios-dl {
  margin: 0;
  display: grid;
  gap: 0.55rem;
}

.usuarios-dl > div {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 8px;
  align-items: baseline;
}

.usuarios-dl dt {
  margin: 0;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-muted);
  font-weight: 600;
}

.usuarios-dl dd {
  margin: 0;
}

.usuarios-action-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: flex-end;
  margin: 0 0 var(--space-md);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--border);
}

.usuarios-action-form:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.usuarios-action-form label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 140px;
}

.usuarios-list {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.4rem;
}

.usuarios-ip {
  font-size: 0.85em;
  word-break: break-all;
}

.usuarios-audit-panel {
  margin-top: 1.25rem;
}

.usuarios-audit-table {
  margin-top: 0.75rem;
}

.usuarios-subhead {
  margin: var(--space-md) 0 var(--space-sm);
  font-size: 0.9rem;
}

@media (max-width: 640px) {
  .usuarios-dl > div {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .usuarios-filters {
    flex-direction: column;
    align-items: stretch;
  }

  .usuarios-filters .btn-primary,
  .usuarios-filters .btn-ghost {
    width: 100%;
    text-align: center;
  }
}