/*
  mockup-v2-theme.css
  -------------------
  Camada de skin/tema:
  - cor
  - transparência / blur / shadow
  - acabamento visual do mockup

  Estrutura e comportamento-base dos componentes ficam em styles.css.
*/

:root {
  --font: "Oxygen", "Segoe UI", sans-serif;
  --font-serif: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", "Cascadia Code", monospace;
  --color-navy: #0A2540;
  --bg-tint-navy: #F4F7F9;
  --color-blue: #2979FF;
  --bg-tint-blue: #F0F5FF;
  --color-teal: #00ACC1;
  --bg-tint-teal: #EBF9FA;
  --color-blue-grey: #607D8B;
  --bg-tint-blue-grey: #F0F4F8;
  --color-orange: #FF7043;
  --bg-tint-orange: #FFF6F3;
  --color-green: #8BC34A;
  --bg-tint-green: #F4F9F0;
  --navy: #08111d;
  --navy-2: #101d31;
  --surface: rgba(8, 14, 24, 0.82);
  --surface-2: rgba(255, 255, 255, 0.06);
  --white: rgba(10, 17, 30, 0.82);
  --border: rgba(255, 255, 255, 0.12);
  --border-2: rgba(255, 255, 255, 0.24);
  --text-1: #f5f7ff;
  --text-2: rgba(236, 241, 255, 0.86);
  --text-3: rgba(205, 217, 244, 0.56);
  --green-bg: rgba(125, 211, 120, 0.14);
  --green-bd: rgba(125, 211, 120, 0.32);
  --green: #9be07b;
  --glass: rgba(11, 18, 31, 0.74);
  --glass-strong: rgba(10, 16, 28, 0.86);
  --glass-soft: rgba(255, 255, 255, 0.08);
  --field: rgba(255, 255, 255, 0.08);
  --field-strong: rgba(255, 255, 255, 0.12);
  --shadow: 0 20px 60px rgba(0, 0, 0, 0.34);
  --shadow-lg: 0 32px 90px rgba(0, 0, 0, 0.4);
  --ring: 0 0 0 1px rgba(255, 255, 255, 0.14), 0 0 0 5px color-mix(in srgb, var(--stage-color) 18%, transparent);
  --motion-accent: #c6d3e1;
  --motion-accent-rgb: 198, 211, 225;
}

@keyframes catalog-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes catalog-fade-opacity-only {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes screen-enter-right {
  0% {
    opacity: 0;
    transform: translateX(140px) scale(0.97);
    filter: blur(10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: blur(0);
  }
}

@keyframes screen-enter-left {
  0% {
    opacity: 0;
    transform: translateX(-140px) scale(0.97);
    filter: blur(10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: blur(0);
  }
}

@keyframes screen-exit-left {
  0% {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: blur(0);
  }
  100% {
    opacity: 0;
    transform: translateX(-140px) scale(0.97);
    filter: blur(10px);
  }
}

@keyframes screen-exit-right {
  0% {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: blur(0);
  }
  100% {
    opacity: 0;
    transform: translateX(140px) scale(0.97);
    filter: blur(10px);
  }
}

html,
body {
  background: #000;
  color: var(--text-1);
}

body.theme-reforge-v2 {
  position: relative;
  background: #000;
  animation: catalog-fade-in 1s;
}

body.theme-reforge-v2::before,
body.theme-reforge-v2::after {
  content: none;
}

body.theme-reforge-v2::before {
}

body.theme-reforge-v2::after {
}

::selection {
  background: color-mix(in srgb, var(--stage-color) 40%, white 12%);
  color: #08111d;
}

#screen-agent,
.screen > #mappingShell,
.understanding-shell,
.diagnostico-shell,
.redesenho-shell,
.implementacao-shell,
.monitoramento-shell {
  background: transparent !important;
}

#screen-home,
#screen-agent {
  position: absolute;
}

#screen-home,
#screen-agent {
  --home-card-blur: 20px;
  --home-card-alpha: 0.15;
  --home-card-saturate: 115%;
  --home-card-depth: 0.10;
  --home-card-border-alpha: 0.30;
  --home-empty-card-alpha: 0.13;
  --home-empty-card-blur: 20px;
  background: url("/images/prancheta-1-background.png") center center / cover no-repeat !important;
}

#screen-home::before,
#screen-home::after,
#screen-agent::before,
#screen-agent::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

#screen-home::before {
  inset: 0;
  background: rgba(5, 7, 12, 0.30);
  z-index: 0;
}

#screen-home::after {
  content: none;
}

#screen-agent::before {
  inset: 0;
  background: rgba(5, 7, 12, 0.30);
  z-index: 0;
}

#screen-agent::after {
  content: none;
}

#screen-home > *,
#screen-agent > * {
  position: relative;
  z-index: 1;
}

.screen {
  transition: none !important;
  will-change: transform, opacity, filter;
}

#screen-home,
#screen-agent {
  filter: blur(0);
  transform: translateX(0) scale(1);
}

#screen-home:not(.hidden),
#screen-agent:not(.hidden) {
  filter: blur(0);
}

#screen-home.hidden {
  transform: translateX(-56px) scale(0.985);
  filter: blur(4px);
}

#screen-agent.hidden {
  transform: translateX(56px) scale(0.985);
  filter: blur(4px);
}

.screen-anim-enter-right {
  animation: screen-enter-right 420ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

.screen-anim-enter-left {
  animation: screen-enter-left 420ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

.screen-anim-exit-left {
  animation: screen-exit-left 420ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

.screen-anim-exit-right {
  animation: screen-exit-right 420ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

.topbar,
.stage-nav,
.ctx-bar {
  margin: 18px 20px 0;
  width: auto;
  background: var(--glass) !important;
  border: 1px solid var(--border);
  backdrop-filter: blur(44px) saturate(165%);
  -webkit-backdrop-filter: blur(44px) saturate(165%);
  box-shadow: var(--shadow);
}

.topbar {
  height: 66px;
  padding: 0 20px;
  border-radius: 26px;
}

.stage-nav {
  height: auto;
  min-height: 52px;
  padding: 4px;
  gap: 6px;
  border-radius: 22px;
  overflow-x: auto;
  overflow-y: hidden;
}

.ctx-bar {
  min-height: 54px;
  height: auto;
  padding: 12px 18px;
  border-radius: 20px;
}

.logo,
.logo-button {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.topbar-right,
.agent-top-left {
  gap: 12px;
}

.topbar-user,
.agent-badge,
.status-badge,
.u-card-badge,
.proc-chip,
.modal-lbl,
.u-section-label,
.monitoramento-field-label {
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.topbar-user,
.agent-badge {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-2);
  border-radius: 999px;
  padding: 6px 12px;
}

.avatar,
.avatar-button,
.proj-action-btn,
.copy-btn,
.panel-close,
.monitoramento-remove-btn,
.proc-chip-edit {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.avatar,
.avatar-button {
  width: 34px;
  height: 34px;
}

.home-body {
  width: min(1420px, 100%);
  margin: 0 auto;
  padding: 32px 20px 72px;
  position: relative;
}

.home-card-tuner {
  margin-bottom: 22px;
  padding: 22px 22px 20px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 18px 40px rgba(10, 37, 64, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.34);
  backdrop-filter: blur(36px) saturate(138%);
  -webkit-backdrop-filter: blur(36px) saturate(138%);
}

.home-card-tuner-head,
.agent-card-tuner-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.home-card-tuner-title,
.agent-card-tuner-title {
  font-family: var(--font-serif);
  font-size: 1rem;
  font-weight: 700;
  color: #16304f;
}

.home-card-tuner-desc,
.agent-card-tuner-desc {
  margin-top: 6px;
  color: #6d8197;
  font-size: 0.84rem;
  line-height: 1.45;
}

.home-card-tuner-actions,
.agent-card-tuner-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.home-card-tuner-btn,
.agent-card-tuner-btn {
  min-height: 32px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.24);
  color: #16304f;
  font-size: 0.78rem;
  font-weight: 700;
}

.home-card-tuner-btn.subtle,
.agent-card-tuner-btn.subtle {
  background: rgba(255, 255, 255, 0.14);
}

.home-card-tuner-grid,
.agent-card-tuner-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.home-card-control,
.agent-card-control {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.home-card-control-head,
.agent-card-control-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #52647c;
  font-size: 0.78rem;
  font-weight: 700;
}

.home-card-control-head strong,
.agent-card-control-head strong {
  color: #16304f;
  font-family: var(--mono);
  font-size: 0.76rem;
}

.home-card-control input[type="range"],
.agent-card-control input[type="range"] {
  width: 100%;
  accent-color: #7eff00;
}

.home-card-config-output,
.agent-card-config-output {
  width: 100%;
  min-height: 220px;
  margin-top: 18px;
  resize: vertical;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.16);
  color: #18304f;
  font-family: var(--mono);
  font-size: 0.78rem;
  line-height: 1.55;
  padding: 16px;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

#screen-home .topbar {
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.sec-head,
.done-head {
  margin-bottom: 18px;
}

#screen-home .done-section {
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease, margin 0.3s ease;
}

#screen-home .done-section.open {
  max-height: 1600px;
  margin-top: -10px;
  padding: 10px 0 16px;
  overflow: visible;
}

#screen-home #doneGrid {
  align-items: stretch;
}

.sec-title,
.page-label,
.u-card-title,
.form-title,
.panel-title,
.agent-name,
.redesenho-cenario-titulo,
.monitoramento-indicator-title {
  font-family: var(--font-serif);
}

.sec-title,
.page-label {
  color: rgba(240, 245, 255, 0.92);
}

.page-label {
  margin: 0 0 18px;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.sec-count,
.screen-disclaimer,
.login-disclaimer,
.proj-client,
.agent-desc,
.u-status-note,
.advance-hint,
.form-meta,
.entry-sub,
.modal-desc,
.login-desc,
.ctx-seg,
.ctx-sep,
.stage-lbl,
.tools-hint,
.transcript-action-hint,
.implementacao-processing-msg,
.monitoramento-processing-msg {
  color: var(--text-3) !important;
}

.divider {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  margin: 36px 0;
}

#screen-home .sec-title,
#screen-home .sec-count,
#screen-home .screen-disclaimer,
#screen-home .proj-client,
#screen-home .agent-desc,
#screen-home .stage-lbl,
#screen-home .proj-date,
#screen-home .toggle-done {
  color: rgba(255, 255, 255, 0.88) !important;
  filter: none !important;
}

#screen-home,
#screen-home .proj-card,
#screen-home .agent-card,
#screen-home .empty-card,
#screen-home .topbar {
  font-family: var(--font);
}

#screen-home .proj-card,
#screen-home .agent-card,
#screen-home .empty-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.015)),
    rgba(18, 20, 24, 0.34) !important;
  backdrop-filter: blur(9px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(9px) saturate(145%) !important;
  background-clip: padding-box;
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  color: #ffffff !important;
  transition: translate 0.18s cubic-bezier(0.22, 1, 0.36, 1), scale 0.18s cubic-bezier(0.22, 1, 0.36, 1), rotate 0.18s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, filter 0.18s ease;
}

#screen-home .proj-card::before,
#screen-home .agent-card::before,
#screen-home .empty-card::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    radial-gradient(120% 160% at 14% 18%, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.035) 30%, transparent 56%),
    linear-gradient(120deg, rgba(255, 255, 255, 0.02), transparent 42%, rgba(255, 255, 255, 0.02) 72%, rgba(255, 255, 255, 0.06) 100%) !important;
  border-radius: inherit;
  box-shadow: none !important;
  pointer-events: none;
  z-index: 0;
}

