/* FinanKey Black Ledger — identidade visual 1.5.0 */
:root,
html[data-theme="dark"],
html[data-theme="light"] {
  color-scheme: dark;
  --bg: #030303;
  --surface: #0a0a0b;
  --surface-2: #101011;
  --surface-3: #161617;
  --surface-soft: #ffffff08;
  --line: #ffffff14;
  --line-strong: #ffffff24;
  --text: #f7f7f5;
  --muted: #aaa9a4;
  --subtle: #777672;
  --silver: #f7f7f5;
  --lime: #91e6ad;
  --lime-soft: #91e6ad12;
  --coral: #ff9898;
  --coral-soft: #ff989812;
  --amber: #e7cf91;
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --shadow: 0 24px 70px #000c;
  --chart-1: #f3f3f0;
  --chart-2: #a5a5a0;
  --chart-3: #6e6e6a;
  --chart-4: #41413f;
  --chart-5: #d0d0cc;
  --chart-6: #858581;
  --chart-7: #555552;
  --chart-empty: #222223;
  --chart-income-top: #fff;
  --chart-income-bottom: #848480;
  --chart-expense-top: #8f8f8a;
  --chart-expense-bottom: #3e3e3b;
  background: #030303 !important;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", sans-serif;
}

* {
  scrollbar-color: #343434 #070707;
}

html,
body,
#root {
  min-width: 320px;
  min-height: 100%;
  background: #030303 !important;
}

