:root {
  --ed-bg: #061a3a;
  --ed-bg-deep: #03112a;
  --ed-surface: #142b53;
  --ed-surface-soft: #1a3867;
  --ed-border: rgba(175, 202, 241, 0.18);
  --ed-text: #f7f9ff;
  --ed-muted: #aab9d6;
  --ed-mint: #55e5a5;
  --ed-blue: #2f6eea;
  --ed-violet: #7446d8;
  --ed-pink: #e73e8c;
  --ed-coral: #ff727c;
  --ed-radius-lg: 24px;
  --ed-radius-md: 18px;
  --ed-shadow: 0 22px 48px rgba(0, 7, 24, 0.28);
}

* { box-sizing: border-box; }

html { min-height: 100%; background: var(--ed-bg-deep); }

body.app-authenticated {
  min-height: 100vh;
  margin: 0;
  color: var(--ed-text);
  background:
    radial-gradient(circle at 80% 8%, rgba(31, 93, 184, 0.36), transparent 31rem),
    radial-gradient(circle at 18% 30%, rgba(29, 77, 151, 0.22), transparent 28rem),
    var(--ed-bg-deep);
  font-family: Inter, ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.app-surface {
  position: relative;
  width: min(100%, 480px);
  min-height: 100vh;
  margin-inline: auto;
  overflow-x: hidden;
  color: var(--ed-text);
  background:
    linear-gradient(180deg, rgba(8, 35, 76, 0.98), rgba(3, 20, 48, 0.99)),
    var(--ed-bg);
  box-shadow: 0 0 70px rgba(0, 0, 0, 0.42);
}

.app-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 1020;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 86px;
  padding: calc(18px + env(safe-area-inset-top)) 20px 14px;
  background: linear-gradient(180deg, rgba(5, 24, 56, 0.98) 70%, rgba(5, 24, 56, 0));
}