#screen-home .proj-card::after,
#screen-home .agent-card::after,
#screen-home .empty-card::after {
  content: none !important;
}

#screen-home .proj-card > *,
#screen-home .agent-card > *,
#screen-home .empty-card > * {
  position: relative;
  z-index: 1;
}

#screen-home .proj-card .proj-name,
#screen-home .agent-card .agent-name {
  color: #ffffff !important;
  filter: none !important;
}

#screen-home .proj-card:hover,
#screen-home .agent-card:hover,
#screen-home .empty-card:hover,
#screen-home .proj-card.catalog-hover-active,
#screen-home .agent-card.catalog-hover-active,
#screen-home .empty-card.catalog-hover-active {
  --catalog-lift: -14px;
  border-color: rgba(var(--motion-accent-rgb), 0.46) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.04)),
    rgba(22, 26, 32, 0.44) !important;
  box-shadow:
    0 40px 84px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06) !important;
}

#screen-home .proj-name,
#screen-home .agent-name,
#screen-home .status-badge,
#screen-home .proj-open-btn,
#screen-home .new-proj-btn,
#screen-home .avatar,
#screen-home .avatar-button,
#screen-home .proj-action-btn {
  color: #ffffff;
  filter: none !important;
}

#screen-home .agent-icon,
#screen-home .entry-icon {
  color: #ffffff;
  filter: none !important;
}

#screen-home .proj-client,
#screen-home .proj-date,
#screen-home .stage-lbl,
#screen-home .stage-lbl strong,
#screen-home .agent-desc,
#screen-home .empty-card,
#screen-home .home-disclaimer {
  color: rgba(255, 255, 255, 0.84) !important;
}

#screen-home .proj-inline-input {
  background: rgba(255, 255, 255, 0.10) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#screen-home .proj-inline-client {
  color: rgba(255, 255, 255, 0.84) !important;
}

#screen-home .proj-inline-input::placeholder {
  color: rgba(255, 255, 255, 0.56) !important;
}

#screen-home .proj-open-btn,
#screen-home .proj-action-btn,
#screen-home .avatar,
#screen-home .avatar-button {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#screen-home .new-proj-btn,
#screen-home .logout-btn,
#screen-home .topbar-user {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  box-shadow: none !important;
  filter: none !important;
}

#screen-home .new-proj-btn {
  border-radius: 999px;
  padding: 0 14px;
  min-height: 38px;
}

#screen-home .logout-btn {
  border-radius: 999px;
}

#screen-home .badge-done,
#screen-home .u-badge-done {
  color: #ffffff;
}

#screen-home .badge-active {
  color: #ffffff;
}

#screen-home .status-badge,
#screen-home .u-card-badge,
#screen-home .badge-active,
#screen-home .badge-done,
#screen-home .u-badge-done,
#screen-home .u-badge-ai {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}

#screen-home .stage-seg {
  background: color-mix(in srgb, var(--sc, rgba(var(--motion-accent-rgb), 1)) 22%, rgba(255, 255, 255, 0.08));
  opacity: 0.38;
}

#screen-home .stage-seg.s-done {
  background: color-mix(in srgb, var(--sc, rgba(var(--motion-accent-rgb), 1)) 76%, rgba(255, 255, 255, 0.12));
  opacity: 0.72;
}

#screen-home .stage-seg.s-active {
  background: var(--sc, rgba(var(--motion-accent-rgb), 1));
  opacity: 1;
  box-shadow: 0 0 14px color-mix(in srgb, var(--sc, rgba(var(--motion-accent-rgb), 1)) 40%, transparent);
}

#screen-home .empty-card {
  color: rgba(255, 255, 255, 0.84) !important;
}

#screen-home .sec-title,
#screen-home .proj-name,
#screen-home .agent-name,
#screen-home .logo,
#screen-home .logo-button {
  font-family: "Plus Jakarta Sans", var(--font-serif);
  font-weight: 700;
}

#screen-home .new-proj-btn,
#screen-home .proj-open-btn,
#screen-home .proj-action-btn,
#screen-home .toggle-done,
#screen-home .avatar,
#screen-home .avatar-button {
  transition: color 0.1s ease, filter 0.1s ease, border-color 0.1s ease, transform 0.1s ease;
}

#screen-home .new-proj-btn:hover,
#screen-home .proj-open-btn:hover,
#screen-home .proj-action-btn:hover,
#screen-home .toggle-done:hover,
#screen-home .avatar:hover,
#screen-home .avatar-button:hover,
#screen-home .new-proj-btn.catalog-hover-active,
#screen-home .proj-open-btn.catalog-hover-active,
#screen-home .proj-action-btn.catalog-hover-active,
#screen-home .toggle-done.catalog-hover-active,
#screen-home .avatar.catalog-hover-active,
#screen-home .avatar-button.catalog-hover-active {
  color: var(--motion-accent) !important;
  filter: none !important;
}

#screen-home .proj-open-btn,
#screen-home .proj-open-btn:hover,
#screen-home .proj-open-btn.catalog-hover-active {
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

#screen-home .stage-lbl strong,
#screen-home .proj-client,
#screen-home .proj-date,
#screen-home .agent-desc,
#screen-home .home-disclaimer {
  filter: none !important;
}

.proj-card,
.agent-card,
.u-card,
.diagnostico-input-card,
.transcript-action-bar,
.panel,
.modal,
.login-card,
.tab-lock-card,
.right-state,
.implementacao-processing-card,
.monitoramento-processing-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.04)),
    var(--glass-strong) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  backdrop-filter: blur(52px) saturate(175%);
  -webkit-backdrop-filter: blur(52px) saturate(175%);
}

.proj-card,
.agent-card,
.u-card,
.diagnostico-input-card,
.right-state {
  border-radius: 12px !important;
}

.proj-card,
.agent-card {
  overflow: hidden;
  will-change: translate, scale, rotate, box-shadow, border-color;
  isolation: isolate;
}

.proj-grid,
.agent-grid {
  perspective: 31.25rem;
}

body.theme-reforge-v2 .catalog-motion-card.fi {
  animation: catalog-fade-opacity-only 0.26s ease forwards;
}

.proj-card {
  padding: 28px;
  gap: 20px;
  --catalog-card-scale: 1;
  --catalog-card-content-scale: 1;
}

.proj-card-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
  transform: translateZ(0) scale(var(--catalog-card-content-scale));
  transform-origin: center center;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  will-change: transform;
}

.proj-card::before {
  height: 5px;
  box-shadow: 0 0 32px color-mix(in srgb, var(--sc, var(--stage-color)) 55%, transparent);
}

.proj-card:hover,
.agent-card:hover,
.catalog-motion-card:hover,
.catalog-motion-card:focus-visible {
}

.u-card:hover,
.redesenho-cenario-item:hover {
  transform: translateY(-3px);
  border-color: var(--border-2) !important;
  box-shadow: var(--shadow-lg) !important;
}

body.theme-reforge-v2 .proj-open-btn,
body.theme-reforge-v2 .proj-action-btn,
body.theme-reforge-v2 .new-proj-btn,
body.theme-reforge-v2 .logout-btn,
body.theme-reforge-v2 .toggle-done,
body.theme-reforge-v2 .avatar-button,
body.theme-reforge-v2 .tool-btn,
body.theme-reforge-v2 .advance-btn,
body.theme-reforge-v2 .copy-btn,
body.theme-reforge-v2 .panel-close,
body.theme-reforge-v2 .back-btn,
body.theme-reforge-v2 .f-btn,
body.theme-reforge-v2 .understanding-shell .entry-card {
  transition: color 0.1s ease, background-color 0.12s ease, border-color 0.12s ease;
}

body.theme-reforge-v2 .stage-pill {
  transition: color 0.1s ease, background-color 0.12s ease, border-color 0.12s ease !important;
}

body.theme-reforge-v2 .stage-pill,
body.theme-reforge-v2 .stage-pill:hover,
body.theme-reforge-v2 .stage-pill.catalog-hover-active {
  transform: translateY(0) scale(1) !important;
  box-shadow: none !important;
  filter: none !important;
  will-change: auto !important;
}

body.theme-reforge-v2 .stage-pill:hover,
body.theme-reforge-v2 .stage-pill.catalog-hover-active {
  color: var(--motion-accent) !important;
  background: rgba(var(--motion-accent-rgb), 0.14) !important;
  border-color: rgba(var(--motion-accent-rgb), 0.52) !important;
}

body.theme-reforge-v2 .sn-item,
body.theme-reforge-v2 .sn-item:hover,
body.theme-reforge-v2 .sn-item.catalog-hover-active,
body.theme-reforge-v2 .sn-item.clickable:hover,
body.theme-reforge-v2 .sn-item.current-stage:not(.active) {
  transform: none !important;
  scale: none !important;
  translate: none !important;
  rotate: none !important;
  box-shadow: none !important;
  filter: none !important;
  will-change: auto !important;
}

#screen-home .agent-card {
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}

#screen-home .agent-card ::selection {
  background: transparent !important;
  color: inherit !important;
}

#screen-home .agent-card .agent-name,
#screen-home .agent-card .agent-desc {
  background: transparent !important;
  box-shadow: none !important;
}

#screen-agent .redesenho-cenario-selecionado {
  background: var(--agent-panel-bg) !important;
  border: 1px solid var(--agent-line) !important;
  color: var(--agent-text) !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, var(--agent-card-depth)),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(var(--agent-card-blur)) saturate(var(--agent-card-saturate)) !important;
  -webkit-backdrop-filter: blur(var(--agent-card-blur)) saturate(var(--agent-card-saturate)) !important;
}

#screen-agent .redesenho-cenario-selecionado::before {
  background: linear-gradient(90deg, var(--stage-color) 0%, color-mix(in srgb, var(--stage-color) 45%, #fff) 100%) !important;
}

#screen-home .proj-open-btn:hover,
#screen-home .proj-action-btn:hover,
#screen-home .new-proj-btn:hover,
#screen-home .logout-btn:hover,
#screen-home .toggle-done:hover,
#screen-home .avatar-button:hover,
#screen-home .proj-open-btn.catalog-hover-active,
#screen-home .proj-action-btn.catalog-hover-active,
#screen-home .new-proj-btn.catalog-hover-active,
#screen-home .logout-btn.catalog-hover-active,
#screen-home .toggle-done.catalog-hover-active,
#screen-home .avatar-button.catalog-hover-active,
#screen-home .proj-name,
#screen-home .agent-name,
#screen-home .proj-client,
#screen-home .proj-date,
#screen-home .agent-desc,
#screen-home .stage-lbl,
#screen-home .stage-lbl strong,
#screen-home .home-disclaimer,
#screen-home .sec-title,
#screen-home .sec-count,
#screen-home .screen-disclaimer,
#screen-home .status-badge {
  filter: none !important;
}