body {
  color: var(--text) !important;
  background:
    linear-gradient(#ffffff05 1px, transparent 1px),
    linear-gradient(90deg, #ffffff05 1px, transparent 1px),
    #030303 !important;
  background-size: 56px 56px !important;
}

body::before {
  opacity: .12 !important;
  mix-blend-mode: normal !important;
  background:
    radial-gradient(circle at 82% 6%, #ffffff0a, transparent 27rem),
    radial-gradient(circle at 12% 72%, #ffffff06, transparent 32rem) !important;
}

::selection { color: #050505; background: #f4f4f0; }

button,
input,
select,
textarea { font: inherit; }

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #f4f4f0 !important;
  outline-offset: 3px;
}

/* Estrutura */
.texture-layer {
  background: transparent !important;
}

.app-shell {
  min-height: 100dvh;
  padding: 14px 14px calc(92px + env(safe-area-inset-bottom));
  isolation: isolate;
}

.app-main { min-width: 0; }

.app-content {
  width: min(100%, 1540px);
  margin: 0 auto;
  padding: 30px 2px 50px;
}

.page-stack { gap: 20px; }

.glass-panel,
html[data-theme="light"] .glass-panel,
html[data-theme="dark"] .glass-panel {
  color: var(--text) !important;
  background: #0a0a0b !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 20px 56px #0008 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

.glass-panel::after { display: none !important; }

.sidebar {
  background: #070708 !important;
  border: 1px solid #ffffff16 !important;
  border-radius: 26px !important;
  box-shadow: 0 28px 70px #000a !important;
}

.sidebar nav { gap: 7px !important; }

.sidebar nav button,
.sidebar-add,
.sidebar-logout {
  color: #92928e !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  min-height: 48px !important;
  transition: color .18s, background .18s, border-color .18s, transform .18s !important;
}

.sidebar nav button:hover,
.sidebar-logout:hover {
  color: #fff !important;
  background: #ffffff08 !important;
  border-color: #ffffff0c !important;
}

.sidebar nav button.active {
  color: #fff !important;
  background: #151516 !important;
  border-color: #ffffff1c !important;
  box-shadow: inset 3px 0 0 #f7f7f5 !important;
}

.sidebar-add {
  color: #090909 !important;
  background: #f3f3f0 !important;
  border-color: #f3f3f0 !important;
  box-shadow: 0 12px 30px #0008 !important;
}

.sidebar-add:hover { transform: translateY(-1px) !important; background: #fff !important; }

.privacy-card {
  color: #d6d6d2 !important;
  background: #0d0d0e !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.privacy-card svg { color: #f2f2ef !important; }

/* Cabeçalho */
.app-header {
  top: calc(max(8px, env(safe-area-inset-top)) + 5px);
  min-height: 72px;
  padding: 10px 12px;
  background: #080809f2 !important;
  border: 1px solid #ffffff18 !important;
  border-radius: 20px !important;
  box-shadow: 0 18px 45px #000b !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.brand-mark {
  background: #111113 !important;
  border: 0 !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.brand-mark img { filter: none !important; }
.brand-word { color: #fff !important; letter-spacing: -.055em; }
.brand-word span { color: #858581 !important; }

.month-switcher {
  background: #030303 !important;
  border: 1px solid #ffffff17 !important;
  border-radius: 14px !important;
  min-height: 46px;
}

.month-switcher button {
  color: #969692 !important;
  border-radius: 11px !important;
}

.month-switcher button:hover { color: #fff !important; background: #151516 !important; }
.month-switcher .month-current { color: #f3f3f0 !important; font-weight: 700 !important; }

.header-actions { gap: 8px !important; }

.icon-button,
.desktop-logout {
  color: #b9b9b5 !important;
  background: #0e0e0f !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.icon-button:hover,
.desktop-logout:hover { color: #fff !important; background: #19191a !important; }

.profile-chip {
  color: #f4f4f1 !important;
  background: transparent !important;
  border: 0 !important;
}

.profile-chip > span:first-child {
  color: #050505 !important;
  background: #f2f2ef !important;
}

.profile-chip small { color: #777773 !important; }

/* Títulos e botões */
.eyebrow {
  color: #aaa9a4 !important;
  letter-spacing: .16em !important;
  font-size: 10px !important;
}

.page-title-row {
  align-items: flex-end;
  padding: 10px 6px 2px;
}

.page-title-row h1,
.hero-copy h1 {
  color: #fff !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
}

.page-title-row h1 { font-size: clamp(38px, 5vw, 66px) !important; }
.page-title-row p,
.section-heading p { color: #94948f !important; }

.primary-button,
.secondary-button {
  min-height: 48px;
  padding: 0 18px;
  border-radius: 14px !important;
  font-weight: 760 !important;
  transition: transform .18s, background .18s, border-color .18s !important;
  box-shadow: none !important;
}

.primary-button {
  color: #070707 !important;
  background: #f4f4f0 !important;
  border: 1px solid #f4f4f0 !important;
}

.primary-button:hover { background: #fff !important; transform: translateY(-1px); }

.secondary-button {
  color: #ededeb !important;
  background: #111112 !important;
  border: 1px solid #ffffff1a !important;
}

.secondary-button:hover { background: #1a1a1b !important; border-color: #ffffff2d !important; }

.danger-button {
  color: #ffb4b4 !important;
  background: #1a0c0c !important;
  border-color: #ff989838 !important;
}

/* Início */
.hero-balance {
  min-height: 260px !important;
  padding: clamp(28px, 5vw, 62px) !important;
  background: #080809 !important;
  border: 1px solid #ffffff18 !important;
  border-radius: 30px !important;
  box-shadow: 0 30px 80px #000c !important;
  overflow: hidden;
  grid-template-columns: minmax(0, 1fr) minmax(310px, .72fr) !important;
  align-items: stretch !important;
  gap: clamp(28px, 4vw, 64px) !important;
}

.hero-balance::before {
  display: none !important;
}

.hero-balance::after {
  content: "FINANKEY / 01" !important;
  display: block !important;
  position: absolute;
  right: 32px;
  bottom: 26px;
  color: #ffffff35;
  font: 700 10px/1 Inter, sans-serif;
  letter-spacing: .26em;
}

.hero-copy { max-width: none; width: 100%; }
.hero-copy > p { color: #8d8d88 !important; }
.hero-copy > strong { color: #fff !important; font-size: clamp(48px, 7vw, 88px) !important; }
.hero-rate > span { color: #dfdfdc !important; background: #141415 !important; border: 1px solid #ffffff15; }
.hero-rate small { color: #81817d !important; }
.orb,
.hero-mini-card { display: none !important; }
.hero-plan-visual {
  width: auto !important;
  height: auto !important;
  display: grid !important;
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
  align-self: stretch !important;
  gap: 12px !important;
}
.hero-plan-card {
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  align-items: flex-start !important;
  background: #0d0d0e !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 22px !important;
}
.hero-plan-card > strong {
  display: block !important;
  margin: 16px 0 7px !important;
  color: #fff !important;
  font-size: clamp(32px, 3.4vw, 54px) !important;
  line-height: 1 !important;
  letter-spacing: -.055em !important;
}
.hero-plan-card > small { color: #888883 !important; line-height: 1.45 !important; }
.hero-plan-card > button {
  margin-top: 24px !important;
  min-height: 42px !important;
  padding: 0 15px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #050505 !important;
  background: #f3f3f0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}
.hero-plan-card > button svg { width: 15px !important; }
.hero-plan-meta { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
.hero-plan-meta > span {
  padding: 16px 17px !important;
  display: grid !important;
  gap: 7px !important;
  background: #0d0d0e !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 17px !important;
}
.hero-plan-meta small { color: #7e7e79 !important; font-size: 10px !important; }
.hero-plan-meta strong { color: #f3f3f0 !important; font-size: 16px !important; }

.quick-actions { gap: 12px !important; }

.quick-actions button {
  min-height: 82px;
  color: #f5f5f2 !important;
  background: #0b0b0c !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

.quick-actions button:hover { background: #111112 !important; border-color: #ffffff25 !important; }
.quick-actions small { color: #81817d !important; }
.quick-actions button > svg { color: #8d8d89 !important; }

.quick-icon,
.quick-icon.expense,
.quick-icon.income,
.quick-icon.plan {
  color: #fff !important;
  background: #161617 !important;
  border-color: #ffffff16 !important;
}

.kpi-grid { gap: 12px !important; }

.kpi-card,
.kpi-card.income-tone,
.kpi-card.expense-tone,
.kpi-card.debt-tone,
.kpi-card.budget-tone {
  min-height: 158px;
  padding: 20px !important;
  background: #0b0b0c !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 22px !important;
  box-shadow: none !important;
}

.kpi-card:hover { border-color: #ffffff24 !important; transform: translateY(-1px); }
.kpi-top small { color: #8b8b86 !important; }
.kpi-icon { color: #f4f4f1 !important; background: #161617 !important; border-color: #ffffff13 !important; }
.kpi-detail { color: #858580 !important; }

.analytics-card,
.recent-card,
.freedom-card,
.budgets-card,
.simulator-card,
.installments-overview,
.installment-series-card,
.debt-hero,
.debt-card,
.filter-bar,
.transaction-card-full {
  background: #0a0a0b !important;
  border: 1px solid #ffffff13 !important;
  border-radius: 24px !important;
  box-shadow: none !important;
}

.section-heading h2 { color: #f6f6f3 !important; }
.section-heading button { color: #a2a29e !important; }
.section-heading button:hover { color: #fff !important; }

.donut { box-shadow: none !important; }
.donut-hole { background: #080809 !important; border: 1px solid #ffffff13 !important; box-shadow: none !important; }
.chart-grid { stroke: #ffffff12 !important; }
.cash-chart text { fill: #858580 !important; }
.key-income { background: #fff !important; }
.key-expense { background: #71716d !important; }
.chart-legend span,
.legend-row span { color: #aaa9a4 !important; }

.transaction-item { border-color: #ffffff0e !important; min-height: 72px !important; }
.transaction-icon { background: #131314 !important; border-color: #ffffff13 !important; }
.transaction-icon.outgoing,
.transaction-icon.incoming { color: #dededb !important; }
.transaction-copy small { color: #7e7e79 !important; }
.row-actions button { color: #a0a09c !important; background: #111112 !important; border-color: #ffffff12 !important; }
.row-actions button:hover { color: #fff !important; background: #1a1a1b !important; }

/* Extrato e filtros */
.filter-bar {
  padding: 14px !important;
  background: #09090a !important;
}

.search-box,
.field-label input,
.field-label select,
.field-label textarea,
.money-input,
.suffix-input {
  color: #f5f5f2 !important;
  background: #050506 !important;
  border: 1px solid #ffffff18 !important;
  border-radius: 15px !important;
  box-shadow: inset 0 1px 0 #ffffff05 !important;
}

.search-box:focus-within,
.field-label input:focus,
.field-label select:focus,
.field-label textarea:focus,
.money-input:focus-within,
.suffix-input:focus-within {
  background: #09090a !important;
  border-color: #ffffff4a !important;
  box-shadow: 0 0 0 4px #ffffff0a !important;
}

.field-label { color: #c9c9c5 !important; }
.field-label input::placeholder,
.field-label textarea::placeholder { color: #5f5f5c !important; }

.filter-chips button,
.history-scope-button {
  color: #aaa9a4 !important;
  background: #0d0d0e !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 999px !important;
}

.filter-chips button.active,
.history-scope-button.active {
  color: #050505 !important;
  background: #f3f3f0 !important;
  border-color: #f3f3f0 !important;
}

.month-group {
  background: #080809 !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 22px !important;
}

.month-group > header { background: #101011 !important; border-color: #ffffff10 !important; }
.month-group > header small { color: #7f7f7b !important; }

/* Parcelados / EPT */
.installments-overview { gap: 12px !important; padding: 18px !important; }
.installments-overview > div,
.installment-series-values > div,
.debt-stats > div {
  background: #050506 !important;
  border: 1px solid #ffffff10 !important;
  border-radius: 15px !important;
}

.installment-series-grid,
.debt-grid { gap: 16px !important; }
.installment-series-card { padding: 20px !important; gap: 18px !important; }
.installment-series-icon,
.debt-logo { color: #fff !important; background: #161617 !important; border-color: #ffffff14 !important; }
.installment-series-card small,
.installment-series-values span,
.series-progress small,
.series-timeline small { color: #7f7f7a !important; }
.series-progress > span,
.progress-track { background: #202021 !important; }
.series-progress i,
.progress-track > i { background: #efefec !important; }
.installment-series-actions button,
.debt-actions button {
  color: #b8b8b4 !important;
  background: #101011 !important;
  border-color: #ffffff12 !important;
  border-radius: 13px !important;
}
.installment-series-actions button:hover,
.debt-actions button:hover { color: #fff !important; background: #19191a !important; }
.series-status.active { color: #dededa !important; background: #19191a !important; }
.series-status.paid { color: #bff1ce !important; background: #0d1a11 !important; }

.debt-hero { background: #080809 !important; }
.donut,
.progress-ring { filter: grayscale(1) contrast(1.15); }

.future-installments-card {
  padding: 24px !important;
  border-radius: 26px !important;
}
.future-installments-card > header,
.ept-hub-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 24px;
}
.future-installments-card h2,
.ept-hub-header h2 { margin: 6px 0 4px; color: #fff; font-size: 24px; }
.future-installments-card p,
.ept-hub-header p { margin: 0; color: #898984; font-size: 13px; }
.future-installments-total,
.ept-hub-total { text-align: right; display: grid; gap: 4px; }
.future-installments-total span,
.future-installments-total small,
.ept-hub-total span,
.ept-hub-total small { color: #7f7f7a; font-size: 10px; }
.future-installments-total strong,
.ept-hub-total strong { color: #fff; font-size: 24px; }
.future-installments-chart {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
  min-width: 820px;
}
.future-installments-card { overflow-x: auto !important; }
.future-month-column { display: grid; gap: 8px; min-width: 0; }
.future-month-column > strong { text-align: center; color: #dcdcd8; font-size: 12px; }
.future-month-column > div {
  position: relative;
  height: 150px;
  padding: 7px;
  display: flex;
  align-items: flex-end;
  background: #050506;
  border: 1px solid #ffffff0f;
  border-radius: 15px;
}
.future-month-column i {
  display: block;
  width: 100%;
  min-height: 5px;
  border-radius: 9px;
  background: linear-gradient(180deg, #f0f0ed, #5a5a57);
}
.future-month-column > span { text-align: center; color: #efefec; text-transform: capitalize; font-size: 11px; font-weight: 700; }
.future-month-column > small { text-align: center; color: #777772; font-size: 9px; }
.ept-hub-section { margin-top: 2px; }
.ept-installment-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ept-series-meta { display: none !important; }
.ept-private-fields > label:first-child,
.ept-private-fields > label:last-child,
.ept-start-field,
.ept-private-info { display: none !important; }

/* Planejamento */
.plan-overview-grid { gap: 16px !important; }
.safe-spend-card,
.rule-card,
.simulator-card,
.budgets-card {
  color: #f4f4f1 !important;
  background: #0a0a0b !important;
  border: 1px solid #ffffff13 !important;
  border-radius: 24px !important;
  box-shadow: none !important;
}
.rule-orb { background: #151516 !important; border-color: #ffffff15 !important; box-shadow: none !important; }
.budget-grid > article { background: #101011 !important; border-color: #ffffff11 !important; }

/* Contas */
.monthly-bills-page { gap: 20px !important; }
.monthly-bills-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 14px !important;
}

.bill-summary-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 150px !important;
  padding: 24px !important;
  color: #f6f6f3 !important;
  background: #0b0b0c !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 23px !important;
  box-shadow: none !important;
}

.bill-summary-card.paid,
.bill-summary-card.pending,
.bill-summary-card.total { background: #0b0b0c !important; }
.bill-summary-card.paid { border-top: 2px solid #91e6ad !important; }
.bill-summary-card.pending { border-top: 2px solid #ff9898 !important; }
.bill-summary-card.total { border-top: 2px solid #f1f1ee !important; }
.bill-summary-card.income { border-top: 2px solid #f1f1ee !important; }
.bill-summary-card.balance.is-positive { border-top: 2px solid #91e6ad !important; }
.bill-summary-card.balance.is-negative { border-top: 2px solid #ff9898 !important; }
.bill-summary-card.average { border-top: 2px solid #777773 !important; }
.bill-summary-card span,
.bill-summary-card small { color: #8e8e89 !important; }
.bill-summary-card strong { color: #fff !important; display: block !important; font-size: clamp(25px, 2vw, 34px) !important; line-height: 1.06 !important; letter-spacing: -.035em !important; }
.bill-summary-card small { display: block !important; line-height: 1.45 !important; }

.monthly-bills-panel {
  padding: 24px !important;
  background: #080809 !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 26px !important;
  box-shadow: none !important;
}

.monthly-bills-panel > header { border-color: #ffffff12 !important; }
.monthly-bills-panel > header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  padding-bottom: 18px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid #ffffff12 !important;
}
.monthly-bills-panel > header p { color: #8d8d88 !important; }

.bill-filter-tabs { display: flex !important; gap: 6px !important; padding: 4px !important; background: #030303 !important; border: 1px solid #ffffff13; border-radius: 999px !important; }
.bill-filter-tabs button { display: inline-flex !important; align-items: center !important; gap: 7px !important; padding: 9px 13px !important; color: #999994 !important; background: transparent !important; border: 0 !important; border-radius: 999px !important; }
.bill-filter-tabs button.active { color: #050505 !important; background: #efefec !important; }
.bill-filter-tabs b { color: inherit !important; background: #ffffff12 !important; }
.bill-filter-tabs button.active b { background: #00000012 !important; }

.monthly-bill-list { display: grid !important; gap: 8px !important; }
.monthly-bill-row {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  min-height: 78px !important;
  padding: 12px 14px !important;
  background: #0e0e0f !important;
  border: 1px solid #ffffff0e !important;
  border-radius: 17px !important;
  column-gap: 16px !important;
}
.monthly-bill-row:hover,
.monthly-bill-row:focus-within { background: #141415 !important; border-color: #ffffff48 !important; }
.monthly-bill-row.is-paid { opacity: .78; }
.monthly-bill-icon { color: #d8d8d4 !important; background: #19191a !important; border-color: #ffffff13 !important; border-radius: 13px !important; }
.monthly-bill-copy { display: grid !important; gap: 6px !important; min-width: 0 !important; }
.monthly-bill-copy strong { display: block !important; line-height: 1.2 !important; }
.monthly-bill-copy small { display: block !important; color: #7f7f7a !important; line-height: 1.35 !important; }
.monthly-bill-value { color: #fff !important; }
.bill-status-toggle {
  min-width: 128px !important;
  min-height: 44px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
}
.bill-status-toggle svg { width: 17px !important; height: 17px !important; }
.bill-status-toggle.is-pending { color: #f4f4f0 !important; background: #181819 !important; border: 1px solid #ffffff19 !important; }
.bill-status-toggle.is-paid { color: #baf0ca !important; background: #0a1810 !important; border: 1px solid #91e6ad35 !important; }
.bill-status-toggle:hover,
.bill-status-toggle:focus-visible,
.bill-status-toggle:active {
  color: #050505 !important;
  background: #f5f5f2 !important;
  border-color: #f5f5f2 !important;
}
.bill-edit-button {
  width: 46px !important;
  min-width: 46px !important;
  height: 44px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: #d2d2ce !important;
  background: #151516 !important;
  border: 1px solid #ffffff20 !important;
  border-radius: 13px !important;
  cursor: pointer !important;
}
.bill-edit-button svg { width: 18px !important; height: 18px !important; stroke: currentColor !important; }
.bill-edit-button:hover,
.bill-edit-button:focus-visible,
.bill-edit-button:active {
  color: #050505 !important;
  background: #f5f5f2 !important;
  border-color: #f5f5f2 !important;
}
.monthly-bill-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
.bill-batch-badge {
  display: inline-flex;
  width: fit-content;
  margin-top: 7px;
  padding: 5px 9px;
  border: 1px solid rgba(106, 226, 160, .32);
  border-radius: 999px;
  background: rgba(63, 185, 124, .1);
  color: #91efba !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: .01em;
}

/* Previsão */
.forecast-summary-grid { display: grid !important; gap: 14px !important; }
.forecast-metric {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  min-height: 150px !important;
  padding: 24px !important;
  color: #f6f6f3 !important;
  background: #0b0b0c !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 23px !important;
  box-shadow: none !important;
}
.forecast-income-card { border-top: 2px solid #91e6ad !important; }
.forecast-expense-card { border-top: 2px solid #ff9898 !important; }
.forecast-balance-card { border-top: 2px solid #f3f3f0 !important; }
.forecast-balance-card.is-negative { border-top-color: #ff9898 !important; }
.forecast-balance-card.is-positive { border-top-color: #91e6ad !important; }
.forecast-metric span,
.forecast-metric small { color: #8d8d88 !important; }
.forecast-metric strong { color: #fff !important; display: block !important; font-size: clamp(28px, 2.6vw, 42px) !important; line-height: 1.04 !important; letter-spacing: -.04em !important; }
.forecast-metric small { display: block !important; line-height: 1.45 !important; }

.forecast-accounts-panel {
  padding: 24px !important;
  background: #080809 !important;
  border: 1px solid #ffffff14 !important;
  border-radius: 26px !important;
  box-shadow: none !important;
}
.forecast-accounts-panel > header { border-color: #ffffff12 !important; }
.forecast-accounts-panel > header {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 20px !important;
  padding-bottom: 20px !important;
  margin-bottom: 8px !important;
  border-bottom: 1px solid #ffffff12 !important;
}
.forecast-accounts-panel > header p { color: #8d8d88 !important; }
.forecast-accounts-actions { display: flex; align-items: flex-end; gap: 14px; flex-direction: column; }
.forecast-accounts-actions > strong { color: #fff !important; font-size: 22px; }
.forecast-add-account { min-height: 42px !important; border-radius: 999px !important; }

.forecast-account-list { gap: 8px !important; display: grid !important; }
.forecast-account-row {
  display: grid !important;
  align-items: end !important;
  min-height: 94px !important;
  padding: 14px 16px !important;
  background: #0e0e0f !important;
  border: 1px solid #ffffff0e !important;
  border-radius: 18px !important;
  column-gap: 22px !important;
  row-gap: 14px !important;
}
.forecast-account-row:hover { background: #131314 !important; border-color: #ffffff1b !important; }
.forecast-account-copy small,
.forecast-account-row label > span,
.forecast-account-total span { color: #7f7f7a !important; }
.forecast-account-copy { display: grid !important; gap: 8px !important; min-width: 0 !important; }
.forecast-account-copy > div { display: flex; align-items: center; gap: 10px; }
.forecast-account-copy strong,
.forecast-account-copy small { display: block !important; line-height: 1.3 !important; }
.forecast-account-row > label { display: grid !important; gap: 8px !important; align-content: end !important; min-width: 0 !important; }
.forecast-edit-account {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: #a5a5a0;
  background: #171718;
  border: 1px solid #ffffff12;
  border-radius: 10px;
  cursor: pointer;
}
.forecast-edit-account svg { width: 14px; }
.forecast-action select {
  width: 100%;
  min-height: 48px;
  padding: 0 38px 0 15px;
  color: #f5f5f2;
  background: #050506;
  border: 1px solid #ffffff18;
  border-radius: 999px;
}
.forecast-account-row input,
.forecast-account-row .money-input {
  min-height: 48px !important;
  color: #f5f5f2 !important;
  background: #050506 !important;
  border: 1px solid #ffffff18 !important;
  border-radius: 999px !important;
}
.forecast-account-row .money-input { padding-inline: 16px !important; }
.forecast-quantity input {
  width: 100% !important;
  padding: 0 18px !important;
  text-align: center !important;
  font-weight: 800 !important;
  appearance: textfield;
}
.forecast-quantity input::-webkit-inner-spin-button { opacity: .5; margin-right: 4px; }
.forecast-account-total { display: grid !important; justify-items: end !important; align-content: center !important; gap: 7px !important; min-width: 126px !important; }
.forecast-account-total strong { color: #fff !important; display: block !important; font-size: 16px !important; line-height: 1.2 !important; }
.forecast-settle-button {
  min-height: 38px !important;
  padding: 0 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  color: #050505 !important;
  background: #f3f3f0 !important;
  border: 1px solid #f3f3f0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}
.forecast-settle-button svg { width: 14px !important; height: 14px !important; }
.forecast-settle-button.is-paid { color: #baf0ca !important; background: #0a1810 !important; border-color: #91e6ad35 !important; }
.forecast-settle-button:disabled { cursor: default !important; opacity: .68 !important; }
.forecast-footer {
  min-height: 74px !important;
  padding: 14px 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  background: #09090a !important;
  border: 1px solid #ffffff13 !important;
  border-radius: 18px !important;
}
.forecast-footer > span { display: block !important; color: #aaa9a4 !important; line-height: 1.5 !important; }
.forecast-footer .primary-button { flex: 0 0 auto !important; }

/* Itens sensíveis aparecem somente como compras parceladas comuns. */
.freedom-card { display: none !important; }
.lower-grid { grid-template-columns: 1fr !important; }

/* Modais e formulários */
.modal-backdrop {
  background: #000000d9 !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.modal-sheet,
.modal-sheet-wide {
  color: #f6f6f3 !important;
  background: #09090a !important;
  border: 1px solid #ffffff1c !important;
  border-radius: 28px !important;
  box-shadow: 0 40px 120px #000 !important;
}
.modal-sheet h2 { color: #fff !important; }
.modal-sheet p,
.modal-sheet small { color: #8d8d88 !important; }
.modal-grip { background: #3d3d3d !important; }
.modal-close { color: #b9b9b5 !important; background: #121213 !important; border-color: #ffffff13 !important; }
.type-selector,
.entry-kind-selector,
.recurrence-box,
.repeat-config,
.inss-card,
.salary-deductions-box,
.installment-quick-config,
.installment-picker,
.bulk-row,
.info-box {
  background: #0d0d0e !important;
  border: 1px solid #ffffff12 !important;
  border-radius: 18px !important;
}
.type-selector button,
.entry-kind-selector button,
.recurrence-options button { color: #9d9d98 !important; background: transparent !important; border-color: transparent !important; }
.type-selector button.active,
.entry-kind-selector button.active,
.recurrence-options button.active { color: #050505 !important; background: #f1f1ee !important; border-color: #f1f1ee !important; }
.toggle-row input,
.remember-check input,
.installment-picker input { accent-color: #f1f1ee !important; }
.form-error { color: #ffb4b4 !important; background: #180b0b !important; border-color: #ff989832 !important; }

/* Login */
.login-shell { background: #030303 !important; }
.login-shell::before { background: #030303 !important; }
.login-aurora { display: none !important; }
.login-panel,
.login-preview-card { background: #09090a !important; border: 1px solid #ffffff18 !important; border-radius: 28px !important; box-shadow: 0 30px 90px #000 !important; }
.private-pill { color: #d4d4d0 !important; background: #121213 !important; border-color: #ffffff12 !important; }
.private-pill svg { color: #f4f4f0 !important; }

/* Estados */
.positive { color: #91e6ad !important; }
.negative { color: #ff9898 !important; }
.status-dot.pending { color: #e7cf91 !important; }
.status-dot.pending::before { background: #e7cf91 !important; }
.empty-state { color: #d6d6d2 !important; }
.empty-state p,
.empty-mini { color: #7f7f7a !important; }
.toast { color: #f4f4f0 !important; background: #151516 !important; border: 1px solid #ffffff1d !important; box-shadow: 0 18px 50px #000c !important; }

/* Navegação móvel */
.bottom-nav {
  background: #080809f5 !important;
  border: 1px solid #ffffff17 !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 60px #000 !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.bottom-nav button { color: #777773 !important; border-radius: 14px !important; }
.bottom-nav button.active { color: #fff !important; background: #181819 !important; }
.bottom-add { color: #050505 !important; background: #f2f2ef !important; }

@media (min-width: 820px) {
  .app-shell {
    display: grid !important;
    grid-template-columns: 246px minmax(0, 1fr) !important;
    gap: 18px !important;
    padding: 18px !important;
  }
  .sidebar {
    display: flex !important;
    position: sticky !important;
    top: 18px !important;
    height: calc(100dvh - 36px) !important;
    padding: 20px 14px !important;
  }
  .app-header { position: sticky !important; }
  .bottom-nav { display: none !important; }
  .app-content { padding-inline: 8px !important; }
  .quick-actions { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .forecast-summary-grid,
  .monthly-bills-summary { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important; }
  .page-title-row .primary-button { display: inline-flex !important; }
}

@media (min-width: 1180px) {
  .app-shell { grid-template-columns: 258px minmax(0, 1fr) !important; gap: 22px !important; padding: 20px !important; }
  .dashboard-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.45fr) !important; gap: 18px !important; }
  .lower-grid { grid-template-columns: 1fr !important; gap: 18px !important; }
  .forecast-account-row { grid-template-columns: minmax(180px, 1.05fr) minmax(205px, .95fr) minmax(180px, .85fr) minmax(124px, .55fr) minmax(145px, .55fr) !important; gap: 22px !important; padding: 20px 18px !important; }
  .forecast-account-copy { grid-column: 1; }
  .forecast-action { grid-column: 2; }
  .forecast-base-amount { grid-column: 3; }
  .forecast-quantity,
  .forecast-extra { grid-column: 4; }
  .forecast-account-total { grid-column: 5; }
}

@media (max-width: 819px) {
  .app-shell { padding: calc(10px + env(safe-area-inset-top)) 10px calc(92px + env(safe-area-inset-bottom)) !important; }
  .app-header { grid-template-columns: auto 1fr !important; border-radius: 18px !important; }
  .app-content { padding-top: 22px !important; }
  .page-title-row { align-items: flex-start !important; }
  .page-title-row h1 { font-size: clamp(34px, 12vw, 49px) !important; }
  .hero-balance { min-height: 300px !important; padding: 28px 22px !important; grid-template-columns: 1fr !important; }
  .hero-plan-visual { display: none !important; }
  .hero-balance::before { width: 38% !important; opacity: .45 !important; }
  .hero-copy > strong { font-size: clamp(42px, 13vw, 64px) !important; }
  .monthly-bills-panel,
  .forecast-accounts-panel { padding: 17px 13px !important; }
  .monthly-bills-panel > header,
  .forecast-accounts-panel > header { gap: 16px !important; }
  .bill-filter-tabs { width: 100% !important; overflow-x: auto !important; }
  .bill-filter-tabs button { flex: 1 !important; white-space: nowrap !important; }
  .monthly-bill-row { grid-template-columns: auto minmax(0, 1fr) auto !important; gap: 10px !important; }
  .monthly-bill-value { font-size: 12px !important; }
  .monthly-bill-actions { grid-column: 1 / -1 !important; display: grid !important; grid-template-columns: 1fr 46px !important; }
  .bill-status-toggle { width: 100% !important; }
  .forecast-accounts-actions { width: 100% !important; align-items: stretch !important; }
  .forecast-accounts-actions > strong { text-align: left !important; }
  .forecast-add-account { width: 100% !important; }
  .forecast-account-row { grid-template-columns: minmax(0, 1fr) 96px !important; gap: 12px !important; }
  .forecast-account-copy { grid-column: 1 / -1 !important; }
  .forecast-action { grid-column: 1 / -1 !important; }
  .forecast-account-row > label:not(.forecast-quantity):not(.forecast-action) { grid-column: 1 !important; }
  .forecast-quantity { grid-column: 2 !important; }
  .forecast-extra { grid-column: 1 / -1 !important; }
  .forecast-account-total { grid-column: 1 / -1 !important; flex-direction: row !important; justify-content: space-between !important; }
  .forecast-footer { align-items: stretch !important; flex-direction: column !important; }
  .forecast-footer .primary-button { width: 100% !important; }
  .modal-sheet { background: #080809 !important; border-radius: 26px 26px 0 0 !important; padding-bottom: calc(20px + env(safe-area-inset-bottom)) !important; }
  .future-installments-card { padding: 18px 14px !important; }
  .future-installments-card > header,
  .ept-hub-header { align-items: flex-start; flex-direction: column; }
  .future-installments-total,
  .ept-hub-total { text-align: left; }
  .ept-installment-grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .app-header { padding: 8px !important; }
  .app-header .brand-mark { width: 40px !important; height: 40px !important; }
  .month-switcher { min-height: 43px !important; }
  .hero-balance { border-radius: 24px !important; }
  .quick-actions button { min-height: 74px !important; }
  .kpi-grid { grid-template-columns: 1fr 1fr !important; }
  .kpi-card { min-height: 145px !important; padding: 16px !important; }
  .bill-summary-card,
  .forecast-metric { min-height: 128px !important; padding: 19px !important; }
  .forecast-account-row { padding: 14px 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* FinanKey 1.5.2 — estabilidade de viewport / iPhone e demais telas */
@supports (height: 100svh) {
  :root { --app-height: 100svh !important; }
}
html,
body,
#root {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  overscroll-behavior-x: none !important;
}
html, body {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}
#root,
.app-shell,
.app-content,
.page-stack {
  min-width: 0 !important;
  max-width: 100% !important;
}
#root { min-height: var(--app-height) !important; }
.app-shell { width: 100% !important; overflow-x: hidden !important; }
.app-content, .page-stack { width: 100% !important; }

@media (max-width: 819px) {
  .monthly-bills-page,
  .monthly-bills-summary,
  .monthly-bills-panel,
  .monthly-bill-list,
  .monthly-bill-row {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .bill-filter-tabs { max-width: 100% !important; overscroll-behavior-x: contain !important; }
  .monthly-bill-copy,
  .monthly-bill-actions { min-width: 0 !important; }
}

@media (max-width: 430px) {
  .bill-summary-card { min-width: 0 !important; }
  .bill-summary-card strong { overflow-wrap: anywhere !important; }
}
