/* Nero — quiet, conversational workspace. Loaded after the legacy components. */
:root {
  color-scheme: light;
  --bg: #fff; --card: #fff; --elevated: #fff; --surface-2: #f7f7f8;
  --text: #202123; --text-secondary: #626466; --text-tertiary: #757779;
  --gray: #747679; --black: #202123; --white: #fff;
  --border: #e5e5e5; --border-hairline: #efefef; --border-strong: #d0d0d0;
  --green-50: #f5f5f5; --green-100: #ececec; --green-200: #dedede;
  --green-300: #303030; --green-400: #303030; --green-500: #303030;
  --green-600: #303030; --green-700: #303030; --green-800: #202123; --green-900: #f5f5f5;
  --green: #303030; --green-ink: #303030; --green-wash: #f0f0f0;
  --green-glow: transparent; --mint: #303030;
  --danger: #b42318; --danger-wash: #fef2f2; --amber: #946200; --amber-wash: #fffaeb;
  --neutral-wash: #f4f4f4;
  --header-bg: #f9f9f9; --header-bg-raised: #fff; --header-border: #ededed;
  --header-text: #444; --header-text-active: #202123;
  --header-active-bg: #eaeaea; --header-active-fg: #202123;
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fs-h1: clamp(26px, 3vw, 34px); --fs-h2: 26px; --fs-h3: 18px;
  --fs-metric: clamp(26px, 3vw, 34px); --lh-display: 1.2;
  --tracking-display: -.035em; --tracking-heading: -.025em;
  --radius-card: 16px; --radius-modal: 22px; --radius-input: 12px;
  --shadow-xs: none; --shadow-sm: none;
  --shadow-md: 0 8px 32px rgb(0 0 0 / .08);
  --shadow-lg: 0 20px 60px rgb(0 0 0 / .12); --shadow-inset-highlight: none;
}
body { background: var(--bg); font-size: 14px; }
button, input, select { font: inherit; }
button { transition: background 150ms, border-color 150ms, opacity 150ms; }
::selection { background: #dcefe8; color: #202123; }
.noise::before, .spotlight::after, .view-header h2::after { display: none; }
.ai-mark { background: #202123; border: 0; box-shadow: none; border-radius: 11px; }
.ai-mark img { width: 100%; height: 100%; }
.promethon-glyph { stroke: #fff; }
.glyph-flame, .glyph-node { fill: #fff; }
.login-screen { background: #fff; padding: 24px 0; }
.login-card { border: 0; box-shadow: none; padding: 36px 26px; gap: 16px; width: min(420px, calc(100vw - 24px)); }
.login-brand { justify-content: center; gap: 10px; font-size: 21px; font-weight: 600; }
.login-kicker { color: var(--text-secondary); text-align: center; letter-spacing: 0; text-transform: none; font-size: 13px; margin: 14px 0 0; }
.login-card h1 { max-width: none; font-size: 28px; font-weight: 600; line-height: 1.25; text-align: center; letter-spacing: -.035em; }
.login-card > .muted { text-align: center; font-size: 14px; margin: 0 0 12px; line-height: 1.65; }
.login-card input { min-height: 50px; background: #fff; padding: 13px 16px; border-color: #d9d9d9; border-radius: 12px; }
.login-card button { min-height: 48px; }
.btn-primary, .login-card button, .inline-form button, .fees-form button, .filters button,
.send-pix-btn, .approve-btn, .confirm-btn-primary {
  background: #202123; border-color: #202123; color: #fff; box-shadow: none;
}
.btn-primary:hover, .login-card button:hover, .inline-form button:hover, .fees-form button:hover,
.filters button:hover, .send-pix-btn:hover, .approve-btn:hover, .confirm-btn-primary:hover {
  background: #38393b; border-color: #38393b; box-shadow: none;
}
.btn-ghost, .btn-refresh, .modal-secondary { background: #fff; box-shadow: none; font-weight: 500; }
input:focus, select:focus, textarea:focus { border-color: #929292 !important; box-shadow: 0 0 0 2px #f0f0f0 !important; }
:focus-visible { outline-color: #6c6c6c; }
.app { display: grid; grid-template-columns: 260px minmax(0, 1fr); min-height: 100vh; }
.topbar {
  grid-column: 1; grid-row: 1; position: sticky; top: 0; height: 100dvh;
  width: 260px; min-height: 0; padding: 24px 14px 14px; border: 0;
  display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start;
  gap: 0; background: #f9f9f9; z-index: 40;
}
.topbar-left { width: 100%; display: flex; flex-direction: column; align-items: stretch; gap: 68px; }
.brand { gap: 10px; padding: 0 10px; color: #202123; }
.brand-word { font-size: 20px; font-weight: 600; letter-spacing: -.045em; }
.brand-mark { width: 31px; height: 31px; }
.mobile-nav-toggle { display: none; }
.topnav { display: flex; flex-direction: column; align-items: stretch; width: 100%; gap: 3px; position: static; padding: 0; background: transparent; border: 0; box-shadow: none; max-height: none; }
.nav-btn, .nav-more-item {
  min-height: 42px; width: 100%; padding: 10px 12px; justify-content: flex-start;
  border-radius: 9px; color: #363739; gap: 12px; font-size: 14px; font-weight: 400;
  border: 0; background: transparent; white-space: normal;
}
.nav-btn:hover, .nav-more-item:hover { background: #ededed; color: #202123; }
.nav-btn.active, .nav-more-item.active { background: #e8e8e8; color: #202123; font-weight: 500; box-shadow: none; }
.nav-icon, .nav-more-item .nav-icon, .nav-more-item.active .nav-icon, .nav-more-item:hover .nav-icon { color: currentColor; opacity: 1; width: 18px; height: 18px; flex-shrink: 0; transform: none !important; }
.nav-label { display: inline !important; }
.nav-btn.active .nav-icon { color: currentColor; background: transparent; padding: 0; width: 18px; height: 18px; border-radius: 0; }
.nav-btn::after { display: none; }
.nav-more { position: static; width: 100%; margin-top: 22px; }
.nav-more-trigger { display: none; }
.nav-more::before { content: 'Ferramentas'; display: block; padding: 0 12px 8px; color: #777; font-size: 12px; }
.nav-more-menu, .nav-more-menu.hidden {
  display: flex !important; flex-direction: column; gap: 3px;
  position: static; border: 0; box-shadow: none; background: transparent;
  padding: 0; min-width: 0; width: 100%; animation: none;
}
.topbar-right { margin-top: auto; width: 100%; display: flex; flex-direction: column; align-items: stretch; gap: 8px; padding-top: 22px; }
.topbar { display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: 44px minmax(0,1fr) 64px; overflow: visible; }
.topbar-left { display: contents; }
.topbar .brand { grid-row: 1; }
.topbar .topnav { grid-row: 2; margin-top: 64px; overflow-y: auto; overflow-x: hidden; min-height: 0; }
.topbar-right { grid-row: 3; margin: 0; padding-top: 8px; }
.topbar-left, .topbar-right { flex-shrink: 0; }
.cmdk-search { position: absolute; top: 78px; left: 14px; width: calc(100% - 28px); min-width: 0; height: 42px; background: transparent; border: 0; padding: 10px 12px; color: #555; }
.cmdk-search:hover { background: #ededed; }
.cmdk-search span { display: inline; }
.cmdk-search span:not(.cmdk-kbd) { display: inline; }
.cmdk-search .cmdk-kbd { margin-left: auto; background: transparent; color: #8d8d8d; border: 0; }
.user-menu, .user-menu-trigger { width: 100%; }
.user-menu-trigger { min-height: 50px; padding: 8px 10px; justify-content: flex-start; border: 0; border-radius: 10px; }
.user-menu-trigger:hover { background: #ededed; }
.user-name { color: #303030; display: inline; font-weight: 500; }
.user-avatar { background: #e6e6e6; color: #333; border: 0; width: 32px; height: 32px; }
.user-chevron { margin-left: auto; color: #777; }
.user-menu-dropdown { bottom: calc(100% + 6px); top: auto; left: 0; right: auto; width: 232px; background: #fff; }
.content { grid-column: 2; grid-row: 1; min-width: 0; width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 46px 48px; overflow-x: visible; }
.workspace-header { height: 80px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 34px; color: #777; gap: 16px; }
.workspace-name { font-size: 18px; font-weight: 500; letter-spacing: -.025em; color: #555; }
.workspace-name span { color: #999; font-size: 14px; font-weight: 400; padding-left: 12px; border-left: 1px solid #e6e6e6; margin-left: 12px; }
.workspace-note { font-size: 12px; color: #7b7b7b; }
.dash-header { align-items: flex-end; margin-bottom: 28px; gap: 20px; }
.dash-eyebrow { margin-bottom: 10px; font-size: 14px; }
.dash-title { font-size: clamp(25px, 3vw, 34px); font-weight: 500; line-height: 1.2; }
.dash-status { margin-top: 10px; font-size: 12px; }
.dash-actions { gap: 8px; }
.period-control { text-transform: none; font-size: 11px; letter-spacing: 0; font-weight: 400; }
.period-control select { font-weight: 400; background: #fff; }
.kpi-grid { gap: 12px; grid-template-columns: repeat(4, minmax(0,1fr)); margin-bottom: 28px; }
.kpi-section-label { padding-top: 15px; padding-bottom: 3px; }
.kpi-section-label span { font-weight: 500; font-size: 13px; text-transform: none; letter-spacing: 0; }
.kpi-section-label small { color: #777; }
.kpi-card, .kpi-financial, .kpi-financial.kpi-revenue, .kpi-digitopay { background: #fff; background-image: none; box-shadow: none; border-color: #e7e7e7; padding: 20px 18px; border-radius: 14px; }
.kpi-card:hover { transform: none; border-color: #cecece; box-shadow: none; }
.kpi-label { text-transform: none; letter-spacing: 0; font-weight: 400; color: #636363; font-size: 12px; margin-bottom: 16px; }
.kpi-value { font-weight: 500; font-size: 30px; letter-spacing: -.04em; }
.kpi-sub { color: #757575; font-size: 11px; }
.kpi-delta.up { color: #157347; background: #eff8f2; }
.chart-card, .ask-card, .today-card { box-shadow: none; border-color: #e7e7e7; background: #fff; border-radius: 14px; }
.chart-card h3, .today-card h3, .ask-card h3 { font-size: 14px; font-weight: 500; }
.bar-side, .bar-top, .donut-shadow { opacity: 0; }
.bar-front { filter: none; }
.view-header h2 { font-weight: 500; line-height: 1.3; }
.table-wrap { background: #fff; border: 1px solid #e7e7e7; border-radius: 14px; box-shadow: none; overflow-x: auto; }
th { background: #fafafa; color: #737373; font-size: 11px; font-weight: 500; text-transform: none; letter-spacing: 0; }
td { font-size: 13px; }
tbody tr:hover { background: #fafafa; }
.filters { gap: 8px; }
.filters input, .filters select, select, .search-input, .inline-form input, .inline-form select, .fees-form input, .modal-form input, .modal-form select { background: #fff; border-color: #dcdcdc; min-height: 42px; color: var(--text); }
.inline-form { background: #fafafa; border: 1px solid #e7e7e7; border-radius: 14px; padding: 18px; gap: 10px; }
.inline-form button { height: 42px; }
.activity-row { padding: 18px 8px; }
.activity-row:hover { background: #fafafa; margin: 0; padding-left: 8px; padding-right: 8px; }
.activity-name { font-weight: 500; }
.activity-meta { font-size: 12px; }
.activity-avatar { background: #f5f5f5; border: 0; color: #555; }
.activity-amount { font-weight: 500; font-size: 18px; }
.badge.success, .badge-realizado { background: #edf7f0; color: #166534; }
.status-paid { background: #edf7f0; color: #166534; }
.chart-tooltip, [data-tooltip]::after { color: var(--text); }
.webhook-card, .fees-form { background: #fff; border-color: #e5e5e5; }
.modal-backdrop, .confirm-backdrop, .cmdk-backdrop { background: rgb(0 0 0 / .25); backdrop-filter: blur(3px); }
.modal-card, .confirm-card, .cmdk-panel { background: #fff; box-shadow: var(--shadow-lg); border: 1px solid #eee; }
.modal-form label { font-size: 13px; color: #555; gap: 8px; }
.modal-form { gap: 18px; }
.modal-form input, .modal-form select { padding: 12px 14px; font-size: 14px; min-height: 48px; }
#view-manual-payment { max-width: 680px; margin: 0 auto; }
#view-manual-payment > .muted { max-width: 600px; font-size: 14px; line-height: 1.75; margin-bottom: 28px; }
#manual-payment-form { border: 1px solid #e5e5e5; border-radius: 22px; padding: 28px; background: #fff; }
#manual-payment-form .btn-primary { align-self: flex-end; height: 44px; padding: 0 24px; margin-top: 8px; }
#mp-recipient-status { font-size: 12px; margin: -6px 0 0; line-height: 1.6; }
#mp-recipient-status:empty { display: none; }
.formiga-wrap { max-width: 490px; padding: 32px 20px; }
.formiga-card { width: 100%; border: 1px solid #e5e5e5; border-radius: 22px; padding: 28px; }
.formiga-tabs { background: #f5f5f5; border: 0; border-radius: 12px; }
.formiga-tabs .formiga-tab-btn { min-height: 38px; }
.formiga-tabs .formiga-tab-btn.active { background: #fff; box-shadow: 0 1px 4px rgb(0 0 0 / .06); }
.formiga-card h1 { font-size: 26px; }
.wallet-hero { background-image: none; border-color: #e5e5e5; box-shadow: none; }
.wallet-label, .settings-heading { text-transform: none; letter-spacing: 0; }
.referral-card { background: #fafafa; }
.login-card .btn-ghost, .login-card .modal-secondary { background: #fff; color: #303030; border-color: #ddd; }
.age-warning { color: #805b08; border-color: #f2e5bd; background: #fffbed; }
.age-warning strong { color: inherit; }
@media (max-width: 1200px) {
  .content { padding-left: 28px; padding-right: 28px; }
  .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dash-header { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 760px) {
  .app { display: flex; flex-direction: column; }
  .topbar { height: 64px; width: 100%; min-height: 64px; padding: 0 16px; flex-direction: row; align-items: center; justify-content: space-between; position: sticky; background: #fff; border-bottom: 1px solid #eee; }
  .topbar { overflow: visible; }
  .topbar { display: flex; }
  .topbar-left { flex-direction: row; align-items: center; gap: 12px; width: auto; }
  .mobile-nav-toggle { display: flex; width: 32px; height: 32px; padding: 6px; color: #444; border: 0; background: transparent; }
  .brand { padding: 0; gap: 8px; }
  .brand-word { font-size: 18px; }
  .brand-mark { width: 27px; height: 27px; }
  .topbar-right { flex-direction: row; width: auto; margin-top: 0; padding: 0; gap: 6px; align-items: center; }
  .cmdk-search { position: static; width: 36px; height: 36px; padding: 9px; }
  .cmdk-search span { display: none; }
  .cmdk-search span:not(.cmdk-kbd) { display: none; }
  .user-menu { width: auto; }
  .user-menu-trigger { min-height: 38px; width: auto; padding: 3px; gap: 0; }
  .user-menu-trigger .user-name, .user-menu-trigger .user-chevron { display: none; }
  .user-menu-dropdown { top: calc(100% + 10px); bottom: auto; left: auto; right: 0; }
  .topnav { display: none; position: absolute; top: 64px; left: 8px; right: 8px; width: auto; padding: 12px; background: #f9f9f9; border: 1px solid #e5e5e5; border-radius: 14px; box-shadow: var(--shadow-md); max-height: calc(100dvh - 90px); overflow-y: auto; z-index: 45; }
  .topnav.mobile-open { display: flex; }
  .topbar .topnav { margin-top: 0; }
  .nav-btn, .nav-more-item { padding: 12px; min-height: 44px; }
  .nav-more { margin-top: 14px; }
  .content { width: 100%; padding: 0 18px 32px; overflow-x: visible; }
  .workspace-header { height: 64px; margin-bottom: 16px; }
  .workspace-name { font-size: 15px; }
  .workspace-name span { font-size: 12px; }
  .workspace-note { display: none; }
  .dash-header { gap: 18px; margin-bottom: 18px; }
  .dash-title { font-size: 26px; }
  .dash-actions { width: 100%; align-items: flex-end; }
  .period-control { flex: 1; }
  .kpi-grid { gap: 10px; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .kpi-section-label { align-items: flex-start; flex-direction: column; gap: 4px; }
  .kpi-card { padding: 16px 13px; }
  .kpi-label { font-size: 11px; }
  .kpi-value { font-size: 25px; }
  .kpi-sub { white-space: normal; font-size: 10px; }
  .kpi-row { flex-wrap: wrap; }
  .dash-columns { grid-template-columns: 1fr; }
  .view-header { align-items: flex-start; gap: 16px; }
  .view-header h2 { font-size: 25px; }
  .activity-row { flex-wrap: wrap; gap: 10px; }
  .activity-right { width: 100%; padding-left: 48px; text-align: left; }
  #manual-payment-form { padding: 20px; border-radius: 18px; }
  #manual-payment-form .btn-primary { width: 100%; }
  .formiga-wrap { padding: 12px; }
  .formiga-card { padding: 24px 20px; }
  .modal-card { max-height: calc(100dvh - 32px); width: calc(100vw - 24px); padding: 22px; }
}
@media (prefers-reduced-motion: reduce) { .view.active, .stagger-in > * { animation: none; } }