@media (prefers-reduced-motion: reduce) {
  body.theme-reforge-v2,
  .proj-card,
  .agent-card {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}

.proj-name {
  font-size: 1.18rem;
  font-weight: 700;
  color: var(--text-1);
}

.agent-card {
  padding: 20px 22px;
  gap: 16px;
}

.agent-icon,
.entry-icon {
  color: var(--text-2);
}

.agent-name {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 6px;
}

.screen.stage-understanding {
  --agent-accent: var(--color-navy);
  --agent-tint: var(--bg-tint-navy);
  --agent-action-text: #ffffff;
}

.screen.stage-mapping {
  --agent-accent: var(--color-blue);
  --agent-tint: var(--bg-tint-blue);
  --agent-action-text: #ffffff;
}

.screen.stage-diagnostico {
  --agent-accent: var(--color-blue-grey);
  --agent-tint: var(--bg-tint-blue-grey);
  --agent-action-text: #ffffff;
}

.screen.stage-redesenho {
  --agent-accent: var(--color-teal);
  --agent-tint: var(--bg-tint-teal);
  --agent-action-text: #ffffff;
}

.screen.stage-implementacao {
  --agent-accent: var(--color-orange);
  --agent-tint: var(--bg-tint-orange);
  --agent-action-text: #ffffff;
}

.screen.stage-operacao,
.screen.stage-monitoramento {
  --agent-accent: var(--color-green);
  --agent-tint: var(--bg-tint-green);
  --agent-action-text: #10243e;
}

#screen-agent {
  --agent-shell-blur: 9px;
  --agent-card-blur: 27px;
  --agent-card-saturate: 145%;
  --agent-card-depth: 0.18;
  --agent-card-border-alpha: 0.18;
  --agent-card-solid-alpha: 0.24;
  --agent-card-alpha-strong: 0.22;
  --agent-card-alpha-soft: 0.08;
  --agent-card-tint-strong: 28%;
  --agent-card-tint-soft: 12%;
  --agent-panel-bg:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--agent-tint, #f8fbff) var(--agent-card-tint-strong), rgba(255, 255, 255, var(--agent-card-alpha-strong))),
      color-mix(in srgb, var(--agent-tint, #f8fbff) var(--agent-card-tint-soft), rgba(255, 255, 255, var(--agent-card-alpha-soft)))
    ),
    rgba(255, 255, 255, var(--agent-card-solid-alpha));
  --surface: color-mix(in srgb, var(--agent-tint, #f8fbff) 60%, rgba(255, 255, 255, 0.14));
  --agent-surface: var(--agent-panel-bg);
  --agent-line: rgba(255, 255, 255, var(--agent-card-border-alpha));
  --agent-text: #10243e;
  --agent-form-title-color: rgb(16, 36, 62);
  --agent-muted: rgb(16, 36, 62);
  --agent-soft: rgba(255, 255, 255, 0.78);
  --text-1: #10243e;
  --text-2: rgb(16, 36, 62);
  --text-3: #6e8198;
}

#screen-agent .topbar,
#screen-agent .stage-nav,
#screen-agent .ctx-bar,
#screen-agent .col-left,
#screen-agent .col-right,
#screen-agent .advance-bar {
  background: var(--agent-panel-bg) !important;
  border: 1px solid var(--agent-line) !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, var(--agent-card-depth)),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(var(--agent-shell-blur)) saturate(var(--agent-card-saturate));
  -webkit-backdrop-filter: blur(var(--agent-shell-blur)) saturate(var(--agent-card-saturate));
  color: var(--agent-text);
}

#screen-agent .u-card,
#screen-agent .diagnostico-input-card,
#screen-agent .transcript-action-bar,
#screen-agent .panel,
#screen-agent .right-state {
  background: var(--agent-panel-bg) !important;
  border: 1px solid var(--agent-line) !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, var(--agent-card-depth)),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(var(--agent-card-blur)) saturate(var(--agent-card-saturate));
  -webkit-backdrop-filter: blur(var(--agent-card-blur)) saturate(var(--agent-card-saturate));
  color: var(--agent-text);
}

#screen-agent .understanding-transcript-bar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#screen-agent .col-left {
  background: var(--agent-panel-bg) !important;
}

#screen-agent .col-right {
  background: var(--agent-surface) !important;
}

#screen-agent .topbar {
  margin: 6px 20px 0;
  min-height: 43px;
  height: auto;
  padding: 0 20px;
  border-radius: 0;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

#screen-agent .advance-bar,
#screen-agent .understanding-advance-bar,
#screen-agent .mapping-advance-bar,
#screen-agent .diagnostico-advance-bar,
#screen-agent .redesenho-advance-bar,
#screen-agent .implementacao-advance-bar,
#screen-agent .monitoramento-advance-bar {
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#understandingAdvanceBar,
#mappingAdvanceBar,
#diagnosticoAdvanceBar,
#redesenhoAdvanceBar,
#implementacaoAdvanceBar,
#monitoramentoAdvanceBar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  pointer-events: none;
}

#understandingAdvanceBar .advance-btn,
#mappingAdvanceBar .advance-btn,
#diagnosticoAdvanceBar .advance-btn,
#redesenhoAdvanceBar .advance-btn,
#implementacaoAdvanceBar .advance-btn,
#monitoramentoAdvanceBar .advance-btn {
  pointer-events: auto;
}

#screen-agent .tool-btn:hover:not(:disabled),
#screen-agent .tool-btn.catalog-hover-active,
#screen-agent .copy-btn:hover:not(:disabled),
#screen-agent .copy-btn.catalog-hover-active,
#screen-agent .f-btn:hover:not(:disabled),
#screen-agent .f-btn.catalog-hover-active,
#screen-agent .advance-btn:hover:not(:disabled),
#screen-agent .advance-btn.catalog-hover-active,
#screen-agent .modal-btn:hover:not(:disabled),
#screen-agent .modal-btn.catalog-hover-active,
#screen-agent .understanding-shell .btn:hover:not(:disabled),
#screen-agent .understanding-shell .btn.catalog-hover-active {
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
}

#screen-agent .tool-btn:hover:not(:disabled),
#screen-agent .tool-btn.catalog-hover-active,
#screen-agent .copy-btn:hover:not(:disabled),
#screen-agent .copy-btn.catalog-hover-active,
#screen-agent .f-btn:not(.export):not(.confirm):not(.confirm-success):not(.f-btn-primary):hover:not(:disabled),
#screen-agent .f-btn:not(.export):not(.confirm):not(.confirm-success):not(.f-btn-primary).catalog-hover-active,
#screen-agent .modal-btn:not(.go):hover:not(:disabled),
#screen-agent .modal-btn:not(.go).catalog-hover-active,
#screen-agent .understanding-shell .btn:not(.btn-navy):hover:not(:disabled),
#screen-agent .understanding-shell .btn:not(.btn-navy).catalog-hover-active {
  color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 82%, white 18%) !important;
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, rgba(255, 255, 255, 0.03)) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 34%, rgba(255, 255, 255, 0.16)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 16%, transparent) !important;
  filter: none !important;
}

#screen-agent .f-btn.export:hover:not(:disabled),
#screen-agent .f-btn.export.catalog-hover-active,
#screen-agent .f-btn.confirm:hover:not(:disabled),
#screen-agent .f-btn.confirm.catalog-hover-active,
#screen-agent .f-btn.confirm-success:hover:not(:disabled),
#screen-agent .f-btn.confirm-success.catalog-hover-active,
#screen-agent .f-btn.f-btn-primary:hover:not(:disabled),
#screen-agent .f-btn.f-btn-primary.catalog-hover-active,
#screen-agent .advance-btn:hover:not(:disabled),
#screen-agent .advance-btn.catalog-hover-active,
#screen-agent .modal-btn.go:hover:not(:disabled),
#screen-agent .modal-btn.go.catalog-hover-active,
#screen-agent .understanding-shell .btn-navy:hover:not(:disabled),
#screen-agent .understanding-shell .btn-navy.catalog-hover-active,
#screen-agent .understanding-shell .btn-stage:hover:not(:disabled),
#screen-agent .understanding-shell .btn-stage.catalog-hover-active {
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 92%, white 8%) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 48%, rgba(255, 255, 255, 0.18)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 22%, transparent) !important;
  filter: none !important;
}

#screen-agent .advance-bar-info {
  display: none !important;
}

#screen-agent .stage-nav {
  margin-top: 4px;
  min-height: 36px;
  padding: 0 4px;
  border-radius: 14px;
  gap: 4px;
}

#screen-agent .agent-stage-nav {
  margin: 0;
  min-height: 0;
  height: auto;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  flex: 1 1 auto;
}

#screen-agent .agent-stage-nav .sn-item {
  min-height: 34px;
}

#screen-agent .ctx-bar {
  margin-top: 4px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 14px;
}

#screen-agent .topbar-right,
#screen-agent .agent-top-left {
  gap: 8px;
}

#screen-agent .logo,
#screen-agent .logo-button {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--agent-text) !important;
}

#screen-agent .topbar-user,
#screen-agent .agent-badge {
  padding: 4px 9px;
  color: var(--agent-muted);
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.24);
}

#screen-agent .avatar,
#screen-agent .avatar-button,
#screen-agent .copy-btn,
#screen-agent .panel-close,
#screen-agent .proc-chip-edit,
#screen-agent .monitoramento-remove-btn,
#screen-agent .proj-action-btn {
  width: 28px;
  height: 28px;
  color: var(--agent-muted);
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.24);
}

#screen-agent .copy-btn {
  width: 44px;
  min-width: 44px;
  height: 36px;
  border-radius: 10px;
}

#screen-agent .back-btn,
#screen-agent .logout-btn,
#screen-agent .tool-btn,
#screen-agent .proj-open-btn,
#screen-agent .f-btn:not(.export):not(.confirm):not(.confirm-success):not(.f-btn-primary),
#screen-agent .understanding-shell .btn:not(.btn-navy),
#screen-agent.stage-mapping #mappingShell .btn:not(.btn-navy),
#screen-agent .add-proc,
#screen-agent .u-edit-toggle {
  min-height: 31px;
  padding: 0 11px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--agent-text);
  box-shadow: none;
}

#screen-agent #backProjectsBtn.back-btn {
  color: rgba(191, 198, 207, 0.94) !important;
}

#screen-agent .agent-main {
  gap: 0;
  padding: 6px 20px 18px;
}

#screen-agent .col-left,
#screen-agent .col-right {
  border-radius: 18px;
}

#screen-agent .col-left {
  width: 42%;
}

#screen-agent .resize-handle {
  width: 6px;
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 12%, rgba(10, 37, 64, 0.08));
}

#screen-agent .chat-scroll {
  padding: 20px 20px 12px;
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, transparent), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03) 24%);
}

#screen-agent .tools-strip,
#screen-agent .advance-wrap,
#screen-agent .chat-input-wrap {
  padding-left: 16px;
  padding-right: 16px;
}

#screen-agent .input-inner {
  background: rgba(255, 255, 255, 0.18);
  border-color: var(--agent-line);
}

#screen-agent .form-header {
  padding: 14px 24px 12px;
  background: rgba(255, 255, 255, 0.08);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

#screen-agent .form-body,
#screen-agent .u-form-shell-body,
#screen-agent .understanding-page,
#screen-agent .diagnostico-page,
#screen-agent .redesenho-page,
#screen-agent .implementacao-page,
#screen-agent .monitoramento-page,
#screen-agent .panel-body {
  padding: 18px;
}

#screen-agent .understanding-page,
#screen-agent .diagnostico-page,
#screen-agent .redesenho-page,
#screen-agent .implementacao-page,
#screen-agent .monitoramento-page {
  max-width: min(1360px, calc(100vw - 40px));
}

#screen-agent .u-card-header,
#screen-agent .u-card-footer,
#screen-agent .panel-head {
  background: rgba(255, 255, 255, 0.08);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

#screen-agent .u-card-title,
#screen-agent .form-title,
#screen-agent .panel-title,
#screen-agent .proc-chip,
#screen-agent .ctx-seg strong,
#screen-agent .proj-open-btn,
#screen-agent .entry-title,
#screen-agent .rs-title,
#screen-agent .modal-title,
#screen-agent .implementacao-analise-content h2,
#screen-agent .implementacao-analise-content h3,
#screen-agent .implementacao-analise-content h4 {
  color: var(--agent-form-title-color) !important;
  font-weight: 700 !important;
}

