:root {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #111827; background: #f3f4f6;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
button, input, select { font: inherit; }
.topbar {
  position: sticky; top: 0; z-index: 5; display: flex; justify-content: space-between;
  align-items: center; gap: 1rem; padding: calc(1rem + env(safe-area-inset-top))
  max(1rem, calc((100vw - 1120px)/2)) 1rem; background: rgba(17,24,39,.97);
  color: white; backdrop-filter: blur(12px);
}
.topbar h1 { margin: 0; font-size: 1.65rem; }
.version { font-size: .75rem; opacity: .6; vertical-align: middle; }
.eyebrow { margin: 0 0 .25rem; font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .11em; opacity: .7; }
.container { width: min(1120px, calc(100% - 2rem)); margin: 1rem auto 3rem; display: grid; gap: 1rem; }
.card { background: white; border-radius: 18px; padding: 1.15rem; box-shadow: 0 8px 30px rgba(17,24,39,.06); }
.toolbar { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.toolbar label { margin-top: 0; }
.toolbar select { min-width: 210px; }
.account-summary { color: #6b7280; text-align: right; }
.hero { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.hero h2 { margin: .25rem 0 .35rem; font-size: clamp(1.35rem, 4vw, 2rem); }
.muted { color: #6b7280; margin: 0; }
.status { padding: .65rem .8rem; border-radius: 999px; font-size: .85rem; font-weight: 800; white-space: nowrap; }
.status.neutral { background: #e5e7eb; }
.status.good { background: #dcfce7; color: #166534; }
.status.warn { background: #fef3c7; color: #92400e; }
.status.bad { background: #fee2e2; color: #991b1b; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.metric span { display: block; color: #6b7280; font-size: .9rem; margin-bottom: .45rem; }
.metric strong { display: block; font-size: clamp(1.35rem, 4vw, 2rem); }
.metric small { display: block; color: #9ca3af; margin-top: .35rem; line-height: 1.3; }
.grid-two { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1rem; }
.section-head { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.section-head h3, .help h3 { margin: 0; }
label { display: block; font-weight: 700; margin: .7rem 0 .35rem; }
input, select { width: 100%; border: 1px solid #d1d5db; background: white; border-radius: 12px; padding: .85rem .9rem; outline: none; }
input:focus, select:focus { border-color: #111827; box-shadow: 0 0 0 3px rgba(17,24,39,.08); }
.amount-row { display: grid; grid-template-columns: 1fr auto; gap: .65rem; }
.button { border: 0; border-radius: 12px; padding: .78rem 1rem; font-weight: 800; cursor: pointer; }
.button-primary { background: #22c55e; color: #052e16; }
.button-dark { background: #111827; color: white; }
.button-ghost { background: #f3f4f6; color: #111827; }
.button.danger { color: #b91c1c; }
.coach-answer { margin-top: 1rem; border-radius: 14px; padding: 1rem; background: #f9fafb; line-height: 1.5; }
.coach-answer.good { background: #ecfdf5; border-left: 5px solid #22c55e; }
.coach-answer.warn { background: #fffbeb; border-left: 5px solid #f59e0b; }
.coach-answer.bad { background: #fef2f2; border-left: 5px solid #ef4444; }
.settings-list { margin: 0; }
.settings-list div { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid #e5e7eb; }
.settings-list dt { color: #6b7280; }
.settings-list dd { margin: 0; font-weight: 800; text-align: right; }
.accounts-list { display: grid; gap: .7rem; }
.account-item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem; border: 1px solid #e5e7eb; border-radius: 14px; }
.account-item strong { display: block; }
.account-item small { color: #6b7280; }
.account-balance { text-align: right; font-weight: 800; }
.hidden { display: none !important; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: .8rem .6rem; border-bottom: 1px solid #e5e7eb; text-align: left; }
th { color: #6b7280; font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; }
.right { text-align: right; }
.positive { color: #15803d; font-weight: 800; }
.negative { color: #b91c1c; font-weight: 800; }
.transfer { color: #6b7280; }
.empty { text-align: center; color: #6b7280; padding: 2rem; }
.help p { color: #4b5563; line-height: 1.5; }
.sample-links { display: flex; gap: 1rem; flex-wrap: wrap; }
.help a { color: #111827; font-weight: 800; }
.toast { position: fixed; left: 50%; bottom: calc(1rem + env(safe-area-inset-bottom)); transform: translateX(-50%); background: #111827; color: white; padding: .8rem 1rem; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,.25); z-index: 30; }
.modal { position: fixed; inset: 0; background: rgba(17,24,39,.65); display: grid; place-items: center; padding: 1rem; z-index: 20; }
.modal-card { width: min(480px, 100%); background: white; border-radius: 18px; padding: 1.2rem; box-shadow: 0 20px 80px rgba(0,0,0,.3); }
.modal-card h3 { margin-top: 0; }
.modal-actions { display: flex; justify-content: flex-end; gap: .7rem; margin-top: 1rem; }
@media (max-width: 800px) {
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .grid-two { grid-template-columns: 1fr; }
  .hero { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 520px) {
  .topbar .eyebrow { display: none; }
  .container { width: min(100% - 1rem, 1120px); }
  .metric-grid { grid-template-columns: 1fr; }
  .amount-row { grid-template-columns: 1fr; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .account-summary { text-align: left; }
  .button { min-height: 44px; }
}

.details-cell {
  max-width: 360px;
  color: #6b7280;
  font-size: .9rem;
  line-height: 1.35;
}

.toolbar-group {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.toolbar-group > div {
  min-width: 210px;
}
.account-item-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
}
.account-meta {
  display: block;
  color: #6b7280;
  margin-top: .25rem;
}
.account-credit {
  color: #92400e;
}
.field-hint {
  display: block;
  color: #6b7280;
  margin-top: .35rem;
  line-height: 1.35;
}
@media (max-width: 620px) {
  .toolbar-group {
    width: 100%;
    flex-direction: column;
  }
  .toolbar-group > div {
    width: 100%;
  }
  .account-item {
    align-items: flex-start;
    flex-direction: column;
  }
  .account-item-actions {
    width: 100%;
    justify-content: space-between;
  }
}

.analysis-toolbar {
  display: grid;
  grid-template-columns: 1fr 240px auto;
  gap: .75rem;
  align-items: center;
}
.recognition-badge {
  background: #ecfdf5;
  color: #166534;
  padding: .55rem .75rem;
  border-radius: 999px;
  font-weight: 800;
  white-space: nowrap;
}
.category-summary {
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.category-chip {
  background: #f3f4f6;
  border-radius: 999px;
  padding: .5rem .7rem;
  font-size: .88rem;
  font-weight: 700;
}
.recurring-list {
  display: grid;
  gap: .7rem;
}
.recurring-item {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 1rem;
  align-items: center;
  padding: .9rem;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
}
.recurring-item small {
  display: block;
  color: #6b7280;
  margin-top: .2rem;
}
.recurring-frequency {
  color: #6b7280;
  font-weight: 700;
}
.category-edit {
  padding: .55rem .7rem;
}
.checkbox-row {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-top: 1rem;
}
.checkbox-row input {
  width: auto;
}
@media (max-width: 760px) {
  .analysis-toolbar {
    grid-template-columns: 1fr;
  }
  .recurring-item {
    grid-template-columns: 1fr;
  }
}


/* V0.6 – Produktlayout */
:root {
  --navy: #0f2537;
  --navy-soft: #17384f;
  --ink: #15202b;
  --muted-ink: #6b7b88;
  --surface: #ffffff;
  --surface-soft: #f4f7f9;
  --line: #dfe7ec;
  --accent: #43c6b7;
  --accent-soft: #e7f8f5;
  --danger: #c84949;
  background: #edf2f5;
}
body {
  color: var(--ink);
  background:
    radial-gradient(circle at 80% -10%, rgba(67,198,183,.10), transparent 32rem),
    #edf2f5;
}
.topbar {
  display: none;
  background: rgba(15,37,55,.97);
}
.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
}
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 1.4rem 1rem;
  background: linear-gradient(180deg, var(--navy), #0b1b28);
  color: white;
  display: flex;
  flex-direction: column;
  z-index: 15;
}
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: .8rem;
  padding: .45rem .55rem 1.5rem;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(67,198,183,.16);
  font-size: 1.35rem;
}
.sidebar-brand h1 {
  margin: 0;
  font-size: 1.35rem;
}
.sidebar-brand p {
  margin: .15rem 0 0;
  color: rgba(255,255,255,.58);
  font-size: .78rem;
}
.sidebar-nav {
  display: grid;
  gap: .35rem;
}
.nav-item {
  border: 0;
  width: 100%;
  border-radius: 12px;
  padding: .82rem .9rem;
  background: transparent;
  color: rgba(255,255,255,.70);
  text-align: left;
  font-weight: 750;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .8rem;
}
.nav-item span {
  width: 1.2rem;
  text-align: center;
  font-size: 1.1rem;
}
.nav-item:hover,
.nav-item.active {
  background: rgba(67,198,183,.14);
  color: white;
}
.sidebar-foot {
  margin-top: auto;
  padding: 1rem .7rem;
  color: rgba(255,255,255,.45);
  font-size: .8rem;
  line-height: 1.5;
}
.content-area {
  width: min(1220px, calc(100% - 3rem));
  margin: 0 auto;
  padding: 1.5rem 0 4rem;
}
.card {
  border: 1px solid rgba(223,231,236,.82);
  border-radius: 20px;
  box-shadow: 0 10px 32px rgba(15,37,55,.055);
}
.toolbar {
  position: sticky;
  top: .75rem;
  z-index: 4;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
}
.hero {
  min-height: 190px;
  color: white;
  background:
    linear-gradient(120deg, rgba(15,37,55,.97), rgba(23,56,79,.93)),
    var(--navy);
  overflow: hidden;
  position: relative;
}
.hero::after {
  content: "⚓";
  position: absolute;
  right: 2rem;
  bottom: -2.2rem;
  font-size: 10rem;
  opacity: .045;
  transform: rotate(-10deg);
}
.hero .muted {
  color: rgba(255,255,255,.66);
}
.hero h2 {
  max-width: 760px;
}
.hero .status {
  position: relative;
  z-index: 1;
}
.metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.metric {
  min-height: 138px;
  position: relative;
  overflow: hidden;
}
.metric::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1rem;
  bottom: 1rem;
  width: 4px;
  border-radius: 0 5px 5px 0;
  background: var(--accent);
}
.metric strong {
  color: var(--navy);
}
.button-primary {
  background: var(--accent);
  color: #062d2a;
}
.button-dark {
  background: var(--navy);
}
.button-ghost {
  background: var(--surface-soft);
}
.recognition-badge {
  background: var(--accent-soft);
  color: #146b62;
}
.category-chip {
  background: var(--surface-soft);
  border: 1px solid var(--line);
}
.accounts-list,
.recurring-list {
  gap: .8rem;
}
.account-item,
.recurring-item {
  border-color: var(--line);
  background: #fbfcfd;
}
.section-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
}
.icon-button {
  border: 0;
  cursor: pointer;
  display: inline-grid;
  place-items: center;
}
.collapse-button {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--navy);
  font-size: 1.25rem;
  transition: transform .18s ease;
}
.collapse-button.open {
  transform: rotate(180deg);
}
.recurring-list.collapsed {
  display: none;
}
.table-wrap {
  border: 1px solid var(--line);
  border-radius: 14px;
}
table {
  min-width: 860px;
}
thead {
  background: #f7f9fa;
}
th:first-child, td:first-child {
  padding-left: .9rem;
}
th:last-child, td:last-child {
  padding-right: .9rem;
}
.help {
  color: var(--muted-ink);
}
.bottom-nav {
  display: none;
}
.mobile-brand {
  display: flex;
  align-items: center;
  gap: .65rem;
}
.mobile-brand strong,
.mobile-brand small {
  display: block;
}
.mobile-brand small {
  color: rgba(255,255,255,.55);
  font-size: .72rem;
}
.menu-toggle {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  color: white;
  background: rgba(255,255,255,.10);
  font-size: 1.2rem;
}
.app-overlay {
  position: fixed;
  inset: 0;
  background: rgba(3,15,24,.55);
  z-index: 12;
}
.app-section {
  scroll-margin-top: 1rem;
}
@media (max-width: 1040px) {
  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 800px) {
  body {
    padding-bottom: 76px;
  }
  .app-shell {
    display: block;
  }
  .topbar {
    position: sticky;
    top: 0;
    display: flex;
    padding: calc(.65rem + env(safe-area-inset-top)) .75rem .65rem;
  }
  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: min(82vw, 300px);
    height: 100vh;
    transform: translateX(-105%);
    transition: transform .22s ease;
    box-shadow: 18px 0 55px rgba(0,0,0,.25);
  }
  .sidebar.open {
    transform: translateX(0);
  }
  .content-area {
    width: min(100% - 1rem, 760px);
    padding: .75rem 0 1.5rem;
  }
  .toolbar {
    top: 74px;
  }
  .bottom-nav {
    position: fixed;
    z-index: 10;
    left: .65rem;
    right: .65rem;
    bottom: calc(.55rem + env(safe-area-inset-bottom));
    height: 62px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid rgba(223,231,236,.92);
    border-radius: 18px;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(16px);
    box-shadow: 0 12px 38px rgba(15,37,55,.18);
    overflow: hidden;
  }
  .bottom-nav-item {
    border: 0;
    background: transparent;
    color: #7b8993;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .1rem;
    cursor: pointer;
  }
  .bottom-nav-item span {
    font-size: 1.15rem;
  }
  .bottom-nav-item small {
    font-size: .68rem;
  }
  .bottom-nav-item.active {
    color: var(--navy);
    background: var(--accent-soft);
  }
  .grid-two {
    grid-template-columns: 1fr;
  }
  .hero {
    min-height: 170px;
  }
}
@media (max-width: 560px) {
  .topbar .button {
    padding: .65rem .72rem;
    font-size: .82rem;
  }
  .topbar .brand-mark {
    width: 36px;
    height: 36px;
    border-radius: 11px;
  }
  .toolbar {
    position: static;
  }
  .card {
    padding: 1rem;
    border-radius: 17px;
  }
  .metric-grid {
    grid-template-columns: 1fr 1fr;
    gap: .7rem;
  }
  .metric {
    min-height: 124px;
  }
  .metric strong {
    font-size: 1.45rem;
  }
  .hero::after {
    right: -.5rem;
  }
  .section-head {
    align-items: flex-start;
  }
  .recognition-badge {
    font-size: .75rem;
  }
}
@media (max-width: 390px) {
  .metric-grid {
    grid-template-columns: 1fr;
  }
}


/* V0.6.1 – Feinschliff */
.dashboard-intro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: .75rem .25rem .2rem;
}
.dashboard-intro h2 {
  margin: 0;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  letter-spacing: -.03em;
  color: var(--navy);
}
.dashboard-intro p {
  margin: .35rem 0 0;
  color: var(--muted-ink);
}
.dashboard-intro-mark {
  width: 72px;
  height: 72px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, var(--accent-soft), #ffffff);
  border: 1px solid var(--line);
  box-shadow: 0 10px 28px rgba(15,37,55,.07);
  font-size: 2rem;
}
.content-area {
  gap: .9rem;
}
.toolbar.card {
  padding: .9rem 1rem;
}
.hero.card {
  padding: 1.4rem 1.45rem;
}
.hero h2 {
  margin-bottom: .55rem;
}
.metric-grid {
  gap: .85rem;
}
.metric {
  padding: 1rem 1rem 1rem 1.15rem;
}
.metric span {
  font-size: .82rem;
  font-weight: 700;
}
.metric strong {
  margin-top: .2rem;
}
.metric small {
  max-width: 24ch;
}
.grid-two {
  gap: .85rem;
}
.section-head {
  margin-bottom: .8rem;
}
.section-head h3 {
  font-size: 1.05rem;
}
.card {
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover {
  box-shadow: 0 14px 38px rgba(15,37,55,.075);
}
.analysis-toolbar {
  grid-template-columns: minmax(220px, 1fr) 220px auto;
}
.category-summary {
  gap: .45rem;
}
.category-chip {
  padding: .42rem .62rem;
  font-size: .81rem;
}
.account-item,
.recurring-item {
  padding: .78rem .85rem;
}
.account-item strong,
.recurring-item strong {
  font-size: .95rem;
}
.coach-answer {
  min-height: 78px;
  display: flex;
  align-items: center;
}
.table-wrap {
  background: white;
}
table {
  font-size: .9rem;
}
th {
  font-size: .72rem;
}
th, td {
  padding-top: .68rem;
  padding-bottom: .68rem;
}
tbody tr:hover {
  background: #f8fbfc;
}
.details-cell {
  color: #75838e;
  font-size: .82rem;
}
.compact-card {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.compact-card p {
  margin-bottom: .6rem;
}
.sidebar-brand {
  padding-bottom: 1.1rem;
}
.sidebar-nav {
  gap: .25rem;
}
.nav-item {
  min-height: 44px;
}
.sidebar-foot {
  border-top: 1px solid rgba(255,255,255,.08);
}
.bottom-nav-item {
  transition: background .18s ease, color .18s ease;
}
@media (max-width: 800px) {
  .dashboard-intro {
    padding: .15rem .15rem .25rem;
  }
  .dashboard-intro-mark {
    width: 54px;
    height: 54px;
    border-radius: 17px;
    font-size: 1.45rem;
  }
  .dashboard-intro h2 {
    font-size: 1.45rem;
  }
  .dashboard-intro p {
    font-size: .88rem;
  }
  .hero.card {
    padding: 1.2rem;
  }
  .analysis-toolbar {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .dashboard-intro-mark {
    display: none;
  }
  .metric-grid {
    grid-template-columns: 1fr 1fr;
  }
  .metric {
    min-height: 112px;
  }
  .metric small {
    font-size: .72rem;
  }
  .table-wrap {
    border: 0;
    overflow: visible;
  }
  table {
    min-width: 0;
    display: block;
  }
  thead {
    display: none;
  }
  tbody {
    display: grid;
    gap: .65rem;
  }
  tbody tr {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .28rem .8rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
  }
  tbody td {
    display: block;
    padding: 0;
    border: 0;
    text-align: left !important;
  }
  tbody td:nth-child(1) {
    grid-column: 1;
    font-size: .75rem;
    color: var(--muted-ink);
  }
  tbody td:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    font-size: .75rem;
    color: var(--muted-ink);
    text-align: right !important;
  }
  tbody td:nth-child(3) {
    grid-column: 1 / -1;
    font-weight: 800;
    color: var(--navy);
  }
  tbody td:nth-child(4) {
    grid-column: 1 / -1;
    font-size: .78rem;
    color: var(--muted-ink);
  }
  tbody td:nth-child(5) {
    grid-column: 1;
    font-size: .8rem;
    color: var(--muted-ink);
  }
  tbody td:nth-child(6) {
    grid-column: 2;
    grid-row: 5;
    font-size: 1rem;
    text-align: right !important;
  }
  tbody td:nth-child(7) {
    grid-column: 1 / -1;
  }
  tbody td:nth-child(7) .button {
    width: 100%;
  }
}
@media (max-width: 390px) {
  .metric-grid {
    grid-template-columns: 1fr;
  }
}


/* V0.7.0 – Regelbasierte Erkenntnisse */
.insights-card {
  padding: 1.15rem 1.25rem;
  background: linear-gradient(135deg, #ffffff, #f8fbfc);
}
.insights-head {
  margin-bottom: .85rem;
}
.insights-basis {
  color: var(--muted-ink);
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .45rem .7rem;
  font-size: .76rem;
  font-weight: 750;
  white-space: nowrap;
}
.insights-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
}
.insight-item {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .78rem .85rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.35;
}
.insight-item.green { background: #f1fbf5; border-color: #ccebd8; }
.insight-item.yellow { background: #fffaf0; border-color: #f1dfb3; }
.insight-item.blue { background: #f2f8fd; border-color: #cfe2f2; }
.insight-item.red { background: #fff4f4; border-color: #efcece; }
.insight-item.neutral { color: var(--muted-ink); }
.insight-icon {
  flex: 0 0 auto;
  font-size: 1.05rem;
}
@media (max-width: 720px) {
  .insights-list { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .insights-card { padding: 1rem; }
  .insights-head { align-items: flex-start; }
  .insights-basis { white-space: normal; text-align: right; }
}


/* V0.7.1 – Monatsvergleich */
.month-compare-card { padding: 1rem; }
.month-compare-head { margin-bottom: .85rem; }
.month-compare-basis {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .35rem .7rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--soft);
  color: var(--muted-ink);
  font-size: .76rem;
  font-weight: 700;
  text-align: right;
}
.month-compare-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
}
.month-compare-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: .95rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
}
.month-compare-item > span {
  color: var(--muted-ink);
  font-size: .75rem;
  font-weight: 700;
}
.month-compare-item > strong {
  margin-top: .35rem;
  color: var(--ink);
  font-size: 1.25rem;
  overflow-wrap: anywhere;
}
.month-compare-item > em {
  margin-top: .35rem;
  color: var(--muted-ink);
  font-size: .72rem;
  font-style: normal;
}
.compare-trend {
  margin-top: .45rem;
  font-size: .78rem;
  font-weight: 800;
}
.compare-trend.good { color: #157a50; }
.compare-trend.bad { color: #b13a3a; }
.compare-trend.neutral { color: var(--muted-ink); }
@media (max-width: 980px) {
  .month-compare-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .month-compare-card { padding: 1rem; }
  .month-compare-head { align-items: flex-start; }
  .month-compare-basis { max-width: 58%; white-space: normal; }
  .month-compare-grid { grid-template-columns: 1fr; }
}


/* V0.7.2 – Händlerprofile */
.merchant-card { padding: 1rem; }
.merchant-head { margin-bottom: .8rem; }
.merchant-toolbar { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:.7rem; margin-bottom:.85rem; }
.merchant-profiles { display:grid; gap:.65rem; }
.merchant-profile { border:1px solid var(--line); border-radius:14px; background:var(--card); overflow:hidden; }
.merchant-profile-main { width:100%; display:grid; grid-template-columns:minmax(210px,1.6fr) repeat(3,minmax(110px,.7fr)) 28px; gap:.8rem; align-items:center; border:0; background:transparent; padding:.9rem; text-align:left; color:var(--ink); cursor:pointer; }
.merchant-profile-main:hover { background:var(--surface-soft); }
.merchant-profile-main > div:not(.merchant-name) { display:flex; flex-direction:column; gap:.2rem; }
.merchant-profile-main span { color:var(--muted-ink); font-size:.72rem; font-weight:700; }
.merchant-profile-main strong { font-size:.93rem; }
.merchant-name { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; min-width:0; }
.merchant-name > strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.merchant-name small { flex-basis:100%; color:var(--muted-ink); }
.merchant-new { color:#176a4a !important; background:#e8f7ef; border-radius:999px; padding:.2rem .45rem; }
.merchant-chevron { font-size:1rem !important; text-align:center; transition:transform .2s ease; }
.merchant-profile.open .merchant-chevron { transform:rotate(180deg); }
.merchant-detail { border-top:1px solid var(--line); padding:.9rem; background:var(--surface-soft); }
.merchant-detail-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; margin-bottom:.7rem; }
.merchant-detail-stats span { display:flex; flex-direction:column; gap:.2rem; padding:.65rem; background:var(--card); border:1px solid var(--line); border-radius:10px; }
.merchant-detail-stats small { color:var(--muted-ink); }
.merchant-recent { display:grid; gap:.35rem; }
.merchant-recent div { display:flex; justify-content:space-between; gap:1rem; padding:.45rem .1rem; border-bottom:1px solid var(--line); font-size:.82rem; }
.merchant-recent div:last-child { border-bottom:0; }
@media (max-width:900px) { .merchant-profile-main { grid-template-columns:minmax(180px,1fr) repeat(2,minmax(95px,.6fr)) 28px; } .merchant-profile-main > div:nth-of-type(4) { display:none; } }
@media (max-width:620px) { .merchant-toolbar { grid-template-columns:1fr; } .merchant-profile-main { grid-template-columns:minmax(0,1fr) auto 24px; } .merchant-profile-main > div:nth-of-type(3), .merchant-profile-main > div:nth-of-type(4) { display:none; } .merchant-detail-stats { grid-template-columns:1fr; } }


/* V0.7.2a – CSV-Import wieder direkt erreichbar */
.import-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.15rem 1.25rem;
  background: linear-gradient(135deg, #ffffff, var(--accent-soft));
  border-color: rgba(67, 198, 183, .34);
}
.import-card-content {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  min-width: 0;
}
.import-card-icon {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(67, 198, 183, .17);
  font-size: 1.45rem;
}
.import-card h3 {
  margin: 0;
  color: var(--navy);
  font-size: 1.12rem;
}
.import-card p:not(.eyebrow) {
  margin: .38rem 0 .7rem;
  color: var(--muted-ink);
  line-height: 1.45;
}
.import-notes {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .8rem;
  color: #246b63;
  font-size: .78rem;
  font-weight: 700;
}
.import-card-button {
  flex: 0 0 auto;
  min-width: 185px;
}
@media (max-width: 720px) {
  .import-card {
    align-items: stretch;
    flex-direction: column;
  }
  .import-card-button {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .import-card-content {
    gap: .75rem;
  }
  .import-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }
  .import-notes {
    display: grid;
  }
}


/* V0.7.3 – Wiederkehrende Einnahmen und Ausgaben */
.recurring-item.income {
  border-left: 4px solid #22a06b;
}
.recurring-item.expense {
  border-left: 4px solid #d67b33;
}
.recurring-item.overdue {
  background: #fff8f1;
  border-color: #efc69e;
}
.recurring-item.income.overdue {
  background: #fff3f3;
  border-color: #e6b1b1;
}
.recurring-item small + small {
  margin-top: .28rem;
}
@media (max-width: 760px) {
  .recurring-item .account-balance {
    text-align: left;
  }
}

/* V0.7.3 – sichtbare Gruppierung regelmäßiger Zahlungen */
.recurring-group { display: grid; gap: .65rem; }
.recurring-group + .recurring-group { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.recurring-group-head { display: flex; align-items: center; justify-content: space-between; color: var(--navy); }
.recurring-group-head span { min-width: 1.8rem; height: 1.8rem; display: inline-grid; place-items: center; border-radius: 999px; background: var(--soft); font-size: .78rem; font-weight: 800; }


/* V0.7.4 Monatsprognose */
.monthly-forecast-card { padding: 1rem; }
.monthly-forecast-content { display: grid; gap: .9rem; }
.forecast-values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.forecast-values > div { padding: .85rem; border: 1px solid var(--line, #dfe6eb); border-radius: 14px; background: rgba(248,250,252,.72); display: grid; gap: .3rem; }
.forecast-values span { font-size: .78rem; color: var(--muted, #657383); }
.forecast-values strong { font-size: 1.05rem; }
.forecast-values .forecast-result { background: rgba(13,110,90,.07); border-color: rgba(13,110,90,.2); }
.forecast-values .positive { color: #087c5b; }
.forecast-values .negative { color: #9a4b10; }
.forecast-status { display: flex; align-items: center; gap: .55rem; padding: .75rem .9rem; border-radius: 12px; }
.forecast-status.good { background: rgba(22,163,74,.09); color: #166534; }
.forecast-status.warn { background: rgba(245,158,11,.12); color: #92400e; }
.forecast-status.bad { background: rgba(220,38,38,.1); color: #991b1b; }
.forecast-note { color: var(--muted, #657383); }
@media (max-width: 850px) { .forecast-values { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .forecast-values { grid-template-columns: 1fr; } }


/* V0.7.5 Sparziele */
.savings-goals-list { display: grid; gap: .85rem; }
.savings-goal-item { border: 1px solid var(--line); border-radius: 16px; padding: 1rem; background: #fbfcfd; display: grid; gap: .75rem; }
.savings-goal-top, .savings-goal-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.savings-goal-top > div, .savings-goal-bottom > div:first-child { display: grid; gap: .18rem; }
.savings-goal-top strong { font-size: 1rem; color: var(--navy); }
.savings-goal-top small, .savings-goal-bottom small { color: var(--muted); }
.savings-goal-top > span { font-weight: 800; color: var(--navy); }
.savings-progress { height: 10px; border-radius: 999px; background: var(--soft); overflow: hidden; }
.savings-progress i { display: block; height: 100%; border-radius: inherit; background: var(--teal); }
.savings-goal-bottom span { font-weight: 700; }
.savings-goal-actions { display: flex; gap: .45rem; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 700px) {
  .savings-goal-bottom { align-items: flex-start; flex-direction: column; }
  .savings-goal-actions { width: 100%; justify-content: stretch; }
  .savings-goal-actions .button { flex: 1; }
}

/* V0.7.5b Sparziel-Coach */
.savings-goal-title { display: flex !important; align-items: center; gap: .7rem; }
.savings-goal-icon { width: 2.25rem; height: 2.25rem; border-radius: 12px; background: rgba(53,196,184,.12); display: grid; place-items: center; font-size: 1.15rem; flex: 0 0 auto; }
.savings-goal-percent { font-size: 1.05rem; }
.savings-goal-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .65rem; }
.savings-goal-summary > div { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: .7rem .8rem; display: grid; gap: .15rem; }
.savings-goal-summary small { color: var(--muted); }
.savings-goal-summary strong { color: var(--navy); }
.savings-goal-coach { border-radius: 12px; padding: .75rem .85rem; display: grid; gap: .18rem; }
.savings-goal-coach strong { font-size: .92rem; }
.savings-goal-coach span { font-size: .86rem; line-height: 1.4; }
.savings-goal-coach.good { background: rgba(22,163,74,.09); color: #166534; }
.savings-goal-coach.warn { background: rgba(245,158,11,.12); color: #92400e; }
.savings-goal-coach.neutral { background: var(--soft); color: var(--navy); }
.savings-goal-actions { justify-self: end; }
@media (max-width: 700px) {
  .savings-goal-summary { grid-template-columns: 1fr; }
  .savings-goal-actions { width: 100%; }
}

/* V0.7.6 Ausgabengruppen mit Händler-Drilldown */
.group-name strong { display:flex; align-items:center; gap:.55rem; }
.group-icon { font-size:1.25rem; line-height:1; }
.spending-group-detail { padding:.55rem .85rem .85rem; display:grid; gap:.45rem; }
.group-merchant { border:1px solid var(--line); border-radius:11px; overflow:hidden; background:var(--card); }
.group-merchant-head { width:100%; border:0; background:transparent; color:var(--ink); padding:.72rem .8rem; display:grid; grid-template-columns:minmax(0,1fr) auto 22px; gap:.7rem; align-items:center; text-align:left; cursor:pointer; }
.group-merchant-head:hover { background:var(--surface-soft); }
.group-merchant-head > span:first-child { display:flex; flex-direction:column; min-width:0; }
.group-merchant-head > span:first-child strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.group-merchant-head small { color:var(--muted-ink); margin-top:.12rem; }
.group-merchant.open .merchant-chevron { transform:rotate(180deg); }
.group-bookings { border-top:1px solid var(--line); padding:.25rem .8rem .55rem; }
@media (max-width:620px) {
  .spending-group-main > div:nth-of-type(3), .spending-group-main > div:nth-of-type(4) { display:none; }
  .group-merchant-head { grid-template-columns:minmax(0,1fr) auto 20px; }
}

/* V0.7.8 – anklickbare Coach-Erkenntnisse */
.insight-item.interactive {
  width: 100%;
  border: 1px solid var(--line);
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.insight-item.interactive:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(20, 42, 55, .08);
  border-color: rgba(28, 166, 153, .42);
}
.insight-item.interactive:focus-visible {
  outline: 3px solid rgba(28, 166, 153, .24);
  outline-offset: 2px;
}
.insight-item.interactive > span:nth-child(2) { flex: 1 1 auto; }
.insight-arrow {
  flex: 0 0 auto;
  font-size: 1.45rem;
  line-height: 1;
  opacity: .55;
}

/* V0.8.0 – Coach 2.0: priorisierte Empfehlungen */
.insight-item.coach2 { align-items:flex-start; min-height:118px; padding:.9rem; }
.insight-item.coach2 .insight-icon { margin-top:.15rem; font-size:1.22rem; }
.insight-content { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:.18rem; }
.insight-level { display:inline-flex; width:auto; padding:.16rem .48rem; border-radius:999px; background:rgba(255,255,255,.72); border:1px solid rgba(0,0,0,.07); font-size:.68rem; font-weight:850; text-transform:uppercase; letter-spacing:.035em; }
.insight-content strong { font-size:.95rem; line-height:1.28; }
.insight-text { font-size:.84rem; font-weight:650; line-height:1.4; color:var(--ink); }
.insight-content small { font-size:.72rem; line-height:1.35; color:var(--muted-ink); font-weight:600; }
.insight-content em { margin-top:.18rem; font-size:.76rem; font-style:normal; color:var(--accent); font-weight:850; }
.insight-item.coach2.red .insight-level { color:#9f2929; }
.insight-item.coach2.yellow .insight-level { color:#8a6100; }
.insight-item.coach2.green .insight-level { color:#237144; }
.insight-item.coach2.blue .insight-level { color:#25668d; }
@media (max-width:480px) { .insight-item.coach2 { min-height:auto; } }


/* V0.8.1 – Backup & Datensicherheit */
.backup-card { border-color: rgba(28,166,153,.28); }
.backup-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem; align-items:center; }
.backup-grid p { margin:.35rem 0 0; }
.backup-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.6rem; }
.backup-status { display:inline-flex; align-items:center; padding:.34rem .7rem; border-radius:999px; font-size:.76rem; font-weight:850; }
.backup-status.ok { background:#e3f7ec; color:#16643a; }
.backup-status.warning { background:#fff1d9; color:#8a5c00; }
.backup-status.neutral { background:var(--surface-soft); color:var(--muted-ink); }
.backup-warning { margin-top:.85rem; padding:.72rem .85rem; border-radius:10px; background:#fff1d9; color:#7a4d00; font-weight:750; }
@media (max-width:720px) { .backup-grid { grid-template-columns:1fr; } .backup-actions { justify-content:flex-start; } }


/* V0.8.1.1 – sichtbarer Bereich Backup & Sicherheit */
.backup-security-card { scroll-margin-top: 86px; border-color: rgba(28,166,153,.24); }
.backup-security-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:1rem; margin-top:1rem; }
.backup-panel { border:1px solid var(--line); border-radius:14px; padding:1rem; background:var(--surface-soft); }
.backup-panel h4 { margin:0 0 .45rem; font-size:1rem; }
.backup-page-actions { justify-content:flex-start; margin-top:1rem; }
.backup-help { margin:.8rem 0 0; font-size:.78rem; color:var(--muted-ink); }
.backup-stats { margin:0; }
.backup-stats > div { display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-bottom:1px solid var(--line); }
.backup-stats > div:last-child { border-bottom:0; }
.backup-stats dt { color:var(--muted-ink); }
.backup-stats dd { margin:0; font-weight:800; text-align:right; }
.security-roadmap { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; margin-top:1rem; }
.security-roadmap > div { display:grid; grid-template-columns:auto 1fr; column-gap:.55rem; align-items:center; border:1px dashed var(--line); border-radius:12px; padding:.8rem; opacity:.76; }
.security-roadmap span { grid-row:1 / span 2; font-size:1.25rem; }
.security-roadmap strong { font-size:.84rem; }
.security-roadmap small { color:var(--muted-ink); font-size:.72rem; }
@media (max-width:760px) {
  .backup-security-grid, .security-roadmap { grid-template-columns:1fr; }
  .backup-page-actions .button { width:100%; }
}

.status-ok-text{color:#087f5b;font-weight:800}.status-error-text{color:#b42318;font-weight:800}

.storage-health-detail{display:flex;flex-direction:column;align-items:flex-end;gap:.12rem}.storage-health-detail small{font-size:.68rem;font-weight:600;color:var(--muted-ink);white-space:nowrap}


/* V0.8.3 – Farbmodi */
:root,
:root[data-theme="light"] {
  --theme-bg: #edf2f5;
  --theme-bg-glow: rgba(67,198,183,.10);
  --theme-surface: #ffffff;
  --theme-surface-soft: #f4f7f9;
  --theme-surface-strong: #e8eef2;
  --theme-line: #dfe7ec;
  --theme-text: #15202b;
  --theme-muted: #6b7b88;
  --theme-nav: #0f2537;
  --theme-nav-end: #0b1b28;
  --theme-accent: #43c6b7;
  --theme-accent-soft: #e7f8f5;
  --theme-button-text: #072f2b;
  --theme-shadow: rgba(15,37,55,.09);
  --theme-input: #ffffff;
}
:root[data-theme="dark"] {
  --theme-bg: #10161d;
  --theme-bg-glow: rgba(89,207,194,.08);
  --theme-surface: #1a232d;
  --theme-surface-soft: #202c37;
  --theme-surface-strong: #293744;
  --theme-line: #344452;
  --theme-text: #edf5f7;
  --theme-muted: #9fb0bc;
  --theme-nav: #0a1016;
  --theme-nav-end: #111a22;
  --theme-accent: #59cfc2;
  --theme-accent-soft: #173c3a;
  --theme-button-text: #061f1d;
  --theme-shadow: rgba(0,0,0,.35);
  --theme-input: #151e27;
}
:root[data-theme="navy"] {
  --theme-bg: #071728;
  --theme-bg-glow: rgba(63,169,226,.16);
  --theme-surface: #0d2740;
  --theme-surface-soft: #12334f;
  --theme-surface-strong: #19415f;
  --theme-line: #24506d;
  --theme-text: #eff8ff;
  --theme-muted: #a8c4d8;
  --theme-nav: #04111e;
  --theme-nav-end: #09243b;
  --theme-accent: #46baf2;
  --theme-accent-soft: #123d58;
  --theme-button-text: #041b2a;
  --theme-shadow: rgba(0,0,0,.42);
  --theme-input: #0a2137;
}
:root[data-theme="emerald"] {
  --theme-bg: #0d2721;
  --theme-bg-glow: rgba(82,210,162,.15);
  --theme-surface: #15382f;
  --theme-surface-soft: #1b463b;
  --theme-surface-strong: #245648;
  --theme-line: #32705f;
  --theme-text: #f0fff9;
  --theme-muted: #b0d2c5;
  --theme-nav: #081c17;
  --theme-nav-end: #12352c;
  --theme-accent: #5bd7a6;
  --theme-accent-soft: #1c5141;
  --theme-button-text: #073024;
  --theme-shadow: rgba(0,0,0,.36);
  --theme-input: #102f28;
}
:root[data-theme="ruby"] {
  --theme-bg: #2a1118;
  --theme-bg-glow: rgba(230,99,123,.14);
  --theme-surface: #401b25;
  --theme-surface-soft: #50232f;
  --theme-surface-strong: #62303d;
  --theme-line: #794252;
  --theme-text: #fff4f6;
  --theme-muted: #d8b1bb;
  --theme-nav: #1c0a0f;
  --theme-nav-end: #37141d;
  --theme-accent: #f06c86;
  --theme-accent-soft: #612637;
  --theme-button-text: #3b0713;
  --theme-shadow: rgba(0,0,0,.40);
  --theme-input: #371720;
}

body {
  color: var(--theme-text);
  background: radial-gradient(circle at 80% -10%, var(--theme-bg-glow), transparent 32rem), var(--theme-bg);
  transition: background .22s ease, color .22s ease;
}
.sidebar { background: linear-gradient(180deg, var(--theme-nav), var(--theme-nav-end)); }
.card, .modal-card, .account-item, .recurring-item, .merchant-group-card, .spending-group-card,
.backup-panel, .theme-panel, .goal-card, .forecast-card, .coach-card, .metric, .comparison-item,
.transaction-row, .group-row, .merchant-row, .filter-card, .import-card, .settings-card {
  background-color: var(--theme-surface);
  color: var(--theme-text);
  border-color: var(--theme-line);
  box-shadow: 0 8px 30px var(--theme-shadow);
}
.card, .modal-card, .backup-panel, .theme-panel { transition: background-color .22s ease, border-color .22s ease, color .22s ease; }
input, select, textarea {
  color: var(--theme-text);
  background: var(--theme-input);
  border-color: var(--theme-line);
}
input::placeholder, textarea::placeholder { color: var(--theme-muted); }
.muted, .metric span, .metric small, .account-summary, .account-meta, .field-hint,
.details-cell, .recurring-item small, .recurring-frequency, .settings-list dt,
.theme-option small, .theme-hint, .backup-help, .help p, .security-roadmap small { color: var(--theme-muted); }
.settings-list div, th, td, .account-item, .recurring-item, .backup-stats div,
.spending-group-card, .merchant-group-card, .theme-option { border-color: var(--theme-line); }
.button-primary { background: var(--theme-accent); color: var(--theme-button-text); }
.button-dark { background: var(--theme-nav); color: #fff; }
.button-ghost, .category-chip { background: var(--theme-surface-soft); color: var(--theme-text); }
.recognition-badge, .backup-status.ok { background: var(--theme-accent-soft); color: var(--theme-text); }
.help a, .sample-links a { color: var(--theme-text); }

.theme-panel {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--theme-line);
  border-radius: 16px;
}
.theme-panel-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.9rem; }
.theme-panel-head h4 { margin:0; }
.theme-current { padding:.45rem .7rem; border-radius:999px; background:var(--theme-accent-soft); color:var(--theme-text); font-weight:800; font-size:.82rem; }
.theme-options { display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:.75rem; }
.theme-option {
  appearance:none; width:100%; text-align:left; border:1px solid var(--theme-line); border-radius:14px;
  background:var(--theme-surface-soft); color:var(--theme-text); padding:.75rem; cursor:pointer;
  display:grid; gap:.2rem; transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.theme-option:hover { transform:translateY(-1px); }
.theme-option.active { border-color:var(--theme-accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--theme-accent) 24%, transparent); }
.theme-preview { display:flex; height:38px; border-radius:9px; overflow:hidden; margin-bottom:.35rem; border:1px solid rgba(127,127,127,.25); }
.theme-preview i { display:block; flex:1; }
.preview-light i:nth-child(1){background:#edf2f5}.preview-light i:nth-child(2){background:#fff}.preview-light i:nth-child(3){background:#43c6b7}
.preview-dark i:nth-child(1){background:#10161d}.preview-dark i:nth-child(2){background:#1a232d}.preview-dark i:nth-child(3){background:#59cfc2}
.preview-navy i:nth-child(1){background:#071728}.preview-navy i:nth-child(2){background:#0d2740}.preview-navy i:nth-child(3){background:#46baf2}
.preview-emerald i:nth-child(1){background:#0d2721}.preview-emerald i:nth-child(2){background:#15382f}.preview-emerald i:nth-child(3){background:#5bd7a6}
.preview-ruby i:nth-child(1){background:#2a1118}.preview-ruby i:nth-child(2){background:#401b25}.preview-ruby i:nth-child(3){background:#f06c86}
.theme-hint { margin:.75rem 0 0; font-size:.86rem; }
.compact-roadmap { grid-template-columns:repeat(2,minmax(0,1fr)); }

:root:not([data-theme="light"]) .hero-card,
:root:not([data-theme="light"]) .dashboard-hero { background:linear-gradient(135deg,var(--theme-nav),var(--theme-nav-end)); }
:root:not([data-theme="light"]) .coach-answer,
:root:not([data-theme="light"]) .empty,
:root:not([data-theme="light"]) .table-wrap,
:root:not([data-theme="light"]) .forecast-item { color:var(--theme-text); }
:root:not([data-theme="light"]) .modal { background:rgba(0,0,0,.72); }

@media (max-width:900px){ .theme-options{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .theme-options{grid-template-columns:1fr;} .compact-roadmap{grid-template-columns:1fr;} }


/* V0.8.3a – vollständige Theme-Kontraste und eigener Darstellungsbereich */
.appearance-card { scroll-margin-top: 86px; border-color: color-mix(in srgb, var(--theme-accent) 32%, var(--theme-line)); }
.appearance-card .section-head { margin-bottom: 1rem; }

:root:not([data-theme="light"]) {
  color-scheme: dark;
}
:root:not([data-theme="light"]) body,
:root:not([data-theme="light"]) h1,
:root:not([data-theme="light"]) h2,
:root:not([data-theme="light"]) h3,
:root:not([data-theme="light"]) h4,
:root:not([data-theme="light"]) strong,
:root:not([data-theme="light"]) label,
:root:not([data-theme="light"]) p,
:root:not([data-theme="light"]) span,
:root:not([data-theme="light"]) dt,
:root:not([data-theme="light"]) dd,
:root:not([data-theme="light"]) th,
:root:not([data-theme="light"]) td { color: inherit; }

:root:not([data-theme="light"]) .card,
:root:not([data-theme="light"]) .toolbar,
:root:not([data-theme="light"]) .metric,
:root:not([data-theme="light"]) .comparison-item,
:root:not([data-theme="light"]) .settings-card,
:root:not([data-theme="light"]) .filter-card,
:root:not([data-theme="light"]) .account-item,
:root:not([data-theme="light"]) .recurring-item,
:root:not([data-theme="light"]) .goal-card,
:root:not([data-theme="light"]) .backup-panel,
:root:not([data-theme="light"]) .appearance-card,
:root:not([data-theme="light"]) .theme-option,
:root:not([data-theme="light"]) .table-wrap,
:root:not([data-theme="light"]) table,
:root:not([data-theme="light"]) thead,
:root:not([data-theme="light"]) tbody,
:root:not([data-theme="light"]) tr,
:root:not([data-theme="light"]) td,
:root:not([data-theme="light"]) th {
  background-color: var(--theme-surface);
  color: var(--theme-text);
  border-color: var(--theme-line);
}

:root:not([data-theme="light"]) .coach-answer,
:root:not([data-theme="light"]) .forecast-item,
:root:not([data-theme="light"]) .goal-stat,
:root:not([data-theme="light"]) .goal-coach,
:root:not([data-theme="light"]) .spending-group-card,
:root:not([data-theme="light"]) .merchant-group-card,
:root:not([data-theme="light"]) .merchant-detail,
:root:not([data-theme="light"]) .group-detail,
:root:not([data-theme="light"]) .category-chip,
:root:not([data-theme="light"]) .button-ghost,
:root:not([data-theme="light"]) .empty,
:root:not([data-theme="light"]) .security-roadmap > div {
  background: var(--theme-surface-soft);
  color: var(--theme-text);
  border-color: var(--theme-line);
}

:root:not([data-theme="light"]) .coach-answer.good,
:root:not([data-theme="light"]) .goal-coach.good { background: color-mix(in srgb, #16a34a 18%, var(--theme-surface)); color: var(--theme-text); }
:root:not([data-theme="light"]) .coach-answer.warn,
:root:not([data-theme="light"]) .forecast-warning { background: color-mix(in srgb, #f59e0b 18%, var(--theme-surface)); color: #ffe5a8; }
:root:not([data-theme="light"]) .coach-answer.bad,
:root:not([data-theme="light"]) .forecast-danger { background: color-mix(in srgb, #ef4444 18%, var(--theme-surface)); color: #ffd0d0; }

:root:not([data-theme="light"]) .muted,
:root:not([data-theme="light"]) .eyebrow,
:root:not([data-theme="light"]) .metric span,
:root:not([data-theme="light"]) .metric small,
:root:not([data-theme="light"]) .account-summary,
:root:not([data-theme="light"]) .account-meta,
:root:not([data-theme="light"]) .field-hint,
:root:not([data-theme="light"]) .details-cell,
:root:not([data-theme="light"]) .recurring-item small,
:root:not([data-theme="light"]) .recurring-frequency,
:root:not([data-theme="light"]) .settings-list dt,
:root:not([data-theme="light"]) .theme-option small,
:root:not([data-theme="light"]) .theme-hint,
:root:not([data-theme="light"]) .backup-help,
:root:not([data-theme="light"]) .help p,
:root:not([data-theme="light"]) .security-roadmap small,
:root:not([data-theme="light"]) .dashboard-intro > div > p:last-child { color: var(--theme-muted) !important; }

:root:not([data-theme="light"]) input,
:root:not([data-theme="light"]) select,
:root:not([data-theme="light"]) textarea {
  background: var(--theme-input) !important;
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) input:focus,
:root:not([data-theme="light"]) select:focus,
:root:not([data-theme="light"]) textarea:focus { border-color: var(--theme-accent) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-accent) 25%, transparent) !important; }
:root:not([data-theme="light"]) option { background: var(--theme-input); color: var(--theme-text); }

:root:not([data-theme="light"]) .button-dark,
:root:not([data-theme="light"]) .button-ghost,
:root:not([data-theme="light"]) .nav-action,
:root:not([data-theme="light"]) .row-action {
  background: var(--theme-surface-strong);
  color: var(--theme-text);
  border-color: var(--theme-line);
}
:root:not([data-theme="light"]) .button-primary { background: var(--theme-accent); color: var(--theme-button-text); }
:root:not([data-theme="light"]) .button.danger { color: #ff9a9a; }

:root:not([data-theme="light"]) .positive { color: #6ee7a1 !important; }
:root:not([data-theme="light"]) .negative { color: #ff8585 !important; }
:root:not([data-theme="light"]) .transfer { color: var(--theme-muted) !important; }
:root:not([data-theme="light"]) .account-credit { color: #ffc46b !important; }

:root:not([data-theme="light"]) .hero-copy h2,
:root:not([data-theme="light"]) .dashboard-hero h2,
:root:not([data-theme="light"]) .hero-card h2,
:root:not([data-theme="light"]) .hero-card p,
:root:not([data-theme="light"]) .dashboard-hero p { color: #f7fbff !important; }

:root:not([data-theme="light"]) .insight-card,
:root:not([data-theme="light"]) .coach-insight,
:root:not([data-theme="light"]) .insight-critical,
:root:not([data-theme="light"]) .insight-warning,
:root:not([data-theme="light"]) .insight-positive,
:root:not([data-theme="light"]) .insight-info {
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) .insight-critical { background: color-mix(in srgb, #ef4444 14%, var(--theme-surface)) !important; }
:root:not([data-theme="light"]) .insight-warning { background: color-mix(in srgb, #f59e0b 13%, var(--theme-surface)) !important; }
:root:not([data-theme="light"]) .insight-positive { background: color-mix(in srgb, #22c55e 13%, var(--theme-surface)) !important; }
:root:not([data-theme="light"]) .insight-info { background: color-mix(in srgb, #38bdf8 11%, var(--theme-surface)) !important; }

:root:not([data-theme="light"]) .toast { background: var(--theme-surface-strong); color: var(--theme-text); border: 1px solid var(--theme-line); }
:root:not([data-theme="light"]) .modal-card { background: var(--theme-surface); color: var(--theme-text); }
:root:not([data-theme="light"]) .modal-card *:not(.button-primary):not(.positive):not(.negative) { border-color: var(--theme-line); }

@media (max-width: 900px) {
  .appearance-card .theme-options { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* V0.8.3b – konsequente Theme-Variablen und Kontrastkorrekturen */
:root {
  --navy: var(--theme-nav);
  --navy-soft: var(--theme-surface-strong);
  --ink: var(--theme-text);
  --muted-ink: var(--theme-muted);
  --surface: var(--theme-surface);
  --surface-soft: var(--theme-surface-soft);
  --line: var(--theme-line);
  --accent: var(--theme-accent);
  --accent-soft: var(--theme-accent-soft);
  --card: var(--theme-surface);
  --soft: var(--theme-surface-soft);
  --muted: var(--theme-muted);
}

/* Überschriften, Gruppen und wiederkehrende Zahlungen */
.dashboard-intro h1,
.section-head h2,
.section-head h3,
.merchant-profile-main,
.merchant-profile-main strong,
.merchant-profile-main b,
.group-merchant-head,
.group-merchant-head strong,
.recurring-group-head,
.recurring-group-head strong,
.recurring-item strong,
.savings-goal-top strong,
.savings-goal-top > span,
.savings-goal-summary strong,
.insight-text,
.settings-list dd,
.account-balance {
  color: var(--theme-text) !important;
}

.merchant-profile-main span,
.merchant-name small,
.group-merchant-head small,
.recurring-item small,
.recurring-frequency,
.forecast-values span,
.forecast-note,
.savings-goal-top small,
.savings-goal-bottom small,
.savings-goal-summary small,
.details-cell,
.account-meta {
  color: var(--theme-muted) !important;
}

/* Hero bleibt in jedem Farbmodus bewusst kontrastreich */
.hero,
.hero.card,
.dashboard-hero,
.hero-card {
  background: linear-gradient(135deg, var(--theme-nav), var(--theme-nav-end)) !important;
  color: #f7fbff !important;
}
.hero h2,
.hero h3,
.hero p,
.hero .muted,
.hero.card h2,
.hero.card p,
.dashboard-hero h2,
.dashboard-hero p,
.hero-card h2,
.hero-card p {
  color: #f7fbff !important;
}
.hero .muted,
.dashboard-hero .muted,
.hero-card .muted { color: rgba(247,251,255,.78) !important; }

/* Ausgabengruppen und Detailkarten */
.merchant-profile,
.spending-group,
.group-merchant,
.recurring-item {
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  color: var(--theme-text) !important;
}
.merchant-profile-main:hover,
.group-merchant-head:hover { background: var(--theme-surface-soft) !important; }
.merchant-detail,
.spending-group-detail,
.group-bookings {
  background: var(--theme-surface-soft) !important;
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
.recurring-group + .recurring-group { border-top-color: var(--theme-line) !important; }
.recurring-group-head span { background: var(--theme-surface-soft) !important; color: var(--theme-text) !important; }

/* Coach-Karten: dunkle Themes bekommen dunkle, kontrastreiche Varianten */
:root:not([data-theme="light"]) .insight-item.coach2 {
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2.red {
  background: color-mix(in srgb, #ef4444 18%, var(--theme-surface)) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2.yellow {
  background: color-mix(in srgb, #f59e0b 17%, var(--theme-surface)) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2.green {
  background: color-mix(in srgb, #22c55e 17%, var(--theme-surface)) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2.blue {
  background: color-mix(in srgb, #38bdf8 15%, var(--theme-surface)) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2 .insight-text,
:root:not([data-theme="light"]) .insight-item.coach2 .insight-content small {
  color: var(--theme-text) !important;
}
:root:not([data-theme="light"]) .insight-item.coach2 .insight-content small { opacity: .76; }

/* Helle Innenflächen in dunklen Themes vermeiden */
:root:not([data-theme="light"]) .forecast-values > div,
:root:not([data-theme="light"]) .savings-goal-item,
:root:not([data-theme="light"]) .savings-goal-summary > div,
:root:not([data-theme="light"]) .coach-answer,
:root:not([data-theme="light"]) .table-wrap,
:root:not([data-theme="light"]) .import-card {
  background: var(--theme-surface-soft) !important;
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}

/* Tabellen und Zeilen */
:root:not([data-theme="light"]) table,
:root:not([data-theme="light"]) thead,
:root:not([data-theme="light"]) tbody,
:root:not([data-theme="light"]) tr,
:root:not([data-theme="light"]) th,
:root:not([data-theme="light"]) td {
  background: var(--theme-surface) !important;
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) th,
:root:not([data-theme="light"]) .details-cell { color: var(--theme-muted) !important; }

/* Formular- und Aktionsflächen */
input, select, textarea,
.button-ghost,
.button-dark,
.row-action,
.nav-action {
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) .button-dark,
:root:not([data-theme="light"]) .button-ghost,
:root:not([data-theme="light"]) .row-action,
:root:not([data-theme="light"]) .nav-action {
  background: var(--theme-surface-strong) !important;
  color: var(--theme-text) !important;
}

/* Lesbare Statusfarben */
:root:not([data-theme="light"]) .status.good,
:root:not([data-theme="light"]) .backup-status.ok { background: rgba(34,197,94,.20) !important; color: #a7f3c3 !important; }
:root:not([data-theme="light"]) .status.warn,
:root:not([data-theme="light"]) .backup-status.warning { background: rgba(245,158,11,.20) !important; color: #ffe2a0 !important; }
:root:not([data-theme="light"]) .status.bad { background: rgba(239,68,68,.20) !important; color: #ffc4c4 !important; }

/* Keine blassen Texte durch globale Vererbung */
:root:not([data-theme="light"]) .card,
:root:not([data-theme="light"]) .card *:not(.positive):not(.negative):not(.status):not(.button-primary):not(.insight-level) {
  text-shadow: none;
}


/* V0.8.3c – finale Kontrast- und Navigationskorrektur */
:root:not([data-theme="light"]) .dashboard-intro,
:root:not([data-theme="light"]) .dashboard-intro *,
:root:not([data-theme="light"]) .section-head,
:root:not([data-theme="light"]) .section-head h1,
:root:not([data-theme="light"]) .section-head h2,
:root:not([data-theme="light"]) .section-head h3,
:root:not([data-theme="light"]) .section-head p,
:root:not([data-theme="light"]) .toolbar label,
:root:not([data-theme="light"]) .toolbar strong {
  color: var(--theme-text) !important;
}

:root:not([data-theme="light"]) .dashboard-intro .eyebrow,
:root:not([data-theme="light"]) .section-head .eyebrow,
:root:not([data-theme="light"]) .dashboard-intro > div > p:last-child {
  color: var(--theme-muted) !important;
}

/* Die Finanzcoach-Fläche übernimmt das jeweilige Theme statt weiß zu bleiben. */
:root:not([data-theme="light"]) #insights,
:root:not([data-theme="light"]) .insights-card {
  background: var(--theme-surface) !important;
  color: var(--theme-text) !important;
  border-color: var(--theme-line) !important;
}
:root:not([data-theme="light"]) #insights .section-head,
:root:not([data-theme="light"]) #insights .section-head *,
:root:not([data-theme="light"]) #insights .insight-content,
:root:not([data-theme="light"]) #insights .insight-content strong,
:root:not([data-theme="light"]) #insights .insight-content p,
:root:not([data-theme="light"]) #insights .insight-content small,
:root:not([data-theme="light"]) #insights .insight-text {
  color: var(--theme-text) !important;
}
:root:not([data-theme="light"]) #insights .insight-content small,
:root:not([data-theme="light"]) #insights .eyebrow {
  color: var(--theme-muted) !important;
}

/* Allgemeine Resttexte, die zuvor feste dunkle Farben geerbt haben. */
:root:not([data-theme="light"]) main h1,
:root:not([data-theme="light"]) main h2,
:root:not([data-theme="light"]) main h3,
:root:not([data-theme="light"]) main h4,
:root:not([data-theme="light"]) main label,
:root:not([data-theme="light"]) main .merchant-profile-main,
:root:not([data-theme="light"]) main .spending-group,
:root:not([data-theme="light"]) main .recurring-group-head,
:root:not([data-theme="light"]) main .recurring-group-head strong {
  color: var(--theme-text) !important;
}

/* Sticky-Zielpositionen: Menüpunkte landen sichtbar unter der oberen Leiste. */
.app-section { scroll-margin-top: 110px; }
#insights { scroll-margin-top: 110px; }

/* V0.9.0 – Smaragd-Kontrast, Import-Testdaten und räumliche Tiefe */
:root {
  --theme-highlight: rgba(255,255,255,.72);
  --theme-shadow-deep: rgba(15,37,55,.16);
  --theme-shadow-soft: rgba(15,37,55,.07);
}
:root[data-theme="dark"] {
  --theme-highlight: rgba(255,255,255,.075);
  --theme-shadow-deep: rgba(0,0,0,.58);
  --theme-shadow-soft: rgba(0,0,0,.28);
}
:root[data-theme="navy"] {
  --theme-highlight: rgba(107,202,255,.12);
  --theme-shadow-deep: rgba(0,0,0,.62);
  --theme-shadow-soft: rgba(0,0,0,.30);
}
:root[data-theme="emerald"] {
  --theme-highlight: rgba(170,255,220,.13);
  --theme-shadow-deep: rgba(0,0,0,.58);
  --theme-shadow-soft: rgba(0,0,0,.28);
}
:root[data-theme="ruby"] {
  --theme-highlight: rgba(255,183,199,.12);
  --theme-shadow-deep: rgba(0,0,0,.60);
  --theme-shadow-soft: rgba(0,0,0,.30);
}

/* Mehr Tiefe, aber ohne die ruhige Oberfläche zu überladen. */
.card,
.modal-card,
.metric,
.comparison-item,
.account-item,
.recurring-item,
.spending-group,
.merchant-profile,
.goal-card,
.savings-goal-item,
.backup-panel,
.appearance-card,
.about-panel,
.theme-option {
  box-shadow:
    0 1px 0 var(--theme-highlight) inset,
    0 10px 24px var(--theme-shadow-soft),
    0 24px 52px -32px var(--theme-shadow-deep) !important;
}

.card,
.metric,
.comparison-item,
.account-item,
.recurring-item,
.spending-group,
.merchant-profile,
.goal-card,
.savings-goal-item,
.backup-panel,
.theme-option {
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .2s ease;
}

@media (hover:hover) {
  .metric:hover,
  .comparison-item:hover,
  .account-item:hover,
  .recurring-item:hover,
  .spending-group:hover,
  .merchant-profile:hover,
  .savings-goal-item:hover,
  .backup-panel:hover,
  .theme-option:hover {
    transform: translateY(-2px);
    box-shadow:
      0 1px 0 var(--theme-highlight) inset,
      0 14px 30px var(--theme-shadow-soft),
      0 30px 60px -30px var(--theme-shadow-deep) !important;
  }
}

.button,
.row-action,
.icon-button {
  box-shadow: 0 1px 0 rgba(255,255,255,.28) inset, 0 7px 16px var(--theme-shadow-soft);
}
.button:active,
.row-action:active,
.icon-button:active { transform: translateY(1px); box-shadow: 0 1px 0 rgba(255,255,255,.16) inset, 0 3px 8px var(--theme-shadow-soft); }

/* Smaragd: Erfolgsflächen nicht Grün auf Grün. */
:root[data-theme="emerald"] .goal-coach.good,
:root[data-theme="emerald"] .coach-answer.good,
:root[data-theme="emerald"] .status.good,
:root[data-theme="emerald"] .backup-status.ok {
  background: #d9fff0 !important;
  color: #083d2d !important;
  border-color: #73dfb5 !important;
}
:root[data-theme="emerald"] .goal-coach.good *,
:root[data-theme="emerald"] .coach-answer.good *,
:root[data-theme="emerald"] .status.good *,
:root[data-theme="emerald"] .backup-status.ok * { color: inherit !important; }
:root[data-theme="emerald"] .forecast-warning,
:root[data-theme="emerald"] .coach-answer.warn {
  background: #4b4723 !important;
  color: #fff1a8 !important;
  border-color: #8c8241 !important;
}

/* Sidebar-Abschluss mit Copyright. */
.sidebar-foot { display:grid; gap:.85rem; }
.sidebar-motto { margin:0; }
.sidebar-copyright {
  display:grid;
  gap:.16rem;
  padding:.75rem .78rem;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(255,255,255,.045);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset, 0 12px 28px rgba(0,0,0,.16);
}
.sidebar-copyright strong { color:#fff; font-size:.72rem; line-height:1.25; }
.sidebar-copyright span { color:rgba(255,255,255,.82); font-size:.69rem; }
.sidebar-copyright small { color:rgba(255,255,255,.55); font-size:.61rem; }

/* Professionelle Info-Seite. */
.about-card { scroll-margin-top:110px; }
.about-version {
  padding:.42rem .68rem;
  border-radius:999px;
  background:var(--theme-accent-soft);
  color:var(--theme-text);
  font-weight:800;
  font-size:.78rem;
}
.about-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:1rem; }
.about-panel {
  padding:1.05rem;
  border:1px solid var(--theme-line);
  border-radius:16px;
  background:linear-gradient(145deg, var(--theme-surface-soft), var(--theme-surface));
  color:var(--theme-text);
}
.about-brand-panel { display:flex; align-items:center; gap:1rem; }
.about-anchor {
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:17px;
  background:linear-gradient(145deg, color-mix(in srgb, var(--theme-accent) 28%, var(--theme-surface)), var(--theme-surface-strong));
  border:1px solid color-mix(in srgb, var(--theme-accent) 55%, var(--theme-line));
  box-shadow:0 1px 0 var(--theme-highlight) inset, 0 10px 25px var(--theme-shadow-soft);
  font-size:1.65rem;
}
.about-panel h4 { margin:0 0 .35rem; }
.about-panel p { margin:0; color:var(--theme-muted); }
.about-license-panel { display:grid; align-content:center; gap:.25rem; }
.about-license-panel p { color:var(--theme-text); font-weight:800; }
.about-license-panel strong { font-size:1rem; }
.about-license-panel span { font-weight:700; color:var(--theme-accent); }
.about-license-panel small { margin-top:.45rem; color:var(--theme-muted); line-height:1.45; }
.about-meta {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.75rem;
  margin-top:.9rem;
}
.about-meta > div {
  display:grid;
  gap:.22rem;
  padding:.82rem .9rem;
  border:1px solid var(--theme-line);
  border-radius:13px;
  background:var(--theme-surface-soft);
  box-shadow:0 1px 0 var(--theme-highlight) inset;
}
.about-meta span { color:var(--theme-muted); font-size:.75rem; }
.about-meta strong { color:var(--theme-text); font-size:.86rem; }
.about-testdata {
  margin-top:.9rem;
  padding-top:.9rem;
  border-top:1px solid var(--theme-line);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
}
.about-testdata h4,.about-testdata p { margin:0; }
.about-testdata p { color:var(--theme-muted); margin-top:.2rem; }

@media (max-width:900px) {
  .about-grid,.about-meta { grid-template-columns:1fr; }
  .about-testdata { align-items:flex-start; flex-direction:column; }
}


/* V0.9.0 – finale Kontrast- und Tiefenregeln */
.sidebar-foot { gap: 0; }
.sidebar-motto { display: none !important; }

.import-card { flex-wrap: wrap; }
.import-testdata {
  grid-column: 1 / -1;
  flex: 1 0 100%;
  width: 100%;
  margin-top: .9rem;
  padding-top: .85rem;
  border-top: 1px solid var(--theme-line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--theme-text);
}
.import-testdata > div:first-child { display: grid; gap: .16rem; }
.import-testdata strong { color: var(--theme-text); }
.import-testdata span { color: var(--theme-muted); font-size: .82rem; }
.import-testdata .sample-links { display: flex; flex-wrap: wrap; gap: .9rem; }
.import-testdata a {
  color: var(--theme-accent);
  font-weight: 800;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
@media (max-width: 760px) {
  .import-testdata { align-items: flex-start; flex-direction: column; }
}

/* Smaragd: Erfolgsflächen mit klarer, heller Mint-Fläche statt Grün auf Grün. */
:root[data-theme="emerald"] .savings-goal-coach.good,
:root[data-theme="emerald"] .goal-coach.good,
:root[data-theme="emerald"] .coach-answer.good,
:root[data-theme="emerald"] .forecast-status.good,
:root[data-theme="emerald"] .status.good,
:root[data-theme="emerald"] .backup-status.ok {
  background: linear-gradient(145deg, #eafff6, #c9f7e4) !important;
  color: #063c2c !important;
  border: 1px solid #72d8b1 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 8px 20px rgba(0,55,38,.18) !important;
}
:root[data-theme="emerald"] .savings-goal-coach.good *,
:root[data-theme="emerald"] .goal-coach.good *,
:root[data-theme="emerald"] .coach-answer.good *,
:root[data-theme="emerald"] .forecast-status.good *,
:root[data-theme="emerald"] .status.good *,
:root[data-theme="emerald"] .backup-status.ok * {
  color: #063c2c !important;
}

/* Mehr räumliche Tiefe in allen Modi, ohne das Layout zu verändern. */
.card,
.savings-goal-item,
.spending-group,
.recurring-item,
.account-item,
.merchant-profile,
.backup-panel,
.about-panel,
.theme-option,
.import-testdata {
  box-shadow:
    0 1px 0 var(--theme-highlight) inset,
    0 10px 24px var(--theme-shadow-soft),
    0 28px 54px -34px var(--theme-shadow-deep);
}
.metric,
.comparison-item,
.forecast-values > div,
.savings-goal-summary > div,
.group-merchant {
  box-shadow:
    0 1px 0 var(--theme-highlight) inset,
    0 7px 16px var(--theme-shadow-soft);
}
input,
select,
textarea {
  box-shadow: 0 1px 0 var(--theme-highlight) inset, 0 5px 12px var(--theme-shadow-soft);
}

/* Profile/Login V0.9.1.2 */
body.auth-locked .topbar, body.auth-locked .app-shell, body.auth-locked .bottom-nav { display:none !important; }
.profile-gate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top,#17354d 0,#0b1722 55%,#071019 100%)}
.profile-gate.hidden{display:none}.profile-card{width:min(460px,100%);background:var(--card,#fff);color:var(--text,#102233);border:1px solid var(--border,#d7e1e8);border-radius:24px;padding:30px;box-shadow:0 28px 80px rgba(0,0,0,.38)}
.profile-logo{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;font-size:32px;background:var(--accent-soft,#dff7f4);margin-bottom:14px}.profile-list{display:grid;gap:10px;margin:20px 0}.profile-entry{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:14px;border:1px solid var(--border,#d7e1e8);background:var(--card-alt,#f5f8fa);color:inherit;font-weight:800;cursor:pointer}.profile-entry small{font-weight:500;color:var(--text-muted,#6f8090)}
.profile-form{display:grid;gap:10px;margin-top:18px}.profile-add{width:100%;margin-top:8px}.profile-security-note{font-size:12px;color:var(--text-muted,#6f8090);margin:16px 0 0}.profile-switch{width:100%;margin-bottom:8px}.active-profile-name{display:block;text-align:center;color:var(--text-muted,#8da0af);margin-bottom:10px}

.profile-form-error {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--danger, #c43d4f);
  border-radius: 10px;
  background: color-mix(in srgb, var(--danger, #c43d4f) 14%, transparent);
  color: var(--danger-text, #ffb7c0);
  font-weight: 700;
  line-height: 1.35;
}
/* MAFICO Branding V0.9.2 */
.brand-mark img,.profile-logo img,.dashboard-intro-mark img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.brand-mark{overflow:hidden;padding:0;background:#071d33}
.profile-logo{overflow:hidden;padding:0;background:#071d33}
.dashboard-intro-mark{overflow:hidden;padding:0;background:#071d33}


/* MAFICO V0.9.3 – eigenes Dialogsystem */
.app-dialog { z-index: 100; backdrop-filter: blur(8px); }
.app-dialog-card { width: min(440px, 100%); text-align: left; border: 1px solid var(--theme-line, var(--line)); box-shadow: 0 28px 90px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08); }
.app-dialog-icon { width: 42px; height: 42px; display:grid; place-items:center; border-radius:14px; margin-bottom:.8rem; font-weight:900; color:#fff; background:linear-gradient(145deg, var(--accent, #1b94db), #28c77b); box-shadow:0 10px 24px rgba(0,0,0,.22); }
.app-dialog-card h3 { margin-bottom:.45rem; }
.app-dialog-message { white-space: pre-line; line-height:1.55; color:var(--theme-muted, var(--muted-ink)); margin:0; }
.app-dialog-input-wrap { margin-top:1rem; }
.app-dialog-input-wrap input { width:100%; }
.danger-button { background:linear-gradient(145deg,#d94a55,#a8182a)!important; border-color:#e46b74!important; color:#fff!important; }
.danger-button:hover { filter:brightness(1.08); }


/* MAFICO V0.9.7 – mobile Feldtests, Buchungssuche und PWA-Installation */
.transaction-toolbar {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap: .75rem;
  align-items: center;
  margin: .9rem 0;
}
.install-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--theme-line);
  border-radius: 15px;
  background: var(--theme-surface-soft);
  box-shadow: 0 1px 0 var(--theme-highlight) inset, 0 8px 20px var(--theme-shadow-soft);
}
.install-panel > div { display:grid; gap:.2rem; }
.install-panel span { color:var(--theme-muted); font-size:.84rem; }
.install-panel .button:disabled { opacity:.68; cursor:not-allowed; }

@media (max-width: 760px) {
  .dashboard-intro { padding-inline:.35rem; }
  .dashboard-intro-mark { width:54px; height:54px; }
  .toolbar.card { gap:.75rem; }
  .transaction-toolbar { grid-template-columns:1fr auto; }
  .transaction-toolbar .recognition-badge { grid-column:1 / -1; justify-self:start; }
  .install-panel { align-items:stretch; flex-direction:column; }
  .install-panel .button { width:100%; }
  #transactions .section-head { flex-direction:column; }
  #transactions .section-head .button { width:100%; }
  #transactions .table-wrap { overflow:visible; }
  #transactions table { min-width:0; display:block; }
  #transactions thead { display:none; }
  #transactions tbody { display:grid; gap:.75rem; }
  #transactions tr { display:grid; gap:.45rem; padding:.85rem; border:1px solid var(--theme-line); border-radius:14px; background:var(--theme-surface-soft); box-shadow:0 1px 0 var(--theme-highlight) inset, 0 8px 18px var(--theme-shadow-soft); }
  #transactions td { display:grid; grid-template-columns:minmax(92px,.42fr) minmax(0,1fr); gap:.7rem; align-items:start; padding:.18rem 0; border:0; text-align:left; min-width:0; }
  #transactions td::before { content:attr(data-label); color:var(--theme-muted); font-size:.73rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
  #transactions td.right { text-align:left; }
  #transactions td .button { width:100%; }
  #transactions .details-cell { max-width:none; overflow-wrap:anywhere; }
}
@media (max-width: 520px) {
  .content-area { width:calc(100% - .7rem); }
  .card { padding:.85rem; }
  .topbar { gap:.45rem; }
  .topbar .button { white-space:nowrap; }
  .mobile-brand small { display:none; }
  .metric-grid { grid-template-columns:1fr; }
  .transaction-toolbar { grid-template-columns:1fr; }
  .transaction-toolbar .button, .transaction-toolbar .recognition-badge { width:100%; }
  #transactions td { grid-template-columns:1fr; gap:.15rem; }
  .bottom-nav { left:.35rem; right:.35rem; }
}

.profile-settings-card{max-width:620px}.profile-settings-section{display:grid;gap:10px;padding:16px 0;border-bottom:1px solid var(--border)}.profile-settings-section:last-of-type{border-bottom:0}.profile-settings-section h4{margin:0}.danger-zone{margin-top:8px;padding:16px;border:1px solid color-mix(in srgb,var(--danger) 55%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--danger) 8%,var(--card))}.button-danger{background:var(--danger);color:#fff;border-color:transparent}.button-danger:hover{filter:brightness(1.06)}

/* MAFICO V1.0 RC3 – Branding, Unterstützung und Kontakt */
.sidebar-brand {
  align-items: center;
  gap: .9rem;
  padding: .55rem .6rem 1.65rem;
}
.sidebar-brand .brand-mark {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
}
.sidebar-brand h1 { font-size: 1.5rem; letter-spacing: .01em; }
.sidebar-brand .version { display:block; margin-top:.18rem; font-size:.62rem; color:rgba(255,255,255,.48); font-weight:700; }
.sidebar-brand p { color: var(--theme-accent-soft, #79e4be); font-size:.8rem; font-weight:700; }
.dashboard-intro { align-items:flex-start; }
.dashboard-intro-mark { display:none !important; }
.dashboard-greeting {
  margin: 0 0 .28rem;
  color: var(--accent, #43c6b7);
  font-weight: 800;
  font-size: 1rem;
}
.about-logo { overflow:hidden; padding:0; background:#071d33; }
.about-logo img { width:100%; height:100%; display:block; }
.about-anchor.about-logo { width:58px; height:58px; border-radius:16px; flex:0 0 auto; }


/* MAFICO unterstützen */
.support-card { scroll-margin-top: 100px; }
.support-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  background: var(--card-alt);
  color: var(--text-muted);
  border-radius: 999px;
  padding: 7px 11px;
  font-size: .78rem;
  font-weight: 800;
}
.support-layout {
  display: grid;
  grid-template-columns: minmax(240px, .8fr) minmax(460px, 1.6fr);
  gap: 18px;
  align-items: stretch;
}
.support-copy {
  border: 1px solid var(--border);
  background: var(--card-alt);
  border-radius: 16px;
  padding: 18px;
}
.support-copy h4 { margin: 0 0 9px; }
.support-copy p { margin: 0; color: var(--text-muted); line-height: 1.55; }
.support-copy .support-note { margin-top: 13px; color: var(--text); font-weight: 700; }
.support-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 12px;
}
.support-option {
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 7px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--card-alt);
  color: var(--text);
  text-decoration: none;
  box-shadow: var(--shadow-soft, 0 8px 20px rgba(0,0,0,.12));
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.support-option:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow: var(--shadow, 0 12px 28px rgba(0,0,0,.18));
}
.support-option > span { font-size: 1.45rem; }
.support-option strong { font-size: 1.05rem; }
.support-option small { color: var(--text-muted); }
.support-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}
@media (max-width: 980px) {
  .support-layout { grid-template-columns: 1fr; }
  .support-options { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}
@media (max-width: 560px) {
  .support-options { grid-template-columns: 1fr; }
  .support-option { min-height: 92px; }
  .support-actions { flex-direction: column; }
  .support-actions .button { width: 100%; }
}


/* MAFICO V1.0 RC3 – Danksagung und kompakter Kontaktbereich */
.support-footer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.support-thanks,
.support-contact {
  border: 1px solid var(--border);
  background: var(--card-alt);
  border-radius: 16px;
  padding: 18px;
  box-shadow: var(--shadow-soft, 0 8px 20px rgba(0,0,0,.12));
}
.support-thanks h4,
.support-contact h4 { margin: 0 0 8px; }
.support-thanks p,
.support-contact p { margin: 0 0 8px; color: var(--text-muted); line-height: 1.5; }
.support-thanks strong { display: inline-block; margin-top: 4px; color: var(--text); }
.support-email {
  display: inline-block;
  margin: 1px 0 12px;
  color: var(--accent);
  font-weight: 800;
  text-decoration: none;
}
.support-email:hover { text-decoration: underline; }
.contact-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.contact-actions .button { text-decoration: none; }
.support-contact small { display: block; margin-top: 12px; color: var(--text-muted); }
@media (max-width: 760px) {
  .support-footer-grid { grid-template-columns: 1fr; }
  .contact-actions { flex-direction: column; }
  .contact-actions .button { width: 100%; }
}


/* MAFICO V1.0 RC4 – Rechtliches */
.legal-panel { margin-top:1rem; padding:1.15rem; border:1px solid var(--theme-line, var(--line)); border-radius:18px; background:var(--theme-card-alt, var(--surface-soft)); box-shadow:var(--theme-shadow, var(--shadow-soft)); }
.legal-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.legal-panel-head h4 { margin:.2rem 0 0; }
.legal-panel-head > span { color:var(--theme-muted, var(--muted-ink)); font-size:.8rem; white-space:nowrap; }
.legal-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.legal-grid article { padding:.9rem; border:1px solid var(--theme-line, var(--line)); border-radius:14px; background:var(--theme-card, var(--card)); }
.legal-grid article strong { display:block; margin-bottom:.35rem; color:var(--theme-text, var(--ink)); }
.legal-grid article p { margin:0; color:var(--theme-muted, var(--muted-ink)); line-height:1.55; font-size:.9rem; }
.legal-contact { margin:1rem 0 0; color:var(--theme-muted, var(--muted-ink)); }
.legal-contact a { color:var(--accent); font-weight:800; }
.legal-consent-modal { z-index:140; backdrop-filter:blur(10px); }
.legal-consent-card { width:min(680px,100%); max-height:min(90vh,760px); overflow:auto; border:1px solid var(--theme-line, var(--line)); box-shadow:0 30px 100px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.08); }
.legal-consent-brand { display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.legal-consent-brand img { width:46px; height:46px; border-radius:14px; }
.legal-consent-brand div { display:flex; flex-direction:column; }
.legal-consent-brand strong { font-size:1.05rem; }
.legal-consent-brand small, .legal-consent-card > small { color:var(--theme-muted, var(--muted-ink)); }
.legal-consent-list { margin:1rem 0; padding-left:1.25rem; display:grid; gap:.55rem; color:var(--theme-muted, var(--muted-ink)); line-height:1.5; }
.legal-consent-check { display:flex; align-items:flex-start; gap:.7rem; padding:.9rem; border:1px solid var(--theme-line, var(--line)); border-radius:14px; background:var(--theme-card-alt, var(--surface-soft)); cursor:pointer; font-weight:700; color:var(--theme-text, var(--ink)); }
.legal-consent-check input { width:18px; height:18px; margin-top:.1rem; accent-color:var(--accent); flex:0 0 auto; }
.legal-consent-card .button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
@media (max-width:700px) { .legal-grid { grid-template-columns:1fr; } .legal-panel-head { flex-direction:column; } .legal-consent-card { max-height:94vh; } }