.app-brand-mark {
  position: absolute;
  left: 50%;
  z-index: 2;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  transform: translateX(-50%);
  border: 1px solid rgba(85, 229, 165, .55);
  border-radius: 50%;
  color: #06264b;
  background: linear-gradient(145deg, #7af0ba, #42d99a);
  box-shadow: 0 10px 24px rgba(85, 229, 165, .2), inset 0 1px 0 rgba(255,255,255,.45);
  text-decoration: none;
}

.app-brand-mark span {
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: -.06em;
  text-transform: lowercase;
}


.app-profile-link,
.app-icon-button {
  color: var(--ed-text);
  text-decoration: none;
  border: 1px solid var(--ed-border);
  background: rgba(27, 55, 99, 0.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(14px);
}

.app-profile-link {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 10px;
  max-width: 128px;
  padding: 7px 13px 7px 7px;
  border-radius: 20px;
}

.app-profile-avatar {
  display: grid;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 2px solid var(--ed-mint);
  border-radius: 50%;
  color: var(--ed-text);
  font-size: .95rem;
  font-weight: 750;
  letter-spacing: .02em;
}

.app-profile-name {
  overflow: hidden;
  font-size: .95rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-header-actions { display: flex; gap: 10px; }

.app-icon-button {
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 16px;
}

.app-icon-button svg,
.app-bottom-icon svg,
.quick-action-icon svg,
.transaction-icon svg { width: 24px; height: 24px; }

.app-notification-dot {
  position: absolute;
  inset-block-start: 8px;
  inset-inline-end: 8px;
  width: 8px;
  height: 8px;
  border: 2px solid var(--ed-surface);
  border-radius: 50%;
  background: var(--ed-mint);
}

.app-main {
  width: 100%;
  padding: 4px 20px calc(104px + env(safe-area-inset-bottom));
}

.home-dashboard { display: grid; gap: 20px; }

.balance-card,
.transactions-panel,
.placeholder-panel {
  overflow: hidden;
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius-lg);
  background:
    radial-gradient(circle at 100% 0, rgba(45, 92, 164, .34), transparent 50%),
    linear-gradient(145deg, rgba(28, 58, 105, .97), rgba(13, 39, 78, .97));
  box-shadow: var(--ed-shadow);
}

.balance-main { min-height: 170px; padding: 26px 26px 22px; }
.balance-label { color: var(--ed-muted); font-size: 1rem; font-weight: 550; }
.balance-value {
  margin-block-start: 14px;
  display: flex;
  max-width: 100%;
  align-items: baseline;
  font-size: clamp(1.8rem, 9vw, 3.35rem);
  font-weight: 760;
  letter-spacing: -.045em;
  line-height: 1;
  white-space: nowrap;
}
.balance-value.is-unavailable { color: var(--ed-muted); }
.balance-value-fraction {
  margin-inline-start: .035em;
  font-size: .52em;
  letter-spacing: -.02em;
}

.balance-value-suffix {
  margin-inline-start: .16em;
  font-size: .46em;
  letter-spacing: 0;
}
.balance-breakdown {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  gap: 18px;
  padding: 22px 26px 24px;
  border-block-start: 1px solid var(--ed-border);
  background: rgba(76, 109, 160, .18);
}
.balance-divider { background: rgba(202, 216, 239, .3); }
.balance-stat-label { color: var(--ed-muted); font-size: .82rem; line-height: 1.2; }
.balance-stat-value { margin-block-start: 8px; font-size: 1.25rem; font-weight: 680; white-space: nowrap; }

.quick-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.quick-action {
  display: flex;
  min-width: 0;
  min-height: 132px;
  padding: 18px 8px 16px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 15px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 20px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 16px 28px rgba(0, 6, 22, .2), inset 0 1px 0 rgba(255,255,255,.12);
  transition: transform .16s ease, filter .16s ease;
}
.quick-action:hover,
.quick-action:focus-visible { color: #fff; filter: brightness(1.08); transform: translateY(-2px); }
.quick-action-expense { background: linear-gradient(145deg, #3477ef, #2455c6); }
.quick-action-tracking { background: linear-gradient(145deg, #8a58e9, #6032bd); }
.quick-action-income { background: linear-gradient(145deg, #ef4a98, #c72872); }
.quick-action-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; background: rgba(255,255,255,.08); }
.quick-action-label { font-size: .88rem; font-weight: 650; line-height: 1.15; }

.transactions-panel { padding: 22px 20px 8px; }
.transactions-heading { display: flex; align-items: center; justify-content: space-between; margin-block-end: 12px; }
.transactions-title { margin: 0; font-size: 1.25rem; font-weight: 690; letter-spacing: -.02em; }
.transactions-link { color: #5f8cff; font-size: .82rem; font-weight: 650; text-decoration: none; }

.transaction-row {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  min-height: 82px;
  border-block-end: 1px solid rgba(173, 199, 238, .12);
}
.transaction-row:last-child { border-block-end: 0; }
.transaction-icon { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid var(--ed-border); border-radius: 15px; background: rgba(255,255,255,.035); color: var(--ed-coral); }
.transaction-row.is-income .transaction-icon,
.transaction-row.is-income .transaction-amount { color: var(--ed-mint); }
.transaction-copy { min-width: 0; }
.transaction-name { overflow: hidden; font-size: .96rem; font-weight: 660; text-overflow: ellipsis; white-space: nowrap; }
.transaction-tag {
  display: inline-flex;
  max-width: 100%;
  margin-block-start: 5px;
  padding: 2px 9px;
  overflow: hidden;
  border: 1px solid rgba(198, 215, 243, .14);
  border-radius: 999px;
  color: var(--ed-muted);
  background: rgba(180, 204, 240, .12);
  font-size: .72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.transaction-amount { color: var(--ed-coral); font-size: .92rem; font-weight: 720; font-variant-numeric: tabular-nums; white-space: nowrap; }
.empty-transactions { padding: 38px 10px; color: var(--ed-muted); text-align: center; }

.data-warning {
  padding: 10px 14px;
  border: 1px solid rgba(255, 183, 77, .32);
  border-radius: 14px;
  color: #ffdda7;
  background: rgba(138, 84, 14, .18);
  font-size: .78rem;
}

.app-bottom-nav {
  position: fixed;
  inset-inline-start: 50%;
  inset-block-end: 0;
  z-index: 1030;
  width: min(100%, 480px);
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border-block-start: 1px solid var(--ed-border);
  border-radius: 24px 24px 0 0;
  background: rgba(16, 38, 76, .96);
  box-shadow: 0 -18px 42px rgba(0, 8, 27, .32);
  backdrop-filter: blur(18px);
}
.app-bottom-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 0; padding: 0; list-style: none; }
.app-bottom-link {
  display: flex;
  min-width: 0;
  min-height: 64px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 16px;
  color: var(--ed-muted);
  font-size: .66rem;
  font-weight: 620;
  text-decoration: none;
}
.app-bottom-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; }
.app-bottom-link.is-active { color: var(--ed-mint); }
.app-bottom-link.is-active .app-bottom-icon { color: #06264b; background: var(--ed-mint); box-shadow: 0 8px 20px rgba(85, 229, 165, .25); }

.placeholder-panel { min-height: 58vh; padding: 48px 24px; text-align: center; }
.placeholder-panel h1 { font-size: 1.5rem; }
.placeholder-panel p { color: var(--ed-muted); }

.app-authenticated .card { color: #172033; }
.app-authenticated .text-muted { color: #70809c !important; }
.app-authenticated .table-responsive { border-radius: 12px; }


/* Shared secondary navigation and form system */
.app-form-page {
  display: grid;
  gap: 18px;
}

.page-action-nav {
  position: sticky;
  inset-block-start: calc(82px + env(safe-area-inset-top));
  z-index: 1010;
  display: grid;
  direction: ltr;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  padding: 8px;
  border: 1px solid var(--ed-border);
  border-radius: 18px;
  background: rgba(12, 35, 72, .94);
  box-shadow: 0 14px 32px rgba(0, 8, 27, .25);
  backdrop-filter: blur(18px);
}

.page-nav-back,
.page-nav-link {
  display: grid;
  min-height: 42px;
  place-items: center;
  border: 1px solid var(--ed-border);
  border-radius: 13px;
  color: var(--ed-muted);
  background: rgba(255, 255, 255, .035);
  font-size: .78rem;
  font-weight: 680;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}

.page-nav-back:hover,
.page-nav-back:focus-visible,
.page-nav-link:hover,
.page-nav-link:focus-visible {
  color: var(--ed-text);
  border-color: rgba(85, 229, 165, .55);
  transform: translateY(-1px);
}

.page-nav-back svg { width: 22px; height: 22px; }
.page-action-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.page-nav-link.is-expense.is-active { color: #fff; border-color: rgba(107, 157, 255, .65); background: linear-gradient(145deg, #3477ef, #2455c6); }
.page-nav-link.is-income.is-active { color: #fff; border-color: rgba(255, 117, 181, .6); background: linear-gradient(145deg, #ef4a98, #c72872); }

.page-heading h1 {
  margin: 0;
  font-size: clamp(1.45rem, 6vw, 1.8rem);
  font-weight: 740;
  letter-spacing: -.035em;
}

.app-form-card {
  overflow: hidden;
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius-lg);
  color: var(--ed-text);
  background:
    radial-gradient(circle at 100% 0, rgba(45, 92, 164, .28), transparent 48%),
    linear-gradient(145deg, rgba(25, 55, 101, .98), rgba(11, 35, 72, .98));
  box-shadow: var(--ed-shadow);
}

.app-entry-form { padding: 20px; }
.app-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 12px; }
.app-form-field { min-width: 0; }
.app-form-span-2 { grid-column: 1 / -1; }
.app-form-field > label {
  display: inline-block;
  margin-block-end: 7px;
  color: #dbe7fb;
  font-size: .78rem;
  font-weight: 650;
  letter-spacing: .01em;
}

.app-form-page .app-control {
  min-height: 49px;
  border: 1px solid rgba(177, 204, 241, .22);
  border-radius: 13px;
  color: var(--ed-text);
  background-color: rgba(5, 25, 58, .72);
  font-size: .92rem;
  font-weight: 560;
  color-scheme: dark;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}

.app-form-page textarea.app-control { min-height: 104px; resize: vertical; }
.app-form-page .app-control:focus {
  color: var(--ed-text);
  border-color: var(--ed-mint);
  background-color: rgba(5, 25, 58, .9);
  box-shadow: 0 0 0 3px rgba(85, 229, 165, .14);
}
.app-form-page .app-control option { color: #10203c; background: #fff; }

.app-tag-control {
  display: flex;
  min-height: 54px;
  padding: 8px 10px;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(177, 204, 241, .22);
  border-radius: 13px;
  background: rgba(5, 25, 58, .72);
  cursor: text;
}
.app-tag-control:focus-within { border-color: var(--ed-mint); box-shadow: 0 0 0 3px rgba(85, 229, 165, .14); }
.app-tag-control input {
  min-width: 140px;
  min-height: 34px;
  flex: 1 1 140px;
  border: 0;
  outline: 0;
  color: var(--ed-text);
  background: transparent;
  font: inherit;
  font-size: .88rem;
}
.app-tag-control input::placeholder { color: #7f92b4; }
.app-tag {
  display: inline-flex;
  min-height: 32px;
  padding: 5px 5px 5px 10px;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(85, 229, 165, .32);
  border-radius: 999px;
  color: #baf8dc;
  background: rgba(85, 229, 165, .1);
  font-size: .75rem;
  font-weight: 650;
}
.app-tag-remove {
  display: grid;
  width: 22px;
  height: 22px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: inherit;
  background: rgba(255, 255, 255, .08);
  line-height: 1;
}
.app-field-help { margin: 7px 0 0; color: var(--ed-muted); font-size: .72rem; line-height: 1.45; }
.app-field-error { margin-block-start: 6px; color: #ff9fa8; font-size: .75rem; }

.app-form-actions { display: flex; margin-block-start: 22px; flex-wrap: wrap; gap: 9px; }
.app-button {
  display: inline-flex;
  min-height: 46px;
  padding: 10px 15px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 13px;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: filter .16s ease, transform .16s ease, border-color .16s ease;
}
.app-button svg { width: 19px; height: 19px; flex: 0 0 19px; }
.app-button:hover,
.app-button:focus-visible { filter: brightness(1.1); transform: translateY(-1px); }
.app-button-primary { color: #fff; background: linear-gradient(145deg, #3477ef, #2455c6); box-shadow: 0 10px 20px rgba(39, 94, 207, .2); }
.app-button-secondary { color: #082648; border-color: rgba(85, 229, 165, .55); background: linear-gradient(145deg, #74edb6, #45d99c); }
.app-button-quiet { color: #c8d6ed; border-color: var(--ed-border); background: rgba(255, 255, 255, .045); }

.receipt-tools {
  margin: -2px -2px 20px;
  padding: 2px 2px 20px;
  border-block-end: 1px solid rgba(175, 202, 241, .14);
}
.receipt-tools-copy h2 { margin: 0; font-size: 1rem; font-weight: 710; }
.receipt-tools-copy p { margin: 7px 0 0; color: var(--ed-muted); font-size: .78rem; line-height: 1.5; }
.receipt-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-block-start: 14px; }
.receipt-preview { margin-block-start: 14px; overflow: hidden; border: 1px solid var(--ed-border); border-radius: 15px; background: rgba(3, 17, 42, .55); }
.receipt-preview img { display: block; width: 100%; max-height: 260px; object-fit: contain; }
.receipt-loading,
.receipt-error { margin-block-start: 14px; padding: 12px 14px; border-radius: 13px; font-size: .78rem; }
.receipt-loading { display: flex; align-items: center; gap: 9px; color: #baf8dc; background: rgba(85, 229, 165, .08); }
.receipt-error { color: #ffc0c5; border: 1px solid rgba(255, 114, 124, .3); background: rgba(255, 114, 124, .09); }
.receipt-result { margin-block-start: 14px; padding: 15px; border: 1px solid rgba(85, 229, 165, .25); border-radius: 16px; background: rgba(85, 229, 165, .07); }
.receipt-result-heading { display: grid; gap: 3px; margin-block-end: 12px; }
.receipt-result-heading strong { color: #baf8dc; font-size: .9rem; }
.receipt-result-heading span { color: var(--ed-muted); font-size: .72rem; }
.receipt-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.receipt-result-grid div { min-width: 0; }
.receipt-result-grid dt { color: var(--ed-muted); font-size: .66rem; font-weight: 600; }
.receipt-result-grid dd { margin: 3px 0 0; overflow-wrap: anywhere; font-size: .82rem; font-weight: 650; }
.receipt-result-wide { grid-column: 1 / -1; }

[hidden] { display: none !important; }

@media (max-width: 360px) {
  .app-main { padding-inline: 14px; }
  .app-header { padding-inline: 14px; }
  .app-profile-name { max-width: 62px; }
  .app-profile-link { max-width: 118px; }
  .quick-action { min-height: 120px; }
  .balance-main, .balance-breakdown { padding-inline: 20px; }
  .transaction-row { grid-template-columns: 42px minmax(0, 1fr) auto; gap: 10px; }
  .transaction-amount { font-size: .82rem; }
  .app-entry-form { padding: 16px; }
  .page-nav-link { font-size: .7rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

[dir="rtl"] .app-bottom-nav { transform: translateX(50%); }

/* Budget workspace: transactions, reports and planning */
.budget-page { display: grid; gap: 18px; }
.page-action-tabs-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.page-nav-link.is-active {
  color: #06264b;
  border-color: rgba(85, 229, 165, .7);
  background: linear-gradient(145deg, #7af0ba, #42d99a);
  box-shadow: 0 8px 18px rgba(85, 229, 165, .16);
}
.page-nav-link.is-import.is-active { color: #06264b; }
.page-heading p { margin: 6px 0 0; color: var(--ed-muted); font-size: .78rem; }

.transaction-search {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  min-height: 54px;
  padding: 0 16px;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--ed-border);
  border-radius: 16px;
  background: rgba(12, 35, 72, .86);
  box-shadow: 0 12px 26px rgba(0, 8, 27, .18);
}
.transaction-search svg { width: 21px; height: 21px; color: var(--ed-muted); }
.transaction-search input { width: 100%; border: 0; outline: 0; color: var(--ed-text); background: transparent; font-size: .9rem; font-weight: 560; }
.transaction-search input::placeholder { color: #7f92b4; }
.transaction-search:focus-within { border-color: var(--ed-mint); box-shadow: 0 0 0 3px rgba(85, 229, 165, .12); }
.active-filter-row { display: flex; margin-top: -8px; flex-wrap: wrap; gap: 7px; align-items: center; }
.active-filter-row span,
.active-filter-row a { display: inline-flex; min-height: 30px; padding: 5px 10px; align-items: center; border: 1px solid var(--ed-border); border-radius: 999px; color: #c6d5ed; background: rgba(255,255,255,.045); font-size: .7rem; font-weight: 650; text-decoration: none; }
.active-filter-row a { color: var(--ed-mint); }
.transaction-card-list { display: grid; gap: 12px; }
.transaction-card {
  padding: 17px;
  border: 1px solid var(--ed-border);
  border-radius: 19px;
  background: radial-gradient(circle at 100% 0, rgba(45,92,164,.22), transparent 48%), linear-gradient(145deg, rgba(25,55,101,.97), rgba(11,35,72,.97));
  box-shadow: 0 14px 28px rgba(0,7,24,.18);
}
.transaction-card-topline { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.entry-card-date,
.transaction-card-date { color: var(--ed-muted); font-size: .76rem; font-weight: 620; }
.transaction-card-amount { color: var(--ed-coral); font-size: 1.02rem; font-weight: 760; font-variant-numeric: tabular-nums; text-align: end; }
.transaction-card-tags { display: flex; margin-block-start: 13px; flex-wrap: wrap; gap: 6px; }
.transaction-filter-tag { display: inline-flex; min-height: 27px; padding: 4px 9px; align-items: center; border: 1px solid rgba(85,229,165,.25); border-radius: 999px; color: #baf8dc; background: rgba(85,229,165,.08); font-size: .68rem; font-weight: 650; text-decoration: none; }
.transaction-filter-tag.is-muted { color: var(--ed-muted); border-color: var(--ed-border); background: rgba(255,255,255,.035); }
.transaction-card-note { margin: 13px 0 0; color: #d7e2f5; font-size: .83rem; line-height: 1.45; overflow-wrap: anywhere; }
.transaction-card-actions { display: flex; margin-block-start: 14px; padding-block-start: 12px; justify-content: flex-end; gap: 8px; border-block-start: 1px solid rgba(175,202,241,.11); }
.transaction-action { display: inline-flex; min-height: 34px; padding: 6px 10px; align-items: center; gap: 6px; border: 1px solid var(--ed-border); border-radius: 10px; color: #bcd1f2; background: rgba(255,255,255,.035); font-size: .7rem; font-weight: 680; text-decoration: none; }
.transaction-action svg { width: 15px; height: 15px; }
button.transaction-action { font: inherit; }
.transaction-action.is-danger { color: #ff9fa8; border-color: rgba(255,114,124,.24); background: rgba(255,114,124,.07); }
.transaction-loader { display: flex; min-height: 48px; align-items: center; justify-content: center; gap: 9px; color: var(--ed-muted); font-size: .76rem; }
.transaction-retry { justify-self: center; }
.transaction-sentinel { height: 2px; }
.transaction-empty { display: grid; min-height: 126px; padding: 24px; place-content: center; gap: 6px; color: var(--ed-muted); text-align: center; }
.transaction-empty strong { color: var(--ed-text); font-size: .94rem; }
.transaction-empty span { font-size: .76rem; }

.report-page-heading { display: grid; grid-template-columns: minmax(0, 1fr) 152px; gap: 14px; align-items: end; }
.report-currency-control { display: grid; gap: 6px; }
.report-currency-control span { color: var(--ed-muted); font-size: .68rem; font-weight: 650; }
.report-currency-control select { width: 100%; min-height: 42px; padding: 7px 30px 7px 10px; border: 1px solid var(--ed-border); border-radius: 12px; color: var(--ed-text); background: rgba(12,35,72,.9); font-size: .74rem; font-weight: 680; color-scheme: dark; }
.report-currency-control option { color: #10203c; background: #fff; }
.report-chart-card { overflow: hidden; padding: 18px 16px 20px; border: 1px solid var(--ed-border); border-radius: var(--ed-radius-lg); background: radial-gradient(circle at 100% 0, rgba(45,92,164,.3), transparent 50%), linear-gradient(145deg, rgba(25,55,101,.98), rgba(11,35,72,.98)); box-shadow: var(--ed-shadow); }
.report-chart-toolbar { display: grid; grid-template-columns: 40px minmax(0,1fr) 40px; gap: 9px; align-items: center; }
.report-history-button { display: grid; width: 40px; height: 40px; padding: 0; place-items: center; border: 1px solid var(--ed-border); border-radius: 12px; color: var(--ed-text); background: rgba(255,255,255,.04); }
.report-history-button:disabled { opacity: .3; }
.report-history-button svg { width: 20px; height: 20px; }
.report-chart-copy { min-width: 0; text-align: center; }
.report-chart-copy span { display: block; overflow: hidden; color: var(--ed-mint); font-size: .68rem; font-weight: 680; text-overflow: ellipsis; white-space: nowrap; }
.report-chart-copy h2 { margin: 3px 0 0; font-size: 1.05rem; font-weight: 730; }
.report-chart-hint { margin: 11px 0 4px; color: var(--ed-muted); font-size: .72rem; text-align: center; }
.report-chart-stage { position: relative; height: min(440px, 92vw); min-height: 320px; margin-block-start: 8px; }
.report-chart-loading { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; color: var(--ed-mint); background: rgba(9,31,66,.7); }
.report-chart-empty { position: absolute; inset: 0; display: grid; padding: 24px; place-items: center; color: var(--ed-muted); text-align: center; font-size: .8rem; }

.plan-card { overflow: hidden; padding: 20px; border: 1px solid var(--ed-border); border-radius: var(--ed-radius-lg); color: var(--ed-text); background: radial-gradient(circle at 100% 0, rgba(45,92,164,.25), transparent 48%), linear-gradient(145deg, rgba(25,55,101,.98), rgba(11,35,72,.98)); box-shadow: var(--ed-shadow); }
.plan-card-heading { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 11px; align-items: start; margin-block-end: 18px; }
.plan-step-index { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(85,229,165,.35); border-radius: 11px; color: #082648; background: var(--ed-mint); font-size: .78rem; font-weight: 800; }
.plan-card-heading h2 { margin: 1px 0 0; font-size: 1rem; font-weight: 720; }
.plan-card-heading p { margin: 4px 0 0; color: var(--ed-muted); font-size: .72rem; line-height: 1.4; }
.plan-period-form,
.plan-form-grid { display: grid; gap: 14px; }
.plan-period-form label,
.plan-field { display: grid; gap: 7px; }
.plan-period-form label > span,
.plan-field > span { color: #dbe7fb; font-size: .75rem; font-weight: 650; }
.plan-page .form-control,
.plan-page .form-select { min-height: 49px; border: 1px solid rgba(177,204,241,.22); border-radius: 13px; color: var(--ed-text); background-color: rgba(5,25,58,.72); font-size: .88rem; color-scheme: dark; }
.plan-page textarea.form-control { min-height: 82px; }
.plan-page .form-control:focus,
.plan-page .form-select:focus { color: var(--ed-text); border-color: var(--ed-mint); background-color: rgba(5,25,58,.9); box-shadow: 0 0 0 3px rgba(85,229,165,.13); }
.plan-page .form-select option { color: #10203c; background: #fff; }
.plan-summary-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.plan-summary-grid div { display: grid; min-height: 84px; padding: 13px; align-content: center; gap: 7px; border: 1px solid var(--ed-border); border-radius: 15px; background: rgba(255,255,255,.035); }
.plan-summary-grid div.is-investment { grid-column: 1/-1; border-color: rgba(85,229,165,.24); background: rgba(85,229,165,.07); }
.plan-summary-grid span { color: var(--ed-muted); font-size: .68rem; }
.plan-summary-grid strong { font-size: .94rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.plan-summary-grid .is-investment strong { color: var(--ed-mint); font-size: 1.12rem; }
.plan-allocation-visual { display: flex; height: 14px; margin-block-start: 18px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.055); }
.plan-allocation-visual span { display: block; height: 100%; }
.plan-allocation-visual .is-expense { background: linear-gradient(90deg,#ff727c,#ef4a98); }
.plan-allocation-visual .is-investment { background: linear-gradient(90deg,#42d99a,#7af0ba); }
.plan-allocation-legend { display: flex; margin-block-start: 9px; justify-content: space-between; gap: 12px; color: var(--ed-muted); font-size: .66rem; }
.plan-allocation-legend span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-inline-end: 6px; border-radius: 50%; }
.plan-allocation-legend .is-expense::before { background: var(--ed-coral); }
.plan-allocation-legend .is-investment::before { background: var(--ed-mint); }
.plan-check { display: flex; align-items: center; gap: 9px; color: #dbe7fb; font-size: .78rem; }
.plan-check .form-check-input { flex: 0 0 auto; margin: 0; }
.plan-form-grid .app-button { justify-self: start; }
.plan-item-list { display: grid; gap: 10px; }
.plan-item-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--ed-border); border-radius: 15px; background: rgba(255,255,255,.035); }
.plan-item-main { display: grid; min-width: 0; gap: 3px; }
.plan-item-main strong { overflow: hidden; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.plan-item-main small { color: var(--ed-muted); font-size: .65rem; }
.plan-item-type { color: var(--ed-mint); font-size: .64rem; font-weight: 680; text-transform: uppercase; letter-spacing: .035em; }
.plan-item-end { display: grid; justify-items: end; gap: 8px; }
.plan-item-end > strong { font-size: .78rem; font-variant-numeric: tabular-nums; }
.plan-item-end form { margin: 0; }

@media (max-width: 360px) {
  .page-action-tabs-three { gap: 5px; }
  .page-action-tabs-three .page-nav-link { font-size: .62rem; }
  .report-page-heading { grid-template-columns: minmax(0,1fr) 130px; }
  .transaction-card { padding: 15px; }
  .plan-card { padding: 16px; }
}

/* Journey */
.journey-page { display: grid; gap: 16px; }
.journey-heading { margin-block-end: -2px; }
.journey-filter { display: grid; grid-template-columns: .72fr 1.28fr; gap: 10px; }
.journey-filter label { display: grid; gap: 6px; }
.journey-filter label > span { color: var(--ed-muted); font-size: .68rem; font-weight: 650; }
.journey-filter select { min-width: 0; min-height: 44px; padding: 8px 30px 8px 11px; border: 1px solid var(--ed-border); border-radius: 12px; color: var(--ed-text); background: rgba(12,35,72,.9); font-size: .74rem; font-weight: 680; color-scheme: dark; }
.journey-filter option { color: #10203c; background: #fff; }
.journey-summary-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.journey-summary-card { position: relative; overflow: hidden; display: grid; min-height: 110px; padding: 15px; align-content: center; gap: 6px; border: 1px solid var(--ed-border); border-radius: 17px; background: linear-gradient(145deg,rgba(27,61,111,.98),rgba(12,37,76,.98)); box-shadow: var(--ed-shadow); }
.journey-summary-card::after { content:""; position:absolute; inset-inline-end:-25px; inset-block-start:-35px; width:90px; height:90px; border-radius:50%; background:currentColor; opacity:.08; }
.journey-summary-card > span { color: var(--ed-muted); font-size: .67rem; font-weight: 650; }
.journey-summary-card > strong { overflow-wrap:anywhere; color:var(--ed-text); font-size:clamp(.95rem,4vw,1.18rem); font-variant-numeric:tabular-nums; }
.journey-summary-card > small { color:var(--ed-muted); font-size:.62rem; }
.journey-summary-card.is-income { color:var(--ed-mint); border-color:rgba(85,229,165,.2); }
.journey-summary-card.is-spent { color:var(--ed-coral); }
.journey-summary-card.is-invested { color:#9f7aea; }
.journey-summary-card.is-return { color:#4c83ff; }
.journey-panel { padding:17px 15px; border:1px solid var(--ed-border); border-radius:var(--ed-radius-lg); background:radial-gradient(circle at 100% 0,rgba(45,92,164,.24),transparent 46%),linear-gradient(145deg,rgba(25,55,101,.98),rgba(11,35,72,.98)); box-shadow:var(--ed-shadow); }
.journey-panel-heading { display:flex; justify-content:space-between; gap:12px; align-items:start; }
.journey-panel-heading span,.journey-section-title span { color:var(--ed-mint); font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.journey-panel-heading h2,.journey-section-title h2 { margin:3px 0 0; font-size:.98rem; font-weight:730; }
.journey-legend { display:flex; flex-wrap:wrap; justify-content:end; gap:5px 8px; color:var(--ed-muted); font-size:.58rem; }
.journey-legend i { width:7px; height:7px; margin-inline-start:4px; border-radius:50%; }
.journey-legend .income { background:var(--ed-mint); }.journey-legend .spent { background:var(--ed-coral); }.journey-legend .invested { background:#9f7aea; }
.journey-chart-stage { height:230px; margin-block-start:14px; }
.income-source-list { display:grid; gap:0; margin-block-start:10px; }
.income-source-list > div { display:flex; min-height:45px; align-items:center; justify-content:space-between; gap:16px; border-block-start:1px solid rgba(177,204,241,.1); }
.income-source-list span { color:#c9daf4; font-size:.76rem; }.income-source-list strong { font-size:.78rem; font-variant-numeric:tabular-nums; }.income-source-list .is-investment strong { color:var(--ed-mint); }
.journey-empty { margin:12px 0 2px; color:var(--ed-muted); font-size:.75rem; }
.journey-section-title { margin-block-start:2px; }
.journey-habit-grid { display:grid; gap:10px; margin-block-start:10px; }
.journey-habit-grid article { display:grid; grid-template-columns:48px minmax(0,1fr); min-height:75px; padding:13px; align-items:center; gap:12px; border:1px solid var(--ed-border); border-radius:16px; background:rgba(19,50,93,.88); }
.journey-habit-grid strong { font-size:.78rem; }.journey-habit-grid p { margin:4px 0 0; color:var(--ed-muted); font-size:.67rem; }
.habit-ring { display:grid; width:46px; height:46px; place-items:center; border-radius:50%; background:conic-gradient(var(--ed-mint) calc(var(--value)*1%),rgba(255,255,255,.08) 0); }
.habit-ring::before { content:""; grid-area:1/1; width:36px; height:36px; border-radius:50%; background:#102b53; }.habit-ring span { z-index:1; grid-area:1/1; font-size:.59rem; font-weight:750; }
.habit-icon { display:grid; width:46px; height:46px; place-items:center; border-radius:14px; color:var(--ed-mint); background:rgba(85,229,165,.1); font-size:1.15rem; font-weight:750; }
.journey-xp-card { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 80px 18px; gap:12px; align-items:center; padding:16px; border:1px solid rgba(85,229,165,.23); border-radius:17px; color:var(--ed-text); background:linear-gradient(135deg,rgba(85,229,165,.11),rgba(24,56,102,.96)); text-decoration:none; }
.journey-xp-card > div:first-child { display:grid; gap:2px; }.journey-xp-card span,.journey-xp-card small { color:var(--ed-muted); font-size:.63rem; }.journey-xp-card strong { font-size:.82rem; }
.journey-xp-card svg { width:18px; }.journey-xp-progress { height:7px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.08); }.journey-xp-progress i { display:block; height:100%; border-radius:inherit; background:var(--ed-mint); }
.badge-hero,.level-hero { padding:20px; border:1px solid rgba(85,229,165,.23); border-radius:var(--ed-radius-lg); background:radial-gradient(circle at 100% 0,rgba(85,229,165,.16),transparent 50%),linear-gradient(145deg,rgba(25,55,101,.98),rgba(11,35,72,.98)); box-shadow:var(--ed-shadow); }
.badge-hero span,.level-hero span { color:var(--ed-muted); font-size:.68rem; }.badge-hero strong,.level-hero strong { display:block; margin-top:4px; font-size:1.45rem; }.badge-hero p,.level-hero p { margin:5px 0 0; color:var(--ed-muted); font-size:.72rem; }
.badge-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.journey-badge { display:grid; min-height:170px; padding:15px; align-content:start; gap:12px; border:1px solid var(--ed-border); border-radius:17px; background:linear-gradient(145deg,rgba(25,55,101,.98),rgba(11,35,72,.98)); }
.badge-icon { display:grid; width:45px; height:45px; place-items:center; border-radius:14px; background:rgba(85,229,165,.13); font-size:1.35rem; }
.journey-badge strong { display:block; font-size:.81rem; }.journey-badge p { margin:5px 0 8px; color:var(--ed-muted); font-size:.65rem; line-height:1.4; }.journey-badge small { color:var(--ed-mint); font-size:.61rem; }
.journey-badge.is-locked { filter:saturate(0); opacity:.52; }.journey-badge.is-locked small { color:var(--ed-muted); }
.level-hero > div { height:8px; margin-top:14px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.08); }.level-hero > div i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--ed-mint),#4c83ff); }.level-hero small { display:block; margin-top:8px; color:var(--ed-muted); font-size:.65rem; }
.level-timeline { display:grid; gap:0; }
.journey-level { position:relative; display:grid; grid-template-columns:42px minmax(0,1fr); gap:13px; padding:0 0 18px; }
.journey-level:not(:last-child)::before { content:""; position:absolute; inset-inline-start:20px; inset-block-start:42px; bottom:0; width:2px; background:rgba(177,204,241,.14); }
.level-marker { z-index:1; display:grid; width:42px; height:42px; place-items:center; border:1px solid var(--ed-border); border-radius:14px; color:var(--ed-muted); background:#102b53; font-weight:750; }
.journey-level > div:last-child { padding:13px; border:1px solid var(--ed-border); border-radius:15px; background:rgba(19,50,93,.88); }
.level-title { display:flex; justify-content:space-between; gap:10px; }.level-title strong { font-size:.82rem; }.level-title span { color:var(--ed-muted); font-size:.65rem; }.journey-level p { margin:6px 0 0; color:var(--ed-muted); font-size:.67rem; line-height:1.45; }.journey-level small { display:block; margin-top:7px; color:var(--ed-mint); font-size:.62rem; }
.journey-level.is-complete .level-marker,.journey-level.is-current .level-marker { color:#082648; border-color:var(--ed-mint); background:var(--ed-mint); }.journey-level.is-current > div:last-child { border-color:rgba(85,229,165,.35); }.journey-level.is-locked { opacity:.58; }
@media (min-width:430px){.journey-habit-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:360px){.journey-summary-card{padding:12px}.badge-grid{grid-template-columns:1fr}.journey-filter{grid-template-columns:110px minmax(0,1fr)}}

/* Investments */
.investment-page { display:grid; gap:16px; }
.investment-heading { margin-block-end:-2px; }
.investment-controls { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr) 44px; gap:9px; align-items:end; }
.investment-controls label,.investment-form-grid label { display:grid; min-width:0; gap:6px; }
.investment-controls label > span,.investment-form-grid label > span { color:var(--ed-muted); font-size:.68rem; font-weight:650; }
.investment-controls select,.investment-form-grid input,.investment-form-grid select,.investment-form-grid textarea,.investment-form-page .form-control,.investment-form-page .form-select,.investment-compare select { width:100%; min-width:0; min-height:44px; padding:8px 30px 8px 11px; border:1px solid var(--ed-border); border-radius:12px; color:var(--ed-text); background-color:rgba(7,28,62,.84); font-size:.76rem; color-scheme:dark; }
.investment-controls select option,.investment-form-grid select option,.investment-form-page option,.investment-compare option { color:#10203c; background:#fff; }
.investment-icon-button { display:grid; width:44px; height:44px; padding:0; place-items:center; border:1px solid rgba(85,229,165,.3); border-radius:13px; color:#082648; background:var(--ed-mint); }
.investment-icon-button svg { width:19px; height:19px; }
.investment-chart-panel,.investment-form-panel { padding:17px 15px; border:1px solid var(--ed-border); border-radius:var(--ed-radius-lg); color:var(--ed-text); background:radial-gradient(circle at 100% 0,rgba(45,92,164,.24),transparent 48%),linear-gradient(145deg,rgba(25,55,101,.98),rgba(11,35,72,.98)); box-shadow:var(--ed-shadow); }
.investment-panel-heading,.investment-list-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.investment-panel-heading span,.investment-list-heading > div > span { color:var(--ed-mint); font-size:.63rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.investment-panel-heading h2,.investment-list-heading h2 { margin:3px 0 0; font-size:.98rem; font-weight:730; }
.investment-filter-button { display:inline-flex; min-height:34px; padding:7px 9px; align-items:center; gap:5px; border:1px solid var(--ed-border); border-radius:10px; color:var(--ed-muted); background:rgba(255,255,255,.035); font-size:.65rem; }
.investment-filter-button svg { width:14px; height:14px; }
.investment-filter-panel { padding-block-start:12px; }
.investment-filter-actions { display:flex; gap:7px; margin-block-end:9px; }
.investment-filter-actions button { padding:5px 9px; border:1px solid var(--ed-border); border-radius:9px; color:#c9daf4; background:rgba(255,255,255,.035); font-size:.62rem; }
.investment-filter-options { display:flex; flex-wrap:wrap; gap:8px 11px; }
.investment-filter-options label { display:flex; align-items:center; gap:5px; color:var(--ed-muted); font-size:.62rem; }
.investment-filter-options input { width:14px; height:14px; accent-color:var(--ed-mint); }
.investment-filter-options label > span { width:7px; height:7px; border-radius:50%; background:var(--filter-color); }
.investment-filter-options em { max-width:130px; overflow:hidden; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.investment-chart-stage { position:relative; height:270px; margin-block-start:12px; }
.investment-chart-stage.is-tall { height:340px; }
.investment-loading { position:absolute; inset:0; z-index:2; display:grid; place-items:center; color:var(--ed-mint); background:rgba(9,31,66,.68); }
.investment-loading[hidden] { display:none; }
.investment-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.investment-summary-grid article { position:relative; overflow:hidden; display:grid; min-height:82px; padding:13px; align-content:center; gap:6px; border:1px solid var(--ed-border); border-radius:16px; background:linear-gradient(145deg,rgba(25,55,101,.97),rgba(11,35,72,.97)); }
.investment-summary-grid article::after { content:""; position:absolute; inset-inline-end:-25px; inset-block-start:-35px; width:82px; height:82px; border-radius:50%; background:currentColor; opacity:.07; }
.investment-summary-grid span { color:var(--ed-muted); font-size:.65rem; }
.investment-summary-grid strong { overflow-wrap:anywhere; font-size:.9rem; font-variant-numeric:tabular-nums; }
.investment-summary-grid .is-value { color:#4c83ff; }.investment-summary-grid .is-income { color:var(--ed-mint); }.investment-summary-grid .is-pnl { color:#9f7aea; }
.is-positive { color:var(--ed-mint)!important; }.is-negative { color:var(--ed-coral)!important; }
.investment-switch { display:flex; align-items:center; gap:7px; color:var(--ed-muted); font-size:.65rem; }
.investment-switch input { position:absolute; opacity:0; pointer-events:none; }
.investment-switch span { position:relative; display:block; width:31px; height:18px; border-radius:999px; background:rgba(255,255,255,.1); }
.investment-switch span::after { content:""; position:absolute; inset:3px auto 3px 3px; width:12px; border-radius:50%; background:#91a9cd; transition:transform .18s; }
.investment-switch input:checked + span { background:rgba(85,229,165,.25); }.investment-switch input:checked + span::after { background:var(--ed-mint); transform:translateX(13px); }
.investment-asset-list { display:grid; gap:10px; margin-block-start:10px; }
.investment-asset-card { display:grid; grid-template-columns:45px minmax(0,1fr) 17px; gap:12px; padding:14px; align-items:start; border:1px solid var(--ed-border); border-radius:17px; color:var(--ed-text); background:radial-gradient(circle at 100% 0,rgba(45,92,164,.18),transparent 45%),rgba(19,50,93,.91); text-decoration:none; }
.investment-asset-card.is-closed { filter:saturate(.45); opacity:.58; }
.investment-asset-icon { display:grid; width:45px; height:45px; place-items:center; border-radius:14px; color:#4c83ff; background:rgba(76,131,255,.13); }
.investment-asset-icon svg { width:24px; height:24px; }
.investment-asset-icon.is-realestate { color:#f59e0b; background:rgba(245,158,11,.12); }.investment-asset-icon.is-market { color:#9f7aea; background:rgba(159,122,234,.12); }.investment-asset-icon.is-deposit { color:var(--ed-mint); background:rgba(85,229,165,.11); }.investment-asset-icon.is-cashflow { color:#22d3ee; background:rgba(34,211,238,.11); }
.investment-asset-main { display:grid; min-width:0; gap:3px; }
.investment-asset-title { display:flex; min-width:0; align-items:center; gap:7px; }.investment-asset-title strong { overflow:hidden; font-size:.84rem; text-overflow:ellipsis; white-space:nowrap; }.investment-asset-title span,.investment-status { padding:3px 6px; border:1px solid rgba(245,158,11,.3); border-radius:999px; color:#fbbf24; background:rgba(245,158,11,.1); font-size:.55rem; font-weight:700; }
.investment-asset-main > small { color:var(--ed-muted); font-size:.62rem; }
.investment-asset-balance { display:flex; margin-block-start:8px; align-items:end; justify-content:space-between; gap:8px; }.investment-asset-balance span { color:var(--ed-muted); font-size:.62rem; }.investment-asset-balance strong { font-size:1rem; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.investment-asset-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 12px; margin-block-start:10px; padding-block-start:10px; border-block-start:1px solid rgba(177,204,241,.1); }
.investment-asset-metrics div { display:grid; gap:2px; }.investment-asset-metrics span { color:var(--ed-muted); font-size:.57rem; }.investment-asset-metrics strong { overflow-wrap:anywhere; font-size:.67rem; font-variant-numeric:tabular-nums; }
.investment-card-chevron { width:17px; margin-block-start:13px; color:var(--ed-muted); }
.investment-empty { display:grid; min-height:100px; padding:20px; place-content:center; color:var(--ed-muted); text-align:center; font-size:.75rem; }.investment-empty a { color:var(--ed-mint); }
.investment-asset-header { display:grid; grid-template-columns:45px minmax(0,1fr) auto; gap:12px; align-items:center; }.investment-asset-header h1 { margin:0; font-size:1.12rem; font-weight:750; }.investment-asset-header p { margin:4px 0 0; color:var(--ed-muted); font-size:.68rem; }
.investment-detail-controls { grid-template-columns:minmax(0,1.4fr) minmax(0,.75fr) 44px; }
.investment-action-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.investment-action-grid a { display:grid; min-height:82px; padding:10px 5px; place-items:center; align-content:center; gap:7px; border:1px solid var(--ed-border); border-radius:15px; color:#dbe7fb; background:rgba(19,50,93,.9); font-size:.62rem; font-weight:700; text-align:center; text-decoration:none; }
.investment-action-grid a span { display:grid; width:34px; height:34px; place-items:center; border-radius:11px; color:var(--ed-mint); background:rgba(85,229,165,.1); }.investment-action-grid svg { width:18px; height:18px; }
.investment-wide-metric { grid-column:1/-1; }.investment-wide-metric small { color:var(--ed-muted); font-size:.64rem; }
.investment-chart-hint { margin:8px 0 0; color:var(--ed-muted); font-size:.68rem; line-height:1.45; }
.investment-inline-actions { display:flex; gap:8px; }.investment-inline-actions button,.investment-danger-actions a,.investment-danger-actions button,.investment-modal button { min-height:37px; padding:8px 11px; border:1px solid var(--ed-border); border-radius:10px; color:#c9daf4; background:rgba(255,255,255,.035); font-size:.68rem; text-decoration:none; }
.investment-danger-panel { display:grid; gap:13px; padding:16px; border:1px solid rgba(255,114,124,.17); border-radius:17px; background:rgba(19,50,93,.78); }.investment-danger-panel h2 { margin:0; font-size:.88rem; }.investment-danger-panel p { margin:5px 0 0; color:var(--ed-muted); font-size:.65rem; line-height:1.45; }
.investment-danger-actions { display:flex; flex-wrap:wrap; gap:8px; }.investment-danger-actions form { margin:0; }.investment-danger-actions .is-danger,.investment-modal .is-danger { color:#ff9fa8; border-color:rgba(255,114,124,.3); background:rgba(255,114,124,.08); }
.investment-form-panel { padding:17px; }
.investment-form-grid { display:grid; gap:13px; }
.investment-form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.investment-form-grid .errorlist { margin:2px 0 0; padding:0; color:#ff9fa8; font-size:.62rem; list-style:none; }
.investment-form-grid small,.investment-form-page .form-text { color:var(--ed-muted)!important; font-size:.62rem; line-height:1.4; }
.investment-form-actions { display:flex; flex-wrap:wrap; gap:8px; margin-block-start:3px; }.investment-form-actions button,.investment-primary-button { min-height:42px; padding:9px 14px; border:0; border-radius:11px; color:#082648; background:var(--ed-mint); font-size:.72rem; font-weight:750; }.investment-form-actions a { display:inline-flex; min-height:42px; padding:9px 14px; align-items:center; border:1px solid var(--ed-border); border-radius:11px; color:#c9daf4; font-size:.72rem; text-decoration:none; }
.investment-record-list { display:grid; gap:9px; margin-block-start:10px; }
.investment-record-card { display:grid; grid-template-columns:39px minmax(0,1fr) auto; gap:10px; padding:13px; align-items:center; border:1px solid var(--ed-border); border-radius:15px; background:rgba(19,50,93,.88); }
.investment-record-icon { display:grid; width:39px; height:39px; place-items:center; border-radius:12px; color:#4c83ff; background:rgba(76,131,255,.11); font-size:1rem; font-weight:800; }.investment-record-icon svg { width:19px; height:19px; }.investment-record-icon.is-positive { background:rgba(85,229,165,.1); }.investment-record-icon.is-negative { background:rgba(255,114,124,.1); }.investment-record-icon.is-value { color:#9f7aea; background:rgba(159,122,234,.11); }
.investment-record-title { display:flex; align-items:center; gap:7px; }.investment-record-title strong { font-size:.75rem; }.investment-record-title span { color:var(--ed-muted); font-size:.59rem; }.investment-record-card p { margin:3px 0 0; overflow:hidden; color:var(--ed-muted); font-size:.62rem; text-overflow:ellipsis; white-space:nowrap; }.investment-record-card small { color:var(--ed-muted); font-size:.58rem; }
.investment-record-end { display:grid; justify-items:end; gap:7px; }.investment-record-end > strong { max-width:110px; overflow-wrap:anywhere; font-size:.68rem; font-variant-numeric:tabular-nums; text-align:end; }.investment-record-end form { margin:0; }.investment-record-end button { padding:3px 0; border:0; color:#ff9fa8; background:transparent; font-size:.58rem; }
.investment-record-actions{display:flex;align-items:center;gap:10px}.investment-record-actions a{color:#8fb3ff;font-size:.58rem;text-decoration:none}.investment-record-card.is-editing{border-color:rgba(85,229,165,.55);box-shadow:0 0 0 1px rgba(85,229,165,.12)}
.investment-unit-warning{padding:8px 10px;border-left:3px solid #f59e0b;border-radius:6px;color:#ffd58a!important;background:rgba(245,158,11,.08)}
.investment-helper,.investment-estimate{padding:12px;border:1px solid var(--ed-border);border-radius:13px;background:rgba(6,25,55,.55)}.investment-helper summary{cursor:pointer;color:#dbe7fb;font-size:.72rem;font-weight:700}.investment-helper-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.investment-helper p{margin:10px 0 8px;color:var(--ed-muted);font-size:.68rem}.investment-helper button,.investment-estimate button{min-height:34px;padding:7px 10px;border:1px solid rgba(85,229,165,.3);border-radius:9px;color:var(--ed-mint);background:rgba(85,229,165,.08);font-size:.65rem}.investment-estimate{display:grid;gap:4px}.investment-estimate[hidden]{display:none}.investment-estimate>span,.investment-estimate>small{color:var(--ed-muted);font-size:.62rem}.investment-estimate>strong{font-size:.84rem}
@media(max-width:360px){.investment-helper-grid{grid-template-columns:1fr}}
.investment-value-breakdown{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;border:1px solid var(--ed-border);border-radius:14px;background:rgba(7,28,62,.55)}.investment-value-breakdown[hidden]{display:none}.investment-value-breakdown div{display:grid;gap:3px}.investment-value-breakdown span,.investment-value-breakdown small{color:var(--ed-muted);font-size:.6rem}.investment-value-breakdown strong{font-size:.7rem;overflow-wrap:anywhere}.investment-value-breakdown>small{grid-column:1/-1}
.investment-advanced-tools{padding:11px 13px;border:1px solid var(--ed-border);border-radius:13px;background:rgba(7,28,62,.45)}.investment-advanced-tools summary{cursor:pointer;color:#b9cceb;font-size:.68rem;font-weight:700}.investment-advanced-tools p{margin:8px 0;color:var(--ed-muted);font-size:.62rem;line-height:1.45}
@media(max-width:520px){.investment-value-breakdown{grid-template-columns:1fr}.investment-value-breakdown>small{grid-column:1}}
.investment-interest-panel { display:grid; gap:13px; }
.investment-form-page .card { border:1px solid var(--ed-border)!important; border-radius:15px!important; color:var(--ed-text); background:rgba(7,28,62,.55)!important; }
.investment-form-page .card-body { color:var(--ed-text); }.investment-form-page label,.investment-form-page .fw-semibold { color:#dbe7fb; font-size:.75rem; }.investment-form-page code { color:var(--ed-mint); }
.investment-form-page .btn-primary,.investment-form-page .btn-success { border-color:var(--ed-mint); color:#082648; background:var(--ed-mint); }.investment-form-page .btn-outline-secondary { border-color:var(--ed-border); color:#c9daf4; }
.investment-form-page .alert-success { border-color:rgba(85,229,165,.3); color:#b8f5d8; background:rgba(85,229,165,.08); }
.investment-form-page .list-group-item { border-color:var(--ed-border); color:var(--ed-text); background:#102b53; }
.investment-compare-controls { display:grid; gap:13px; }.investment-compare select[multiple] { min-height:118px; padding:7px; }.investment-compare-controls small { color:var(--ed-muted); font-size:.62rem; }
.investment-modal .modal-content { border:1px solid var(--ed-border); border-radius:18px; color:var(--ed-text); background:#102b53; }.investment-modal .modal-header,.investment-modal .modal-footer { border-color:rgba(177,204,241,.12); }.investment-modal h2 { margin:0; font-size:.95rem; }.investment-modal p { margin:0; color:var(--ed-muted); font-size:.72rem; }.investment-modal .modal-footer form { margin:0; }.investment-modal .is-warning { color:#1c1402; border-color:#f59e0b; background:#f59e0b; }
@media(max-width:360px){.investment-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.investment-form-row{grid-template-columns:1fr}.investment-record-card{grid-template-columns:36px minmax(0,1fr)}.investment-record-end{grid-column:2; justify-items:start}.investment-record-end>strong{text-align:start}.investment-summary-grid strong{font-size:.8rem}}

.balance-breakdown-three { grid-template-columns: repeat(5, auto); }
.balance-breakdown-three .balance-stat-value.is-negative,
.investment-summary-grid .is-cash .is-negative { color: var(--ed-coral); }
.balance-transfer-link { display: inline-flex; margin: 0 18px 16px; color: var(--ed-mint); font-size: .7rem; font-weight: 700; text-decoration: none; }
.balance-transfer-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.balance-transfer-actions { display: grid; justify-items: end; gap: 5px; font-size: .62rem; }
.balance-transfer-actions form { margin: 0; }
.balance-transfer-actions button { padding: 0; border: 0; color: var(--ed-coral); background: transparent; }
.investment-summary-grid .is-cash { color: #f59e0b; }

@media (max-width: 480px) { .balance-breakdown-three { grid-template-columns: 1fr; gap: 10px; } .balance-breakdown-three .balance-divider { width: 100%; height: 1px; } .balance-transfer-heading { align-items: start; } }

/* Balance transfer and manual balance adjustment */
.balance-direction-title {
  display: inline-block;
  margin-block-end: 7px;
  color: #dbe7fb;
  font-size: .78rem;
  font-weight: 650;
}
.balance-direction {
  display: grid;
  width: 100%;
  min-height: 76px;
  padding: 10px 14px;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(177, 204, 241, .25);
  border-radius: 14px;
  color: var(--ed-text);
  background: rgba(5, 25, 58, .56);
  text-align: start;
}
.balance-direction:hover,
.balance-direction:focus-visible {
  border-color: var(--ed-mint);
  background: rgba(10, 39, 78, .82);
  box-shadow: 0 0 0 3px rgba(85, 229, 165, .12);
}
.balance-direction-account { display: grid; min-width: 0; gap: 4px; }
.balance-direction-account:last-child { text-align: end; }
.balance-direction-account small { color: var(--ed-muted); font-size: .66rem; font-weight: 650; }
.balance-direction-account strong { overflow-wrap: anywhere; font-size: .84rem; line-height: 1.2; }
.balance-direction-swap {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(85, 229, 165, .35);
  border-radius: 50%;
  color: var(--ed-mint);
  background: rgba(85, 229, 165, .08);
}
.balance-direction-swap svg { width: 20px; height: 20px; }
.balance-adjustment-card { margin-block-start: 2px; }
.balance-adjustment-heading { padding: 20px 20px 0; }
.balance-adjustment-heading h2 { margin: 0; font-size: 1rem; }
.balance-adjustment-heading p { margin: 6px 0 0; color: var(--ed-muted); font-size: .72rem; line-height: 1.45; }

.balance-breakdown-three {
  grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr) 1px minmax(0, 1fr);
  gap: 12px;
  padding-inline: 22px;
}
.balance-breakdown-three > div {
  display: grid;
  min-width: 0;
  grid-template-rows: 2.4em auto;
  align-content: start;
}
.balance-breakdown-three .balance-stat-value {
  margin-block-start: 7px;
  font-size: clamp(.78rem, 3.2vw, 1.08rem);
  line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 390px) {
  .balance-breakdown-three { gap: 8px; padding-inline: 14px; }
  .balance-breakdown-three .balance-stat-label { font-size: .7rem; }
  .balance-breakdown-three .balance-stat-value { font-size: .76rem; }
}