#screen-agent,
#screen-agent .u-card-body,
#screen-agent .u-field-value,
#screen-agent .u-field-label,
#screen-agent .form-meta,
#screen-agent .u-status-note,
#screen-agent .entry-sub,
#screen-agent .diagnostico-input-sub,
#screen-agent .diagnostico-file-state,
#screen-agent .ctx-seg,
#screen-agent .ctx-sep,
#screen-agent .stage-lbl,
#screen-agent .tools-hint,
#screen-agent .transcript-action-hint,
#screen-agent .implementacao-processing-msg,
#screen-agent .monitoramento-processing-msg,
#screen-agent .raci-legenda,
#screen-agent .impl-date,
#screen-agent .monitoramento-field-label,
#screen-agent .screen-disclaimer {
  color: var(--agent-muted) !important;
}

#screen-agent .u-status-note,
#screen-agent .entry-sub,
#screen-agent .tools-hint,
#screen-agent .transcript-action-hint {
  color: rgb(16, 36, 62) !important;
}

#screen-agent .understanding-transcript-bar {
  justify-content: flex-end;
}

#screen-agent .understanding-transcript-bar .transcript-action-copy {
  flex: 0 1 440px;
  margin-left: auto;
  max-width: 460px;
  justify-content: flex-end;
  text-align: right;
}

#screen-agent .understanding-transcript-bar .transcript-action-buttons {
  flex: 0 0 auto;
}

#screen-agent .u-field-label,
#screen-agent .u-section-label,
#screen-agent .diagnostico-section-label,
#screen-agent .monitoramento-field-label,
#screen-agent .raci-legenda {
  color: var(--agent-form-title-color) !important;
  font-weight: 700 !important;
}

#screen-agent .modal-input,
#screen-agent .u-field-input,
#screen-agent .diagnostico-textarea,
#screen-agent .monitoramento-select,
#screen-agent .monitoramento-input,
#screen-agent .monitoramento-textarea,
#screen-agent .implementacao-cidade-input,
#screen-agent #understandingPasteInput,
#screen-agent .chat-ta,
#screen-agent .lousa,
#screen-agent .lousa-preview,
#screen-agent .u-field-value,
#screen-agent .mapping-form-fields,
#screen-agent .diagnostico-file-input-visible {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 64%, rgba(255, 255, 255, 0.18)) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, rgba(255, 255, 255, 0.18)) !important;
  color: var(--agent-text) !important;
  border-radius: 16px !important;
}

#screen-agent .diagnostico-textarea-readonly,
#screen-agent .monitoramento-bpmn-readonly,
#screen-agent .mapping-form-fields,
#screen-agent .lousa-preview,
#screen-agent .u-field-value,
#screen-agent .u-cronograma,
#screen-agent .u-scope-value,
#screen-agent.stage-understanding .entry-card,
#screen-agent .redesenho-cenario-item,
#screen-agent .monitoramento-indicator-card,
#screen-agent .diagnostico-upload-chip,
#screen-agent .diagnostico-inline-alert,
#screen-agent .monitoramento-inline-alert,
#screen-agent .u-gen-notice {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 60%, rgba(255, 255, 255, 0.14)) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, rgba(255, 255, 255, 0.16)) !important;
  color: var(--agent-text) !important;
}

#screen-agent .diagnostico-indicator-box,
#screen-agent .diagnostico-list-section,
#screen-agent .u-gen-content,
#screen-agent .redesenho-output-pre,
#screen-agent .implementacao-analise-content {
  position: relative;
  overflow: hidden;
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 60%, rgba(255, 255, 255, 0.14)) !important;
  border: 1px solid color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, rgba(255, 255, 255, 0.16)) !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 8%, transparent);
  color: var(--agent-text) !important;
  padding: 18px 18px 16px !important;
}

#screen-agent .diagnostico-indicator-box::before,
#screen-agent .diagnostico-list-section::before,
#screen-agent .u-gen-content::before,
#screen-agent .redesenho-output-pre::before,
#screen-agent .implementacao-analise-content::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(
    90deg,
    var(--agent-accent, var(--stage-color)) 0%,
    color-mix(in srgb, var(--agent-accent, var(--stage-color)) 45%, #fff) 100%
  );
}

#screen-agent .diagnostico-indicator-box > *,
#screen-agent .diagnostico-list-section > *,
#screen-agent .u-gen-content > *,
#screen-agent .implementacao-analise-content > * {
  position: relative;
  z-index: 1;
}

/* Redesenho: o conteúdo precisa crescer livre, sem "card dentro do card". */
#screen-agent.stage-redesenho .u-card,
#screen-agent.stage-redesenho .redesenho-output-card,
#screen-agent.stage-redesenho .redesenho-output-card .u-card-body,
#screen-agent.stage-redesenho .redesenho-cenarios-grid,
#screen-agent.stage-redesenho .redesenho-cenario-item,
#screen-agent.stage-redesenho .redesenho-page {
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#screen-agent.stage-redesenho .redesenho-page {
  overflow-y: auto !important;
  overflow-x: visible !important;
}

#screen-agent.stage-redesenho .redesenho-fase2-wrap,
#screen-agent.stage-redesenho .redesenho-outputs-grid,
#screen-agent.stage-redesenho .redesenho-outputs-grid > *,
#screen-agent.stage-redesenho .redesenho-cenario-selecionado,
#screen-agent.stage-redesenho .redesenho-cenario-history,
#screen-agent.stage-redesenho .redesenho-cenario-history[open] {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#screen-agent.stage-redesenho .redesenho-output-card {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

#screen-agent.stage-redesenho .redesenho-output-card .u-card-body,
#screen-agent.stage-redesenho .u-card-body.redesenho-cenarios-grid {
  display: block !important;
  flex: none !important;
}

#screen-agent.stage-redesenho .redesenho-output-card .u-card-body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
}

#screen-agent.stage-redesenho .redesenho-cenario-selecionado,
#screen-agent.stage-redesenho .redesenho-output-card {
  overflow: hidden !important;
}

#screen-agent.stage-redesenho .redesenho-cenario-selected-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

#screen-agent.stage-redesenho .redesenho-output-pre {
  position: static !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
}

#screen-agent.stage-redesenho .redesenho-output-pre::before {
  content: none !important;
}

#screen-agent .u-card-body {
  padding: 16px 18px !important;
}

#screen-agent .u-form-grid,
#screen-agent .u-form-grid.cols-2,
#screen-agent .u-form-grid.cols-3 {
  gap: 12px !important;
}

#screen-agent .u-field {
  gap: 6px;
}

#screen-agent .u-field-label {
  font-size: 10.5px;
  letter-spacing: 0.05em;
}

#screen-agent .u-field-value,
#screen-agent .u-field-input.short,
#screen-agent .monitoramento-input,
#screen-agent .monitoramento-select,
#screen-agent .implementacao-cidade-input,
#screen-agent .diagnostico-file-input-visible {
  min-height: 42px !important;
  padding: 8px 14px !important;
  line-height: 1.45;
}

#screen-agent .u-field-input {
  min-height: 48px !important;
  padding: 10px 14px !important;
  line-height: 1.5;
}

#screen-agent .mapping-form-fields,
#screen-agent .lousa-preview,
#screen-agent .lousa,
#screen-agent .diagnostico-textarea-readonly,
#screen-agent .monitoramento-bpmn-readonly {
  padding: 14px 16px !important;
  border-radius: 18px !important;
}

#screen-agent .msg-agent .bubble,
#screen-agent .bubble-agent {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--agent-accent, var(--stage-color)) 92%, white 8%),
      color-mix(in srgb, var(--agent-accent, var(--stage-color)) 78%, black 8%)
    ) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 34%, rgba(10, 37, 64, 0.12)) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 18%, transparent) !important;
}

#screen-agent .msg-user .bubble,
#screen-agent .bubble-user,
#screen-agent .file-chip {
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, rgba(255, 255, 255, 0.18)) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 18%, rgba(10, 37, 64, 0.08)) !important;
  color: var(--agent-text) !important;
}

#screen-agent .page-label {
  display: none !important;
}

#screen-agent .sn,
#screen-agent .sn-item,
#screen-agent .sn-item.done,
#screen-agent .stage-lbl {
  color: rgba(191, 198, 207, 0.94) !important;
}

#screen-agent .sn-item {
  min-height: 28px;
  padding: 0 12px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
}

#screen-agent .sn-item.clickable:hover,
#screen-agent .sn-item.current-stage:not(.active) {
  color: var(--agent-text) !important;
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 72%, white);
}

#screen-agent .sn-item.active {
  color: var(--agent-text) !important;
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 11%, white);
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 26%, rgba(255, 255, 255, 0.18));
  box-shadow: none;
}

#screen-agent .sn-dot {
  background: var(--agent-accent, var(--stage-color));
  box-shadow: none;
  flex: 0 0 5px;
}

#screen-agent .sn-check {
  min-width: 10px;
  text-align: center;
  flex: 0 0 10px;
}

#screen-agent .sn-index,
#screen-agent .sn-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#screen-agent .proc-chip {
  padding: 6px 10px;
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 42%, rgba(255, 255, 255, 0.12)) !important;
  border-color: var(--agent-line) !important;
  color: var(--agent-text) !important;
}

#screen-agent .proc-chip.active {
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 10%, white) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 26%, rgba(10, 37, 64, 0.12)) !important;
  color: var(--agent-accent, var(--stage-color)) !important;
}

#screen-agent .proc-chip.done {
  background: color-mix(in srgb, var(--color-green) 18%, rgba(255, 255, 255, 0.3)) !important;
  border-color: color-mix(in srgb, var(--color-green) 24%, rgba(10, 37, 64, 0.1)) !important;
  color: #5d8f2a !important;
}

#screen-agent .add-proc {
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  border-color: var(--agent-line);
  color: var(--agent-muted);
}

.agent-card-tuner {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: min(390px, calc(100vw - 28px));
  max-height: calc(100vh - 120px);
  overflow: auto;
  z-index: 40;
  padding: 18px;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 18px 42px rgba(10, 37, 64, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.24);
  backdrop-filter: blur(48px) saturate(155%);
  -webkit-backdrop-filter: blur(48px) saturate(155%);
}

#mappingShell {
  background: transparent !important;
}

#screen-agent input::placeholder,
#screen-agent textarea::placeholder {
  color: color-mix(in srgb, var(--agent-muted) 78%, white 22%) !important;
}

#screen-agent.stage-mapping .advance-wrap {
  padding-top: 4px;
  padding-bottom: 6px;
}

#screen-agent .advance-btn {
  min-height: 35px;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 14px;
  font-size: 0.82rem;
}

#screen-agent.stage-mapping #advanceHint {
  display: none !important;
}

#screen-agent .add-proc:hover {
  color: var(--agent-accent, var(--stage-color));
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 28%, rgba(10, 37, 64, 0.12));
}

#screen-agent .f-btn.export,
#screen-agent .f-btn.confirm,
#screen-agent .f-btn.f-btn-primary,
#screen-agent .advance-btn,
#screen-agent .modal-btn.go,
#screen-agent .understanding-shell .btn-navy,
#screen-agent .understanding-shell .btn-stage,
#screen-agent.stage-mapping #mappingShell .btn-navy,
#screen-agent.stage-mapping #mappingShell .btn-stage {
  background: var(--agent-accent, var(--stage-color)) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 78%, rgba(10, 37, 64, 0.16)) !important;
  color: var(--agent-action-text, #ffffff) !important;
  border-radius: 10px !important;
  box-shadow: 0 14px 28px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 24%, transparent) !important;
  font-weight: 700 !important;
}

#screen-agent .f-btn.export:hover:not(:disabled),
#screen-agent .f-btn.confirm:hover:not(:disabled),
#screen-agent .f-btn.f-btn-primary:hover:not(:disabled),
#screen-agent .advance-btn:hover:not(:disabled),
#screen-agent .modal-btn.go:hover:not(:disabled),
#screen-agent .understanding-shell .btn-navy:hover:not(:disabled),
#screen-agent .understanding-shell .btn-stage:hover:not(:disabled),
#screen-agent.stage-mapping #mappingShell .btn-navy:hover:not(:disabled),
#screen-agent.stage-mapping #mappingShell .btn-stage:hover:not(:disabled),
#screen-agent .f-btn.export.catalog-hover-active,
#screen-agent .f-btn.confirm.catalog-hover-active,
#screen-agent .f-btn.f-btn-primary.catalog-hover-active,
#screen-agent .advance-btn.catalog-hover-active,
#screen-agent .modal-btn.go.catalog-hover-active,
#screen-agent .understanding-shell .btn-navy.catalog-hover-active,
#screen-agent .understanding-shell .btn-stage.catalog-hover-active,
#screen-agent.stage-mapping #mappingShell .btn-navy.catalog-hover-active,
#screen-agent.stage-mapping #mappingShell .btn-stage.catalog-hover-active {
  background: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 92%, white 8%) !important;
  border-color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 84%, rgba(10, 37, 64, 0.16)) !important;
  color: var(--agent-action-text, #ffffff) !important;
  box-shadow: 0 18px 34px color-mix(in srgb, var(--agent-accent, var(--stage-color)) 28%, transparent) !important;
  filter: none !important;
}

#screen-agent .right-state .p-item {
  background: rgba(252, 253, 255, 0.98) !important;
  color: rgb(16, 36, 62) !important;
  border: 1px solid rgba(120, 146, 178, 0.28);
  box-shadow:
    0 10px 22px rgba(10, 37, 64, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.status-badge,
.u-card-badge,
.badge-active,
.badge-done,
.u-badge-done,
.u-badge-ai,
.u-badge-stage-accent,
.u-badge-stale {
  font-size: 0.64rem;
  font-weight: 800;
  border-radius: 999px;
  padding: 7px 11px;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.badge-active,
.u-badge-ai {
  background: color-mix(in srgb, var(--stage-color) 18%, transparent);
  color: color-mix(in srgb, var(--stage-color) 66%, white);
}

.badge-done,
.u-badge-done {
  background: color-mix(in srgb, #7dd378 26%, rgba(255, 255, 255, 0.96));
  color: #4e9a2a;
  border-color: color-mix(in srgb, #7dd378 42%, rgba(255, 255, 255, 0.34));
}

.u-badge-stage-accent {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-1);
}

.u-badge-stale {
  background: rgba(251, 191, 36, 0.16);
  color: #f7d77b;
  border-color: rgba(251, 191, 36, 0.28);
}

.sn-item {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 18px;
  color: var(--text-3);
  font-size: 0.7rem;
  border: 1px solid transparent;
}

.sn-label {
  font-size: 0.82rem;
  font-family: var(--font);
  font-weight: 700;
}

.sn-item.clickable:hover,
.sn-item.current-stage:not(.active) {
  color: var(--text-1);
  background: rgba(255, 255, 255, 0.06);
}

.sn-item.active {
  color: var(--text-1);
  border-bottom-color: transparent;
  background: color-mix(in srgb, var(--stage-color) 18%, rgba(255, 255, 255, 0.04));
  border-color: color-mix(in srgb, var(--stage-color) 34%, rgba(255, 255, 255, 0.12));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.ctx-procs {
  gap: 8px;
}

.proc-chip {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-2);
  padding: 8px 12px;
  border-radius: 999px;
}

.proc-chip.active {
  background: color-mix(in srgb, var(--stage-color) 18%, rgba(255, 255, 255, 0.05));
  border-color: color-mix(in srgb, var(--stage-color) 42%, rgba(255, 255, 255, 0.14));
  color: color-mix(in srgb, var(--stage-color) 58%, white);
}

.proc-chip.done {
  background: rgba(125, 211, 120, 0.12);
}

.add-proc,
.tool-btn,
.f-btn,
.understanding-shell .btn,
.proj-open-btn,
.new-proj-btn,
.logout-btn,
.back-btn,
.modal-btn,
.login-submit,
.u-edit-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.07);
  color: var(--text-1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.add-proc:hover,
.tool-btn:hover:not(:disabled),
.f-btn:hover:not(:disabled),
.understanding-shell .btn:hover:not(:disabled),
.proj-open-btn:hover,
.new-proj-btn:hover,
.logout-btn:hover,
.back-btn:hover,
.modal-btn:hover,
.login-submit:hover,
.u-edit-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--text-1);
}

.new-proj-btn,
.f-btn.export,
.f-btn.confirm,
.btn-navy,
.modal-btn.go,
.login-submit,
.advance-btn,
.f-btn.f-btn-primary {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--stage-color) 92%, white 8%), color-mix(in srgb, var(--stage-color) 52%, black 16%));
  border-color: color-mix(in srgb, var(--stage-color) 58%, transparent);
  color: #ffffff !important;
  box-shadow: 0 16px 28px color-mix(in srgb, var(--stage-color) 28%, transparent);
}

.new-proj-btn,
.login-submit {
  background:
    linear-gradient(135deg, #89aafc, #2979ff);
  border-color: rgba(137, 170, 252, 0.34);
}

.f-btn.confirm-success,
.advance-btn.done-s {
  background: linear-gradient(135deg, #7fd66a, #5ab047);
  border-color: rgba(125, 211, 120, 0.32);
  color: #04110a !important;
}

.f-btn-subtle,
.modal-btn.cancel,
.logout-btn,
.back-btn,
.proj-open-btn {
  background: rgba(255, 255, 255, 0.04);
}

.tool-btn.active,
.understanding-shell .entry-card.selected,
.toggle-done:hover {
  background: color-mix(in srgb, var(--stage-color) 18%, rgba(255, 255, 255, 0.06));
  border-color: color-mix(in srgb, var(--stage-color) 38%, rgba(255, 255, 255, 0.14));
}

.f-btn:disabled,
.advance-btn:disabled,
.copy-btn:disabled,
.send-btn:disabled,
.tool-btn:disabled,
.login-submit:disabled,
.new-proj-btn:disabled {
  opacity: 0.38;
}

input,
textarea,
select,
button {
  font-family: var(--font);
}

input::placeholder,
textarea::placeholder {
  color: rgba(214, 224, 248, 0.4);
}

.modal-input,
.u-field-input,
.diagnostico-textarea,
.monitoramento-select,
.monitoramento-input,
.monitoramento-textarea,
.implementacao-cidade-input,
#understandingPasteInput,
.chat-ta,
.lousa,
.lousa-preview,
.u-field-value,
.mapping-form-fields,
.diagnostico-file-input-visible {
  background: var(--field) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 20px !important;
  color: var(--text-1) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.modal-input:focus,
.u-field-input:focus,
.diagnostico-textarea:focus,
.monitoramento-select:focus,
.monitoramento-input:focus,
.monitoramento-textarea:focus,
.implementacao-cidade-input:focus,
#understandingPasteInput:focus,
.chat-ta:focus,
.lousa:focus {
  box-shadow: var(--ring) !important;
}

.u-field-value,
.diagnostico-textarea-readonly,
.monitoramento-bpmn-readonly,
.mapping-form-fields,
.lousa-preview {
  background: rgba(255, 255, 255, 0.045) !important;
}

.agent-main {
  gap: 18px;
  padding: 14px 20px 24px;
  overflow: hidden;
}

.col-left,
.col-right {
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: var(--glass-strong) !important;
  box-shadow: var(--shadow);
  backdrop-filter: blur(48px) saturate(160%);
  -webkit-backdrop-filter: blur(48px) saturate(160%);
}

.col-left {
  border-right: none;
  overflow: hidden;
}

.col-right {
  border-left: none;
  overflow: hidden;
}

.resize-handle {
  width: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
}

.chat-scroll {
  padding: 24px 24px 16px;
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--stage-color) 18%, transparent), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 25%);
}

.msg-agent .bubble,
.msg-user .bubble,
.bubble-agent,
.bubble-user,
.file-chip {
  border-radius: 22px !important;
  backdrop-filter: blur(28px);
  -webkit-backdrop-filter: blur(28px);
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.2);
  font-family: var(--font) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.msg-agent .bubble strong,
.msg-agent .bubble b,
.msg-user .bubble strong,
.msg-user .bubble b,
.bubble-agent strong,
.bubble-agent b,
.bubble-user strong,
.bubble-user b {
  font-weight: 500 !important;
}

.msg-agent .bubble,
.bubble-agent {
  background: color-mix(in srgb, var(--stage-color) 16%, rgba(6, 11, 18, 0.92)) !important;
  border: 1px solid color-mix(in srgb, var(--stage-color) 34%, rgba(255, 255, 255, 0.08)) !important;
  color: var(--text-1) !important;
}

.msg-user .bubble,
.bubble-user,
.file-chip {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: var(--text-1) !important;
}

.msg-agent.msg-context-summary .bubble {
  border-left: 1px solid color-mix(in srgb, var(--stage-color) 42%, rgba(255, 255, 255, 0.1)) !important;
}

#screen-agent .msg-agent.msg-context-summary .bubble p:first-child,
#screen-agent .msg-agent.msg-context-summary .bubble strong:first-child {
  color: #ffffff !important;
}

.tools-strip,
.advance-wrap,
.chat-input-wrap,
.form-header {
  background: transparent;
}

.tools-strip,
.advance-wrap,
.chat-input-wrap {
  padding-left: 18px;
  padding-right: 18px;
}

.tools-strip {
  padding-bottom: 6px;
}

.tools-lbl {
  display: none !important;
  margin: 0 !important;
}

.input-inner {
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.chat-ta {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 10px 14px;
}

.send-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 18px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--stage-color) 88%, white 12%), color-mix(in srgb, var(--stage-color) 55%, black 18%));
  color: #fff;
  border: none;
  box-shadow: 0 16px 28px color-mix(in srgb, var(--stage-color) 28%, transparent);
}

.form-header,
.u-card-header,
.panel-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.form-header {
  background: rgba(255, 255, 255, 0.02);
  padding: 22px 24px;
}

.form-title {
  font-size: 1.12rem;
  font-weight: 700;
  color: var(--text-1);
}

.form-body,
.u-form-shell-body,
.understanding-page,
.diagnostico-page,
.redesenho-page,
.implementacao-page,
.monitoramento-page,
.panel-body {
  padding: 24px;
}

.understanding-page,
.diagnostico-page,
.redesenho-page,
.implementacao-page,
.monitoramento-page {
  max-width: min(1400px, calc(100vw - 40px));
}

.u-card-header,
.u-card-footer {
  background: rgba(255, 255, 255, 0.03);
}

.u-card-body,
.u-form-grid,
.monitoramento-entry-body,
.implementacao-entry-body,
.implementacao-plan-actions,
.diagnostico-entry-body {
  color: var(--text-2);
}

.understanding-shell .entry-card,
.redesenho-cenario-item,
.monitoramento-indicator-card,
.diagnostico-upload-chip,
.diagnostico-inline-alert,
.monitoramento-inline-alert,
.u-gen-notice,
.transcript-action-bar {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 22px !important;
  color: var(--text-2);
}

#mappingTranscriptActions {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.mapping-transcript-inline {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  padding: 0 !important;
}

.understanding-shell .entry-card:hover,
.understanding-shell .entry-card.selected,
.understanding-shell .entry-card.catalog-hover-active {
  background: color-mix(in srgb, var(--stage-color) 14%, rgba(255, 255, 255, 0.06)) !important;
}

#screen-agent.stage-understanding .entry-card:hover,
#screen-agent.stage-understanding .entry-card.catalog-hover-active,
#screen-agent.stage-understanding .entry-card.selected {
  color: var(--text-1) !important;
  background: color-mix(in srgb, var(--stage-color) 14%, rgba(255, 255, 255, 0.06)) !important;
  border-color: color-mix(in srgb, var(--stage-color) 38%, rgba(255, 255, 255, 0.14)) !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--stage-color) 16%, transparent), var(--shadow) !important;
  filter: none !important;
}

.understanding-shell .entry-card,
.u-form-card,
.understanding-paste-area textarea,
.u-cronograma,
.u-scope-value,
.u-field-value,
.u-field-input,
.u-cronograma-row-input {
  color: var(--text-1);
}

.u-field-label,
.diagnostico-input-sub,
.diagnostico-file-state,
.monitoramento-plan-footer,
.raci-legenda,
.impl-date {
  color: var(--text-3);
}

.right-state {
  margin: 24px;
  padding: 28px;
}

.rs-title {
  font-family: var(--font-serif);
  font-size: 1.1rem;
  margin-bottom: 8px;
}

.panel {
  top: 22px;
  right: 22px;
  bottom: 22px;
  width: min(420px, calc(100% - 44px));
  border-radius: 28px;
}

.modal-overlay,
.login-gate,
.tab-lock-gate {
  background: rgba(3, 8, 15, 0.66) !important;
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
}

.modal,
.login-card,
.tab-lock-card {
  border-radius: 30px !important;
  color: var(--text-1);
}

.modal-title,
.login-title,
.login-brand {
  font-family: var(--font-serif);
}

.login-brand {
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
  margin-bottom: 10px;
}

.login-error {
  background: rgba(239, 68, 68, 0.14);
  border: 1px solid rgba(239, 68, 68, 0.24);
  color: #ffb4b4;
  border-radius: 16px;
  padding: 10px 12px;
}

.advance-bar,
.understanding-advance-bar,
.diagnostico-advance-bar,
.redesenho-advance-bar,
.implementacao-advance-bar,
.monitoramento-advance-bar {
  margin: 0 20px 20px;
  padding: 12px 16px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: var(--glass);
  backdrop-filter: blur(44px);
  -webkit-backdrop-filter: blur(44px);
  box-shadow: var(--shadow);
}

.advance-btn {
  min-height: 50px;
  border-radius: 18px;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.toast {
  background: rgba(11, 18, 31, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-1);
  border-radius: 18px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(28px);
  -webkit-backdrop-filter: blur(28px);
}

.diagnostico-textarea,
.monitoramento-textarea,
.monitoramento-bpmn-readonly,
.understanding-paste-area textarea {
  min-height: 160px;
}

.diagnostico-textarea-sm,
.implementacao-iter-textarea,
.monitoramento-textarea {
  min-height: 110px !important;
}

.diagnostico-textarea-quant,
.monitoramento-input,
.monitoramento-select,
.implementacao-cidade-input {
  min-height: 58px;
}

.redesenho-cenario-item::before {
  height: 5px;
}

.redesenho-cenario-col,
.redesenho-cenario-projecao {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: var(--text-2);
}

.redesenho-output-pre,
.implementacao-analise-content,
.markdown-surface,
.lousa-preview {
  color: var(--text-2);
}

#screen-agent .diagnostico-indicator-box {
  color: var(--agent-text) !important;
}

#screen-agent .diagnostico-indicator-name {
  color: var(--agent-muted) !important;
}

#screen-agent .diagnostico-indicator-value,
#screen-agent .diagnostico-indicator-comment {
  color: var(--agent-text) !important;
}

.redesenho-table,
.implementacao-table,
.monitoramento-table,
.diagnostico-table,
table {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.22);
}

.redesenho-table th,
.redesenho-table td,
.implementacao-table th,
.implementacao-table td,
.monitoramento-table th,
.monitoramento-table td,
table th,
table td {
  border-color: rgba(255, 255, 255, 0.24) !important;
}

.redesenho-table th,
.implementacao-table th,
.monitoramento-table th,
table th {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-1) !important;
}

.redesenho-table td,
.implementacao-table td,
.monitoramento-table td,
table td {
  background: rgba(255, 255, 255, 0.03);
  color: var(--text-2) !important;
}

#screen-agent.stage-mapping .sipoc-table,
#screen-agent.stage-redesenho .redesenho-table,
#screen-agent.stage-implementacao .implementacao-table,
#screen-agent.stage-operacao .monitoramento-table {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 76%, rgba(255, 255, 255, 0.88)) !important;
  border-color: color-mix(in srgb, var(--stage-color) 16%, rgba(255, 255, 255, 0.22)) !important;
}

#screen-agent.stage-diagnostico .diagnostico-table {
  background: var(--surface) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

#screen-agent.stage-mapping .sipoc-table th,
#screen-agent.stage-redesenho .redesenho-table th,
#screen-agent.stage-implementacao .implementacao-table th,
#screen-agent.stage-operacao .monitoramento-table th {
  background: color-mix(in srgb, var(--stage-color) 10%, rgba(255, 255, 255, 0.98)) !important;
  color: color-mix(in srgb, var(--stage-color) 62%, #16324f) !important;
  border-color: color-mix(in srgb, var(--stage-color) 24%, rgba(255, 255, 255, 0.34)) !important;
}

#screen-agent.stage-diagnostico .diagnostico-table th {
  background: color-mix(in srgb, var(--surface) 88%, white) !important;
  color: color-mix(in srgb, var(--stage-color) 52%, #16324f) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

#screen-agent.stage-mapping .sipoc-table td,
#screen-agent.stage-redesenho .redesenho-table td,
#screen-agent.stage-implementacao .implementacao-table td,
#screen-agent.stage-operacao .monitoramento-table td {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 66%, rgba(255, 255, 255, 0.96)) !important;
  color: #18324b !important;
  border-color: color-mix(in srgb, var(--stage-color) 22%, rgba(255, 255, 255, 0.34)) !important;
}

#screen-agent.stage-redesenho .redesenho-table td.raci-r,
#screen-agent.stage-redesenho .redesenho-table .raci-r {
  background: #e8f5e9 !important;
  color: #2e7d32 !important;
}

#screen-agent.stage-redesenho .redesenho-table td.raci-a,
#screen-agent.stage-redesenho .redesenho-table .raci-a {
  background: #fff3e0 !important;
  color: #e65100 !important;
}

#screen-agent.stage-redesenho .redesenho-table td.raci-c,
#screen-agent.stage-redesenho .redesenho-table .raci-c {
  background: #e3f2fd !important;
  color: #1565c0 !important;
}

#screen-agent.stage-redesenho .redesenho-table td.raci-i,
#screen-agent.stage-redesenho .redesenho-table .raci-i {
  background: #f3e5f5 !important;
  color: #6a1b9a !important;
}

#screen-agent.stage-redesenho .redesenho-table td.raci-processo,
#screen-agent.stage-redesenho .redesenho-table .raci-processo {
  background: color-mix(in srgb, var(--stage-color) 6%, white) !important;
  color: #46617c !important;
}

#screen-agent.stage-implementacao .implementacao-table {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 58%, rgba(255, 255, 255, 0.78)) !important;
}

#screen-agent.stage-implementacao .implementacao-table td {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 46%, rgba(255, 255, 255, 0.72)) !important;
}

#redesenhoVoltarBtn {
  color: #ffffff !important;
}

#screen-agent.stage-diagnostico .diagnostico-table td {
  background: var(--surface) !important;
  color: #18324b !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

.autohide-scrollbar {
  scrollbar-width: thin !important;
  scrollbar-color: transparent transparent !important;
  scrollbar-gutter: stable both-edges !important;
}

.autohide-scrollbar::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
  background: transparent !important;
}

.autohide-scrollbar::-webkit-scrollbar-thumb {
  background: transparent !important;
  border-radius: 999px;
}

.autohide-scrollbar.is-scrolling {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(84, 101, 111, 0.72) transparent !important;
  scrollbar-gutter: stable both-edges !important;
}

.autohide-scrollbar.is-scrolling::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
  background: transparent !important;
}

.autohide-scrollbar.is-scrolling::-webkit-scrollbar-thumb {
  background: rgba(84, 101, 111, 0.72) !important;
  border-radius: 999px;
}

.autohide-scrollbar.is-scrolling::-webkit-scrollbar-track {
  background: transparent !important;
}

@media (max-width: 1100px) {
  .topbar,
  .stage-nav,
  .ctx-bar,
  .advance-bar {
    margin-left: 14px;
    margin-right: 14px;
  }

  .home-body,
  .agent-main {
    padding-left: 14px;
    padding-right: 14px;
  }

  .agent-main {
    gap: 14px;
  }
}

@media (max-width: 980px) {
  .topbar {
    height: auto;
    min-height: 66px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .topbar,
  .stage-nav,
  .ctx-bar {
    border-radius: 22px;
  }

  .col-left,
  .col-right,
  .panel {
    border-radius: 24px;
  }

  .agent-main {
    padding-bottom: 16px;
  }

  .home-card-tuner-grid,
  .agent-card-tuner-grid {
    grid-template-columns: 1fr;
  }

  .agent-card-tuner {
    right: 12px;
    left: 12px;
    width: auto;
    bottom: 12px;
    max-height: 48vh;
  }
}

@media (max-width: 720px) {
  .home-body {
    padding-top: 20px;
    padding-bottom: 54px;
  }

  .proj-card,
  .agent-card,
  .u-card,
  .diagnostico-input-card,
  .understanding-shell .entry-card,
  .modal,
  .login-card,
  .tab-lock-card {
    border-radius: 24px !important;
  }

  .stage-nav {
    padding-bottom: 8px;
  }

  #screen-agent .agent-stage-nav {
    padding-bottom: 0;
  }

  .sn-item {
    flex: 0 0 auto;
  }

  .form-header,
  .form-body,
  .u-form-shell-body,
  .chat-scroll,
  .tools-strip,
  .chat-input-wrap,
  .advance-wrap,
  .understanding-page,
  .diagnostico-page,
  .redesenho-page,
  .implementacao-page,
  .monitoramento-page,
  .panel-body {
    padding-left: 16px;
    padding-right: 16px;
  }

  .home-card-tuner,
  .agent-card-tuner {
    padding: 16px;
    border-radius: 22px;
  }

  .home-card-tuner-head,
  .agent-card-tuner-head {
    flex-direction: column;
  }

  .home-card-tuner-actions,
  .agent-card-tuner-actions {
    width: 100%;
  }

  .home-card-tuner-btn,
  .agent-card-tuner-btn {
    flex: 1 1 auto;
  }
}

body.theme-reforge-v2 .proj-open-btn:hover,
body.theme-reforge-v2 .proj-action-btn:hover,
body.theme-reforge-v2 .new-proj-btn:hover,
body.theme-reforge-v2 .logout-btn:hover,
body.theme-reforge-v2 .toggle-done:hover,
body.theme-reforge-v2 .avatar-button:hover,
body.theme-reforge-v2 .tool-btn:hover,
body.theme-reforge-v2 .advance-btn:hover,
body.theme-reforge-v2 .copy-btn:hover,
body.theme-reforge-v2 .panel-close:hover,
body.theme-reforge-v2 .back-btn:hover,
body.theme-reforge-v2 .f-btn:hover,
body.theme-reforge-v2 .proj-open-btn.catalog-hover-active,
body.theme-reforge-v2 .proj-action-btn.catalog-hover-active,
body.theme-reforge-v2 .new-proj-btn.catalog-hover-active,
body.theme-reforge-v2 .logout-btn.catalog-hover-active,
body.theme-reforge-v2 .toggle-done.catalog-hover-active,
body.theme-reforge-v2 .avatar-button.catalog-hover-active,
body.theme-reforge-v2 .tool-btn.catalog-hover-active,
body.theme-reforge-v2 .advance-btn.catalog-hover-active,
body.theme-reforge-v2 .copy-btn.catalog-hover-active,
body.theme-reforge-v2 .panel-close.catalog-hover-active,
body.theme-reforge-v2 .back-btn.catalog-hover-active,
body.theme-reforge-v2 .f-btn.catalog-hover-active,
body.theme-reforge-v2 .add-proc.catalog-hover-active {
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
  filter: none !important;
}


.chat-ta {
  padding: 10px 14px !important;
  min-height: 24px !important;
  max-height: 72px !important;
  height: 24px;
  line-height: 1.45 !important;
  overflow-y: hidden !important;
  resize: none !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-secondary-actions {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding-top: 0 !important;
  padding-bottom: 16px !important;
}

#screen-agent.stage-mapping #mappingShell .form-header {
  align-items: flex-start !important;
  gap: 24px !important;
  justify-content: space-between !important;
}

#screen-agent.stage-mapping #mappingShell .form-header > :first-child {
  min-width: 0 !important;
  padding-right: 16px !important;
}

#screen-agent.stage-mapping #mappingShell .form-header > :first-child > div {
  min-width: 0 !important;
}

#screen-agent.stage-mapping #mappingShell .form-btns {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  column-gap: 6px !important;
  row-gap: 8px !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
}

#screen-agent.stage-mapping #mappingShell .form-btns .f-btn {
  min-width: auto !important;
  justify-content: center !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

#screen-agent.stage-mapping #mappingShell .form-btns .f-btn.icon-only {
  width: 44px !important;
  min-width: 44px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-fields {
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  min-height: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-panel {
  width: 0 !important;
  flex: 0 0 0 !important;
  max-width: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

#screen-agent.stage-mapping #mappingShell.chat-open .mapping-chat-panel {
  width: 50% !important;
  flex: 0 0 50% !important;
  max-width: 50% !important;
}

#screen-agent.stage-mapping #mappingShell #mappingMainColumn {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: min(1360px, calc(100vw - 56px)) !important;
  margin: 0 auto !important;
}

#screen-agent.stage-mapping #mappingShell .col-right,
#screen-agent.stage-mapping #mappingShell #mappingMainColumn {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-card,
#screen-agent.stage-mapping #mappingShell .mapping-form-card,
#screen-agent.stage-mapping #mappingShell .mapping-artifact-card {
  background: var(--agent-panel-bg) !important;
  border: 1px solid var(--agent-line) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, var(--agent-card-depth)), inset 0 1px 0 rgba(255, 255, 255, 0.18), inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(var(--agent-card-blur)) saturate(var(--agent-card-saturate)) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card {
  min-height: auto !important;
  height: auto !important;
  display: block !important;
}

/* Mapear: cards iniciais com classe própria para não herdarem o hover global de .entry-card. */
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card {
  appearance: none !important;
  -webkit-appearance: none !important;
  color: var(--agent-text) !important;
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, #F0F5FF 28%, rgba(255, 255, 255, 0.22)),
      color-mix(in srgb, #F0F5FF 12%, rgba(255, 255, 255, 0.08))
    ),
    rgba(255, 255, 255, 0.24) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 12px !important;
  padding: 26px 20px !important;
  text-align: center !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(27px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(27px) saturate(145%) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .entry-title {
  color: var(--text-2) !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card .u-card-title,
#screen-agent.stage-mapping #mappingShell .mapping-artifact-card .u-card-title {
  color: var(--text-2) !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .entry-sub {
  color: rgb(16, 36, 62) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-artifact-card .u-status-text,
#screen-agent.stage-mapping #mappingShell .mapping-artifact-card .u-gen-notice {
  color: rgb(16, 36, 62) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-analysis-section-title {
  color: var(--agent-text, var(--text-1)) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-analysis-item {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 74%, rgba(255, 255, 255, 0.9)) !important;
  border: 1px solid color-mix(in srgb, var(--agent-accent, var(--stage-color)) 14%, rgba(255, 255, 255, 0.18)) !important;
  color: rgb(16, 36, 62) !important;
  box-shadow: none !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-section-title {
  color: var(--agent-text, var(--text-1)) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-meta-item,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-row-number {
  color: color-mix(in srgb, var(--agent-accent, var(--stage-color)) 46%, rgb(16, 36, 62)) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-row-text,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-note,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-plain {
  color: rgb(16, 36, 62) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-block,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-note {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 74%, rgba(255, 255, 255, 0.9)) !important;
  border: 1px solid color-mix(in srgb, var(--agent-accent, var(--stage-color)) 14%, rgba(255, 255, 255, 0.18)) !important;
  box-shadow: none !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card .form-meta,
#screen-agent.stage-mapping #mappingShell .mapping-form-card .u-card-subtitle {
  color: rgb(16, 36, 62) !important;
}

#screen-agent.stage-mapping #mappingShell .col-right {
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#screen-agent.stage-mapping #mappingShell .form-body {
  flex: 0 0 auto !important;
  min-height: auto !important;
  overflow: visible !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card.u-form-card,
#screen-agent.stage-mapping #mappingShell .mapping-form-card .u-form-shell-body,
#screen-agent.stage-mapping #mappingShell .mapping-form-card .u-card-body {
  min-height: auto !important;
  height: auto !important;
  flex: 0 0 auto !important;
  overflow: visible !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card .lousa-preview,
#screen-agent.stage-mapping #mappingShell .mapping-form-card #lousaPreview {
  overflow: visible !important;
  min-height: auto !important;
  height: auto !important;
  max-height: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  outline: none !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-form-card .lousa-preview.editing,
#screen-agent.stage-mapping #mappingShell .mapping-form-card #lousaPreview.editing,
#screen-agent.stage-mapping #mappingShell .mapping-form-fields.editing {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

#screen-agent.stage-mapping #mappingShell .u-section-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.07em !important;
  color: var(--agent-text, var(--text-1)) !important;
}

#screen-agent.stage-mapping #mappingShell .u-field-label {
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  color: var(--agent-muted, var(--text-2)) !important;
}

#screen-agent.stage-mapping #mappingShell .u-field-value,
#screen-agent.stage-mapping #mappingShell .sipoc-value {
  font-size: 13px !important;
  line-height: 1.6 !important;
}

#screen-agent.stage-operacao .monitoramento-field-label,
#screen-agent.stage-operacao .u-section-label,
#screen-agent.stage-operacao .monitoramento-indicator-title,
#screen-agent.stage-operacao .monitoramento-table th,
#screen-agent.stage-monitoramento .monitoramento-field-label,
#screen-agent.stage-monitoramento .u-section-label,
#screen-agent.stage-monitoramento .monitoramento-indicator-title,
#screen-agent.stage-monitoramento .monitoramento-table th {
  color: color-mix(in srgb, var(--stage-color) 62%, #10243e) !important;
  font-weight: 700 !important;
}

#screen-agent.stage-operacao .monitoramento-input,
#screen-agent.stage-operacao .monitoramento-select,
#screen-agent.stage-operacao .monitoramento-textarea,
#screen-agent.stage-monitoramento .monitoramento-input,
#screen-agent.stage-monitoramento .monitoramento-select,
#screen-agent.stage-monitoramento .monitoramento-textarea {
  background: rgba(255, 255, 255, 0.995) !important;
  border-color: color-mix(in srgb, var(--stage-color) 36%, rgba(16, 36, 62, 0.2)) !important;
  color: #10243e !important;
  -webkit-text-fill-color: #10243e !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    0 0 0 1px color-mix(in srgb, var(--stage-color) 11%, transparent) !important;
}

#screen-agent.stage-operacao .monitoramento-input::placeholder,
#screen-agent.stage-operacao .monitoramento-textarea::placeholder,
#screen-agent.stage-monitoramento .monitoramento-input::placeholder,
#screen-agent.stage-monitoramento .monitoramento-textarea::placeholder {
  color: rgba(96, 116, 135, 0.82) !important;
  -webkit-text-fill-color: rgba(96, 116, 135, 0.82) !important;
}

#screen-agent.stage-operacao .monitoramento-input:disabled,
#screen-agent.stage-operacao .monitoramento-select:disabled,
#screen-agent.stage-operacao .monitoramento-textarea:disabled,
#screen-agent.stage-operacao .monitoramento-bpmn-readonly,
#screen-agent.stage-operacao .monitoramento-bpmn-readonly *,
#screen-agent.stage-operacao .monitoramento-table td,
#screen-agent.stage-operacao .monitoramento-table td *,
#screen-agent.stage-operacao .monitoramento-inline-alert,
#screen-agent.stage-operacao .monitoramento-inline-alert *,
#screen-agent.stage-monitoramento .monitoramento-input:disabled,
#screen-agent.stage-monitoramento .monitoramento-select:disabled,
#screen-agent.stage-monitoramento .monitoramento-textarea:disabled,
#screen-agent.stage-monitoramento .monitoramento-bpmn-readonly,
#screen-agent.stage-monitoramento .monitoramento-bpmn-readonly *,
#screen-agent.stage-monitoramento .monitoramento-table td,
#screen-agent.stage-monitoramento .monitoramento-table td *,
#screen-agent.stage-monitoramento .monitoramento-inline-alert,
#screen-agent.stage-monitoramento .monitoramento-inline-alert * {
  color: rgb(96, 116, 135) !important;
  -webkit-text-fill-color: rgb(96, 116, 135) !important;
  opacity: 1 !important;
}

#screen-agent.stage-operacao .monitoramento-input:disabled,
#screen-agent.stage-operacao .monitoramento-select:disabled,
#screen-agent.stage-operacao .monitoramento-textarea:disabled,
#screen-agent.stage-operacao .monitoramento-bpmn-readonly,
#screen-agent.stage-monitoramento .monitoramento-input:disabled,
#screen-agent.stage-monitoramento .monitoramento-select:disabled,
#screen-agent.stage-monitoramento .monitoramento-textarea:disabled,
#screen-agent.stage-monitoramento .monitoramento-bpmn-readonly {
  background: color-mix(in srgb, var(--stage-color) 14%, rgba(244, 248, 252, 0.98)) !important;
  border-color: color-mix(in srgb, var(--stage-color) 18%, rgba(16, 36, 62, 0.18)) !important;
  box-shadow: none !important;
  cursor: default !important;
  opacity: 1 !important;
}

/* Operar: títulos/labels verdes mais claros para leitura no fundo atual. */
#screen-agent.stage-operacao .monitoramento-field-label,
#screen-agent.stage-operacao .u-section-label,
#screen-agent.stage-operacao .monitoramento-indicator-title,
#screen-agent.stage-operacao .monitoramento-table th {
  color: color-mix(in srgb, var(--stage-color) 44%, white 56%) !important;
}

#screen-agent.stage-mapping #mappingShell .panel-body .p-sec-title {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--agent-text, var(--text-1)) !important;
  letter-spacing: 0.01em !important;
}

#screen-agent #mappingShell .panel-close {
  width: 44px !important;
  min-width: 44px !important;
  height: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
  color: var(--agent-text, var(--text-2)) !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  gap: 8px !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn:hover,
#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn.active {
  background: color-mix(in srgb, #2979FF 10%, rgba(255, 255, 255, 0.03)) !important;
  border-color: color-mix(in srgb, #2979FF 40%, white 12%) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, #2979FF 16%, transparent) !important;
  color: #2979FF !important;
}

#screen-agent.stage-mapping .tool-btn:hover:not(:disabled),
#screen-agent.stage-mapping .tool-btn.catalog-hover-active,
#screen-agent.stage-mapping .copy-btn:hover:not(:disabled),
#screen-agent.stage-mapping .copy-btn.catalog-hover-active,
#screen-agent.stage-mapping .f-btn:not(.export):not(.confirm):not(.confirm-success):not(.f-btn-primary):hover:not(:disabled),
#screen-agent.stage-mapping .f-btn:not(.export):not(.confirm):not(.confirm-success):not(.f-btn-primary).catalog-hover-active,
#screen-agent.stage-mapping .modal-btn:not(.go):hover:not(:disabled),
#screen-agent.stage-mapping .modal-btn:not(.go).catalog-hover-active,
#screen-agent.stage-mapping .f-btn.export:hover:not(:disabled),
#screen-agent.stage-mapping .f-btn.export.catalog-hover-active,
#screen-agent.stage-mapping .f-btn.confirm:hover:not(:disabled),
#screen-agent.stage-mapping .f-btn.confirm.catalog-hover-active,
#screen-agent.stage-mapping .f-btn.confirm-success:hover:not(:disabled),
#screen-agent.stage-mapping .f-btn.confirm-success.catalog-hover-active,
#screen-agent.stage-mapping .f-btn.f-btn-primary:hover:not(:disabled),
#screen-agent.stage-mapping .f-btn.f-btn-primary.catalog-hover-active,
#screen-agent.stage-mapping .advance-btn:hover:not(:disabled),
#screen-agent.stage-mapping .advance-btn.catalog-hover-active,
#screen-agent.stage-mapping .modal-btn.go:hover:not(:disabled),
#screen-agent.stage-mapping .modal-btn.go.catalog-hover-active {
  background: color-mix(in srgb, #2979FF 92%, white 8%) !important;
  border-color: color-mix(in srgb, #2979FF 40%, white 12%) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, #2979FF 22%, transparent) !important;
  color: #ffffff !important;
  filter: none !important;
}

#screen-agent .understanding-gamma-link {
  min-height: 36px !important;
  height: 36px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
}

#screen-agent.stage-understanding .u-status-note,
#screen-agent.stage-understanding .entry-sub,
#screen-agent.stage-understanding .tools-hint,
#screen-agent.stage-understanding .transcript-action-hint {
  color: rgb(16, 36, 62) !important;
}

/* Mapear: os 3 cards iniciais têm hover próprio, sem depender do sistema global. */
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card:hover,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.catalog-hover-active,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.selected {
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, #2979FF 18%, rgba(255, 255, 255, 0.26)),
      color-mix(in srgb, #2979FF 10%, rgba(255, 255, 255, 0.1))
    ),
    rgba(255, 255, 255, 0.28) !important;
  border-color: color-mix(in srgb, #2979FF 42%, white 14%) !important;
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.18),
    0 0 0 1px color-mix(in srgb, #2979FF 16%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.04) !important;
  color: var(--agent-text) !important;
  filter: none !important;
  transform: none !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card:hover .entry-icon,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card:hover .entry-title,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card:hover .entry-sub,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.catalog-hover-active .entry-icon,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.catalog-hover-active .entry-title,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.catalog-hover-active .entry-sub,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.selected .entry-icon,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.selected .entry-title,
#screen-agent.stage-mapping #mappingShell .mapping-entry-grid .mapping-entry-card.selected .entry-sub {
  color: #10243e !important;
}

/* 2026-03-29 · overrides finais de perfil, loading e polimento */
.u-processing-inline {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.u-processing-inline .u-gen-notice,
.u-processing-inline .u-gen-notice-reset {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#screen-agent .copy-btn,
#screen-agent .f-btn.icon-only.f-btn-subtle {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  color: var(--agent-text, var(--text-2)) !important;
}

#screen-agent .copy-btn:hover:not(:disabled),
#screen-agent .copy-btn.catalog-hover-active,
#screen-agent .f-btn.icon-only.f-btn-subtle:hover:not(:disabled),
#screen-agent .f-btn.icon-only.f-btn-subtle.catalog-hover-active {
  border-color: color-mix(in srgb, var(--stage-color) 38%, white 12%) !important;
  color: var(--stage-color) !important;
  background: color-mix(in srgb, var(--stage-color) 10%, rgba(255, 255, 255, 0.05)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--stage-color) 14%, transparent) !important;
}

.u-card-badge,
.u-badge-done,
.u-badge-ai,
.u-badge-stale {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

.u-badge-ai {
  background: rgba(10, 37, 64, 0.14) !important;
  color: #16324f !important;
  border-color: rgba(10, 37, 64, 0.24) !important;
}

.u-badge-done {
  background: color-mix(in srgb, #7dd378 34%, rgba(255, 255, 255, 0.98)) !important;
  color: #4a9a24 !important;
  border-color: color-mix(in srgb, #7dd378 54%, rgba(255, 255, 255, 0.38)) !important;
}

#understandingPage.autohide-scrollbar,
#mappingShell .col-right.autohide-scrollbar,
#diagnosticoPage.autohide-scrollbar,
#redesenhoPage.autohide-scrollbar,
#implementacaoPage.autohide-scrollbar,
#monitoramentoPage.autohide-scrollbar {
  overflow-y: scroll !important;
  scrollbar-gutter: stable both-edges !important;
}

#screen-agent.stage-understanding .u-form-card .u-field-value,
#screen-agent.stage-understanding .u-form-card .u-scope-value,
#screen-agent.stage-understanding .u-form-card .u-cronograma-row-value {
  color: #607487 !important;
}

#screen-agent.stage-understanding .u-form-card .u-field-input,
#screen-agent.stage-understanding .u-form-card .u-cronograma-row-input {
  color: #10243e !important;
}

#screen-agent.stage-mapping #mappingShell .u-section-label,
#screen-agent.stage-mapping #mappingShell .u-field-label,
#screen-agent.stage-mapping #mappingShell .sipoc-table th {
  color: rgb(16, 36, 62) !important;
  font-weight: 700 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 8px 20px rgba(0, 0, 0, 0.10) !important;
  color: var(--agent-text, var(--text-2)) !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  gap: 8px !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn:hover,
#screen-agent.stage-mapping #mappingShell .mapping-chat-toggle-btn.active {
  background: color-mix(in srgb, #2979FF 12%, rgba(255, 255, 255, 0.08)) !important;
  border-color: color-mix(in srgb, #2979FF 38%, white 12%) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, #2979FF 18%, transparent) !important;
  color: #2979FF !important;
}

#screen-agent.stage-mapping #mappingPasteArea textarea {
  background: color-mix(in srgb, var(--agent-tint, #f8fbff) 52%, rgba(255, 255, 255, 0.94)) !important;
  border-color: color-mix(in srgb, var(--stage-color) 18%, rgba(255, 255, 255, 0.24)) !important;
  color: #10243e !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.38),
    0 0 0 1px color-mix(in srgb, var(--stage-color) 6%, transparent) !important;
}

#screen-agent.stage-mapping #mappingPasteArea textarea::placeholder {
  color: rgba(96, 116, 135, 0.92) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-entry-card.is-disabled,
#screen-agent.stage-understanding .entry-card.is-disabled {
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--agent-tint, #f8fbff) 24%, rgba(255, 255, 255, 0.18)),
      color-mix(in srgb, var(--agent-tint, #f8fbff) 8%, rgba(255, 255, 255, 0.06))
    ),
    rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.diagnostico-table th,
.diagnostico-table td,
.sipoc-table th,
.sipoc-table td,
.redesenho-table th,
.redesenho-table td,
.implementacao-table th,
.implementacao-table td,
.monitoramento-table th,
.monitoramento-table td {
  border-color: rgba(16, 36, 62, 0.18) !important;
}

.u-processing-inline {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100%;
  align-items: flex-start;
}

.u-processing-inline .u-gen-notice,
.u-processing-inline .u-gen-notice-reset {
  width: auto !important;
  max-width: 100%;
}

#screen-agent .u-card-badge,
#screen-agent .u-badge-done,
#screen-agent .u-badge-ai,
#screen-agent .u-badge-stale {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.26),
    0 6px 16px rgba(0, 0, 0, 0.08) !important;
}

#screen-agent .u-badge-done {
  background: color-mix(in srgb, var(--green) 34%, rgba(255, 255, 255, 0.98)) !important;
  color: color-mix(in srgb, var(--green) 92%, #1b4332) !important;
  border-color: color-mix(in srgb, var(--green) 58%, rgba(255, 255, 255, 0.46)) !important;
}

#screen-agent .u-badge-ai {
  background: rgba(16, 36, 62, 0.14) !important;
  color: rgb(16, 36, 62) !important;
  border-color: rgba(16, 36, 62, 0.26) !important;
}

#screen-agent .u-badge-stale {
  background: color-mix(in srgb, #2979ff 18%, rgba(255, 255, 255, 0.95)) !important;
  border-color: color-mix(in srgb, #2979ff 34%, rgba(255, 255, 255, 0.42)) !important;
  color: #1f4f99 !important;
}

#screen-agent .u-field-value,
#screen-agent .u-field-value *,
#screen-agent .u-scope-title,
#screen-agent .u-scope-title *,
#screen-agent .u-bullet-list li,
#screen-agent .u-bullet-list li *,
#screen-agent .u-cronograma-row-value,
#screen-agent .u-cronograma-row-value *,
#screen-agent textarea[readonly],
#screen-agent input[readonly],
#screen-agent .diagnostico-textarea-readonly,
#screen-agent .diagnostico-textarea-readonly *,
#screen-agent .monitoramento-bpmn-readonly,
#screen-agent .monitoramento-bpmn-readonly *,
#screen-agent .sipoc-value,
#screen-agent .sipoc-value * {
  color: rgb(96, 116, 135) !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-analysis-card-content,
#screen-agent.stage-mapping #mappingShell .mapping-analysis-card-content *,
#screen-agent.stage-mapping #mappingShell .mapping-analysis-item,
#screen-agent.stage-mapping #mappingShell .mapping-analysis-item *,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-meta-item,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-row-number,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-row-text,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-note,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-note *,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-plain {
  font-family: "Oxygen", var(--font), sans-serif !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage {
  padding-left: 16px !important;
  border-left: 3px solid color-mix(in srgb, var(--stage-color) 24%, rgba(16, 36, 62, 0.14)) !important;
  line-height: 1.8 !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-1 {
  padding-left: 14px !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-2 {
  padding-left: 28px !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-3 {
  padding-left: 42px !important;
}

#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-4,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-5,
#screen-agent.stage-mapping #mappingShell .mapping-bpmn-item.stage.depth-6 {
  padding-left: 56px !important;
}

#screen-agent .u-status-note-warning-strong,
#screen-agent .u-status-note-warning-strong * {
  color: #b8860b !important;
  font-weight: 700 !important;
}

.diagnostico-table th,
.diagnostico-table td,
.sipoc-table th,
.sipoc-table td,
.redesenho-table th,
.redesenho-table td,
.implementacao-table th,
.implementacao-table td,
.monitoramento-table th,
.monitoramento-table td {
  border-color: rgba(16, 36, 62, 0.42) !important;
}
