:root {
  --bg: #0b1016;
  --bg-soft: #101720;
  --surface: #171e27;
  --surface-2: #111821;
  --surface-3: #202832;
  --surface-soft: rgba(23, 30, 39, .94);
  --text: #f6f8fb;
  --muted: #98a2ae;
  --line: rgba(255, 255, 255, .085);
  --line-strong: rgba(255, 255, 255, .14);
  --accent: #b8ff18;
  --accent-soft: rgba(184, 255, 24, .12);
  --accent-2: #6ee7c0;
  --danger: #ff747a;
  --warning: #ffc45d;
  --success: #76edb1;
  --shadow: 0 24px 64px rgba(0, 0, 0, .34);
  --radius: 23px;
  --radius-sm: 16px;
  color-scheme: dark;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
}

:root[data-theme="light"] {
  --bg: #f2f4f6;
  --bg-soft: #e9edf0;
  --surface: #ffffff;
  --surface-2: #f7f8f9;
  --surface-3: #edf0f2;
  --surface-soft: rgba(255, 255, 255, .96);
  --text: #111820;
  --muted: #68727d;
  --line: rgba(17, 24, 32, .10);
  --line-strong: rgba(17, 24, 32, .16);
  --accent: #8dcc00;
  --accent-soft: rgba(141, 204, 0, .12);
  --accent-2: #00a982;
  --danger: #d84952;
  --warning: #a96b00;
  --success: #09875f;
  --shadow: 0 22px 55px rgba(28, 37, 44, .12);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body { margin: 0; min-height: 100%; background: radial-gradient(circle at 50% -12%, rgba(184,255,24,.055), transparent 28%), var(--bg); color: var(--text); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
svg { display: block; }
.app-shell { min-height: 100vh; padding-bottom: calc(96px + env(safe-area-inset-bottom)); }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(19px + env(safe-area-inset-top)) 20px 16px;
  background: linear-gradient(180deg, rgba(11,16,22,.98) 0%, rgba(11,16,22,.91) 78%, rgba(11,16,22,0) 100%);
  backdrop-filter: blur(20px);
}
:root[data-theme="light"] .topbar { background: linear-gradient(180deg, rgba(242,244,246,.98), rgba(242,244,246,.91), rgba(242,244,246,0)); }
.eyebrow { margin: 0 0 5px; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .13em; font-weight: 650; }
h1 { margin: 0; font-size: clamp(30px, 8vw, 40px); letter-spacing: -.055em; line-height: 1; }
h2, h3, p { margin-top: 0; }
.content { width: min(100%, 760px); margin: 0 auto; padding: 9px 18px 34px; }
.icon-btn {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.015));
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.hero, .progress-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(184,255,24,.24);
  border-radius: 29px;
  padding: 22px;
  background:
    radial-gradient(circle at 95% 0%, rgba(184,255,24,.11), transparent 38%),
    linear-gradient(145deg, #1d2730 0%, #17212a 50%, #141b24 100%);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.05);
}
:root[data-theme="light"] .hero,
:root[data-theme="light"] .progress-hero { background: linear-gradient(145deg, #fff, #f3f8eb); }
.hero.compact { padding: 22px; }
.hero-top, .progress-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.hero h2, .progress-hero h2 { margin-bottom: 8px; font-size: 25px; letter-spacing: -.04em; }
.hero p, .progress-hero p { margin-bottom: 0; color: var(--muted); line-height: 1.45; }
.kpi { font-size: clamp(36px, 10vw, 52px); line-height: 1; font-weight: 850; letter-spacing: -.06em; margin: 5px 0 12px; }
.score-ring {
  --ring-bg: rgba(255,255,255,.08);
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(var(--accent) calc(var(--score) * 1%), var(--ring-bg) 0);
  font-size: 20px;
  font-weight: 850;
  position: relative;
}
.score-ring.large { width: 88px; height: 88px; flex-basis: 88px; font-size: 25px; }
.score-ring::after { content: ""; position: absolute; inset: 8px; border-radius: inherit; background: var(--surface); }
.score-ring span { z-index: 1; }
.capital-breakdown { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.capital-breakdown span { border: 1px solid var(--line-strong); border-radius: 999px; padding: 6px 10px; color: var(--muted); font-size: 11px; background: rgba(255,255,255,.025); }

.grid { display: grid; gap: 12px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stats { margin-top: 14px; }
.stat-card, .card, .toolbar-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 17px;
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.012)), var(--surface);
  box-shadow: 0 12px 32px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.025);
}
.stat-card { min-height: 126px; display: flex; flex-direction: column; align-items: flex-start; }
.stat-card small, .muted { color: var(--muted); }
.stat-card strong { display: block; margin: 8px 0 10px; font-size: 23px; line-height: 1; letter-spacing: -.04em; overflow-wrap: anywhere; }
.stat-card .compare { margin-top: auto; }
.section { margin-top: 27px; }
.section-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 12px; }
.section-head h2 { margin: 0; font-size: 21px; letter-spacing: -.035em; }
.link-btn { padding: 7px 2px; border: 0; background: transparent; color: var(--accent); font-weight: 780; cursor: pointer; }
.btn { border: 0; border-radius: 15px; padding: 13px 16px; font-weight: 800; cursor: pointer; }
.btn.primary { background: var(--accent); color: #11170a; box-shadow: 0 12px 24px rgba(184,255,24,.14); }
.btn.secondary { border: 1px solid var(--line); background: var(--surface-3); color: var(--text); }
.btn.full { width: 100%; }

.quick-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin-top: 14px; }
.quick-btn {
  min-height: 56px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 9px;
  background: var(--surface);
  font-weight: 790;
  cursor: pointer;
}
.quick-btn span { margin-right: 4px; color: var(--accent); font-size: 19px; }
.finance-actions { grid-template-columns: repeat(2, 1fr); }
.finance-toolbar { margin-top: 15px; }
.action-tile {
  width: 100%;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 13px 15px;
  text-align: left;
  background: var(--surface);
  cursor: pointer;
}
.action-tile-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #11170a; background: var(--accent); font-size: 22px; font-weight: 850; }
.action-tile b, .action-tile small { display: block; }
.action-tile small { color: var(--muted); margin-top: 3px; }
.action-tile i { color: var(--muted); font-style: normal; font-size: 28px; }

.list { display: grid; gap: 11px; }
.item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 19px;
  padding: 15px;
  background: var(--surface);
}
.item.overdue, .overdue-card { border-color: rgba(255,116,122,.40); }
.item-main { flex: 1; min-width: 0; }
.item-title { margin-bottom: 6px; font-weight: 790; line-height: 1.25; overflow-wrap: anywhere; }
.item-meta { color: var(--muted); font-size: 12px; line-height: 1.5; }
.item-note { margin-top: 10px; color: var(--muted); font-size: 13px; line-height: 1.5; white-space: pre-line; }
.item-actions { display: flex; gap: 7px; margin-top: 8px; }
.item-actions.end { justify-content: flex-end; }
.mini-btn { min-width: 36px; height: 36px; border: 0; border-radius: 12px; background: var(--surface-3); cursor: pointer; }
.amount-block { flex: 0 0 auto; text-align: right; }
.amount-block strong { white-space: nowrap; }
.category-icon, .account-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 14px; background: var(--surface-3); font-size: 18px; font-weight: 850; }
.category-icon.expense { color: var(--danger); background: rgba(255,116,122,.10); }
.category-icon.income { color: var(--success); background: rgba(118,237,177,.10); }
.account-icon { color: var(--accent); }

.check {
  appearance: none;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  margin: 0;
  border: 1.5px solid rgba(255,255,255,.22);
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
}
.check:checked { border-color: var(--accent); background: var(--accent); box-shadow: inset 0 0 0 5px var(--surface); }
.done .item-title { color: var(--muted); text-decoration: line-through; }
.habit-today { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.habit-today .item-title { margin: 0; }

.badge { display: inline-flex; align-items: center; gap: 4px; padding: 5px 9px; border-radius: 999px; background: var(--surface-3); color: var(--muted); font-size: 11px; font-weight: 760; vertical-align: middle; }
.badge.high { color: #ff9da1; background: rgba(255,116,122,.12); }
.badge.medium { color: #ffd58a; background: rgba(255,196,93,.11); }
.badge.low { color: var(--success); background: rgba(118,237,177,.10); }
.badge.status-doing { color: #9ebdff; }
.badge.status-waiting { color: var(--warning); }
.badge.status-done { color: var(--success); }
.pill-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.progress { height: 9px; margin-top: 11px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.075); }
.progress.thin { height: 6px; margin-top: 8px; }
.progress > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.metric-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.metric-row strong { font-size: 20px; }
.positive { color: var(--success); }
.negative { color: var(--danger); }
.compare { display: inline-flex; width: fit-content; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 780; line-height: 1.2; }
.compare.good { color: var(--success); background: rgba(118,237,177,.10); }
.compare.bad { color: var(--danger); background: rgba(255,116,122,.10); }
.compare.neutral { color: var(--muted); background: var(--surface-3); }
.insight { padding: 14px 15px; border: 1px solid rgba(184,255,24,.15); border-left: 3px solid var(--accent); border-radius: 15px; background: var(--accent-soft); color: color-mix(in srgb, var(--accent) 25%, var(--text)); line-height: 1.5; }
.insight.warning { border-color: rgba(255,196,93,.20); border-left-color: var(--warning); background: rgba(255,196,93,.07); color: color-mix(in srgb, var(--warning) 28%, var(--text)); }
.insight.danger { border-color: rgba(255,116,122,.20); border-left-color: var(--danger); background: rgba(255,116,122,.07); color: color-mix(in srgb, var(--danger) 28%, var(--text)); }

.tabs { display: flex; gap: 8px; margin: 15px 0 2px; padding: 4px; overflow-x: auto; scrollbar-width: none; border: 1px solid var(--line); border-radius: 18px; background: var(--surface-2); }
.tabs::-webkit-scrollbar, .filter-row::-webkit-scrollbar { display: none; }
.tab, .chip { border: 0; border-radius: 14px; padding: 10px 14px; background: transparent; color: var(--muted); font-weight: 760; white-space: nowrap; cursor: pointer; }
.tab.active, .chip.active { background: var(--accent); color: #11170a; box-shadow: 0 8px 20px rgba(184,255,24,.11); }
.filter-row { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 9px; scrollbar-width: none; }
.search-input, .field input, .field select, .field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 13px 14px;
  background: var(--surface-2);
  color: var(--text);
  outline: none;
}
.search-input:focus, .field input:focus, .field select:focus, .field textarea:focus { border-color: rgba(184,255,24,.55); box-shadow: 0 0 0 3px rgba(184,255,24,.08); }
.toolbar-card { margin-bottom: 13px; }

.bottom-nav {
  position: fixed;
  z-index: 40;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(100%, 760px);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: end;
  gap: 2px;
  padding: 9px 7px calc(9px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: rgba(11,16,22,.95);
  backdrop-filter: blur(22px);
}
:root[data-theme="light"] .bottom-nav { background: rgba(242,244,246,.95); }
.nav-item { min-width: 0; display: grid; justify-items: center; gap: 4px; padding: 7px 1px 3px; border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.nav-item svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.nav-item small { max-width: 100%; overflow: hidden; font-size: 9px; text-overflow: ellipsis; }
.nav-item.active { color: var(--accent); }
.global-add {
  align-self: center;
  justify-self: center;
  width: 52px;
  height: 52px;
  margin-top: -20px;
  border: 0;
  border-radius: 50%;
  background: var(--accent);
  color: #11170a;
  font-size: 31px;
  font-weight: 480;
  box-shadow: 0 12px 28px rgba(184,255,24,.22);
  cursor: pointer;
}

.modal { width: min(94vw, 620px); max-height: 88vh; margin: auto; padding: 0; border: 1px solid var(--line-strong); border-radius: 26px; background: var(--surface); color: var(--text); box-shadow: 0 34px 100px rgba(0,0,0,.60); }
.modal::backdrop { background: rgba(0,0,0,.66); backdrop-filter: blur(8px); }
.modal-card { max-height: 88vh; overflow-y: auto; padding: 19px; border: 0; background: transparent; color: inherit; }
.modal-head { position: sticky; top: -19px; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: -19px -19px 16px; padding: 18px 19px 14px; background: rgba(23,30,39,.96); backdrop-filter: blur(18px); }
:root[data-theme="light"] .modal-head { background: rgba(255,255,255,.96); }
.modal-head h2 { margin: 0; font-size: 22px; letter-spacing: -.035em; }
.modal-actions { position: sticky; bottom: -19px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; padding: 13px 0 4px; background: var(--surface); }
.modal-actions[hidden] { display: none; }
.field { display: grid; gap: 7px; margin-bottom: 14px; }
.field label { color: var(--muted); font-size: 12px; font-weight: 650; }
.field small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.field textarea { min-height: 90px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.quick-sheet { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.quick-sheet button { display: grid; justify-items: start; gap: 5px; min-height: 126px; padding: 16px; border: 1px solid var(--line); border-radius: 19px; background: var(--surface-2); text-align: left; cursor: pointer; }
.quick-sheet button span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; background: var(--accent); color: #11170a; font-size: 21px; font-weight: 850; }
.quick-sheet button b { font-size: 17px; }
.quick-sheet button small { color: var(--muted); line-height: 1.35; }

.empty-state { padding: 30px 20px; border: 1px dashed var(--line-strong); border-radius: 21px; text-align: center; color: var(--muted); }
.empty-icon { color: var(--accent); font-size: 36px; }
.empty-state h3 { margin: 8px 0 6px; color: var(--text); }
.settings-list { display: grid; margin-top: 17px; }
.settings-row { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 16px 2px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.settings-row span { display: grid; gap: 4px; }
.settings-row small { color: var(--muted); font-size: 11px; }
.settings-row.danger { color: var(--danger); }
.file-row { position: relative; }
.file-row input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.privacy-note { margin-top: 18px; color: var(--muted); font-size: 12px; line-height: 1.5; }

.bar-chart { height: 185px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; align-items: end; margin-top: 12px; }
.bar-column { min-width: 0; height: 100%; display: grid; grid-template-rows: 19px 1fr 17px; gap: 5px; text-align: center; }
.bar-value { overflow: hidden; color: var(--muted); font-size: 8px; }
.bar-track { height: 100%; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; border-radius: 10px; background: rgba(255,255,255,.035); }
.bar-track span { width: 100%; min-height: 3px; display: block; border-radius: 8px 8px 0 0; background: linear-gradient(180deg, var(--accent), var(--accent-2)); }
.bar-column small { color: var(--muted); font-size: 9px; text-transform: capitalize; }
.chart-card { overflow: hidden; }
.dual-chart { height: 190px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; align-items: end; margin-top: 8px; }
.dual-column { min-width: 0; height: 100%; display: grid; grid-template-rows: 1fr 18px; gap: 5px; }
.dual-bars { height: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 4px; padding: 0 4px; overflow: hidden; border-radius: 10px; background: rgba(255,255,255,.03); }
.dual-bars span { width: 43%; min-height: 3px; border-radius: 6px 6px 0 0; }
.income-bar { background: linear-gradient(180deg, var(--accent), var(--accent-2)); }
.expense-bar { background: linear-gradient(180deg, var(--danger), #ffae76); }
.dual-column small { color: var(--muted); font-size: 9px; text-align: center; text-transform: capitalize; }
.chart-legend { display: flex; justify-content: center; gap: 17px; margin-top: 11px; color: var(--muted); font-size: 11px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 3px; }
.legend-income { background: var(--accent); }
.legend-expense { background: var(--danger); }
.trend-footer { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.money-chart { height: 190px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; align-items: end; }
.money-column { height: 100%; display: grid; grid-template-rows: 1fr 18px; gap: 5px; text-align: center; }
.money-bar-track { height: 100%; display: flex; align-items: flex-end; overflow: hidden; border-radius: 11px; background: rgba(255,255,255,.03); }
.money-bar-track span { width: 100%; min-height: 4px; border-radius: 9px 9px 0 0; background: linear-gradient(180deg, var(--accent), #78d7a7); }
.money-column small { color: var(--muted); font-size: 9px; text-transform: capitalize; }
.category-list { display: grid; gap: 16px; }
.category-row { display: grid; gap: 3px; }

.alert-list { display: grid; gap: 9px; }
.alert-row { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 13px 14px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); }
.alert-row b { font-size: 17px; }
.alert-row span { color: var(--muted); font-size: 13px; }
.alert-row button { border: 0; background: transparent; color: var(--accent); font-weight: 780; cursor: pointer; }
.alert-row.danger { border-color: rgba(255,116,122,.34); }
.alert-row.warning { border-color: rgba(255,196,93,.34); }
.pulse-card { display: grid; gap: 15px; }
.pulse-main { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pulse-main small, .pulse-grid small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.pulse-main strong { font-size: 21px; overflow-wrap: anywhere; }
.pulse-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.pulse-grid > div { min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.pulse-grid b { font-size: 13px; overflow-wrap: anywhere; }
.discipline-strip { display: flex; align-items: baseline; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.discipline-strip strong { color: var(--accent); font-size: 27px; }
.discipline-strip span { color: var(--muted); }

.compare-panel { display: grid; gap: 16px; }
.compare-selects { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: end; }
.compare-selects label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; }
.compare-selects select { width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); color: var(--text); }
.compare-selects > span { padding-bottom: 12px; color: var(--muted); }
.comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.comparison-grid > div { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-2); }
.comparison-grid small { display: block; margin-bottom: 6px; color: var(--muted); }
.comparison-grid strong { display: block; margin-bottom: 9px; font-size: 19px; overflow-wrap: anywhere; }
.category-compare { padding-top: 15px; border-top: 1px solid var(--line); }
.category-compare h3 { margin: 0 0 8px; font-size: 16px; }
.category-delta { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.category-delta:last-child { border-bottom: 0; }
.category-delta span { display: grid; gap: 3px; }
.category-delta small { color: var(--muted); font-size: 10px; }
.category-delta b { white-space: nowrap; }

.project-card { display: grid; gap: 4px; }
.project-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 13px; }
.project-metrics.two-cols { grid-template-columns: repeat(2, 1fr); }
.project-metrics > div, .project-progress-grid > div { min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.project-metrics small, .project-progress-grid small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; }
.project-metrics strong, .project-progress-grid strong { display: block; font-size: 15px; overflow-wrap: anywhere; }
.project-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; }
.project-progress-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.growth-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin-top: 15px; }
.goal-meta-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 10px; color: var(--muted); font-size: 12px; }
.goal-card, .habit-card { background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.01)), var(--surface); }
.week-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-top: 13px; }
.day-cell { padding: 9px 3px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--muted); font-size: 11px; text-align: center; cursor: pointer; }
.day-cell.done { border-color: rgba(184,255,24,.30); background: var(--accent-soft); color: var(--accent); }
.checkbox-row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.day-checkbox input { position: absolute; opacity: 0; pointer-events: none; }
.day-checkbox span { display: grid; place-items: center; padding: 10px 3px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--muted); font-size: 12px; cursor: pointer; }
.day-checkbox input:checked + span { border-color: rgba(184,255,24,.35); background: var(--accent-soft); color: var(--accent); }

.toast { position: fixed; z-index: 100; left: 50%; bottom: calc(112px + env(safe-area-inset-bottom)); transform: translateX(-50%); padding: 12px 16px; border-radius: 14px; background: var(--accent); color: #11170a; font-weight: 820; box-shadow: var(--shadow); white-space: nowrap; }
.period-note { margin: 13px 2px 0; color: var(--muted); font-size: 11px; line-height: 1.45; }

@media (max-width: 520px) {
  .content { padding-left: 13px; padding-right: 13px; }
  .topbar { padding-left: 17px; padding-right: 17px; }
  .hero, .progress-hero { padding: 18px; border-radius: 25px; }
  .grid.two, .form-grid { grid-template-columns: 1fr; }
  .stats.grid.two, .growth-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-card { min-height: 121px; padding: 14px; }
  .stat-card strong { font-size: 20px; }
  .project-metrics { grid-template-columns: repeat(2, 1fr); }
  .pulse-grid { grid-template-columns: repeat(2, 1fr); }
  .compare-selects { grid-template-columns: 1fr; }
  .compare-selects > span { display: none; }
  .dual-chart, .money-chart, .bar-chart { height: 166px; gap: 5px; }
  .goal-meta-row { align-items: flex-start; flex-direction: column; }
  .nav-item small { font-size: 8px; }
  .global-add { width: 49px; height: 49px; }
}

@media (max-width: 370px) {
  .quick-actions { gap: 7px; }
  .quick-btn { font-size: 12px; }
  .stats.grid.two, .growth-summary { grid-template-columns: 1fr; }
  .comparison-grid { grid-template-columns: 1fr; }
  .quick-sheet { grid-template-columns: 1fr; }
  .bottom-nav { padding-left: 2px; padding-right: 2px; }
  .nav-item small { font-size: 7.5px; }
}


/* Alexander OS v5 - premium design system */
:root {
  --bg: #070c13;
  --bg-soft: #0b121b;
  --surface: #101923;
  --surface-2: #0b141e;
  --surface-3: #17222e;
  --surface-soft: rgba(15, 24, 34, .95);
  --text: #f4f7fb;
  --muted: #8794a4;
  --line: rgba(166, 187, 210, .10);
  --line-strong: rgba(166, 187, 210, .18);
  --accent: #b7ff18;
  --accent-soft: rgba(183, 255, 24, .10);
  --accent-2: #75e7ca;
  --danger: #ff666e;
  --warning: #ffb84d;
  --success: #70e9a7;
  --shadow: 0 24px 72px rgba(0, 0, 0, .44);
  --radius: 22px;
  --radius-sm: 15px;
}

body {
  background:
    radial-gradient(circle at 14% -10%, rgba(76, 145, 255, .08), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(183,255,24,.035), transparent 28%),
    linear-gradient(180deg, #080d15 0%, #060a10 100%);
}
.app-shell { max-width: 760px; margin: 0 auto; }
.topbar { padding: calc(15px + env(safe-area-inset-top)) 18px 14px; background: linear-gradient(180deg, rgba(7,12,19,.99), rgba(7,12,19,.92) 76%, rgba(7,12,19,0)); }
.topbar h1 { font-size: clamp(27px, 7vw, 34px); }
.topbar .eyebrow { font-size: 10px; letter-spacing: .18em; }
.content { padding: 6px 16px 44px; }
.icon-btn { width: 43px; height: 43px; border-radius: 15px; background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 30px rgba(0,0,0,.2); }

.hero, .progress-hero {
  border: 1px solid rgba(122, 157, 190, .17);
  border-radius: 26px;
  padding: 18px;
  background:
    radial-gradient(circle at 88% -10%, rgba(183,255,24,.08), transparent 38%),
    radial-gradient(circle at 4% 0%, rgba(64,140,255,.11), transparent 42%),
    linear-gradient(145deg, rgba(24,37,50,.97), rgba(13,23,33,.98));
  box-shadow: 0 24px 62px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.055);
}
.home-hero { padding: 16px; }
.profile-row { display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: 11px; }
.profile-avatar { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 16px; background: linear-gradient(145deg, var(--accent), #71dd9d); color: #0c130a; font-size: 15px; font-weight: 900; box-shadow: 0 12px 28px rgba(183,255,24,.12); }
.profile-copy small { color: var(--muted); font-size: 11px; }
.profile-copy h2 { margin: 2px 0 0; font-size: 20px; letter-spacing: -.035em; }
.profile-copy h2 span { font-size: 17px; }
.status-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 6px rgba(183,255,24,.08), 0 0 18px rgba(183,255,24,.55); }
.focus-card { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; margin-top: 15px; padding: 15px; border: 1px solid rgba(166,187,210,.11); border-radius: 20px; background: rgba(5,12,20,.45); }
.focus-card small, .focus-card span { display: block; color: var(--muted); font-size: 11px; }
.focus-card strong { display: block; margin: 6px 0 5px; font-size: 16px; line-height: 1.3; }
.score-ring { width: 62px; height: 62px; flex-basis: 62px; font-size: 14px; }
.score-ring::after { inset: 7px; background: #101923; }

.premium-actions { gap: 9px; margin-top: 11px; }
.quick-btn { min-height: 48px; border-radius: 16px; background: linear-gradient(145deg, rgba(24,34,46,.95), rgba(13,22,31,.97)); box-shadow: inset 0 1px 0 rgba(255,255,255,.035); font-size: 13px; }
.quick-btn span { font-size: 17px; }
.quick-btn.expense-action span { color: #ff7a48; }

.stat-card, .card, .toolbar-card, .item {
  border-color: rgba(166,187,210,.105);
  background: linear-gradient(145deg, rgba(20,31,43,.98), rgba(12,21,31,.98));
  box-shadow: 0 15px 38px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
.stat-card { min-height: 116px; padding: 15px; }
.stat-card strong { font-size: 22px; }
.section { margin-top: 23px; }
.compact-section { margin-top: 16px; }
.section-head { margin-bottom: 10px; }
.section-head h2 { font-size: 19px; }
.link-btn { color: var(--accent); font-size: 13px; }

.premium-pulse { padding: 14px; }
.premium-pulse .pulse-main { gap: 10px; }
.premium-pulse .pulse-main > div { padding: 12px; border-radius: 17px; background: rgba(255,255,255,.025); }
.premium-pulse .pulse-main strong { font-size: 23px; }
.premium-pulse .pulse-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; margin-top: 9px; }
.premium-pulse .pulse-grid > div { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px; padding: 12px; border-radius: 17px; background: rgba(255,255,255,.025); }
.premium-pulse .pulse-grid b { grid-row: 2; }
.premium-pulse .compare { grid-column: 2; grid-row: 1 / span 2; }
.money-mini-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.money-mini-card { border: 1px solid var(--line); border-radius: 20px; padding: 15px; text-align: left; background: linear-gradient(145deg, rgba(20,31,43,.98), rgba(12,21,31,.98)); color: var(--text); }
.money-mini-card small, .money-mini-card span { display: block; color: var(--muted); }
.money-mini-card strong { display: block; margin: 8px 0 4px; font-size: 20px; }
.money-mini-card span { font-size: 11px; }

.finance-hero { overflow: hidden; }
.finance-hero-head { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.finance-hero .kpi { margin-bottom: 3px; font-size: clamp(38px, 10vw, 54px); }
.hero-sparkline { height: 88px; margin: 3px -5px 1px; color: var(--accent); opacity: .95; }
.hero-sparkline svg { width: 100%; height: 100%; }
.hero-spark-empty { height: 56px; display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.finance-hero .capital-breakdown { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 5px; }
.finance-hero .capital-breakdown span { display: grid; gap: 4px; border: 0; border-radius: 14px; padding: 10px; background: rgba(255,255,255,.026); color: var(--text); font-size: 12px; font-weight: 760; }
.finance-hero .capital-breakdown small { color: var(--muted); font-size: 9px; font-weight: 650; }
.finance-tabs, .progress-tabs { border-radius: 16px; padding: 3px; background: rgba(11,18,27,.86); }
.finance-tabs .tab, .progress-tabs .tab { flex: 1; padding: 9px 11px; font-size: 12px; }
.finance-tabs .tab.active, .progress-tabs .tab.active { background: linear-gradient(135deg, var(--accent), #8fe85b); }
.action-tile { border-radius: 18px; padding: 12px 14px; }
.action-tile-icon { background: rgba(183,255,24,.13); color: var(--accent); }
.chart-card { overflow: hidden; }
.dual-chart, .money-chart { height: 180px; }
.category-row + .category-row { margin-top: 14px; }

.item { border-radius: 18px; padding: 14px; }
.category-icon, .account-icon { border-radius: 13px; }
.project-card { padding: 16px; }
.project-card .item-title { font-size: 17px; }
.project-metrics { margin-top: 12px; }
.project-metrics > div { border-radius: 14px; background: rgba(255,255,255,.025); }
.project-card .insight { border-left-width: 2px; background: rgba(183,255,24,.055); }

.progress-hero { align-items: center; }
.progress-tabs { position: sticky; top: calc(72px + env(safe-area-inset-top)); z-index: 15; backdrop-filter: blur(18px); }
.growth-summary { gap: 10px; }
.goal-card { overflow: hidden; }
.habit-card .week-grid { gap: 7px; }
.day-cell { border-radius: 13px; }

.bottom-nav {
  width: min(100%, 760px);
  grid-template-columns: repeat(6, 1fr);
  padding: 8px 7px calc(8px + env(safe-area-inset-bottom));
  background: rgba(6,11,18,.96);
  border-top-color: rgba(166,187,210,.10);
  box-shadow: 0 -18px 50px rgba(0,0,0,.22);
}
.nav-item[data-screen="dashboard"] { grid-column: 1; }
.nav-item[data-screen="tasks"] { grid-column: 2; }
.nav-item[data-screen="finance"] { grid-column: 3; }
.nav-item[data-screen="projects"] { grid-column: 5; }
.nav-item[data-screen="growth"] { grid-column: 6; }
.nav-item { min-height: 55px; }
.nav-item svg { width: 20px; height: 20px; }
.nav-item small { font-size: 9px; }
.global-add {
  position: absolute;
  left: 50%;
  top: 5px;
  transform: translateX(-50%);
  width: 50px;
  height: 50px;
  margin: 0;
  border: 5px solid #070c13;
  background: linear-gradient(145deg, #c7ff37, #99ef1e);
  box-shadow: 0 12px 30px rgba(183,255,24,.28);
}

.modal { border-radius: 28px; border-color: rgba(166,187,210,.16); background: #0d1620; }
.modal-card { padding: 18px; }
.modal-head { background: rgba(13,22,32,.97); }
.modal-actions { background: #0d1620; }
.field input, .field select, .field textarea, .search-input { background: #0a131d; border-color: rgba(166,187,210,.13); }
.btn.primary { background: linear-gradient(135deg, var(--accent), #83e994); }
.settings-row.featured { border-color: rgba(183,255,24,.24); background: linear-gradient(145deg, rgba(183,255,24,.10), rgba(20,31,43,.96)); }
.settings-row.featured b { color: var(--accent); }
.privacy-note b { color: var(--warning); }

@media (max-width: 430px) {
  .content { padding-inline: 14px; }
  .topbar { padding-inline: 16px; }
  .hero, .progress-hero { border-radius: 24px; }
  .finance-hero .capital-breakdown span { padding: 8px; font-size: 10px; }
  .grid.two, .growth-summary { gap: 9px; }
  .stat-card { min-height: 108px; padding: 13px; }
  .stat-card strong { font-size: 20px; }
  .money-mini-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 360px) {
  .quick-actions { gap: 6px; }
  .quick-btn { padding-inline: 6px; font-size: 11px; }
  .finance-hero .capital-breakdown { grid-template-columns: 1fr; }
  .finance-hero .capital-breakdown span { grid-template-columns: 1fr auto; }
  .money-mini-grid { grid-template-columns: 1fr; }
}


/* Alexander OS v6 - Forest Glass design */
:root {
  --bg: #07150f;
  --bg-soft: #0b1d15;
  --surface: #10261b;
  --surface-2: #0b1b13;
  --surface-3: #193326;
  --surface-soft: rgba(14, 36, 25, .95);
  --text: #f4fff7;
  --muted: #9bb4a5;
  --line: rgba(211, 255, 222, .09);
  --line-strong: rgba(211, 255, 222, .16);
  --accent: #a8ff78;
  --accent-strong: #79ed8b;
  --accent-soft: rgba(168, 255, 120, .12);
  --accent-2: #70e7ba;
  --danger: #ff7b83;
  --warning: #ffd26e;
  --success: #7af0ad;
  --shadow: 0 24px 68px rgba(0, 16, 7, .42);
  --radius: 24px;
  --radius-sm: 16px;
}

:root[data-theme="light"] {
  --bg: #edf4ed;
  --bg-soft: #e4eee5;
  --surface: #ffffff;
  --surface-2: #f6faf6;
  --surface-3: #e7f1e8;
  --surface-soft: rgba(255, 255, 255, .96);
  --text: #102116;
  --muted: #617266;
  --line: rgba(16, 33, 22, .09);
  --line-strong: rgba(16, 33, 22, .16);
  --accent: #65d86e;
  --accent-strong: #42bb62;
  --accent-soft: rgba(101, 216, 110, .13);
  --accent-2: #00a77a;
  --danger: #ce4d5d;
  --warning: #a86b00;
  --success: #16885b;
}

html, body { background: var(--bg); }
body {
  background:
    radial-gradient(circle at 8% -8%, rgba(168,255,120,.16), transparent 30%),
    radial-gradient(circle at 100% 16%, rgba(79,195,119,.11), transparent 26%),
    linear-gradient(180deg, #0b2117 0%, #07150f 34%, #06110c 100%);
}
:root[data-theme="light"] body {
  background:
    radial-gradient(circle at 8% -8%, rgba(101,216,110,.16), transparent 30%),
    linear-gradient(180deg, #f4f8f4, #edf4ed);
}

.app-shell { max-width: 760px; margin: 0 auto; padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
.content { padding: 8px 16px 42px; }

.topbar {
  padding: calc(14px + env(safe-area-inset-top)) 16px 13px;
  gap: 12px;
  background: linear-gradient(180deg, rgba(7,21,15,.99), rgba(7,21,15,.94) 76%, rgba(7,21,15,0));
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}
:root[data-theme="light"] .topbar { background: linear-gradient(180deg, rgba(237,244,237,.99), rgba(237,244,237,.94) 76%, rgba(237,244,237,0)); }
.topbar-brand { min-width: 0; display: flex; align-items: center; gap: 11px; }
.brand-mark {
  width: 43px;
  height: 43px;
  flex: 0 0 43px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background:
    radial-gradient(circle at 70% 16%, rgba(255,255,255,.58), transparent 20%),
    linear-gradient(145deg, #d7ffab 0%, #83f28c 55%, #4dcf78 100%);
  color: #0b2a16;
  font-size: 25px;
  font-weight: 950;
  font-style: italic;
  letter-spacing: -.12em;
  box-shadow: 0 13px 28px rgba(92, 231, 123, .22), inset 0 1px 0 rgba(255,255,255,.7);
}
.topbar-copy { min-width: 0; }
.topbar .eyebrow { margin-bottom: 3px; color: #9eb7a6; font-size: 9px; letter-spacing: .18em; }
.topbar h1 { overflow: hidden; font-size: clamp(25px, 7vw, 33px); text-overflow: ellipsis; white-space: nowrap; }
.topbar-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.icon-btn,
.top-add {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.icon-btn {
  border: 1px solid var(--line-strong);
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 22px rgba(0,0,0,.18);
}
.top-add {
  position: static;
  margin: 0;
  border: 0;
  background: linear-gradient(145deg, #d4ffa4, #72e986);
  color: #0a2714;
  box-shadow: 0 12px 26px rgba(112,233,134,.24), inset 0 1px 0 rgba(255,255,255,.65);
}
.top-add svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 2.3; stroke-linecap: round; }
.top-add:active { transform: scale(.96); }

.hero, .progress-hero,
.stat-card, .card, .toolbar-card, .item, .money-mini-card, .action-tile {
  border-color: rgba(211,255,222,.105);
  background:
    linear-gradient(145deg, rgba(255,255,255,.042), rgba(255,255,255,.014)),
    linear-gradient(145deg, #112a1e, #0b1d15);
  box-shadow: 0 16px 42px rgba(0,10,5,.24), inset 0 1px 0 rgba(255,255,255,.04);
}
.hero, .progress-hero {
  border-radius: 27px;
  background:
    radial-gradient(circle at 86% -5%, rgba(168,255,120,.18), transparent 40%),
    radial-gradient(circle at 0% 100%, rgba(79,195,119,.11), transparent 36%),
    linear-gradient(145deg, #173729 0%, #10281c 50%, #0b1d15 100%);
}
.home-hero { padding: 17px; }
.profile-avatar {
  background: linear-gradient(145deg, #dcffbd, #74e98a);
  color: #0c2a15;
  border-radius: 15px;
  box-shadow: 0 12px 27px rgba(112,233,134,.18);
}
.status-dot { background: var(--accent); box-shadow: 0 0 0 6px rgba(168,255,120,.08), 0 0 18px rgba(168,255,120,.5); }
.focus-card { border-color: rgba(211,255,222,.11); background: rgba(2,14,8,.35); }
.score-ring { background: conic-gradient(var(--accent) calc(var(--score) * 1%), rgba(255,255,255,.08) 0); }
.score-ring::after { background: #10261b; }

.quick-btn {
  border-color: rgba(211,255,222,.10);
  background: linear-gradient(145deg, rgba(27,59,42,.96), rgba(11,29,20,.98));
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 22px rgba(0,0,0,.16);
}
.quick-btn span { color: var(--accent); }
.quick-btn.expense-action span { color: #ff9971; }
.quick-btn:active { transform: translateY(1px); }

.finance-hero {
  border: 0;
  background:
    radial-gradient(circle at 86% 7%, rgba(255,255,255,.52), transparent 27%),
    linear-gradient(135deg, #d9ffad 0%, #a9fa91 43%, #70dda0 100%);
  color: #092617;
  box-shadow: 0 24px 58px rgba(42, 143, 73, .24), inset 0 1px 0 rgba(255,255,255,.75);
}
.finance-hero .eyebrow,
.finance-hero .muted,
.finance-hero small { color: rgba(8,38,22,.68); }
.finance-hero .hero-sparkline { color: #155b31; }
.finance-hero .compare.good,
.finance-hero .compare.bad,
.finance-hero .compare.neutral { border-color: rgba(8,38,22,.12); background: rgba(255,255,255,.32); color: #103f24; }
.finance-hero .capital-breakdown span { background: rgba(8,38,22,.14); color: #06190f; box-shadow: inset 0 1px 0 rgba(255,255,255,.16); }
.finance-hero .capital-breakdown small { color: #092617; font-weight: 800; letter-spacing: .02em; }
.finance-hero .progress { background: rgba(8,38,22,.14); }
.finance-hero .progress > span { background: #0c4a28; }
.finance-hero .kpi { color: #082518; }

.finance-tabs, .progress-tabs, .tabs {
  border: 1px solid rgba(211,255,222,.075);
  background: rgba(4,17,10,.58);
}
.finance-tabs .tab.active, .progress-tabs .tab.active, .tab.active {
  background: linear-gradient(135deg, #d6ffac, #79e88e);
  color: #0a2815;
  box-shadow: 0 8px 18px rgba(91,215,116,.16);
}

.action-tile-icon { background: linear-gradient(145deg, #d5ffab, #77e68b); color: #0a2815; }
.link-btn { color: var(--accent); }
.btn.primary { background: linear-gradient(135deg, #d5ffab, #75e58a); color: #092416; box-shadow: 0 12px 25px rgba(111,230,136,.19); }
.btn.secondary { background: #183327; }
.badge { background: rgba(255,255,255,.055); }
.progress { background: rgba(255,255,255,.075); }
.progress > span { background: linear-gradient(90deg, #bfff82, #67dc91); }
.category-icon, .account-icon { background: rgba(255,255,255,.055); }
.project-metrics > div { background: rgba(255,255,255,.035); }
.day-cell { background: rgba(255,255,255,.035); }

.modal {
  border-color: rgba(211,255,222,.16);
  background: #0c2117;
  box-shadow: 0 30px 100px rgba(0,0,0,.62);
}
.modal-card { background: #0c2117; }
.modal-head { background: rgba(12,33,23,.98); }
.modal-actions { background: #0c2117; }
.field input, .field select, .field textarea, .search-input {
  border-color: rgba(211,255,222,.13);
  background: #07180f;
}
.settings-row.featured {
  border-color: rgba(168,255,120,.24);
  background: linear-gradient(145deg, rgba(168,255,120,.11), rgba(16,42,30,.96));
}

.bottom-nav {
  position: fixed;
  z-index: 40;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(100%, 760px);
  min-height: calc(72px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  padding: 6px 7px calc(6px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(211,255,222,.09);
  background: rgba(5,17,11,.96);
  box-shadow: 0 -18px 50px rgba(0,0,0,.28);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
:root[data-theme="light"] .bottom-nav { background: rgba(245,249,245,.96); }
.bottom-nav .nav-item {
  min-width: 0;
  min-height: 59px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 2px 5px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.bottom-nav .nav-item svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.bottom-nav .nav-item small {
  width: 100%;
  overflow: hidden;
  color: inherit;
  font-size: 9px;
  font-weight: 680;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bottom-nav .nav-item.active {
  color: var(--accent);
  background: linear-gradient(180deg, rgba(168,255,120,.08), rgba(168,255,120,0));
}
.bottom-nav .nav-item.active svg { filter: drop-shadow(0 0 8px rgba(168,255,120,.28)); }

.toast { bottom: calc(86px + env(safe-area-inset-bottom)); }
.content { padding-bottom: calc(90px + env(safe-area-inset-bottom)); }

@media (max-width: 430px) {
  .content { padding-inline: 13px; }
  .topbar { padding-inline: 13px; }
  .brand-mark { width: 40px; height: 40px; flex-basis: 40px; border-radius: 14px; font-size: 23px; }
  .icon-btn, .top-add { width: 40px; height: 40px; border-radius: 14px; }
  .topbar-actions { gap: 7px; }
  .hero, .progress-hero { border-radius: 24px; }
  .bottom-nav { padding-inline: 3px; }
  .bottom-nav .nav-item { gap: 5px; padding-inline: 1px; }
  .bottom-nav .nav-item small { font-size: 8.5px; }
}

@media (max-width: 350px) {
  .topbar-brand { gap: 8px; }
  .brand-mark { width: 36px; height: 36px; flex-basis: 36px; font-size: 21px; }
  .icon-btn, .top-add { width: 36px; height: 36px; }
  .topbar h1 { font-size: 23px; }
  .bottom-nav .nav-item small { font-size: 7.6px; }
  .bottom-nav .nav-item svg { width: 19px; height: 19px; }
}


/* Alexander OS v7 - iOS 27 inspired Liquid Glass */
:root {
  --bg: #06140d;
  --bg-soft: #0b1e15;
  --surface: rgba(19, 44, 31, .62);
  --surface-2: rgba(10, 29, 19, .66);
  --surface-3: rgba(255, 255, 255, .075);
  --surface-soft: rgba(13, 35, 24, .76);
  --text: #f7fff9;
  --muted: rgba(219, 238, 225, .66);
  --line: rgba(225, 255, 234, .105);
  --line-strong: rgba(225, 255, 234, .18);
  --accent: #a9ff72;
  --accent-strong: #76ec8c;
  --accent-soft: rgba(169, 255, 114, .14);
  --accent-2: #72e4b1;
  --danger: #ff7e89;
  --warning: #ffd36d;
  --success: #82f2b2;
  --shadow: 0 24px 80px rgba(0, 15, 7, .38);
  --glass-shadow: 0 18px 48px rgba(0, 10, 5, .24), inset 0 1px 0 rgba(255,255,255,.08);
  --radius: 26px;
  --radius-sm: 18px;
}

:root[data-theme="light"] {
  --bg: #edf6ef;
  --bg-soft: #e5f0e8;
  --surface: rgba(255,255,255,.68);
  --surface-2: rgba(248,252,249,.75);
  --surface-3: rgba(16, 42, 27, .07);
  --surface-soft: rgba(255,255,255,.78);
  --text: #102118;
  --muted: rgba(40, 65, 49, .64);
  --line: rgba(16, 42, 27, .10);
  --line-strong: rgba(16, 42, 27, .17);
  --accent: #61d46e;
  --accent-strong: #3ebd5d;
  --accent-soft: rgba(97,212,110,.15);
  --accent-2: #00aa7c;
}

html { background: var(--bg); }
body {
  background:
    radial-gradient(circle at 10% -8%, rgba(169,255,114,.22), transparent 29%),
    radial-gradient(circle at 96% 12%, rgba(58,178,108,.16), transparent 31%),
    radial-gradient(circle at 45% 110%, rgba(82,217,152,.10), transparent 34%),
    linear-gradient(180deg, #0b2418 0%, #06140d 42%, #041009 100%);
  background-attachment: fixed;
}
:root[data-theme="light"] body {
  background:
    radial-gradient(circle at 10% -8%, rgba(112,231,132,.24), transparent 30%),
    radial-gradient(circle at 96% 12%, rgba(76,188,124,.15), transparent 31%),
    linear-gradient(180deg, #f7fbf8, #eaf4ed);
}

.app-shell {
  min-height: 100dvh;
  max-width: 760px;
  margin: 0 auto;
  padding-bottom: calc(92px + env(safe-area-inset-bottom));
}
.content {
  min-height: calc(100dvh - 164px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  padding: 10px 15px calc(112px + env(safe-area-inset-bottom));
}

.topbar {
  top: 0;
  margin: 0 auto;
  padding: calc(12px + env(safe-area-inset-top)) 15px 12px;
  background: linear-gradient(180deg, rgba(4,16,9,.90), rgba(4,16,9,.66) 76%, transparent);
  -webkit-backdrop-filter: blur(32px) saturate(150%);
  backdrop-filter: blur(32px) saturate(150%);
}
:root[data-theme="light"] .topbar {
  background: linear-gradient(180deg, rgba(239,247,241,.90), rgba(239,247,241,.70) 76%, transparent);
}
.topbar-brand { gap: 10px; }
.brand-mark {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
  border: 1px solid rgba(255,255,255,.44);
  border-radius: 14px;
  background:
    radial-gradient(circle at 30% 16%, rgba(255,255,255,.84), transparent 22%),
    linear-gradient(145deg, rgba(216,255,189,.98), rgba(116,235,139,.96) 62%, rgba(65,190,104,.98));
  color: #0a2914;
  box-shadow: 0 12px 30px rgba(93,225,124,.26), inset 0 1px 0 rgba(255,255,255,.72);
}
.topbar .eyebrow { color: var(--muted); font-size: 9px; letter-spacing: .17em; }
.topbar h1 { font-size: clamp(25px, 7vw, 34px); letter-spacing: -.052em; }
.topbar-actions { margin-left: auto; }
.top-add {
  width: 43px;
  height: 43px;
  border: 1px solid rgba(255,255,255,.50);
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 18%, rgba(255,255,255,.92), transparent 25%),
    linear-gradient(145deg, #d8ffae, #77ed8c 66%, #56c977);
  color: #082615;
  box-shadow: 0 15px 34px rgba(111,235,139,.28), inset 0 1px 0 rgba(255,255,255,.75);
}
.top-add:active { transform: scale(.94); }

.hero, .progress-hero,
.stat-card, .card, .toolbar-card, .item, .money-mini-card, .action-tile,
.empty-state, .focus-card, .insight, .settings-row.featured {
  border: 1px solid var(--line);
  background:
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.018) 52%, rgba(255,255,255,.035)),
    rgba(11, 31, 20, .62);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
}
:root[data-theme="light"] .hero,
:root[data-theme="light"] .progress-hero,
:root[data-theme="light"] .stat-card,
:root[data-theme="light"] .card,
:root[data-theme="light"] .toolbar-card,
:root[data-theme="light"] .item,
:root[data-theme="light"] .money-mini-card,
:root[data-theme="light"] .action-tile,
:root[data-theme="light"] .empty-state,
:root[data-theme="light"] .focus-card,
:root[data-theme="light"] .insight {
  background: linear-gradient(150deg, rgba(255,255,255,.90), rgba(255,255,255,.60));
}
.hero, .progress-hero {
  border-radius: 29px;
  background:
    radial-gradient(circle at 88% -8%, rgba(169,255,114,.22), transparent 42%),
    radial-gradient(circle at -4% 110%, rgba(67,183,117,.16), transparent 39%),
    linear-gradient(145deg, rgba(25,62,43,.80), rgba(9,31,20,.74));
}
.finance-hero {
  border: 1px solid rgba(255,255,255,.42);
  background:
    radial-gradient(circle at 85% 4%, rgba(255,255,255,.65), transparent 27%),
    linear-gradient(135deg, #e2ffbd 0%, #b5fb9c 42%, #78e2a2 100%);
  color: #082617;
  box-shadow: 0 28px 70px rgba(56,160,88,.28), inset 0 1px 0 rgba(255,255,255,.86);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.stat-card, .card, .toolbar-card, .item { border-radius: 24px; }
.stat-card { min-height: 118px; }
.section { margin-top: 24px; }
.section-head h2 { font-size: 21px; }

.quick-btn, .btn, .mini-btn, .link-btn, .tab, .filter, .icon-btn, .settings-row {
  -webkit-tap-highlight-color: transparent;
}
.quick-btn {
  border: 1px solid var(--line);
  border-radius: 19px;
  background:
    linear-gradient(150deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    rgba(12, 36, 24, .68);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 10px 24px rgba(0,0,0,.17);
}
.quick-btn:active, .btn:active, .mini-btn:active, .nav-item:active { transform: scale(.97); }
.btn.primary {
  background: linear-gradient(135deg, #d9ffaf, #78e98c);
  color: #082617;
  box-shadow: 0 13px 30px rgba(103,228,133,.22), inset 0 1px 0 rgba(255,255,255,.70);
}
.btn.secondary, .mini-btn {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.07);
}
.tabs, .finance-tabs, .progress-tabs {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(4,17,10,.42);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
}
.tab.active, .finance-tabs .tab.active, .progress-tabs .tab.active {
  border: 1px solid rgba(255,255,255,.52);
  background: linear-gradient(135deg, #dcffb6, #79e98d);
  color: #082617;
  box-shadow: 0 8px 20px rgba(100,221,128,.22), inset 0 1px 0 rgba(255,255,255,.70);
}

.field input, .field select, .field textarea, .search-input {
  border: 1px solid var(--line-strong);
  border-radius: 15px;
  background: rgba(1, 15, 7, .46);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
:root[data-theme="light"] .field input,
:root[data-theme="light"] .field select,
:root[data-theme="light"] .field textarea,
:root[data-theme="light"] .search-input { background: rgba(255,255,255,.72); }

.modal {
  width: min(94vw, 620px);
  max-height: 88dvh;
  border: 1px solid rgba(225,255,234,.18);
  border-radius: 30px;
  background: rgba(8, 27, 17, .78);
  box-shadow: 0 38px 120px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(36px) saturate(160%);
  backdrop-filter: blur(36px) saturate(160%);
}
.modal::backdrop {
  background: rgba(0, 10, 4, .58);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.modal-card { background: transparent; }
.modal-head, .modal-actions {
  background: rgba(8,27,17,.84);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  backdrop-filter: blur(30px) saturate(150%);
}
.settings-row {
  margin-bottom: 8px;
  padding: 14px 14px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: rgba(255,255,255,.035);
}
.settings-row:last-child { margin-bottom: 0; }
.settings-row.featured {
  background:
    radial-gradient(circle at 92% 0%, rgba(169,255,114,.16), transparent 40%),
    rgba(255,255,255,.045);
}

.fab { display: none !important; }

.bottom-nav {
  position: fixed;
  z-index: 60;
  left: 50%;
  bottom: calc(8px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: min(calc(100% - 16px), 744px);
  min-height: 66px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: center;
  gap: 2px;
  padding: 5px;
  border: 1px solid rgba(225,255,234,.13);
  border-radius: 27px;
  background:
    linear-gradient(150deg, rgba(255,255,255,.08), rgba(255,255,255,.018)),
    rgba(4, 18, 10, .74);
  box-shadow: 0 20px 58px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.075);
  -webkit-backdrop-filter: blur(32px) saturate(170%);
  backdrop-filter: blur(32px) saturate(170%);
}
:root[data-theme="light"] .bottom-nav {
  background: linear-gradient(150deg, rgba(255,255,255,.90), rgba(255,255,255,.64));
  border-color: rgba(16,42,27,.10);
}
.bottom-nav .nav-item,
.nav-item[data-screen="dashboard"],
.nav-item[data-screen="tasks"],
.nav-item[data-screen="finance"],
.nav-item[data-screen="projects"],
.nav-item[data-screen="growth"] {
  grid-column: auto !important;
  min-width: 0;
  min-height: 54px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 5px 1px 4px;
  border: 1px solid transparent;
  border-radius: 18px;
  background: transparent;
  color: var(--muted);
  transition: background .18s ease, color .18s ease, transform .12s ease;
}
.bottom-nav .nav-item svg {
  width: 20px;
  height: 20px;
  stroke-width: 1.8;
}
.bottom-nav .nav-item small {
  max-width: 100%;
  overflow: hidden;
  font-size: 8px;
  font-weight: 650;
  line-height: 1;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bottom-nav .nav-item.active {
  border-color: rgba(169,255,114,.16);
  background:
    radial-gradient(circle at 50% 0%, rgba(169,255,114,.15), transparent 70%),
    rgba(169,255,114,.055);
  color: var(--accent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.bottom-nav .nav-item.active svg { filter: drop-shadow(0 0 8px rgba(169,255,114,.28)); }
.bottom-nav .settings-nav small { font-size: 7.2px; }
.toast { bottom: calc(88px + env(safe-area-inset-bottom)); }

@media (max-width: 430px) {
  .content { padding-inline: 13px; }
  .topbar { padding-inline: 13px; }
  .brand-mark { width: 39px; height: 39px; flex-basis: 39px; border-radius: 13px; font-size: 23px; }
  .top-add { width: 40px; height: 40px; }
  .bottom-nav { width: calc(100% - 12px); gap: 0; padding-inline: 3px; }
  .bottom-nav .nav-item { min-height: 53px; border-radius: 16px; }
  .bottom-nav .nav-item svg { width: 19px; height: 19px; }
  .bottom-nav .nav-item small { font-size: 7.6px; }
  .bottom-nav .settings-nav small { font-size: 6.7px; }
}

@media (max-width: 350px) {
  .topbar h1 { font-size: 23px; }
  .brand-mark { width: 36px; height: 36px; flex-basis: 36px; }
  .top-add { width: 36px; height: 36px; }
  .bottom-nav { width: calc(100% - 8px); padding-inline: 2px; }
  .bottom-nav .nav-item { min-height: 51px; padding-inline: 0; }
  .bottom-nav .nav-item svg { width: 18px; height: 18px; }
  .bottom-nav .nav-item small { font-size: 6.8px; }
  .bottom-nav .settings-nav small { font-size: 6.1px; }
}

@media (max-width: 520px) {
  .modal {
    width: 100%;
    max-width: 100%;
    max-height: 89dvh;
    margin: auto 0 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 30px 30px 0 0;
  }
  .modal-card { max-height: 89dvh; }
  .modal-head::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 50%;
    width: 38px;
    height: 5px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: rgba(255,255,255,.22);
  }
  .modal-head { padding-top: 24px; }
}

/* v8 - income structure, simple projects and knowledge base */
.income-target-card { display:grid; gap:14px; }
.income-target-card .target-percent { min-width:58px; height:58px; border-radius:18px; display:grid; place-items:center; background:rgba(121,232,142,.13); color:var(--accent); font-weight:850; font-size:18px; }
.income-source-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.income-source-grid > div { padding:12px; border-radius:16px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.05); display:grid; gap:5px; }
.income-source-grid small { color:var(--muted); }
.income-source-grid strong { font-size:15px; }
.knowledge-toolbar { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:12px; }
.folder-chip-row { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; scrollbar-width:none; }
.folder-chip-row::-webkit-scrollbar { display:none; }
.knowledge-folder { white-space:nowrap; }
.knowledge-folder small { opacity:.65; margin-left:4px; }
.knowledge-list { max-height:min(64vh,620px); overflow:auto; padding-right:2px; }
.knowledge-note { display:grid; gap:10px; }
.knowledge-note .item-note { line-height:1.5; white-space:normal; }
.project-metrics.two-cols { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:360px){ .income-source-grid { grid-template-columns:1fr; } }


/* v8.1 finance and tasks polish */
.month-picker { display:grid; gap:4px; font-size:12px; color:var(--muted); }
.month-picker input { min-width:140px; padding:10px 14px; border-radius:16px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.05); color:var(--text); }
.income-target-card.polished { gap:18px; }
.income-target-top { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:start; }
.headline-amount { display:block; margin-top:4px; font-size:clamp(28px,4.8vw,56px); line-height:1.02; }
.income-target-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.income-target-meta > div, .income-source-grid > div { padding:14px 16px; border-radius:18px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06); }
.details-card summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; font-weight:700; }
.details-card summary::-webkit-details-marker { display:none; }
.details-card summary small { display:block; color:var(--muted); font-weight:500; }
.details-card .details-body { margin-top:14px; }
.compact-kpis .stat-card strong { font-size:24px; }
.knowledge-preview-card { display:grid; gap:12px; }
.knowledge-list.inline { max-height:none; }
.action-inline { display:flex; gap:8px; flex-wrap:wrap; }
@media (max-width:640px) {
  .income-target-top, .income-target-meta { grid-template-columns:1fr; }
}

/* Alexander OS v9 - Production Emerald UI */
:root,
:root[data-theme="emerald"] {
  --bg: #03130b;
  --bg-soft: #071e12;
  --surface: rgba(15, 47, 31, .78);
  --surface-2: rgba(7, 30, 18, .82);
  --surface-3: rgba(221, 255, 230, .085);
  --surface-soft: rgba(10, 39, 24, .90);
  --text: #f7fff9;
  --muted: #9fb8a7;
  --line: rgba(222, 255, 231, .11);
  --line-strong: rgba(222, 255, 231, .19);
  --accent: #9dff67;
  --accent-strong: #65e97d;
  --accent-soft: rgba(157, 255, 103, .14);
  --accent-2: #73e7ae;
  --danger: #ff858d;
  --warning: #ffd06b;
  --success: #78efac;
  --shadow: 0 24px 72px rgba(0, 16, 8, .44);
  color-scheme: dark;
}

:root[data-theme="graphite"] {
  --bg: #090d12;
  --bg-soft: #101720;
  --surface: rgba(26, 34, 45, .88);
  --surface-2: rgba(16, 23, 32, .90);
  --surface-3: rgba(255,255,255,.075);
  --surface-soft: rgba(22, 30, 39, .94);
  --text: #f7f9fc;
  --muted: #9ca8b6;
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.17);
  --accent: #a9ff72;
  --accent-strong: #78eb8e;
  --accent-soft: rgba(169,255,114,.13);
  --accent-2: #6fdcc5;
  --danger: #ff8088;
  --warning: #ffcc67;
  --success: #7cebb1;
  --shadow: 0 24px 72px rgba(0,0,0,.42);
  color-scheme: dark;
}

:root[data-theme="light"] {
  --bg: #edf5ef;
  --bg-soft: #e4eee7;
  --surface: rgba(255,255,255,.88);
  --surface-2: rgba(248,252,249,.94);
  --surface-3: rgba(16,42,27,.075);
  --surface-soft: rgba(255,255,255,.94);
  --text: #102218;
  --muted: #617367;
  --line: rgba(16,42,27,.10);
  --line-strong: rgba(16,42,27,.18);
  --accent: #4fcf65;
  --accent-strong: #2fb954;
  --accent-soft: rgba(79,207,101,.14);
  --accent-2: #00a77a;
  --danger: #ce4d59;
  --warning: #a96d00;
  --success: #15875a;
  --shadow: 0 22px 62px rgba(39,73,50,.14);
  color-scheme: light;
}

body {
  background:
    radial-gradient(circle at 12% -5%, color-mix(in srgb, var(--accent) 19%, transparent), transparent 30%),
    radial-gradient(circle at 100% 10%, color-mix(in srgb, var(--accent-2) 13%, transparent), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 84%, #0d2b1a), var(--bg) 48%, color-mix(in srgb, var(--bg) 94%, #000));
  background-attachment: fixed;
}

.topbar {
  border-bottom: 1px solid color-mix(in srgb, var(--line) 55%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 96%, transparent), color-mix(in srgb, var(--bg) 88%, transparent));
  box-shadow: 0 12px 36px color-mix(in srgb, var(--bg) 70%, transparent);
}

.brand-mark,
.top-add {
  border: 1px solid rgba(255,255,255,.62);
  background:
    radial-gradient(circle at 70% 16%, rgba(255,255,255,.72), transparent 22%),
    linear-gradient(145deg, #d9ffaf 0%, #83f18d 53%, #4fcf78 100%);
  color: #082416;
  box-shadow: 0 13px 32px rgba(91,232,123,.25), inset 0 1px 0 rgba(255,255,255,.82);
}

.card,
.stat-card,
.toolbar-card,
.item,
.settings-profile-card,
.settings-list-card,
.settings-form,
.privacy-card {
  background:
    linear-gradient(150deg, rgba(255,255,255,.055), rgba(255,255,255,.012)),
    var(--surface);
  border: 1px solid var(--line);
  box-shadow: 0 16px 42px color-mix(in srgb, var(--bg) 60%, transparent), inset 0 1px 0 rgba(255,255,255,.045);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
}

.finance-master-card {
  padding: clamp(20px, 4.5vw, 34px);
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 34px;
  background:
    radial-gradient(circle at 88% 4%, rgba(255,255,255,.72), transparent 28%),
    linear-gradient(135deg, #dfffad 0%, #b4fb99 43%, #75dfa0 100%);
  color: #082617;
  box-shadow: 0 30px 84px rgba(52,163,86,.30), inset 0 1px 0 rgba(255,255,255,.92);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.finance-master-card .eyebrow,
.finance-master-card small,
.finance-master-card .muted,
.finance-master-card em { color: rgba(8,38,22,.72); }
.finance-master-card .kpi { color: #061e12; font-size: clamp(46px, 12vw, 72px); }
.finance-master-card .hero-sparkline { color: #0d5a2d; margin: 12px 0 10px; }
.finance-master-card .compare { border: 1px solid rgba(8,38,22,.10); background: rgba(255,255,255,.34); color: #103e24; }
.finance-master-card .capital-breakdown {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin: 12px 0;
}
.finance-master-card .capital-breakdown span {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 0;
  border-radius: 18px;
  background: rgba(9, 55, 29, .11);
  color: #061e12;
  font-size: 15px;
  font-weight: 850;
}
.finance-master-card .capital-breakdown small { color: #092617; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.finance-head-actions { display: flex; align-items: flex-start; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.hero-month-picker { display: grid; gap: 3px; padding: 7px 10px; border-radius: 15px; background: rgba(255,255,255,.30); }
.hero-month-picker span { font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: rgba(8,38,22,.65); }
.hero-month-picker input { width: 128px; border: 0; padding: 0; background: transparent; color: #082617; font-weight: 850; }
.finance-master-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 9px;
  margin: 12px 0;
}
.finance-master-grid > div {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(8, 54, 28, .095);
}
.finance-master-grid small { font-size: 11px; font-weight: 760; }
.finance-master-grid strong { color: #061e12; font-size: clamp(16px, 4vw, 22px); line-height: 1.08; overflow-wrap: anywhere; }
.finance-master-grid em { font-size: 9px; font-style: normal; }
.finance-source-details { margin: 5px 0 15px; border-radius: 17px; background: rgba(255,255,255,.20); }
.finance-source-details summary { cursor: pointer; padding: 11px 14px; color: #0a321c; font-size: 12px; font-weight: 850; list-style: none; }
.finance-source-details summary::-webkit-details-marker { display:none; }
.finance-source-row { display:flex; justify-content:space-between; gap:12px; padding:9px 14px; border-top:1px solid rgba(8,38,22,.09); color:#0a321c; font-size:12px; }
.finance-source-row b { color:#061e12; }
.finance-master-card .goal-row { color: #163f26; margin-top: 4px; }
.finance-master-card .goal-row strong { color: #061e12; font-size: 25px; }
.finance-master-card .progress { background: rgba(8,38,22,.15); }
.finance-master-card .progress > span { background: #0b4b28; }

.finance-support-section { margin-top: 20px; }
.finance-tabs { position: sticky; top: calc(74px + env(safe-area-inset-top)); z-index: 10; }

.settings-screen { display:grid; gap:22px; }
.settings-profile-card { display:flex; align-items:center; gap:15px; padding:18px; }
.settings-avatar { width:56px; height:56px; flex:0 0 56px; display:grid; place-items:center; border-radius:19px; background:linear-gradient(145deg,#d9ffaf,#74e98b); color:#082416; font-size:30px; font-weight:950; box-shadow:inset 0 1px 0 rgba(255,255,255,.75); }
.settings-profile-card small { color:var(--muted); }
.settings-profile-card h2 { margin:2px 0 4px; }
.settings-profile-card p { margin:0; color:var(--muted); font-size:13px; }
.settings-group { display:grid; gap:10px; }
.settings-group > h3 { margin:0 6px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.11em; }
.settings-form { display:grid; gap:13px; padding:18px; }
.settings-list-card { padding:5px; }
.settings-list-card .settings-row { margin:0; border:0; border-radius:17px; background:transparent; }
.settings-list-card .settings-row + .settings-row { border-top:1px solid var(--line); border-radius:0; }
.privacy-card { padding:16px; }
.privacy-card p { margin:0; color:var(--muted); line-height:1.55; }
.app-version { margin:0; padding:0 0 12px; color:var(--muted); text-align:center; font-size:12px; }

.quick-expense-form { display:grid; gap:15px; }
.quick-amount-wrap { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:8px; padding:12px 16px; border-radius:22px; background:rgba(255,255,255,.055); border:1px solid var(--line); }
.quick-amount-wrap span { color:var(--danger); font-size:28px; font-weight:900; }
.quick-amount-wrap input { min-width:0; border:0; padding:0; background:transparent; color:var(--text); font-size:42px; font-weight:900; text-align:right; outline:0; }
.quick-amount-wrap b { font-size:27px; }
.quick-amounts { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.quick-amounts button,
.expense-category-chip,
.quick-more-actions { border:1px solid var(--line); border-radius:14px; padding:10px; background:var(--surface-3); color:var(--text); cursor:pointer; }
.expense-category-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.expense-category-chip { min-height:46px; padding:7px 4px; font-size:10px; }
.expense-category-chip.active { border-color:color-mix(in srgb,var(--accent) 52%,transparent); background:var(--accent-soft); color:var(--accent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 18%,transparent); }
.quick-more-actions { width:100%; color:var(--accent); font-weight:800; }

:root[data-theme="light"] .topbar,
:root[data-theme="light"] .bottom-nav,
:root[data-theme="light"] .modal-head,
:root[data-theme="light"] .modal-actions { color:var(--text); }
:root[data-theme="light"] .bottom-nav { background:rgba(255,255,255,.84); }
:root[data-theme="light"] .field input,
:root[data-theme="light"] .field select,
:root[data-theme="light"] .field textarea,
:root[data-theme="light"] .search-input { background:rgba(255,255,255,.78); color:var(--text); }
:root[data-theme="light"] .modal { background:rgba(245,251,247,.94); }
:root[data-theme="light"] .modal-head,
:root[data-theme="light"] .modal-actions { background:rgba(245,251,247,.92); }
:root[data-theme="graphite"] body { background:radial-gradient(circle at 10% -8%, rgba(169,255,114,.12), transparent 29%), linear-gradient(180deg,#111821,#090d12 50%,#06090d); }

@media (max-width: 520px) {
  .finance-master-card { border-radius: 29px; padding: 20px; }
  .finance-hero-head { align-items:flex-start; }
  .finance-head-actions { max-width:150px; }
  .hero-month-picker input { width:116px; }
  .finance-master-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .expense-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 350px) {
  .finance-master-card .capital-breakdown { grid-template-columns:1fr; }
  .finance-master-grid { grid-template-columns:1fr; }
}
.topbar-actions { position: relative; z-index: 5; pointer-events: none; }
.topbar-actions .top-add { position: relative; z-index: 6; pointer-events: auto; touch-action: manipulation; }
.topbar-actions { pointer-events: auto; }
.top-add svg, .top-add svg * { pointer-events: none; }
.topbar { pointer-events: none; }
.topbar-brand, .top-add { pointer-events: auto; }
.finance-master-card .kpi { white-space: nowrap; }
@media (max-width: 520px) {
  .finance-master-card .finance-hero-head { display: block; }
  .finance-master-card .finance-head-actions { position: absolute; top: 20px; right: 20px; max-width: 145px; }
  .finance-master-card .kpi { padding-top: 12px; padding-right: 0; font-size: clamp(40px, 11vw, 58px); }
}

/* =====================================================
   Alexander OS v10 - design system and security layer
   ===================================================== */

:root {
  --v10-green: #34d17c;
  --v10-green-2: #9cff9a;
  --v10-green-dark: #075a31;
  --v10-red: #ff747a;
  --v10-blue: #63a6ff;
  --v10-card-glow: 0 18px 50px rgba(0, 0, 0, .22);
}

.brand-line {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 3px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .01em;
  color: var(--text);
}
.brand-line span {
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10px;
}
.topbar-copy h1 { font-size: clamp(28px, 7.5vw, 38px); }

.home-welcome {
  padding: 6px 3px 4px;
}
.home-welcome small {
  color: var(--muted);
  font-size: 12px;
}
.home-welcome h2 {
  margin: 7px 0 0;
  font-size: clamp(24px, 7vw, 34px);
  line-height: 1.08;
  letter-spacing: -.045em;
}
.home-welcome h2 span { font-size: .8em; }

.home-capital-card {
  margin-top: 16px;
  padding: 20px;
  border-color: rgba(82, 232, 142, .22);
  background:
    radial-gradient(circle at 90% 0%, rgba(51, 209, 124, .17), transparent 34%),
    linear-gradient(145deg, rgba(22, 61, 44, .92), rgba(13, 31, 25, .98));
  box-shadow: 0 20px 46px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255,255,255,.07);
}
:root[data-theme="graphite"] .home-capital-card {
  background:
    radial-gradient(circle at 90% 0%, rgba(128, 148, 169, .16), transparent 34%),
    linear-gradient(145deg, #1d2630, #11171f);
  border-color: rgba(180, 194, 210, .18);
}
:root[data-theme="light"] .home-capital-card {
  background:
    radial-gradient(circle at 90% 0%, rgba(81, 213, 137, .20), transparent 34%),
    linear-gradient(145deg, #ffffff, #edf8f0);
  border-color: rgba(20, 126, 70, .14);
}
.home-capital-card .metric-row { align-items: flex-start; }
.home-capital-card small { color: var(--muted); }
.home-capital-card strong {
  display: block;
  margin-top: 5px;
  font-size: clamp(32px, 9vw, 48px);
  letter-spacing: -.06em;
}
.home-capital-card .hero-sparkline { height: 92px; margin-top: 9px; }

.home-metric-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  margin-top: 12px;
}
.home-metric-card {
  min-height: 126px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 21px;
  background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.015)), var(--surface);
  box-shadow: var(--v10-card-glow);
  text-align: left;
  cursor: pointer;
}
.home-metric-card small { color: var(--muted); line-height: 1.25; }
.home-metric-card strong {
  font-size: clamp(22px, 6.7vw, 31px);
  letter-spacing: -.045em;
  overflow-wrap: anywhere;
}
.home-metric-card span {
  margin-top: auto;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}
.home-metric-card.income { border-color: rgba(65, 215, 128, .19); }
.home-metric-card.expense { border-color: rgba(255, 116, 122, .18); }
.home-metric-card.week { border-color: rgba(99, 166, 255, .16); }
.home-metric-card.free { border-color: rgba(156, 255, 154, .17); }
.home-metric-card.income strong, .home-metric-card.free strong { color: var(--success); }
.home-metric-card.expense strong { color: var(--danger); }

.finance-master-card {
  box-shadow: 0 26px 65px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255,255,255,.34);
}
.finance-master-grid > div {
  min-height: 83px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.finance-master-grid strong { overflow-wrap: anywhere; }
.finance-source-details summary { user-select: none; }

.theme-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}
.theme-choice {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface-2);
  color: var(--text);
  cursor: pointer;
}
.theme-choice.active {
  border-color: color-mix(in srgb, var(--accent) 70%, transparent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
.theme-choice > span {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--theme-dot);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.3), 0 5px 16px rgba(0,0,0,.16);
}
.theme-choice b { font-size: 12px; }
.theme-choice small { color: var(--muted); font-size: 10px; }

.v10-profile-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
}
.security-status {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(255, 116, 122, .11);
  color: var(--danger);
  font-size: 10px;
  font-weight: 800;
}
.security-status.active {
  background: rgba(77, 221, 145, .12);
  color: var(--success);
}
.v10-privacy-card {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 13px;
  align-items: start;
}
.v10-privacy-card p { margin: 5px 0 0; color: var(--muted); line-height: 1.48; }
.privacy-icon, .security-shield {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 24px;
  font-weight: 900;
}
.settings-row[disabled] { opacity: .42; cursor: not-allowed; }
.settings-row.danger-soft { color: var(--danger); }
.select-row select {
  max-width: 145px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px 10px;
  background: var(--surface-3);
  color: var(--text);
}
.switch-row input {
  appearance: none;
  width: 48px;
  height: 28px;
  border-radius: 999px;
  background: var(--surface-3);
  border: 1px solid var(--line);
  position: relative;
  transition: .2s ease;
}
.switch-row input::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--muted);
  transition: .2s ease;
}
.switch-row input:checked { background: var(--accent); border-color: var(--accent); }
.switch-row input:checked::after { left: 23px; background: #0b2417; }

.security-overview {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 13px;
  align-items: center;
  margin-bottom: 14px;
}
.security-overview strong, .security-overview small { display: block; }
.security-overview small { margin-top: 4px; color: var(--muted); line-height: 1.4; }
.security-shield { width: 52px; height: 52px; border-radius: 18px; }
.security-list { padding: 0; overflow: hidden; }

.lock-screen {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: calc(24px + env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 10%, rgba(48, 220, 127, .18), transparent 32%),
    linear-gradient(180deg, #04150d, #020906 70%);
  backdrop-filter: blur(24px);
}
.lock-screen[hidden] { display: none !important; }
.lock-card {
  width: min(100%, 390px);
  padding: 28px;
  border: 1px solid rgba(128, 255, 177, .18);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(18, 45, 34, .97), rgba(7, 21, 16, .98));
  box-shadow: 0 34px 90px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.07);
  text-align: center;
}
.lock-logo {
  width: 70px;
  height: 70px;
  display: grid;
  place-items: center;
  margin: 0 auto 17px;
  border-radius: 24px;
  background: linear-gradient(145deg, #caffbc, #35d27c);
  color: #062515;
  font-size: 39px;
  font-weight: 950;
  box-shadow: inset 0 2px 4px rgba(255,255,255,.65), 0 18px 38px rgba(50,211,124,.25);
}
.lock-card h2 { margin: 5px 0 9px; font-size: 27px; letter-spacing: -.04em; }
.lock-card > p:not(.eyebrow):not(.lock-error) { color: #a8bdb1; line-height: 1.5; }
.lock-divider { display: flex; align-items: center; gap: 10px; margin: 16px 0; color: #789286; font-size: 11px; }
.lock-divider::before, .lock-divider::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,.09); }
.lock-pin-form { display: grid; grid-template-columns: 1fr auto; gap: 9px; }
.lock-pin-form input {
  min-width: 0;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 15px;
  padding: 13px 15px;
  background: rgba(255,255,255,.055);
  color: #fff;
  text-align: center;
  letter-spacing: .2em;
}
.lock-error { min-height: 20px; margin: 14px 0 0; color: #ff9da2; font-size: 12px; }
body.app-locked .app-shell, body.app-locked .modal { pointer-events: none; user-select: none; filter: blur(8px); }

@media (max-width: 430px) {
  .topbar { padding-inline: 16px; }
  .content { padding-inline: 14px; }
  .theme-picker { grid-template-columns: 1fr 1fr 1fr; gap: 7px; }
  .theme-choice { min-height: 100px; padding: 8px 4px; }
  .theme-choice b { font-size: 10px; }
  .theme-choice small { font-size: 8px; }
  .finance-master-grid { gap: 8px; }
  .finance-master-grid > div { min-height: 76px; padding: 11px; }
  .finance-master-grid strong { font-size: 16px; }
}

@media (max-width: 350px) {
  .home-metric-grid { grid-template-columns: 1fr; }
  .theme-picker { grid-template-columns: 1fr; }
  .theme-choice { min-height: 74px; display: grid; grid-template-columns: 32px 1fr; text-align: left; }
  .theme-choice > span { grid-row: 1 / 3; width: 32px; height: 32px; }
}

/* Explicit hit targets for Safari and automated browsers */
.topbar { pointer-events: auto; }
.topbar::before, .topbar::after { pointer-events: none; }
.top-add { position: relative; z-index: 30; pointer-events: auto; touch-action: manipulation; }

/* =========================================================
   Alexander OS vNext 10.3 - final 2030 interface layer
   ========================================================= */

:root {
  --nav-height: 68px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --vnext-glow: 0 0 0 1px rgba(111,255,162,.04), 0 24px 70px rgba(0,0,0,.34);
}

:root[data-theme="future"] {
  --bg: #00120d;
  --bg-soft: #031b15;
  --surface: rgba(4, 35, 26, .72);
  --surface-2: rgba(1, 24, 18, .78);
  --surface-3: rgba(99, 255, 199, .085);
  --surface-soft: rgba(3, 28, 21, .92);
  --text: #eafff5;
  --muted: #86aa9c;
  --line: rgba(108, 255, 203, .13);
  --line-strong: rgba(108, 255, 203, .25);
  --accent: #5dffcf;
  --accent-strong: #00dda1;
  --accent-soft: rgba(93, 255, 207, .14);
  --accent-2: #8dff78;
  --danger: #ff788b;
  --warning: #ffd86f;
  --success: #70ffc2;
  --shadow: 0 28px 86px rgba(0, 5, 3, .54);
  --glass-shadow: 0 24px 72px rgba(0, 8, 5, .42), inset 0 1px 0 rgba(182,255,229,.08);
  color-scheme: dark;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:root[data-theme="future"] body {
  background:
    linear-gradient(rgba(93,255,207,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(93,255,207,.018) 1px, transparent 1px),
    radial-gradient(circle at 16% -5%, rgba(93,255,207,.22), transparent 30%),
    radial-gradient(circle at 92% 15%, rgba(141,255,120,.13), transparent 28%),
    linear-gradient(180deg, #001c13 0%, #00100b 48%, #000805 100%);
  background-size: 34px 34px, 34px 34px, auto, auto, auto;
  background-attachment: fixed;
}

.app-shell,
.topbar,
.content {
  width: 100%;
  max-width: 760px;
}

.app-shell { position: relative; }

.topbar {
  min-width: 0;
  overflow: visible;
  padding-top: calc(13px + env(safe-area-inset-top));
}

.topbar-brand,
.topbar-copy { min-width: 0; }

.brand-line {
  font-size: 13px;
  letter-spacing: -.01em;
}

.brand-line span {
  padding: 3px 7px;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  background: color-mix(in srgb, var(--accent-soft) 78%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.top-add,
.floating-add {
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.64);
  background:
    radial-gradient(circle at 28% 16%, rgba(255,255,255,.96), transparent 24%),
    linear-gradient(145deg, #d9ffb9 0%, #82f28f 54%, #4ed67e 100%);
  color: #072616;
  box-shadow: 0 16px 38px rgba(84,235,132,.30), inset 0 1px 0 rgba(255,255,255,.85);
}

.top-add svg,
.floating-add svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
}

:root[data-theme="future"] .top-add,
:root[data-theme="future"] .floating-add,
:root[data-theme="future"] .brand-mark {
  border-color: rgba(182,255,231,.72);
  background:
    radial-gradient(circle at 30% 17%, rgba(255,255,255,.93), transparent 21%),
    linear-gradient(145deg, #caffb9 0%, #5dffcf 52%, #22cf91 100%);
  box-shadow: 0 0 0 1px rgba(93,255,207,.14), 0 0 34px rgba(93,255,207,.26), inset 0 1px 0 rgba(255,255,255,.85);
}

.floating-add {
  position: fixed;
  z-index: 85;
  right: max(18px, calc((100vw - 744px) / 2 + 18px));
  bottom: calc(var(--nav-height) + 22px + var(--safe-bottom));
  width: 58px;
  height: 58px;
  border-radius: 50%;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .2s ease;
}

.floating-add:active { transform: scale(.93); }
body.app-locked .floating-add { opacity: 0; pointer-events: none; }

.bottom-nav {
  width: min(calc(100% - 14px), 746px);
  min-height: var(--nav-height);
  overflow: visible;
  padding: 6px 5px;
  border-radius: 28px;
}

.bottom-nav .nav-item {
  min-height: 55px;
  border-radius: 18px;
}

.bottom-nav .nav-item svg {
  width: 21px;
  height: 21px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bottom-nav .nav-item .nav-fill {
  fill: currentColor;
  stroke: currentColor;
}

.bottom-nav .nav-item .nav-dot { opacity: .18; }
.bottom-nav .nav-item.active .nav-dot { opacity: .38; }

.bottom-nav .nav-item small {
  font-size: 8px;
  font-weight: 720;
}

.bottom-nav .nav-item.active {
  transform: translateY(-1px);
  background:
    radial-gradient(circle at 50% -15%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 68%),
    color-mix(in srgb, var(--accent-soft) 50%, transparent);
}

:root[data-theme="future"] .bottom-nav {
  border-color: rgba(93,255,207,.18);
  background:
    linear-gradient(145deg, rgba(126,255,217,.08), rgba(255,255,255,.015)),
    rgba(0, 22, 15, .82);
  box-shadow: 0 22px 64px rgba(0,0,0,.50), 0 0 34px rgba(93,255,207,.05), inset 0 1px 0 rgba(255,255,255,.07);
}

.content {
  min-width: 0;
  padding-bottom: calc(132px + var(--safe-bottom));
}

.card,
.stat-card,
.toolbar-card,
.item,
.action-tile,
.settings-profile-card,
.settings-list-card,
.settings-form,
.privacy-card,
.home-metric-card {
  overflow: hidden;
}

:root[data-theme="future"] .card,
:root[data-theme="future"] .stat-card,
:root[data-theme="future"] .toolbar-card,
:root[data-theme="future"] .item,
:root[data-theme="future"] .action-tile,
:root[data-theme="future"] .settings-profile-card,
:root[data-theme="future"] .settings-list-card,
:root[data-theme="future"] .settings-form,
:root[data-theme="future"] .privacy-card,
:root[data-theme="future"] .home-metric-card {
  border-color: rgba(93,255,207,.13);
  background:
    radial-gradient(circle at 95% 0%, rgba(93,255,207,.07), transparent 33%),
    linear-gradient(145deg, rgba(133,255,219,.055), rgba(255,255,255,.012)),
    rgba(0, 27, 19, .68);
  box-shadow: var(--glass-shadow);
}

:root[data-theme="future"] .home-capital-card,
:root[data-theme="future"] .progress-hero {
  position: relative;
  border-color: rgba(93,255,207,.24);
  background:
    linear-gradient(rgba(93,255,207,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(93,255,207,.035) 1px, transparent 1px),
    radial-gradient(circle at 89% 2%, rgba(93,255,207,.20), transparent 34%),
    linear-gradient(145deg, rgba(3, 56, 40, .96), rgba(0, 24, 17, .98));
  background-size: 24px 24px, 24px 24px, auto, auto;
  box-shadow: 0 26px 72px rgba(0,0,0,.42), 0 0 40px rgba(93,255,207,.06), inset 0 1px 0 rgba(255,255,255,.08);
}

:root[data-theme="future"] .finance-master-card {
  border-color: rgba(201,255,226,.72);
  background:
    linear-gradient(rgba(2,61,39,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(2,61,39,.035) 1px, transparent 1px),
    radial-gradient(circle at 88% 2%, rgba(255,255,255,.72), transparent 25%),
    linear-gradient(135deg, #d8ffad 0%, #91ffc5 48%, #5ee8a4 100%);
  background-size: 25px 25px, 25px 25px, auto, auto;
  box-shadow: 0 34px 94px rgba(14,194,121,.26), 0 0 46px rgba(93,255,207,.10), inset 0 1px 0 rgba(255,255,255,.94);
}

/* Full-screen bottom sheet on iPhone */
@media (max-width: 600px) {
  dialog.modal {
    width: 100%;
    max-width: none;
    max-height: min(91dvh, 860px);
    margin: auto 0 0;
    border-width: 1px 0 0;
    border-radius: 28px 28px 0 0;
  }
  .modal-card { min-height: 0; }
  .modal-head {
    position: sticky;
    top: 0;
    z-index: 3;
    padding-top: 14px;
  }
  .modal-head::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 50%;
    width: 42px;
    height: 4px;
    border-radius: 999px;
    background: var(--line-strong);
    transform: translateX(-50%);
  }
  #modalBody { padding-bottom: 22px; }
}

.vnext-quick-sheet {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}

.vnext-quick-sheet button {
  min-height: 104px;
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 11px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.012)),
    var(--surface-2);
  text-align: left;
  cursor: pointer;
}

.vnext-quick-sheet button span {
  grid-row: 1 / 3;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: var(--surface-3);
  color: var(--accent);
  font-size: 24px;
  font-weight: 850;
}

.vnext-quick-sheet button b { font-size: 15px; }
.vnext-quick-sheet button small { color: var(--muted); line-height: 1.35; }
.vnext-quick-sheet button.primary-action {
  grid-column: 1 / -1;
  min-height: 88px;
  border-color: color-mix(in srgb, var(--accent) 25%, transparent);
  background:
    radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--accent-soft) 80%, var(--surface)), var(--surface));
}
.vnext-quick-sheet button.primary-action span {
  background: var(--accent);
  color: #072416;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--accent) 24%, transparent);
}

/* Face ID interface */
.lock-screen {
  background:
    radial-gradient(circle at 50% 18%, rgba(76,255,171,.21), transparent 31%),
    radial-gradient(circle at 50% 78%, rgba(34,205,143,.08), transparent 32%),
    linear-gradient(180deg, #001b11 0%, #000b07 76%);
}

.lock-card {
  border-color: rgba(115,255,180,.17);
  background:
    radial-gradient(circle at 50% -8%, rgba(93,255,173,.09), transparent 37%),
    linear-gradient(145deg, rgba(5,41,27,.96), rgba(0,17,11,.98));
}

.face-orb {
  position: relative;
  width: 144px;
  height: 144px;
  display: grid;
  place-items: center;
  margin: 0 auto 24px;
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(121,255,168,.24) 0%, rgba(40,214,128,.08) 50%, transparent 72%);
  box-shadow: 0 0 65px rgba(80,255,155,.22);
}

.face-orb::before,
.face-orb::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}
.face-orb::before {
  inset: 13px;
  border: 1px solid rgba(142,255,184,.38);
  box-shadow: inset 0 0 24px rgba(70,255,151,.13), 0 0 26px rgba(70,255,151,.15);
  animation: facePulse 2.2s ease-in-out infinite;
}
.face-orb::after {
  inset: 28px;
  border: 1px solid rgba(142,255,184,.20);
}
.face-orb svg {
  width: 72px;
  height: 72px;
  fill: none;
  stroke: #72ffad;
  stroke-width: 2.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 10px rgba(90,255,164,.45));
}

.face-corners { position:absolute; inset:34px; }
.face-corners i { position:absolute; width:16px; height:16px; border-color:#79ffb2; opacity:.7; }
.face-corners i:nth-child(1) { left:0; top:0; border-left:2px solid; border-top:2px solid; border-radius:5px 0 0; }
.face-corners i:nth-child(2) { right:0; top:0; border-right:2px solid; border-top:2px solid; border-radius:0 5px 0 0; }
.face-corners i:nth-child(3) { left:0; bottom:0; border-left:2px solid; border-bottom:2px solid; border-radius:0 0 0 5px; }
.face-corners i:nth-child(4) { right:0; bottom:0; border-right:2px solid; border-bottom:2px solid; border-radius:0 0 5px; }

@keyframes facePulse {
  0%,100% { transform: scale(.96); opacity:.72; }
  50% { transform: scale(1.04); opacity:1; }
}

.face-status {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 18px auto;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: #9ab6a8;
  font-size: 12px;
  font-weight: 700;
}
.face-status > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ffd36d;
  box-shadow: 0 0 12px currentColor;
}
.face-status.scanning > span { background:#5dffcf; animation: faceBlink 1s ease-in-out infinite; }
.face-status.success { color:#7bffb0; }
.face-status.success > span { background:#7bffb0; }
.face-status.error { color:#ff9aa4; }
.face-status.error > span { background:#ff7e89; }
@keyframes faceBlink { 50% { opacity:.25; transform:scale(.7); } }
.face-retry { margin-top: 4px; }
.lock-divider[hidden] { display:none !important; }

/* Theme selection */
.theme-picker { grid-template-columns: repeat(4, minmax(0,1fr)); }
.theme-choice { position:relative; isolation:isolate; }
.theme-choice[data-theme-choice="future"]::before {
  content:"";
  position:absolute;
  inset:7px;
  z-index:-1;
  border-radius:14px;
  background:
    linear-gradient(rgba(93,255,207,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(93,255,207,.04) 1px, transparent 1px),
    rgba(0,30,21,.74);
  background-size:12px 12px;
}
.theme-choice[data-theme-choice="future"] > span { box-shadow:0 0 22px rgba(93,255,207,.42), inset 0 1px 3px rgba(255,255,255,.40); }

/* Better typography and alignment across every tab */
.section-head h2,
.settings-group > h3,
.item-title,
.project-card .item-title { text-wrap: balance; }
.amount-block strong,
.finance-master-grid strong,
.home-metric-card strong { font-variant-numeric: tabular-nums; }

@media (max-width: 520px) {
  .theme-picker { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .theme-choice { min-height: 96px; }
  .floating-add {
    right: 16px;
    bottom: calc(var(--nav-height) + 18px + var(--safe-bottom));
    width: 54px;
    height: 54px;
  }
}

@media (max-width: 360px) {
  .vnext-quick-sheet { grid-template-columns: 1fr; }
  .vnext-quick-sheet button.primary-action { grid-column:auto; }
  .bottom-nav .nav-item small { font-size: 6.8px; }
  .bottom-nav .nav-item svg { width: 18px; height: 18px; }
}

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

/* Safari header width guard - overrides legacy centered FAB rules */
.topbar > .top-add {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  flex: 0 0 43px;
  justify-self: auto;
  align-self: center;
  margin: 0 0 0 auto !important;
  border-width: 1px;
}
@media (max-width: 430px) {
  .topbar > .top-add { flex-basis: 40px; width: 40px; height: 40px; }
}

/* The lower floating action mirrors the approved mockups only where it is useful. */
.floating-add { display: none; }
body[data-screen="tasks"] .floating-add,
body[data-screen="growth"] .floating-add { display: grid; }

/* =========================================================
   ALEXANDER OS v10.4 - EXACT DESIGN SYSTEM
   Final visual layer matching the approved premium mockups.
   ========================================================= */
:root,
:root[data-theme="emerald"] {
  --bg: #03110b;
  --bg-soft: #061a12;
  --surface: #0b2118;
  --surface-2: #0d281d;
  --surface-3: #15362a;
  --surface-soft: rgba(7, 28, 19, .94);
  --text: #f5fff8;
  --muted: #8ca89a;
  --line: rgba(144, 255, 175, .10);
  --line-strong: rgba(144, 255, 175, .20);
  --accent: #86f895;
  --accent-strong: #36d66d;
  --accent-soft: rgba(134, 248, 149, .12);
  --accent-2: #43df91;
  --danger: #ff7e86;
  --warning: #f4c96b;
  --success: #6ff0a4;
  --shadow: 0 20px 55px rgba(0, 0, 0, .34);
  --glass-shadow: 0 18px 46px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.035);
  --radius: 17px;
  --radius-sm: 12px;
  --nav-height: 66px;
  color-scheme: dark;
}

:root[data-theme="graphite"] {
  --bg: #090d11;
  --bg-soft: #10161b;
  --surface: #171d22;
  --surface-2: #1d242a;
  --surface-3: #282f36;
  --surface-soft: rgba(15, 20, 25, .95);
  --text: #f7f9fa;
  --muted: #979fa6;
  --line: rgba(255,255,255,.075);
  --line-strong: rgba(255,255,255,.14);
  --accent: #8df79a;
  --accent-strong: #54d86d;
  --accent-soft: rgba(141,247,154,.10);
  --accent-2: #91d9af;
  --danger: #ff7c83;
  --warning: #f1c669;
  --success: #83e8a8;
  --shadow: 0 20px 55px rgba(0,0,0,.38);
  --glass-shadow: 0 20px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
  color-scheme: dark;
}

:root[data-theme="light"] {
  --bg: #f4f6f5;
  --bg-soft: #edf1ef;
  --surface: #ffffff;
  --surface-2: #f7f9f8;
  --surface-3: #edf1ef;
  --surface-soft: rgba(255,255,255,.96);
  --text: #101713;
  --muted: #6c7770;
  --line: rgba(16,23,19,.08);
  --line-strong: rgba(16,23,19,.14);
  --accent: #45d76b;
  --accent-strong: #1ebd51;
  --accent-soft: rgba(69,215,107,.11);
  --accent-2: #51ce8a;
  --danger: #dd4e58;
  --warning: #9b700d;
  --success: #168d4d;
  --shadow: 0 18px 45px rgba(28,42,34,.10);
  --glass-shadow: 0 17px 38px rgba(33,53,40,.08), inset 0 1px 0 rgba(255,255,255,.7);
  color-scheme: light;
}

html, body { width:100%; min-height:100%; overflow-x:hidden; }
body {
  background:
    radial-gradient(circle at 50% -8%, rgba(69, 216, 107, .10), transparent 27%),
    linear-gradient(180deg, var(--bg-soft) 0, var(--bg) 22%, var(--bg) 100%);
  background-attachment: fixed;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", sans-serif;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}
:root[data-theme="graphite"] body {
  background: radial-gradient(circle at 50% -8%, rgba(125,255,153,.065), transparent 25%), linear-gradient(180deg,#10161b,#090d11 24%,#090d11);
}
:root[data-theme="light"] body {
  background: radial-gradient(circle at 75% -5%, rgba(70,214,109,.11), transparent 26%), linear-gradient(180deg,#f8faf9,#f4f6f5 24%,#f4f6f5);
}

.app-shell { width:100%; max-width:520px; min-height:100dvh; margin:0 auto; padding-bottom:calc(92px + env(safe-area-inset-bottom)); }
.content { width:100%; max-width:none; padding:8px 15px 42px; }

/* Header */
.topbar {
  position:sticky;
  top:0;
  z-index:50;
  width:100%;
  max-width:520px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:calc(12px + env(safe-area-inset-top)) 15px 13px;
  background:linear-gradient(180deg, color-mix(in srgb,var(--bg) 97%,transparent) 0%, color-mix(in srgb,var(--bg) 91%,transparent) 78%, transparent 100%);
  backdrop-filter:blur(22px) saturate(130%);
  -webkit-backdrop-filter:blur(22px) saturate(130%);
}
.topbar-brand { min-width:0; display:flex; align-items:center; gap:11px; }
.brand-mark {
  width:43px;
  height:43px;
  flex:0 0 43px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.70);
  border-radius:13px;
  background:
    radial-gradient(circle at 30% 18%,rgba(255,255,255,.92),transparent 23%),
    linear-gradient(145deg,#d6ffb2 0%,#7aee8a 56%,#45c977 100%);
  color:#072315;
  font-size:24px;
  font-weight:900;
  box-shadow:0 12px 25px rgba(69,217,110,.22),inset 0 1px 0 rgba(255,255,255,.75);
}
.topbar-copy { min-width:0; display:grid; gap:1px; }
.brand-line { display:flex; align-items:center; gap:6px; color:var(--text); font-size:13px; font-weight:800; letter-spacing:.005em; }
.brand-line span { padding:2px 6px; border:1px solid rgba(134,248,149,.20); border-radius:7px; background:rgba(134,248,149,.10); color:var(--accent); font-size:9px; }
.topbar .eyebrow { margin:1px 0 0; color:var(--muted); font-size:8px; font-weight:720; letter-spacing:.19em; white-space:nowrap; }
.topbar h1 { margin:0; overflow:hidden; color:var(--text); font-size:28px; line-height:1.04; font-weight:850; letter-spacing:-.055em; text-overflow:ellipsis; white-space:nowrap; }
.top-add {
  position:relative!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  flex:0 0 40px!important;
  margin:0 0 0 auto!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 30% 18%,#fff,transparent 24%),linear-gradient(145deg,#cfffaa,#77ee87 55%,#43d276)!important;
  color:#072315!important;
  box-shadow:0 10px 26px rgba(77,225,112,.26),inset 0 1px 0 rgba(255,255,255,.86)!important;
}
.top-add svg { width:23px!important; height:23px!important; stroke-width:2!important; }

/* Shared surfaces */
.card,.stat-card,.toolbar-card,.item,.action-tile,.settings-profile-card,.settings-list-card,.settings-form,.privacy-card,.home-metric-card {
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(255,255,255,.026),rgba(255,255,255,.006)),var(--surface);
  box-shadow:var(--glass-shadow);
}
.card,.stat-card,.toolbar-card { padding:14px; }
.section { margin-top:20px; }
.compact-section { margin-top:17px; }
.section-head { margin-bottom:9px; }
.section-head h2 { margin:0; font-size:18px; font-weight:820; letter-spacing:-.035em; }
.link-btn { color:var(--accent); font-size:12px; font-weight:800; }
.badge { padding:4px 8px; border-radius:999px; background:var(--surface-3); color:var(--muted); font-size:9px; }
.btn { min-height:45px; border-radius:12px; padding:12px 15px; }
.btn.primary { background:linear-gradient(180deg,#42d86b,#22b954); color:#f5fff8; box-shadow:0 11px 25px rgba(36,185,85,.19),inset 0 1px 0 rgba(255,255,255,.18); }
:root[data-theme="light"] .btn.primary { color:white; }

/* Home */
.home-welcome { margin:3px 2px 14px; }
.home-welcome small { color:var(--muted); font-size:11px; }
.home-welcome h2 { margin:7px 0 0; font-size:23px; line-height:1.16; font-weight:850; letter-spacing:-.05em; }
.home-capital-card {
  position:relative;
  overflow:hidden;
  min-height:195px;
  padding:17px;
  border-color:rgba(94,229,130,.25);
  background:
    radial-gradient(circle at 98% 0%,rgba(112,246,149,.18),transparent 35%),
    linear-gradient(145deg,#0f4a2d 0%,#0b3322 50%,#09271b 100%);
  box-shadow:0 21px 55px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.065);
}
:root[data-theme="graphite"] .home-capital-card { border-color:rgba(141,247,154,.15); background:radial-gradient(circle at 95% 0%,rgba(141,247,154,.11),transparent 35%),linear-gradient(145deg,#253029,#1b2320 50%,#151c19); }
:root[data-theme="light"] .home-capital-card { border-color:rgba(53,184,89,.18); background:radial-gradient(circle at 98% 0%,rgba(77,211,112,.14),transparent 38%),linear-gradient(145deg,#fff,#f4fbf5); }
.home-capital-card small { color:color-mix(in srgb,var(--text) 60%,transparent); font-size:11px; }
.home-capital-card strong { display:block; margin-top:4px; color:var(--text); font-size:33px; line-height:1; letter-spacing:-.06em; }
.home-capital-card .compare { font-size:9px; }
.home-capital-card .hero-sparkline { height:88px; margin:10px 0 -2px; color:var(--accent); }
.home-capital-card .hero-sparkline svg { width:100%; height:100%; }
.home-metric-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:10px; }
.home-metric-card { min-height:105px; padding:13px; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.home-metric-card small { color:var(--muted); font-size:10px; }
.home-metric-card strong { display:block; margin:8px 0 0; font-size:22px; letter-spacing:-.045em; }
.home-metric-card span { margin-top:auto; color:var(--muted); font-size:9px; line-height:1.3; }
.home-metric-card.income { background:linear-gradient(145deg,rgba(50,179,92,.20),rgba(8,43,27,.55)),var(--surface); }
.home-metric-card.expense { background:linear-gradient(145deg,rgba(190,72,86,.17),rgba(53,18,25,.34)),var(--surface); }
.home-metric-card.week { background:linear-gradient(145deg,rgba(36,137,145,.16),rgba(7,37,38,.32)),var(--surface); }
.home-metric-card.free { background:linear-gradient(145deg,rgba(92,88,151,.16),rgba(31,25,59,.25)),var(--surface); }
.home-metric-card.income strong,.home-metric-card.free strong { color:var(--success); }
.home-metric-card.expense strong { color:var(--danger); }

/* Lists */
.list { gap:8px; }
.compact-list { gap:6px; }
.item { gap:10px; padding:11px 12px; border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.026),rgba(255,255,255,.005)),var(--surface); }
.item-title { margin-bottom:3px; font-size:12px; font-weight:760; }
.item-meta { color:var(--muted); font-size:9px; line-height:1.42; }
.item-note { margin-top:7px; font-size:10px; }
.item-actions { gap:4px; margin-top:4px; }
.mini-btn { min-width:28px; height:28px; border-radius:9px; font-size:11px; }
.amount-block strong { font-size:12px; }
.category-icon,.account-icon { width:34px; height:34px; flex-basis:34px; border-radius:10px; font-size:13px; }
.check { width:18px; height:18px; flex-basis:18px; border-radius:5px; }
.check:checked { box-shadow:inset 0 0 0 4px var(--surface); }
.empty-state { min-height:132px; padding:26px 16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.empty-state .empty-icon { color:var(--accent); font-size:31px; }
.empty-state h3 { margin:5px 0 3px; font-size:16px; }
.empty-state p { margin:0; color:var(--muted); font-size:11px; }

/* Tabs */
.tabs { width:100%; margin:3px 0 12px; padding:3px; gap:3px; border:1px solid var(--line); border-radius:11px; background:var(--surface-2); }
.tab,.chip { min-height:33px; flex:1; padding:8px 10px; border-radius:8px; color:var(--muted); font-size:10px; font-weight:750; }
.tab.active,.chip.active { background:linear-gradient(180deg,#2cb75e,#1b8c46); color:#f6fff8; box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 6px 15px rgba(24,141,67,.16); }
:root[data-theme="light"] .tab.active,:root[data-theme="light"] .chip.active { color:white; }

/* Finance - one premium dashboard card */
.finance-master-card {
  position:relative;
  overflow:hidden;
  padding:14px;
  border:1px solid rgba(157,255,184,.25);
  border-radius:19px;
  background:
    radial-gradient(circle at 92% 5%,rgba(94,246,139,.25),transparent 28%),
    linear-gradient(145deg,#145f34 0%,#0d4028 48%,#092c1e 100%);
  color:#f6fff8;
  box-shadow:0 22px 58px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08);
}
:root[data-theme="graphite"] .finance-master-card { border-color:rgba(139,248,156,.17); background:radial-gradient(circle at 90% 0%,rgba(138,248,155,.12),transparent 28%),linear-gradient(145deg,#29332d,#1d2521 50%,#151c19); }
:root[data-theme="light"] .finance-master-card { border-color:rgba(57,190,93,.20); background:radial-gradient(circle at 92% 0%,rgba(76,214,113,.17),transparent 30%),linear-gradient(145deg,#fff,#eef9f1); color:#102017; }
.finance-hero-head { align-items:flex-start; }
.finance-master-card .eyebrow { color:rgba(235,255,241,.62); font-size:9px; }
:root[data-theme="light"] .finance-master-card .eyebrow { color:#6a7a70; }
.finance-master-card .kpi { margin:4px 0 0; color:inherit; font-size:33px; line-height:1; letter-spacing:-.06em; }
.finance-head-actions { display:flex; align-items:flex-end; gap:7px; }
.hero-month-picker { display:grid; gap:2px; }
.hero-month-picker span { display:none; }
.hero-month-picker input { width:105px; min-height:31px; border:1px solid rgba(255,255,255,.09); border-radius:9px; padding:6px 7px; background:rgba(0,0,0,.18); color:inherit; font-size:9px; }
:root[data-theme="light"] .hero-month-picker input { background:rgba(255,255,255,.66); border-color:rgba(10,30,18,.08); }
.finance-master-card .hero-sparkline { height:67px; margin:8px 0 7px; color:var(--accent); }
.capital-breakdown { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin:6px 0 8px; }
.finance-master-card .capital-breakdown span { min-width:0; display:grid; gap:3px; padding:8px; border:1px solid rgba(255,255,255,.07); border-radius:10px; background:rgba(0,0,0,.15); color:#f4fff7; font-size:11px; font-weight:760; }
.finance-master-card .capital-breakdown small { color:rgba(235,255,241,.58); font-size:7px; font-weight:650; text-transform:none; letter-spacing:0; }
:root[data-theme="light"] .finance-master-card .capital-breakdown span { background:rgba(255,255,255,.55); color:#112219; border-color:rgba(15,50,27,.07); }
:root[data-theme="light"] .finance-master-card .capital-breakdown small { color:#728078; }
.finance-master-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin-top:8px; }
.finance-master-grid > div { min-width:0; min-height:66px; padding:9px; border:1px solid rgba(255,255,255,.065); border-radius:11px; background:rgba(3,27,16,.32); }
.finance-master-grid > div:nth-child(1),.finance-master-grid > div:nth-child(2),.finance-master-grid > div:nth-child(3),.finance-master-grid > div:nth-child(6) { background:linear-gradient(145deg,rgba(54,204,103,.19),rgba(4,32,19,.34)); }
.finance-master-grid > div:nth-child(4),.finance-master-grid > div:nth-child(5) { background:linear-gradient(145deg,rgba(205,69,80,.19),rgba(52,16,22,.28)); }
.finance-master-grid small { display:block; color:rgba(235,255,241,.58); font-size:7.5px; line-height:1.25; }
.finance-master-grid strong { display:block; margin-top:5px; color:#f5fff8; font-size:15px; line-height:1.05; overflow-wrap:anywhere; }
.finance-master-grid > div:nth-child(4) strong,.finance-master-grid > div:nth-child(5) strong { color:#ff979c; }
.finance-master-grid em { display:block; margin-top:4px; color:rgba(235,255,241,.50); font-size:7px; font-style:normal; }
:root[data-theme="light"] .finance-master-grid > div { border-color:rgba(20,50,28,.07); background:rgba(255,255,255,.58); }
:root[data-theme="light"] .finance-master-grid small,:root[data-theme="light"] .finance-master-grid em { color:#718078; }
:root[data-theme="light"] .finance-master-grid strong { color:#102017; }
.finance-source-details { margin-top:8px; border:1px solid rgba(255,255,255,.07); border-radius:10px; background:rgba(0,0,0,.12); }
.finance-source-details summary { padding:8px 10px; color:rgba(245,255,248,.75); font-size:8px; }
.finance-source-row { display:flex; justify-content:space-between; padding:6px 10px; border-top:1px solid rgba(255,255,255,.06); font-size:8px; }
.goal-row { margin-top:10px; font-size:10px; }
.finance-master-card .goal-row strong { color:inherit; font-size:16px; }
.finance-master-card .progress { height:6px; margin-top:7px; background:rgba(0,0,0,.22); }
.finance-master-card .progress > span { background:linear-gradient(90deg,#56ea78,#b0ff88); }
.finance-tabs { margin-top:11px; }
.finance-support-section { margin-top:16px; }
.chart-card { padding:12px; }
.dual-chart,.bar-chart { min-height:130px; }

/* Tasks */
.task-view-tabs,.project-tabs,.progress-period-tabs { margin-top:2px; }
.task-search-row { margin:0 0 8px; }
.search-input,.field input,.field select,.field textarea { border:1px solid var(--line); border-radius:11px; padding:11px 12px; background:var(--surface-2); color:var(--text); font-size:12px; }
.task-ideas-link { width:100%; margin-top:18px; display:flex; justify-content:space-between; align-items:center; text-align:left; cursor:pointer; }
.task-ideas-link small,.task-ideas-link strong { display:block; }
.task-ideas-link small { color:var(--muted); font-size:9px; }
.task-ideas-link strong { margin-top:4px; font-size:12px; }
.task-ideas-link > span { color:var(--accent); font-size:25px; }
.knowledge-preview-card { padding:10px; }
.folder-chip-row { gap:5px; }
.folder-chip-row .chip { flex:0 0 auto; min-height:29px; padding:6px 9px; font-size:9px; }

/* Projects */
.project-list { gap:9px; }
.project-card { padding:13px; }
.project-card-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.project-card-head strong { color:var(--warning); font-size:14px; white-space:nowrap; }
.project-compact-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:10px; }
.project-compact-stats span { min-width:0; display:grid; gap:3px; padding:8px; border-radius:10px; background:var(--surface-2); }
.project-compact-stats small { color:var(--muted); font-size:7px; }
.project-compact-stats b { font-size:9px; overflow-wrap:anywhere; }
.project-date-row { display:flex; justify-content:space-between; gap:10px; margin-top:9px; color:var(--muted); font-size:8px; }
.project-date-row b { color:var(--text); }
.project-next { margin-top:9px; padding:8px 10px; border-radius:10px; background:var(--accent-soft); color:color-mix(in srgb,var(--accent) 30%,var(--text)); font-size:9px; }
.project-footer { margin-top:9px; }
.add-project-button { margin-top:14px; }

/* Progress */
.progress-main-card { overflow:hidden; padding:14px; }
.progress-main-card > small { color:var(--muted); font-size:9px; }
.progress-main-card > strong { display:block; margin-top:4px; font-size:29px; letter-spacing:-.055em; }
.progress-main-card > span { display:block; margin-top:3px; font-size:9px; }
.progress-main-card .line-chart,.progress-main-card .hero-sparkline { height:145px; margin-top:12px; }
.progress-money-card { margin-top:10px; }
.progress-income-expense { display:grid; gap:8px; margin-top:11px; }
.progress-income-expense span { display:flex; justify-content:space-between; gap:12px; padding-top:8px; border-top:1px solid var(--line); }
.progress-income-expense small { color:var(--muted); }
.growth-mini-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:10px; }
.growth-mini-grid .card { min-height:100px; }
.growth-mini-grid small { color:var(--muted); }
.growth-mini-grid strong { display:block; margin:8px 0; font-size:23px; }
.goal-card { padding:13px; }
.goal-meta-row { font-size:9px; }

/* Settings */
.exact-settings { display:grid; gap:12px; }
.compact-profile { width:100%; display:grid; grid-template-columns:46px 1fr auto; align-items:center; gap:11px; padding:12px; color:var(--text); text-align:left; cursor:pointer; }
.settings-avatar { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(145deg,#aaff8c,#36c96d); color:#092315; font-size:21px; font-weight:900; box-shadow:0 9px 22px rgba(54,201,109,.19); }
.compact-profile h2 { margin:0; font-size:15px; }
.compact-profile p { margin:3px 0 0; color:var(--muted); font-size:9px; }
.compact-profile > span { color:var(--muted); font-size:24px; }
.exact-settings-list { padding:4px 12px; }
.settings-row { min-height:57px; display:grid; grid-template-columns:32px 1fr auto; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); }
.settings-row:last-child { border-bottom:0; }
.settings-row span { display:grid; gap:3px; font-size:11px; font-weight:680; }
.settings-row small { color:var(--muted); font-size:8px; font-weight:500; }
.settings-row > b { color:var(--muted); font-size:18px; }
.settings-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--surface-3); color:var(--accent); font-style:normal; font-size:14px; }
.settings-row.featured .settings-icon { background:var(--accent-soft); }
.settings-row.danger { color:var(--danger); }
.settings-row.danger .settings-icon { color:var(--danger); background:rgba(255,126,134,.10); }
.app-version { margin:3px 0 18px; color:var(--muted); text-align:center; font-size:9px; }
.profile-editor-head { display:flex; align-items:center; gap:12px; margin-bottom:15px; }
.profile-editor-head b,.profile-editor-head small { display:block; }
.profile-editor-head small,.modal-description { color:var(--muted); font-size:10px; }
.exact-theme-picker { grid-template-columns:repeat(3,minmax(0,1fr)); }

/* Bottom navigation */
.bottom-nav {
  position:fixed;
  z-index:70;
  left:50%;
  bottom:calc(7px + env(safe-area-inset-bottom));
  width:min(calc(100% - 14px),506px);
  min-height:66px;
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:1px;
  padding:5px;
  border:1px solid var(--line-strong);
  border-radius:20px;
  background:color-mix(in srgb,var(--surface-soft) 92%,transparent);
  box-shadow:0 16px 44px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
}
.bottom-nav .nav-item { min-width:0; min-height:54px; display:grid; place-items:center; align-content:center; gap:3px; border:0; border-radius:14px; background:transparent; color:var(--muted); }
.bottom-nav .nav-item svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.bottom-nav .nav-item .nav-fill { fill:currentColor; stroke:currentColor; }
.bottom-nav .nav-item small { max-width:100%; font-size:6.7px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bottom-nav .nav-item.active { color:var(--accent); background:linear-gradient(180deg,rgba(134,248,149,.12),rgba(134,248,149,.045)); box-shadow:inset 0 1px 0 rgba(255,255,255,.03); }
.bottom-nav .nav-item.active svg { filter:drop-shadow(0 0 7px rgba(134,248,149,.26)); }

/* Floating plus */
.floating-add { display:none; position:fixed; z-index:80; right:max(17px,calc((100vw - 506px)/2 + 17px)); bottom:calc(82px + env(safe-area-inset-bottom)); width:48px; height:48px; border:1px solid rgba(255,255,255,.72); border-radius:50%; background:radial-gradient(circle at 30% 18%,#fff,transparent 24%),linear-gradient(145deg,#d1ffac,#70ea84 55%,#3fca73); color:#082216; box-shadow:0 12px 29px rgba(70,216,108,.28); }
body[data-screen="tasks"] .floating-add,body[data-screen="growth"] .floating-add { display:grid; }

/* Modal and quick actions */
dialog.modal { width:min(100%,520px); max-width:520px; max-height:92dvh; margin:auto 0 0; padding:0; border:1px solid var(--line-strong); border-width:1px 0 0; border-radius:23px 23px 0 0; background:var(--surface); color:var(--text); box-shadow:0 -20px 75px rgba(0,0,0,.48); }
.modal::backdrop { background:rgba(0,0,0,.62); backdrop-filter:blur(7px); }
.modal-card { max-height:92dvh; padding:15px; }
.modal-head { top:-15px; margin:-15px -15px 12px; padding:21px 15px 12px; background:color-mix(in srgb,var(--surface) 96%,transparent); }
.modal-head::before { content:""; position:absolute; top:7px; left:50%; width:39px; height:4px; border-radius:99px; background:var(--line-strong); transform:translateX(-50%); }
.modal-head h2 { font-size:17px; }
.icon-btn { width:32px; height:32px; border-radius:10px; }
.modal-actions { bottom:-15px; margin:15px -15px -15px; padding:11px 15px calc(11px + env(safe-area-inset-bottom)); background:color-mix(in srgb,var(--surface) 97%,transparent); }
.vnext-quick-sheet { grid-template-columns:1fr; gap:7px; }
.vnext-quick-sheet button,.vnext-quick-sheet button.primary-action { min-height:58px; grid-column:auto; grid-template-columns:34px 1fr; padding:9px 10px; border-radius:13px; }
.vnext-quick-sheet button span { width:34px; height:34px; border-radius:10px; font-size:17px; }
.vnext-quick-sheet button b { font-size:12px; }
.vnext-quick-sheet button small { font-size:8px; }
.quick-expense-form .quick-amount-wrap input { font-size:40px; }
.expense-category-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; }
.expense-category-chip { min-height:55px; padding:7px 3px; border-radius:11px; font-size:8px; }

/* Face ID */
.lock-screen { z-index:500; background:radial-gradient(circle at 50% 22%,rgba(91,244,135,.18),transparent 30%),linear-gradient(180deg,#06281a,#02100a 75%); }
.lock-card { width:min(92vw,390px); padding:28px 22px; border:0; background:transparent; box-shadow:none; text-align:center; }
.face-orb { width:145px; height:145px; margin-bottom:24px; box-shadow:0 0 72px rgba(91,244,135,.20); }
.lock-card h2 { font-size:22px; }
.lock-card > p { color:var(--muted); font-size:11px; line-height:1.45; }
.face-retry { max-width:240px; margin-left:auto; margin-right:auto; }
.lock-pin-form { max-width:290px; margin:0 auto; }

/* Theme safety */
:root[data-theme="light"] .topbar { background:linear-gradient(180deg,rgba(244,246,245,.98),rgba(244,246,245,.90) 78%,transparent); }
:root[data-theme="light"] .bottom-nav { background:rgba(255,255,255,.92); }
:root[data-theme="light"] .modal-head,:root[data-theme="light"] .modal-actions { background:rgba(255,255,255,.97); }
:root[data-theme="light"] .home-metric-card.income { background:linear-gradient(145deg,#effaf1,#fff); }
:root[data-theme="light"] .home-metric-card.expense { background:linear-gradient(145deg,#fff0f1,#fff); }
:root[data-theme="light"] .home-metric-card.week { background:linear-gradient(145deg,#eff9f8,#fff); }
:root[data-theme="light"] .home-metric-card.free { background:linear-gradient(145deg,#f4f1fb,#fff); }
:root[data-theme="light"] .settings-icon { color:#168d4d; }

@media (max-width:360px) {
  .content { padding-left:11px; padding-right:11px; }
  .topbar { padding-left:11px; padding-right:11px; }
  .brand-mark { width:39px; height:39px; flex-basis:39px; font-size:21px; }
  .topbar h1 { font-size:25px; }
  .home-capital-card strong { font-size:29px; }
  .home-metric-card strong { font-size:19px; }
  .bottom-nav { width:calc(100% - 8px); padding:4px 2px; }
  .bottom-nav .nav-item small { font-size:5.8px; }
  .bottom-nav .nav-item svg { width:16px; height:16px; }
  .finance-master-card .kpi { font-size:29px; }
  .finance-master-grid strong { font-size:13px; }
  .exact-theme-picker { grid-template-columns:1fr; }
}

@media (min-width:521px) {
  .topbar { border-left:1px solid rgba(255,255,255,.025); border-right:1px solid rgba(255,255,255,.025); }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; }
}
.finance-master-card .goal-row,
.finance-master-card .goal-row span,
.finance-master-card .goal-row strong { color:#f4fff7!important; }
:root[data-theme="light"] .finance-master-card .goal-row,
:root[data-theme="light"] .finance-master-card .goal-row span,
:root[data-theme="light"] .finance-master-card .goal-row strong { color:#102017!important; }
.hero-month-picker select { width:112px; min-height:31px; border:1px solid rgba(255,255,255,.09); border-radius:9px; padding:6px 7px; background:rgba(0,0,0,.18); color:inherit; font-size:9px; }
:root[data-theme="light"] .hero-month-picker select { background:rgba(255,255,255,.66); border-color:rgba(10,30,18,.08); color:#102017; }

/* =========================================================
   Alexander OS V11 - approved neon glass design system
   ========================================================= */
:root {
  --bg: #02090c;
  --bg-soft: #061116;
  --surface: #0a171c;
  --surface-2: #0c1c22;
  --surface-3: #10252b;
  --surface-soft: rgba(7, 20, 24, .94);
  --text: #f3f7f5;
  --muted: #8a999a;
  --line: rgba(122, 255, 104, .10);
  --line-strong: rgba(122, 255, 104, .22);
  --accent: #9cf329;
  --accent-soft: rgba(156, 243, 41, .12);
  --accent-2: #39e56f;
  --success: #52ee7e;
  --danger: #ff5f53;
  --warning: #ffc84f;
  --radius: 24px;
  --radius-sm: 16px;
  --shadow: 0 26px 78px rgba(0, 0, 0, .48);
}
:root[data-theme="graphite"] {
  --bg: #080b0e;
  --bg-soft: #101418;
  --surface: #151b20;
  --surface-2: #1a2228;
  --surface-3: #212b32;
  --surface-soft: rgba(18, 24, 29, .95);
  --text: #f3f5f4;
  --muted: #9ba5aa;
  --line: rgba(255,255,255,.08);
  --line-strong: rgba(156,243,41,.16);
  --accent: #9cf329;
  --accent-soft: rgba(156,243,41,.10);
  --accent-2: #5fe781;
}
:root[data-theme="light"] {
  --bg: #eef2ee;
  --bg-soft: #e5ebe6;
  --surface: #fbfdfb;
  --surface-2: #f3f7f3;
  --surface-3: #e8efe9;
  --surface-soft: rgba(251,253,251,.96);
  --text: #101713;
  --muted: #67736b;
  --line: rgba(15, 55, 28, .10);
  --line-strong: rgba(73, 170, 64, .23);
  --accent: #66c928;
  --accent-soft: rgba(102,201,40,.13);
  --accent-2: #2cb861;
  --danger: #d64e45;
  --warning: #a96e00;
  --success: #188a45;
  --shadow: 0 22px 64px rgba(31, 50, 38, .12);
}

html, body { min-height: 100%; }
body {
  background:
    radial-gradient(circle at 15% -6%, rgba(76, 255, 120, .09), transparent 34%),
    radial-gradient(circle at 92% 20%, rgba(100, 255, 123, .035), transparent 28%),
    linear-gradient(180deg, #02080b 0%, var(--bg) 42%, #010607 100%);
  letter-spacing: -.012em;
}
:root[data-theme="light"] body {
  background: linear-gradient(180deg, #f8faf8 0%, var(--bg) 55%, #e9efea 100%);
}

.app-shell { padding-bottom: calc(104px + env(safe-area-inset-bottom)); }
.content { width: min(100%, 560px); padding: 7px 14px 42px; }
.topbar {
  padding: calc(17px + env(safe-area-inset-top)) 16px 13px;
  background: linear-gradient(180deg, rgba(2,9,12,.98), rgba(2,9,12,.84) 78%, transparent);
}
:root[data-theme="light"] .topbar { background: linear-gradient(180deg, rgba(248,250,248,.98), rgba(248,250,248,.88) 78%, transparent); }
.topbar-brand { gap: 12px; }
.brand-mark {
  width: 52px; height: 52px; flex-basis: 52px; border-radius: 17px;
  background: radial-gradient(circle at 30% 15%, #efffca 0 10%, transparent 31%), linear-gradient(145deg, #c7ff52 0%, #84dc28 48%, #5dbb18 100%);
  color: #071304; font-size: 30px; font-weight: 950; border: 1px solid rgba(255,255,255,.62);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 12px 30px rgba(111, 223, 38, .22);
}
.brand-line { font-size: 15px; }
.brand-line span { background: rgba(156,243,41,.13); color: var(--accent); border-color: rgba(156,243,41,.26); font-size: 10px; }
.topbar .eyebrow { margin-top: 2px; font-size: 9px; letter-spacing: .08em; text-transform: none; }
.topbar h1 { font-size: clamp(28px, 8vw, 39px); letter-spacing: -.052em; }
.top-add {
  width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(156,243,41,.34);
  background: radial-gradient(circle at 30% 18%, rgba(255,255,255,.75), transparent 22%), rgba(14,34,27,.9);
  color: var(--accent); box-shadow: 0 0 0 1px rgba(156,243,41,.05), 0 12px 26px rgba(0,0,0,.24);
}

.card, .toolbar-card, .stat-card, .item, .insight, .details-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.032), rgba(255,255,255,.007)), var(--surface);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 16px 38px rgba(0,0,0,.20);
}
.section { margin-top: 20px; }
.section-head { margin-bottom: 10px; }
.section-head h2 { font-size: 20px; }

.tabs, .filter-row { border: 1px solid var(--line); background: var(--surface-2); padding: 4px; border-radius: 17px; }
.tab, .chip { border-radius: 12px; }
.tab.active, .chip.active {
  background: linear-gradient(145deg, #42dd6d, #0aa447);
  color: white; box-shadow: 0 10px 24px rgba(27,202,87,.18), inset 0 1px 0 rgba(255,255,255,.28);
}
.btn.primary {
  background: linear-gradient(135deg, #a7f638, #34d964 55%, #12a34a);
  color: #071006; box-shadow: 0 14px 32px rgba(45,211,92,.20), inset 0 1px 0 rgba(255,255,255,.42);
}
.progress { height: 8px; background: rgba(255,255,255,.07); }
.progress span { background: linear-gradient(90deg, #82ed29, #38df6a); box-shadow: 0 0 14px rgba(82,238,105,.36); }
.positive { color: var(--success)!important; }
.negative { color: var(--danger)!important; }

/* Home */
.home-welcome small { color: var(--accent); }
.home-welcome h2 { font-size: 25px; }
.home-capital-card {
  border-color: rgba(156,243,41,.18);
  background: radial-gradient(circle at 92% 8%, rgba(89,243,100,.12), transparent 34%), linear-gradient(145deg, #0e2720, #07181a 62%, #051216);
}
.home-capital-card strong { font-size: clamp(34px, 10vw, 52px); }
.home-metric-grid { gap: 10px; }
.home-metric-card { min-height: 103px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(255,255,255,.032), transparent), var(--surface); }
.home-metric-card.income { background: linear-gradient(145deg, rgba(73,234,99,.09), transparent), var(--surface); }
.home-metric-card.expense { background: linear-gradient(145deg, rgba(255,86,75,.08), transparent), var(--surface); }
.home-metric-card.free { background: linear-gradient(145deg, rgba(130,237,41,.07), transparent), var(--surface); }

/* Finance */
.finance-master-card {
  border: 1px solid rgba(156,243,41,.20);
  background: radial-gradient(circle at 94% 2%, rgba(75,239,101,.14), transparent 32%), linear-gradient(145deg,#0d2820,#071a18 58%,#041215);
}
.finance-master-card .kpi { font-size: clamp(37px, 10vw, 54px); }
.finance-master-grid { gap: 9px; }
.finance-master-grid > div {
  min-height: 78px; padding: 13px; border-radius: 17px; border: 1px solid rgba(255,255,255,.04);
  background: rgba(4, 21, 19, .62);
}
.finance-master-grid strong { font-size: 18px; }
.capital-breakdown { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
.capital-breakdown span { border-radius: 14px; padding: 10px; display:grid; gap:4px; color: var(--text); background: rgba(0,0,0,.14); }
.capital-breakdown small { color: var(--muted); }
.dual-chart .income-bar { background: linear-gradient(180deg,#b2f43f,#26d76b)!important; }
.dual-chart .expense-bar { background: linear-gradient(180deg,#ff8e47,#ff4e3f)!important; }

/* Tasks */
.item { border-radius: 18px; }
.check { border-radius: 7px; }
.check:checked { box-shadow: inset 0 0 0 4px var(--surface); }
.knowledge-preview-card { background: linear-gradient(145deg, rgba(156,243,41,.035), transparent), var(--surface); }

/* Projects */
.project-card { overflow: hidden; }
.project-card::after { content:""; display:block; height:5px; margin:14px -17px -17px; background: linear-gradient(90deg,var(--accent) var(--project-progress,55%),rgba(255,255,255,.07) 0); }
.project-card-head strong { color: var(--accent); }
.add-project-button { margin-top: 16px; }

/* Progress V11 */
.v11-tabs { margin-bottom: 12px; }
.v11-progress-overview { padding: 18px; }
.v11-progress-overview h2 { margin: 3px 0 0; font-size: 22px; }
.v11-progress-overview > .section-head > strong { font-size: 24px; }
.v11-progress-grid { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:10px; }
.v11-progress-tile { min-height: 130px; text-align:left; color:var(--text); cursor:pointer; }
.v11-progress-tile .tile-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; background:var(--accent-soft); color:var(--accent); font-size:20px; }
.v11-progress-tile small, .v11-progress-tile em { display:block; color:var(--muted); font-style:normal; }
.v11-progress-tile strong { display:block; margin:8px 0 4px; font-size:24px; }
.v11-workout-card { margin-top: 12px; border-color: rgba(156,243,41,.18); background:radial-gradient(circle at 95% 8%,rgba(156,243,41,.08),transparent 38%),var(--surface); }
.workout-card-head { display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:start; }
.workout-card-head h2 { margin:3px 0 4px; font-size:20px; }
.workout-card-head p { margin:0; color:var(--muted); font-size:12px; line-height:1.4; }
.workout-card-head > strong { color:var(--accent); font-size:30px; }
.workout-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:14px; background:var(--accent-soft); color:var(--accent); font-size:24px; }
.workout-card-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:15px 0; }
.workout-card-stats span { padding:10px; border-radius:14px; background:rgba(255,255,255,.025); }
.workout-card-stats b,.workout-card-stats small { display:block; }
.workout-card-stats small { margin-top:3px; color:var(--muted); font-size:10px; }

/* Settings */
.v11-settings { display:grid; gap:12px; }
.v11-settings .settings-profile-card { width:100%; display:grid; grid-template-columns:54px 1fr auto; align-items:center; gap:12px; color:var(--text); text-align:left; }
.v11-settings .settings-profile-card h2 { margin:0; font-size:20px; }
.v11-settings .settings-profile-card p { margin:4px 0 0; color:var(--accent); font-size:11px; }
.v11-theme-card { padding:15px; }
.v11-theme-picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.v11-theme-choice { padding:10px 6px; border:1px solid var(--line); border-radius:16px; background:var(--surface-2); color:var(--text); cursor:pointer; }
.v11-theme-choice span { width:45px; height:45px; display:block; margin:0 auto 8px; border-radius:50%; background:var(--theme-swatch); border:1px solid rgba(255,255,255,.28); box-shadow: inset 0 1px 8px rgba(255,255,255,.25); }
.v11-theme-choice b { font-size:10px; }
.v11-theme-choice.active { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); }
.settings-row { min-height:62px; }
.settings-row span { font-size:13px; }
.settings-row small { font-size:9px; }
.settings-icon { width:38px; height:38px; border-radius:12px; font-size:17px; }

/* Workout full-screen modal */
dialog.modal.workout-dialog { width:min(100%,760px); max-width:760px; height:100dvh; max-height:100dvh; margin:0 auto; border-radius:0; border:0; background:var(--bg); }
.workout-dialog .modal-card { max-height:100dvh; min-height:100dvh; padding:16px; }
.workout-dialog .modal-head { position:sticky; top:-16px; z-index:8; margin:-16px -16px 14px; padding:calc(18px + env(safe-area-inset-top)) 16px 14px; border-bottom:1px solid var(--line); background:rgba(2,9,12,.92); backdrop-filter:blur(24px); }
:root[data-theme="light"] .workout-dialog .modal-head { background:rgba(248,250,248,.94); }
.workout-dialog .modal-head::before { display:none; }
.workout-dialog .modal-head h2 { font-size:28px; }
.workout-dialog .modal-actions { position:sticky; bottom:-16px; z-index:8; margin:18px -16px -16px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); }
.workout-profile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.workout-profile-grid label { display:grid; gap:5px; padding:11px; border:1px solid var(--line); border-radius:15px; background:var(--surface); }
.workout-profile-grid span { color:var(--muted); font-size:10px; }
.workout-profile-grid input,.workout-profile-grid select { width:100%; padding:0; border:0; background:transparent; color:var(--text); font-weight:750; }
.workout-recommendation { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; margin-top:12px; padding:15px; border:1px solid rgba(156,243,41,.18); border-radius:18px; background:linear-gradient(145deg,rgba(156,243,41,.07),transparent),var(--surface); }
.workout-recommendation small,.workout-recommendation strong,.workout-recommendation p { display:block; }
.workout-recommendation strong { margin:5px 0; font-size:20px; }
.workout-recommendation p { margin:0; color:var(--muted); font-size:11px; }
.workout-ring { width:62px; height:62px; display:grid; place-items:center; border-radius:50%; border:7px solid var(--accent); color:var(--accent); font-size:24px; font-weight:900; box-shadow:0 0 24px rgba(156,243,41,.16); }
.workout-section { margin-top:18px; padding:14px; border:1px solid var(--line); border-radius:20px; background:var(--surface-2); }
.workout-section h3 { margin:0; font-size:18px; }
.workout-week { display:grid; gap:7px; }
.workout-week details,.faq-section details { border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.workout-week summary { display:grid; grid-template-columns:56px 1fr auto auto; gap:9px; align-items:center; padding:12px; cursor:pointer; list-style:none; }
.workout-week summary::-webkit-details-marker,.faq-section summary::-webkit-details-marker,.exercise-card summary::-webkit-details-marker { display:none; }
.workout-week summary span { color:var(--accent); font-size:10px; }
.workout-week summary b { font-size:13px; }
.workout-week summary small { color:var(--muted); font-size:9px; }
.workout-week details > div { display:grid; gap:6px; padding:0 12px 12px 77px; color:var(--muted); font-size:10px; }
.exercise-filters { display:flex; gap:7px; overflow:auto; padding-bottom:8px; scrollbar-width:none; }
.exercise-filters::-webkit-scrollbar { display:none; }
.exercise-card { margin-top:8px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.exercise-card summary { display:grid; grid-template-columns:68px 1fr auto; gap:12px; align-items:center; padding:10px; cursor:pointer; list-style:none; }
.exercise-thumb { width:68px; height:58px; display:grid; place-items:center; border-radius:13px; background:radial-gradient(circle at 50% 25%,rgba(156,243,41,.10),transparent 65%),var(--surface-3); }
.exercise-svg { width:56px; height:50px; fill:none; stroke:var(--accent); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.exercise-card summary b,.exercise-card summary small { display:block; }
.exercise-card summary small { margin-top:4px; color:var(--muted); font-size:10px; }
.exercise-details { padding:0 12px 12px 90px; }
.exercise-details p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }
.exercise-safety { margin-top:8px; padding:8px 10px; border-radius:10px; background:var(--accent-soft); color:var(--text); font-size:9px; }
.nutrition-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.nutrition-grid article { padding:12px; border:1px solid var(--line); border-radius:15px; background:var(--surface); }
.nutrition-grid span { font-size:22px; }
.nutrition-grid b,.nutrition-grid small { display:block; }
.nutrition-grid b { margin:7px 0 4px; font-size:12px; }
.nutrition-grid small { color:var(--muted); line-height:1.45; font-size:9px; }
.workout-disclaimer { margin:10px 0 0; color:var(--muted); font-size:9px; line-height:1.5; }
.faq-section details { margin-top:7px; }
.faq-section summary { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px; cursor:pointer; list-style:none; font-size:12px; }
.faq-section details p { margin:0; padding:0 12px 12px; color:var(--muted); font-size:10px; line-height:1.5; }

/* Navigation */
.bottom-nav { width:min(calc(100% - 10px),560px); min-height:72px; bottom:calc(5px + env(safe-area-inset-bottom)); padding:5px; border-radius:22px; background:rgba(5,16,19,.93); }
:root[data-theme="light"] .bottom-nav { background:rgba(252,253,252,.94); }
.bottom-nav .nav-item { min-height:60px; gap:4px; border-radius:16px; }
.bottom-nav .nav-item svg { width:22px; height:22px; stroke-width:1.75; }
.bottom-nav .nav-item small { font-size:8px; }
.bottom-nav .nav-item.active { color:var(--accent); background:linear-gradient(180deg,rgba(156,243,41,.11),rgba(156,243,41,.025)); }
.floating-add { width:54px; height:54px; bottom:calc(88px + env(safe-area-inset-bottom)); background:linear-gradient(145deg,#b6fb3b,#24d65f); color:#061006; }

/* Light theme parity */
:root[data-theme="light"] .home-capital-card,
:root[data-theme="light"] .finance-master-card { background:radial-gradient(circle at 92% 5%,rgba(100,201,40,.11),transparent 34%),linear-gradient(145deg,#ffffff,#eef7ef); }
:root[data-theme="light"] .finance-master-grid > div,
:root[data-theme="light"] .capital-breakdown span { background:rgba(255,255,255,.72); }
:root[data-theme="light"] .workout-dialog .modal-actions { background:rgba(248,250,248,.97); }

@media (max-width: 390px) {
  .content { padding-left:10px; padding-right:10px; }
  .topbar { padding-left:10px; padding-right:10px; }
  .brand-mark { width:44px; height:44px; flex-basis:44px; font-size:25px; border-radius:15px; }
  .top-add { width:42px; height:42px; }
  .finance-master-grid strong { font-size:15px; }
  .v11-progress-tile { min-height:118px; }
  .workout-profile-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .workout-week summary { grid-template-columns:48px 1fr auto; }
  .workout-week summary small { display:none; }
  .workout-week details > div { padding-left:70px; }
}

@media (max-width: 340px) {
  .brand-line { font-size:12px; }
  .topbar h1 { font-size:24px; }
  .home-metric-grid,.v11-progress-grid,.nutrition-grid { grid-template-columns:1fr; }
  .workout-profile-grid { grid-template-columns:1fr 1fr; }
  .bottom-nav .nav-item small { font-size:6.4px; }
  .bottom-nav .nav-item svg { width:18px; height:18px; }
}

/* V11.1 Stability & Intelligence */
.utility-intro { padding:14px; margin-bottom:12px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,var(--accent-soft),transparent),var(--surface); }
.utility-intro b,.utility-intro p { display:block; }
.utility-intro p { margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
.utility-list { display:grid; gap:8px; margin-top:12px; }
.utility-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.utility-row b,.utility-row small { display:block; }
.utility-row small { margin-top:4px; color:var(--muted); font-size:9px; line-height:1.45; }
.utility-actions { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.mini-action { min-height:34px; padding:7px 10px; border:1px solid var(--line); border-radius:11px; background:var(--surface-2); color:var(--text); font-weight:750; cursor:pointer; }
.mini-action.danger { color:var(--danger); }
.utility-index { min-width:30px; height:30px; display:grid; place-items:center; border-radius:10px; background:var(--accent-soft); color:var(--accent); font-weight:800; }
.smart-expense-line { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.smart-expense-line input { min-height:48px; border:1px solid var(--line); border-radius:15px; background:var(--surface); color:var(--text); padding:0 14px; }
.smart-expense-line button { min-height:48px; border:0; border-radius:15px; padding:0 14px; background:var(--accent); color:#071008; font-weight:850; }
.smart-expense-hint { color:var(--muted); font-size:9px; }
.finance-tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
.finance-tool { display:grid; grid-template-columns:42px 1fr auto; gap:11px; align-items:center; text-align:left; color:var(--text); cursor:pointer; }
.finance-tool > span { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; background:var(--accent-soft); color:var(--accent); font-size:22px; }
.finance-tool b,.finance-tool small { display:block; }
.finance-tool small { margin-top:4px; color:var(--muted); font-size:9px; line-height:1.35; }
.finance-tool i { color:var(--muted); font-style:normal; font-size:22px; }
.compact-month-field { max-width:220px; }
.calendar-weekdays,.finance-calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; }
.calendar-weekdays { margin:10px 0 6px; }
.calendar-weekdays span { text-align:center; color:var(--muted); font-size:9px; }
.calendar-cell { min-height:58px; padding:7px; border:1px solid var(--line); border-radius:13px; background:var(--surface); color:var(--text); text-align:left; cursor:pointer; }
.calendar-cell.empty { visibility:hidden; }
.calendar-cell.today { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent-soft); }
.calendar-cell b { font-size:11px; }
.calendar-cell div { display:grid; gap:2px; margin-top:6px; }
.calendar-cell span { font-size:7.5px; white-space:nowrap; }
.calendar-cell i { width:16px; height:16px; display:grid; place-items:center; border-radius:50%; background:rgba(255,190,40,.18); color:#ffc64c; font-size:8px; font-style:normal; }
.cal-income { color:var(--positive); }
.cal-expense { color:var(--danger); }
.cal-obligation { color:#ffc64c; }
.calendar-day-details { margin-top:12px; padding:13px; border:1px solid var(--line); border-radius:16px; background:var(--surface-2); }
.calendar-day-details h3 { margin:0 0 10px; }
.calendar-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:8px; }
.calendar-summary span,.calendar-op { padding:9px 10px; border-radius:11px; background:var(--surface); }
.calendar-summary b { display:block; margin-top:3px; }
.calendar-op { display:flex; justify-content:space-between; gap:10px; margin-top:6px; }
.calendar-op.planned { border:1px dashed rgba(255,198,76,.32); }
.calendar-legend { display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:9px; }
.diagnostic-score { display:grid; place-items:center; padding:20px; border:1px solid var(--line); border-radius:20px; background:radial-gradient(circle,var(--accent-soft),transparent 70%),var(--surface); }
.diagnostic-score strong { font-size:42px; color:var(--accent); }
.diagnostic-score span { color:var(--muted); }
.diagnostic-list { display:grid; gap:8px; margin-top:12px; }
.diagnostic-row { display:grid; grid-template-columns:34px 1fr; gap:10px; align-items:center; padding:11px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.diagnostic-row i { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:rgba(255,180,60,.14); color:#ffc64c; font-style:normal; font-weight:900; }
.diagnostic-row.ok i { background:var(--accent-soft); color:var(--accent); }
.diagnostic-row.danger i { background:rgba(255,74,74,.14); color:var(--danger); }
.diagnostic-row b,.diagnostic-row small { display:block; }
.diagnostic-row small { margin-top:3px; color:var(--muted); font-size:9px; }
.self-tests { margin-top:12px; }
.self-tests summary { display:flex; justify-content:space-between; align-items:center; cursor:pointer; }
.test-row { display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-top:1px solid var(--line); }
.test-row.ok span { color:var(--positive); }
.test-row.bad span { color:var(--danger); }
.test-row small { color:var(--muted); }
.workout-card-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.workout-log-form { padding:12px; border:1px solid var(--line); border-radius:18px; background:var(--surface-2); }
.auto-review-card { display:grid; gap:12px; }
.auto-review-card b { display:block; }
.auto-review-card p { margin:5px 0 0; color:var(--muted); font-size:10px; line-height:1.45; }
.review-history { margin-top:10px; }
.review-history summary { display:flex; justify-content:space-between; cursor:pointer; }
.stability-settings .settings-row:first-child .settings-icon { color:var(--accent); }

:root[data-theme="light"] .calendar-cell,
:root[data-theme="light"] .calendar-day-details,
:root[data-theme="light"] .utility-row,
:root[data-theme="light"] .smart-expense-line input,
:root[data-theme="light"] .diagnostic-row { background:#fff; }

@media (max-width:420px) {
  .finance-tool-grid { grid-template-columns:1fr; }
  .finance-calendar,.calendar-weekdays { gap:4px; }
  .calendar-cell { min-height:52px; padding:6px; }
  .workout-card-actions { grid-template-columns:1fr; }
}


/* V11.2 - five-tab navigation and profile settings sheet */
.profile-settings-trigger {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.profile-settings-trigger:active { transform: scale(.985); }
.profile-settings-trigger .brand-mark { box-shadow: 0 0 0 1px rgba(156,243,41,.14), 0 10px 30px rgba(65,210,83,.12); }
.bottom-nav { grid-template-columns: repeat(5,minmax(0,1fr)); }
.settings-dialog .modal-card {
  width: min(100%, 620px);
  max-height: 94dvh;
  padding: 14px;
  border-radius: 28px 28px 0 0;
  background: color-mix(in srgb, var(--bg) 94%, transparent);
  box-shadow: 0 -22px 70px rgba(0,0,0,.44);
}
.settings-dialog::backdrop { background: rgba(0,8,5,.62); backdrop-filter: blur(10px); }
.settings-dialog .modal-head { position: sticky; top: 0; z-index: 5; padding: 4px 2px 12px; background: linear-gradient(180deg,var(--bg) 78%,transparent); }
.settings-dialog .modal-head h2 { font-size: 24px; }
.settings-dialog #modalBody { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
.settings-dialog .settings-screen { gap: 14px; }
.settings-dialog .settings-profile-card { margin-top: 2px; }
@media (max-width: 640px) {
  .settings-dialog { align-items: end; padding: 0; }
  .settings-dialog .modal-card { width: 100%; max-width: none; min-height: 82dvh; max-height: 94dvh; margin: 0; }
}

/* =========================================================
   Alexander OS V11.3 - Settings polish, spacing and Neon Lime
   ========================================================= */

:root[data-theme="neonlime"] {
  --bg: #111315;
  --bg-soft: #17191c;
  --surface: #1b1e21;
  --surface-2: #141619;
  --surface-3: #25292d;
  --surface-soft: rgba(23, 25, 28, .96);
  --text: #f5f5f0;
  --muted: #9a9d9f;
  --line: rgba(255, 255, 255, .075);
  --line-strong: rgba(216, 255, 24, .28);
  --accent: #d8ff18;
  --accent-soft: rgba(216, 255, 24, .12);
  --accent-2: #a7ff47;
  --danger: #ff6d62;
  --warning: #ffd34f;
  --success: #c8ff32;
  --shadow: 0 28px 72px rgba(0, 0, 0, .46);
  --glass-shadow: 0 20px 54px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255,255,255,.035);
  color-scheme: dark;
}

:root[data-theme="neonlime"] body {
  background:
    radial-gradient(circle at 58% -12%, rgba(216,255,24,.055), transparent 30%),
    linear-gradient(180deg, #16181a 0%, #101214 56%, #0b0d0f 100%);
}

:root[data-theme="neonlime"] .topbar {
  background: linear-gradient(180deg, rgba(17,19,21,.98), rgba(17,19,21,.90), rgba(17,19,21,0));
}

:root[data-theme="neonlime"] .brand-mark,
:root[data-theme="neonlime"] .top-add,
:root[data-theme="neonlime"] .floating-add {
  border-color: rgba(222,255,77,.66) !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.72), transparent 23%),
    linear-gradient(145deg, #edff73 0%, #d8ff18 58%, #a6d900 100%) !important;
  color: #151a00 !important;
  box-shadow: 0 12px 30px rgba(216,255,24,.21), inset 0 1px 0 rgba(255,255,255,.68) !important;
}

:root[data-theme="neonlime"] .card,
:root[data-theme="neonlime"] .stat-card,
:root[data-theme="neonlime"] .toolbar-card,
:root[data-theme="neonlime"] .item,
:root[data-theme="neonlime"] .action-tile,
:root[data-theme="neonlime"] .settings-profile-card,
:root[data-theme="neonlime"] .settings-list-card,
:root[data-theme="neonlime"] .settings-form,
:root[data-theme="neonlime"] .privacy-card,
:root[data-theme="neonlime"] .home-metric-card {
  border-color: rgba(255,255,255,.07);
  background:
    linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.006)),
    #1b1e21;
  box-shadow: 0 17px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.035);
}

:root[data-theme="neonlime"] .home-capital-card,
:root[data-theme="neonlime"] .progress-hero,
:root[data-theme="neonlime"] .v11-progress-overview {
  border-color: rgba(216,255,24,.20);
  background:
    radial-gradient(circle at 92% 0%, rgba(216,255,24,.12), transparent 33%),
    linear-gradient(145deg, #24282a 0%, #1b1e20 52%, #17191b 100%);
  box-shadow: 0 24px 62px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.05);
}

:root[data-theme="neonlime"] .finance-master-card {
  border-color: rgba(216,255,24,.24);
  background:
    radial-gradient(circle at 90% 0%, rgba(216,255,24,.15), transparent 31%),
    linear-gradient(145deg, #292d2e 0%, #1e2123 50%, #17191b 100%);
  color: var(--text);
  box-shadow: 0 26px 66px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.05);
}

:root[data-theme="neonlime"] .finance-master-card .eyebrow,
:root[data-theme="neonlime"] .finance-master-grid small,
:root[data-theme="neonlime"] .finance-master-grid em,
:root[data-theme="neonlime"] .finance-master-card .capital-breakdown small {
  color: #9ea19e;
}

:root[data-theme="neonlime"] .finance-master-card .capital-breakdown span,
:root[data-theme="neonlime"] .finance-master-grid > div,
:root[data-theme="neonlime"] .finance-source-details {
  border-color: rgba(255,255,255,.075);
  background: rgba(0,0,0,.17);
  color: var(--text);
}

:root[data-theme="neonlime"] .finance-master-grid > div:nth-child(1),
:root[data-theme="neonlime"] .finance-master-grid > div:nth-child(2),
:root[data-theme="neonlime"] .finance-master-grid > div:nth-child(3),
:root[data-theme="neonlime"] .finance-master-grid > div:nth-child(6) {
  background: linear-gradient(145deg, rgba(216,255,24,.08), rgba(0,0,0,.16));
}

:root[data-theme="neonlime"] .finance-master-grid strong,
:root[data-theme="neonlime"] .finance-master-card .capital-breakdown span {
  color: var(--text);
}

:root[data-theme="neonlime"] .tabs,
:root[data-theme="neonlime"] .bottom-nav {
  border-color: rgba(255,255,255,.07);
  background: rgba(20,22,24,.93);
  box-shadow: 0 18px 48px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.035);
}

:root[data-theme="neonlime"] .tab.active,
:root[data-theme="neonlime"] .chip.active {
  background: linear-gradient(180deg, #e3ff55, #c4ef0d);
  color: #171b05;
  box-shadow: 0 7px 18px rgba(216,255,24,.18), inset 0 1px 0 rgba(255,255,255,.56);
}

:root[data-theme="neonlime"] .bottom-nav .nav-item.active {
  background: radial-gradient(circle at 50% -10%, rgba(216,255,24,.15), transparent 68%);
  color: var(--accent);
}

:root[data-theme="neonlime"] .btn.primary {
  background: linear-gradient(180deg, #e4ff58, #c9f315);
  color: #171b05;
  box-shadow: 0 12px 28px rgba(216,255,24,.17), inset 0 1px 0 rgba(255,255,255,.58);
}

/* Deliberate breathing room between the progress chart and metric tiles. */
.v11-progress-grid {
  margin-top: 22px;
}

/* Refined habit icon - consistent vector ring instead of a text glyph. */
.v11-progress-tile .habit-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.v11-progress-tile .habit-icon circle {
  stroke-dasharray: 72 28;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
}

/* Four quick themes, readable on every iPhone width. */
.v11-theme-picker {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.v11-theme-choice {
  min-height: 104px;
  padding: 12px 8px;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.v11-theme-choice:active { transform: scale(.98); }
.v11-theme-choice span {
  width: 48px;
  height: 48px;
}
.v11-theme-choice[data-theme-inline="neonlime"] span,
.theme-choice[data-theme-modal="neonlime"] > span {
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.76), transparent 22%),
    linear-gradient(145deg, #f0ff78, #d8ff18 55%, #9dcc00);
  box-shadow: 0 0 24px rgba(216,255,24,.28), inset 0 1px 5px rgba(255,255,255,.52);
}

/* Reliable, inset settings sheet with fixed header and independent scrolling. */
dialog.modal.settings-dialog {
  width: min(calc(100% - 22px), 600px) !important;
  max-width: 600px !important;
  max-height: calc(100dvh - max(22px, env(safe-area-inset-top)) - 12px) !important;
  margin: max(11px, env(safe-area-inset-top)) auto 11px !important;
  padding: 0 !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.56), 0 0 0 1px rgba(255,255,255,.02) !important;
}
.settings-dialog::backdrop {
  background: rgba(0, 7, 4, .68);
  backdrop-filter: blur(13px) saturate(110%);
}
.settings-dialog .modal-card {
  width: 100% !important;
  min-height: 0 !important;
  max-height: inherit !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 52% -8%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 27%),
    color-mix(in srgb, var(--bg) 96%, var(--surface)) !important;
}
.settings-dialog .modal-head {
  position: relative !important;
  top: auto !important;
  z-index: 10;
  flex: 0 0 auto;
  min-height: 70px;
  margin: 0 !important;
  padding: 24px 18px 14px !important;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 96%, transparent) !important;
  backdrop-filter: blur(24px);
}
.settings-dialog .modal-head::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  width: 42px;
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted) 45%, transparent);
  transform: translateX(-50%);
}
.settings-dialog .modal-head h2 {
  font-size: 24px;
  line-height: 1;
}
.settings-dialog .modal-head .icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 15px;
  flex: 0 0 42px;
  touch-action: manipulation;
}
.settings-dialog #modalBody {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 14px 14px calc(24px + env(safe-area-inset-bottom)) !important;
  scroll-padding-top: 14px;
}
.settings-dialog .settings-screen {
  display: grid;
  gap: 12px !important;
}
.settings-dialog .settings-profile-card {
  margin: 0 !important;
  min-height: 82px;
  padding: 14px;
  border-radius: 21px;
}
.settings-dialog .v11-theme-card {
  padding: 14px;
  border-radius: 21px;
}
.settings-dialog .exact-settings-list {
  padding: 4px 12px;
  border-radius: 21px;
}
.settings-dialog .settings-row {
  min-height: 58px;
  padding: 10px 2px;
}
.settings-dialog .settings-icon {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 11px;
}
.settings-dialog .app-version {
  margin: 3px 0 0;
  padding-bottom: 4px;
  text-align: center;
}

@media (max-width: 420px) {
  dialog.modal.settings-dialog {
    width: calc(100% - 14px) !important;
    max-height: calc(100dvh - max(14px, env(safe-area-inset-top)) - 7px) !important;
    margin: max(7px, env(safe-area-inset-top)) auto 7px !important;
    border-radius: 25px !important;
  }
  .settings-dialog .modal-head { min-height: 66px; padding: 22px 14px 12px !important; }
  .settings-dialog #modalBody { padding: 12px 11px calc(18px + env(safe-area-inset-bottom)) !important; }
  .settings-dialog .settings-profile-card { grid-template-columns: 48px 1fr auto; min-height: 76px; padding: 12px; }
  .settings-dialog .settings-avatar { width: 48px; height: 48px; }
  .settings-dialog .settings-profile-card h2 { font-size: 18px; }
  .settings-dialog .settings-row { min-height: 55px; }
  .v11-progress-grid { margin-top: 19px; }
}

/* =====================================================
   Alexander OS V11.4 - custom expense categories
   ===================================================== */
#quickCategoryArea { display:grid; gap:10px; }
.expense-category-chip { position:relative; display:grid; place-items:center; overflow:hidden; }
.expense-category-chip span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.18; overflow:hidden; }
.expense-category-chip.custom { background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 10%,var(--surface-3)),var(--surface-3)); }
.expense-category-chip.custom i { position:absolute; top:5px; right:7px; color:var(--accent); font-size:11px; font-style:normal; }
.category-more { border:1px solid var(--line); border-radius:14px; background:var(--surface-2); overflow:hidden; }
.category-more summary { display:flex; justify-content:space-between; align-items:center; gap:10px; min-height:42px; padding:0 12px; color:var(--text); font-size:11px; font-weight:800; cursor:pointer; list-style:none; }
.category-more summary::-webkit-details-marker { display:none; }
.category-more summary span { min-width:24px; height:24px; display:grid; place-items:center; border-radius:99px; background:var(--accent-soft); color:var(--accent); font-size:9px; }
.category-more[open] summary { border-bottom:1px solid var(--line); }
.category-more .expense-category-grid { padding:9px; }
.category-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.category-tools button { min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:13px; background:var(--surface-2); color:var(--accent); font-weight:800; cursor:pointer; }
.category-tools button:only-child { grid-column:1/-1; }
.custom-category-editor { display:grid; gap:10px; padding:12px; border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line)); border-radius:16px; background:linear-gradient(145deg,var(--accent-soft),transparent),var(--surface-2); }
.custom-category-list { display:grid; gap:7px; }
.custom-category-list > div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 11px; border:1px solid var(--line); border-radius:13px; background:var(--surface-2); }
.custom-category-list b,.custom-category-list small { display:block; }
.custom-category-list small { margin-top:3px; color:var(--muted); font-size:8px; line-height:1.35; }
.custom-category-list button { width:30px; height:30px; border:1px solid var(--line); border-radius:10px; background:var(--surface-3); color:var(--danger); font-size:17px; cursor:pointer; }
@media (max-width:520px) {
  .category-tools { grid-template-columns:1fr 1fr; }
  .custom-category-editor { padding:10px; }
}


/* Alexander OS V11.6 - Russian Video Workouts */
.video-workout-dialog .modal-card { padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
.video-workout-dialog .modal-head { margin-bottom:8px; }
.video-workout-dialog #modalBody { overflow-x:hidden; }
.workout-hub-tabs { position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin:0 0 18px; padding:6px; border:1px solid var(--line); border-radius:19px; background:color-mix(in srgb,var(--bg) 94%,transparent); backdrop-filter:blur(22px); box-shadow:0 12px 30px rgba(0,0,0,.18); }
.workout-hub-tabs button { min-width:0; padding:10px 5px; border:0; border-radius:13px; background:transparent; color:var(--muted); font-size:10px; font-weight:800; white-space:nowrap; }
.workout-hub-tabs button.active { background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 72%,#fff)); color:#071109; box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 22%,transparent); }
.workout-tab-panel[hidden] { display:none !important; }
.workout-save-profile { margin-top:16px; }
.workout-video-intro { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; margin:0 0 16px; padding:18px; border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line)); border-radius:22px; background:radial-gradient(circle at 92% 10%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 48%),var(--surface); box-shadow:0 16px 36px rgba(0,0,0,.16); }
.workout-video-intro small,.workout-video-intro h3,.workout-video-intro p { display:block; margin:0; }
.workout-video-intro small { color:var(--accent); font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
.workout-video-intro h3 { margin-top:4px; font-size:21px; }
.workout-video-intro p { margin-top:5px; color:var(--muted); font-size:11px; line-height:1.45; }
.workout-video-intro > span { display:grid; place-items:center; width:52px; height:52px; border-radius:17px; background:var(--accent-soft); color:var(--accent); font-size:25px; font-weight:900; }
.workout-video-filters { display:flex; overflow-x:auto; gap:7px; margin:0 -2px 12px; padding:2px 2px 7px; scrollbar-width:none; }
.workout-video-filters::-webkit-scrollbar { display:none; }
.workout-video-filters .chip { flex:0 0 auto; }
.workout-video-grid { display:grid; gap:14px; }
.workout-video-card { overflow:hidden; border:1px solid var(--line); border-radius:22px; background:var(--surface); box-shadow:0 14px 40px rgba(0,0,0,.14); }
.workout-video-shell { position:relative; width:100%; min-height:0; aspect-ratio:16/9; overflow:hidden; border-radius:18px; background:#06100c; }
.workout-video-shell img { width:100%; height:100%; display:block; object-fit:cover; }
.workout-video-shell iframe { width:100%; height:100%; display:block; border:0; }
.workout-video-shell .video-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.5)); }
.workout-play { position:absolute; inset:50% auto auto 50%; translate:-50% -50%; width:66px; height:66px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.4); border-radius:50%; background:color-mix(in srgb,var(--accent) 88%,#fff); color:#071109; box-shadow:0 14px 40px rgba(0,0,0,.28),0 0 34px color-mix(in srgb,var(--accent) 26%,transparent); }
.workout-play svg { width:30px; height:30px; fill:currentColor; }
.video-source { position:absolute; left:12px; bottom:10px; padding:6px 9px; border-radius:999px; background:rgba(0,0,0,.58); color:#fff; font-size:9px; font-weight:750; backdrop-filter:blur(12px); }
.workout-video-copy { padding:14px; }
.workout-video-title { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:start; }
.workout-video-title span { color:var(--accent); font-size:9px; font-weight:850; text-transform:uppercase; letter-spacing:.07em; }
.workout-video-title h4 { margin:3px 0 0; font-size:18px; }
.workout-video-title p { margin:4px 0 0; color:var(--muted); font-size:10px; }
.workout-favorite { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--line); border-radius:13px; background:var(--surface-2); color:var(--muted); }
.workout-favorite svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.workout-favorite.active { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 42%,var(--line)); background:var(--accent-soft); }
.workout-favorite.active svg { fill:currentColor; }
.workout-video-metrics { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }
.workout-video-metrics span { padding:7px 9px; border-radius:11px; background:var(--surface-2); color:var(--text); font-size:10px; }
.workout-technique { border:1px solid var(--line); border-radius:14px; background:var(--surface-2); }
.workout-technique summary { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:11px; cursor:pointer; list-style:none; font-size:11px; font-weight:800; }
.workout-technique summary::-webkit-details-marker { display:none; }
.workout-technique > p { margin:0; padding:0 11px 10px; color:var(--muted); font-size:10px; line-height:1.55; }
.workout-technique > b { display:block; padding:2px 11px 0; font-size:10px; }
.workout-technique ul { margin:6px 0 0; padding:0 26px 10px; color:var(--muted); font-size:10px; line-height:1.5; }
.workout-variants { display:grid; grid-template-columns:1fr 1fr; gap:7px; padding:0 10px 10px; }
.workout-variants span { padding:9px; border-radius:11px; background:var(--surface); font-size:9px; }
.workout-variants small { display:block; margin-bottom:3px; color:var(--accent); font-weight:850; }
.workout-video-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.workout-video-actions .btn { min-height:42px; padding:9px; font-size:10px; }
.workout-reels { height:min(68dvh,700px); overflow-y:auto; scroll-snap-type:y mandatory; scroll-padding-top:4px; overscroll-behavior:contain; border-radius:24px; scrollbar-width:none; }
.workout-reels::-webkit-scrollbar { display:none; }
.workout-reel { min-height:100%; scroll-snap-align:start; scroll-snap-stop:always; display:flex; flex-direction:column; gap:14px; margin-bottom:16px; padding:14px; border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line)); border-radius:24px; background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,var(--accent) 4%),var(--surface)); box-shadow:0 18px 42px rgba(0,0,0,.22); }
.workout-reel .workout-video-shell { flex:0 0 auto; width:100%; min-height:0; aspect-ratio:16/9; border-radius:18px; }
.workout-reel .workout-video-shell img { object-position:center; }
.workout-reel-copy { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:start; }
.workout-reel-copy span { color:var(--accent); font-size:9px; font-weight:850; text-transform:uppercase; }
.workout-reel-copy h3 { margin:4px 0 0; font-size:22px; }
.workout-reel-copy p { margin:4px 0 0; color:var(--muted); font-size:11px; }
.workout-reel-meta { display:flex; gap:8px; }
.workout-reel-meta span { padding:7px 10px; border-radius:10px; background:var(--surface-2); color:var(--muted); font-size:10px; }
.workout-empty-favorites { padding:38px 18px; border:1px dashed var(--line); border-radius:22px; text-align:center; background:var(--surface); }
.workout-empty-favorites span { display:block; color:var(--accent); font-size:44px; }
.workout-empty-favorites h3 { margin:8px 0 5px; }
.workout-empty-favorites p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }
.workout-video-disclaimer { margin:18px 4px 0; color:var(--muted); font-size:9px; line-height:1.5; text-align:center; }
.workout-week details > div button { width:100%; display:grid; grid-template-columns:1fr auto auto; gap:8px; align-items:center; padding:8px 0; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--text); text-align:left; }
.workout-week details > div button:last-child { border-bottom:0; }
.workout-week details > div button span { color:var(--text); font-size:10px; }
.workout-week details > div button small { color:var(--muted); font-size:8px; }
.workout-week details > div button i { color:var(--accent); font-style:normal; }
:root[data-theme="light"] .workout-video-shell { background:#e8ece9; }
:root[data-theme="light"] .workout-hub-tabs { background:rgba(248,250,248,.9); }

@media (max-width:520px) {
  .workout-hub-tabs button { padding:9px 3px; font-size:9px; }
  .workout-video-shell { min-height:0; }
  .workout-reel { min-height:100%; }
  .workout-reel .workout-video-shell { min-height:0; aspect-ratio:16/9; }
}

@media (max-width:370px) {
  .workout-hub-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .workout-video-actions,.workout-variants { grid-template-columns:1fr; }
  .workout-reel .workout-video-shell { min-height:0; aspect-ratio:16/9; }
}


/* V11.6 workout feed layout fix */
.video-workout-dialog .modal-card { overflow:hidden; }
.video-workout-dialog #modalBody { padding-top:4px; }
.workout-tab-panel[hidden] { display:none !important; }
.workout-video-filters { display:flex; gap:8px; overflow-x:auto; padding:0 0 12px; margin-bottom:4px; scroll-snap-type:x proximity; scrollbar-width:none; }
.workout-video-filters::-webkit-scrollbar { display:none; }
.workout-video-filters .chip { flex:0 0 auto; scroll-snap-align:start; }
.workout-reel .workout-video-shell iframe,
.workout-reel .workout-video-shell img { aspect-ratio:16/9; object-fit:cover; }
.workout-reel .workout-video-copy { padding:0 2px; }
.workout-reel .workout-video-actions { margin-top:auto; }
@media (max-width:420px) {
  .video-workout-dialog .modal-card { padding-left:14px; padding-right:14px; }
  .workout-hub-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:5px; }
  .workout-hub-tabs button { padding:10px 3px; font-size:9px; }
  .workout-video-intro { padding:15px; border-radius:19px; }
  .workout-video-intro h3 { font-size:19px; }
  .workout-reels { height:min(64dvh,620px); }
  .workout-reel { padding:12px; border-radius:21px; }
}


/* Alexander OS V12.2 - Life Map inside Tasks */
.floating-add {
  position: fixed;
  right: max(18px, calc((100vw - 760px) / 2 + 18px));
  bottom: calc(88px + env(safe-area-inset-bottom));
  z-index: 45;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 3px solid rgba(236,255,220,.82);
  border-radius: 50%;
  background: linear-gradient(145deg, #c7ff37, #63e870);
  color: #071008;
  box-shadow: 0 18px 42px rgba(105,255,115,.28), 0 0 0 9px rgba(105,255,115,.045);
  opacity: 0;
  pointer-events: none;
  transform: translateY(22px) scale(.92);
  transition: opacity .2s ease, transform .2s ease;
}
.floating-add.visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.floating-add svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }

.bottom-nav { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.bottom-nav .nav-item { grid-column: auto !important; }

.task-life-map-link {
  width: 100%;
  min-height: 78px;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) 24px;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 14px;
  text-align: left;
  cursor: pointer;
  color: var(--text);
}
.task-life-map-link:active { transform: scale(.992); }
.task-life-map-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(151,255,125,.16);
  border-radius: 16px;
  background: radial-gradient(circle at 30% 20%, rgba(169,255,114,.24), rgba(32,104,55,.20));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  font-size: 25px;
}
.task-life-map-copy { min-width: 0; display: block; }
.task-life-map-copy small { display: block; color: var(--muted); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.task-life-map-copy strong { display: block; margin-top: 4px; font-size: 15px; line-height: 1.2; }
.task-life-map-copy em { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; font-style: normal; }
.task-life-map-arrow { color: var(--accent); font-size: 28px; line-height: 1; text-align: right; }

.life-page-head {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  margin: 2px 0 12px;
}
.life-back,
.life-head-add {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  color: var(--text);
}
.life-back { padding: 0 12px; font-size: 12px; font-weight: 750; }
.life-back span { margin-left: 2px; }
.life-head-add { width: 42px; padding: 0; color: var(--accent); font-size: 25px; }
.life-page-title { min-width: 0; text-align: center; }
.life-page-title .eyebrow { margin: 0 0 2px; font-size: 8px; }
.life-page-title h2 { margin: 0; font-size: 22px; letter-spacing: -.045em; }

.life-summary {
  display: grid;
  gap: 14px;
  padding: 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 6%, rgba(124,255,108,.18), transparent 34%),
    linear-gradient(145deg, rgba(18,72,43,.88), rgba(7,34,22,.92));
}
.life-summary small { color: rgba(230,255,236,.62); font-size: 8px; letter-spacing: .13em; }
.life-summary h3 { margin: 6px 0 7px; font-size: 23px; letter-spacing: -.045em; }
.life-summary p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }

.life-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 10px; }
.life-stat { min-width: 0; min-height: 75px; display: flex; align-items: center; gap: 10px; padding: 12px; }
.life-stat > span { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; background: var(--accent-soft); font-size: 20px; }
.life-stat div { min-width: 0; }
.life-stat small { display: block; color: var(--muted); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.life-stat strong { display: block; margin-top: 3px; font-size: 22px; }

.life-board { display: grid; gap: 12px; margin-top: 14px; }
.life-block { padding: 14px; touch-action: pan-y; }
.life-block-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
.life-block-head > div:first-child { min-width: 0; }
.life-block-head small { color: var(--muted); font-size: 8px; letter-spacing: .12em; }
.life-block-head h3 { margin: 4px 0 0; font-size: 18px; letter-spacing: -.035em; }
.life-block-controls { display: flex; align-items: center; gap: 5px; flex: 0 0 auto; }
.life-list { gap: 8px; }
.life-card { display: grid; gap: 10px; padding: 12px; touch-action: pan-y; }
.life-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.life-card-title { min-width: 0; display: flex; align-items: center; gap: 9px; }
.life-card-icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: var(--surface-2); }
.life-card-title > div { min-width: 0; }
.life-card-actions { flex: 0 0 auto; }
.life-card-badges { margin-top: 0; }
.life-note { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.48; }
.life-note b { color: var(--text); }
.life-next { display: grid; gap: 4px; padding: 10px 11px; border: 1px solid rgba(164,255,124,.12); border-radius: 11px; background: var(--accent-soft); }
.life-next small { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .09em; }
.life-next strong { font-size: 11px; line-height: 1.35; }
.life-empty { min-height: 88px; display: grid; place-items: center; align-content: center; gap: 6px; padding: 14px; border: 1px dashed var(--line); border-radius: 13px; color: var(--muted); text-align: center; }
.life-empty span { font-size: 23px; }
.life-empty p { margin: 0; font-size: 10px; line-height: 1.4; }

.draggable-card,.draggable-block { cursor: grab; }
.draggable-card:active,.draggable-block:active { cursor: grabbing; }
.dragging { opacity: .58; transform: scale(.99); }
.habit-card { touch-action: pan-y; }
.habit-card-head { align-items: flex-start; }
.habit-title-copy { min-width: 0; }
.habit-actions { flex-wrap: wrap; justify-content: flex-end; }
.habit-history { margin-top: 11px; }
.mini-heatmap { display: grid; grid-template-columns: repeat(14,1fr); gap: 4px; }
.mini-heatmap span { aspect-ratio: 1; border-radius: 4px; background: rgba(255,255,255,.055); border: 1px solid rgba(166,187,210,.07); }
.mini-heatmap span.done { background: linear-gradient(145deg,var(--accent),var(--accent-2)); border-color: rgba(184,255,24,.35); }
.pin-habit { color: var(--accent); }

@media (max-width: 420px) {
  .task-life-map-link { grid-template-columns: 44px minmax(0,1fr) 20px; padding: 12px; }
  .task-life-map-icon { width: 44px; height: 44px; }
  .life-page-head { gap: 8px; }
  .life-back { padding: 0 9px; }
  .life-page-title h2 { font-size: 20px; }
  .life-summary { padding: 15px; }
  .life-summary h3 { font-size: 21px; }
  .life-block { padding: 12px; }
  .life-card-actions,.habit-actions { gap: 3px; }
  .life-card-actions .mini-btn,.habit-actions .mini-btn { width: 28px; min-width: 28px; height: 28px; padding: 0; }
  .floating-add { width: 52px; height: 52px; right: 17px; bottom: calc(82px + env(safe-area-inset-bottom)); }
}


/* Weekly habit calendar and history */
.habit-week-grid .day-cell { min-height: 48px; display: grid; place-items: center; align-content: center; gap: 2px; }
.habit-week-grid .day-cell span { font-size: 11px; }
.habit-week-grid .day-cell small { color: var(--muted); font-size: 8px; }
.habit-week-grid .day-cell.not-scheduled { opacity: .38; background: transparent; }
.habit-week-grid .day-cell:disabled { cursor: default; }
.habit-week-grid .day-cell.done small { color: currentColor; }
.habit-history-btn { color: var(--accent); }
.habit-history-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-bottom: 12px; }
.habit-history-summary > div { padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-2); }
.habit-history-summary small { display: block; color: var(--muted); font-size: 9px; }
.habit-history-summary strong { display: block; margin-top: 4px; font-size: 18px; }
.habit-week-history-list { display: grid; gap: 9px; }
.habit-week-row { padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.habit-week-row-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 9px; }
.habit-week-row-head strong { display: block; font-size: 11px; }
.habit-week-row-head small { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
.habit-week-history-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 5px; }
.habit-week-history-days span { min-width: 0; min-height: 40px; display: grid; place-items: center; align-content: center; gap: 2px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: rgba(255,255,255,.025); }
.habit-week-history-days span.off { opacity: .32; }
.habit-week-history-days span.done { border-color: color-mix(in srgb,var(--accent) 38%,var(--line)); background: var(--accent-soft); color: var(--accent); }
.habit-week-history-days b { font-size: 8px; }
.habit-week-history-days small { font-size: 7px; }
@media (max-width:420px) {
  .habit-week-grid .day-cell { min-height: 44px; padding: 5px 2px; }
  .habit-week-history-days { gap: 3px; }
  .habit-week-history-days span { min-height: 36px; border-radius: 8px; }
}


/* =========================================================
   Alexander OS V12.2 - precise iPhone tab bar and smart FAB
   ========================================================= */
.bottom-nav {
  box-sizing: border-box !important;
  left: 50% !important;
  right: auto !important;
  bottom: max(6px, calc(env(safe-area-inset-bottom) - 22px)) !important;
  width: min(calc(100% - 16px), 430px) !important;
  height: 66px !important;
  min-height: 66px !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 4px !important;
  overflow: hidden !important;
  border: 1px solid rgba(209,255,221,.13) !important;
  border-radius: 22px !important;
  background: rgba(4,17,12,.93) !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.055) !important;
  transform: translateX(-50%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(150%) !important;
  backdrop-filter: blur(26px) saturate(150%) !important;
}

.bottom-nav .nav-item,
.nav-item[data-screen="dashboard"],
.nav-item[data-screen="finance"],
.nav-item[data-screen="tasks"],
.nav-item[data-screen="projects"],
.nav-item[data-screen="growth"] {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 58px !important;
  min-height: 58px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 5px 1px 4px !important;
  border: 0 !important;
  border-radius: 17px !important;
  box-sizing: border-box !important;
}

.bottom-nav .nav-item svg {
  width: 21px !important;
  height: 21px !important;
  flex: 0 0 21px !important;
  stroke-width: 1.8 !important;
}

.bottom-nav .nav-item small {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 10px !important;
  margin: 0 !important;
  overflow: hidden !important;
  font-size: 8.5px !important;
  font-weight: 720 !important;
  line-height: 1 !important;
  letter-spacing: -.015em !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.bottom-nav .nav-item.active {
  color: var(--accent) !important;
  background: linear-gradient(180deg, rgba(156,243,41,.12), rgba(156,243,41,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}

:root[data-theme="light"] .bottom-nav {
  background: rgba(250,253,250,.94) !important;
  border-color: rgba(20,52,30,.10) !important;
}

.floating-add {
  display: grid !important;
  right: max(17px, calc((100vw - 430px) / 2 + 17px)) !important;
  bottom: calc(80px + max(6px, calc(env(safe-area-inset-bottom) - 22px))) !important;
  width: 54px !important;
  height: 54px !important;
  border-width: 2px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translate3d(0, 16px, 0) scale(.94) !important;
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s !important;
}

.floating-add.visible {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition-delay: 0s !important;
}

body[data-screen="life"] .floating-add {
  display: none !important;
}

.app-shell {
  padding-bottom: 0 !important;
}

.content {
  padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
}

@media (orientation: landscape) and (max-height: 520px) {
  .bottom-nav {
    width: min(calc(100% - max(28px, env(safe-area-inset-left) + env(safe-area-inset-right))), 430px) !important;
    height: 58px !important;
    min-height: 58px !important;
    bottom: max(5px, calc(env(safe-area-inset-bottom) - 18px)) !important;
    padding: 3px !important;
    border-radius: 19px !important;
  }
  .bottom-nav .nav-item,
  .nav-item[data-screen="dashboard"],
  .nav-item[data-screen="finance"],
  .nav-item[data-screen="tasks"],
  .nav-item[data-screen="projects"],
  .nav-item[data-screen="growth"] {
    height: 52px !important;
    min-height: 52px !important;
    gap: 3px !important;
    padding: 4px 1px 3px !important;
    border-radius: 15px !important;
  }
  .bottom-nav .nav-item svg {
    width: 19px !important;
    height: 19px !important;
    flex-basis: 19px !important;
  }
  .bottom-nav .nav-item small {
    font-size: 7.7px !important;
  }
  .floating-add {
    right: max(calc(env(safe-area-inset-right) + 12px), calc((100vw - 430px) / 2 + 14px)) !important;
    bottom: calc(68px + max(5px, calc(env(safe-area-inset-bottom) - 18px))) !important;
    width: 48px !important;
    height: 48px !important;
  }
}

@media (max-width: 360px) {
  .bottom-nav {
    width: calc(100% - 10px) !important;
    height: 62px !important;
    min-height: 62px !important;
    padding: 3px !important;
  }
  .bottom-nav .nav-item,
  .nav-item[data-screen="dashboard"],
  .nav-item[data-screen="finance"],
  .nav-item[data-screen="tasks"],
  .nav-item[data-screen="projects"],
  .nav-item[data-screen="growth"] {
    height: 56px !important;
    min-height: 56px !important;
  }
  .bottom-nav .nav-item svg {
    width: 19px !important;
    height: 19px !important;
    flex-basis: 19px !important;
  }
  .bottom-nav .nav-item small {
    font-size: 7.5px !important;
  }
  .floating-add {
    right: 14px !important;
    width: 50px !important;
    height: 50px !important;
  }
}


/* =========================================================
   Alexander OS V12.3 - iPhone form focus without auto zoom
   iOS Safari automatically magnifies controls below 16px.
   Keep every editable control at 16px or larger while preserving
   intentionally large amount fields.
   ========================================================= */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@supports (-webkit-touch-callout: none) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="hidden"]),
  select,
  textarea {
    font-size: 16px !important;
  }

  /* Compact selectors still need enough physical width at 16px. */
  .hero-month-picker input,
  .hero-month-picker select {
    width: 136px !important;
    min-height: 38px !important;
    padding: 8px 10px !important;
    font-size: 16px !important;
  }

  .select-row select {
    max-width: 178px;
    min-height: 40px;
  }

  .workout-profile-grid input,
  .workout-profile-grid select {
    min-height: 32px;
  }

  /* Preserve the large quick-expense amount typography. */
  .quick-amount-wrap input,
  .quick-expense-form .quick-amount-wrap input,
  #quickExpenseAmount {
    font-size: 40px !important;
  }
}


/* V12.4 native app lock fixes */

html {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  -webkit-text-size-adjust: 100%;
  touch-action: pan-y;
}
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
  overscroll-behavior-x: none;
  position: relative;
  touch-action: pan-y;
}
.app-shell,
.content,
#app {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
* , *::before, *::after {
  box-sizing: border-box;
}
input, select, textarea {
  touch-action: manipulation;
}
dialog.modal {
  position: fixed;
  inset: auto 0 0 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(100vw, 520px);
  max-width: 100vw;
  margin: 0;
}
.modal-card,
#modalBody,
.quick-expense-form,
.quick-expense-form > *,
.smart-expense-line,
.smart-expense-line > * {
  max-width: 100%;
}
.modal-card {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.quick-expense-form,
.category-more,
.finance-card,
.card,
.hero-card {
  overflow-x: hidden;
}
.smart-expense-line input,
.smart-expense-line button,
.field input,
.field select,
.field textarea,
.search-input,
.btn,
.quick-amount-wrap,
.quick-amounts,
.expense-category-grid,
.expense-category-chip {
  max-width: 100%;
}
@media (max-width: 520px) {
  dialog.modal {
    width: 100vw;
    max-width: 100vw;
    border-radius: 24px 24px 0 0;
  }
}


/* V12.5 smooth modal performance fixes */
body.modal-open {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden !important;
}
dialog.modal {
  overscroll-behavior: contain;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translate3d(-50%, 0, 0);
  will-change: transform;
  contain: layout paint;
}
.modal::backdrop {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(0, 0, 0, .54) !important;
}
.modal-card {
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  contain: layout paint;
}
#modalBody {
  overflow-x: hidden;
}
.modal-head,
.modal-actions {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.quick-expense-form,
.quick-sheet,
.category-more,
.expense-category-grid {
  contain: layout paint;
}
.expense-category-chip,
.quick-amounts button,
.btn,
.smart-expense-line button {
  transform: translateZ(0);
}
@media (max-width: 520px) {
  dialog.modal {
    box-shadow: 0 -12px 34px rgba(0,0,0,.30);
  }
}


/* =========================================================
   Alexander OS V12.6 - iPhone performance and stable sheets
   ========================================================= */

/* Ordinary forms use one dedicated scroll layer. This avoids
   sticky-header repaints and clipped content in iOS WebKit. */
dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) {
  position: fixed !important;
  inset: auto 0 0 0 !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 520px !important;
  height: min(92dvh, 860px) !important;
  max-height: calc(100dvh - env(safe-area-inset-top)) !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  transform: none !important;
  will-change: auto !important;
  contain: none !important;
  border-radius: 24px 24px 0 0 !important;
  background: #0c2117 !important;
  box-shadow: 0 -14px 36px rgba(0,0,0,.34) !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-card {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  contain: none !important;
  background: #0c2117 !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-head {
  position: relative !important;
  top: auto !important;
  z-index: 3 !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 26px 16px 13px !important;
  border-bottom: 1px solid rgba(123,255,155,.08) !important;
  background: #0c2117 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-head::before {
  top: 9px !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) #modalBody {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 14px 16px 24px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  contain: none !important;
  transform: translateZ(0);
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-actions {
  position: relative !important;
  bottom: auto !important;
  z-index: 4 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid rgba(123,255,155,.10) !important;
  background: #0c2117 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-actions[hidden] {
  display: none !important;
}

/* No paint containment on dynamic form blocks - it clipped expanded
   category editors and forced extra raster layers on iPhone. */
.quick-expense-form,
.quick-expense-form > *,
.smart-expense-line,
.category-more,
.expense-category-grid,
.custom-category-editor,
.custom-category-list {
  contain: none !important;
  will-change: auto !important;
}

.quick-expense-form {
  width: 100%;
  min-width: 0;
  overflow: visible !important;
}

.smart-expense-line {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.smart-expense-line input,
.smart-expense-line button,
.quick-amount-wrap,
.quick-amounts,
.expense-category-grid,
.expense-category-chip,
.custom-category-editor,
.custom-category-list,
.form-grid,
.field,
.field input,
.field select,
.field textarea {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* iOS Safari pays a high compositing cost for many simultaneous glass
   layers. Preserve the dark premium look with opaque surfaces instead. */
@supports (-webkit-touch-callout: none) {
  * {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .topbar {
    background: linear-gradient(180deg, rgba(2,18,11,.995) 0%, rgba(2,18,11,.97) 82%, rgba(2,18,11,0) 100%) !important;
  }

  .bottom-nav {
    background: rgba(4,21,13,.985) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.035) !important;
  }

  .hero,
  .card,
  .stat-card,
  .toolbar-card,
  .item,
  .finance-hero,
  .finance-card,
  .home-metric-card,
  .project-card,
  .goal-card,
  .progress-main-card {
    box-shadow: 0 7px 20px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.025) !important;
  }

  dialog.modal::backdrop {
    background: rgba(0,0,0,.52) !important;
  }
}

@media (max-width: 520px) {
  dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) {
    height: min(94dvh, 860px) !important;
  }

  dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) #modalBody {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .expense-category-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .expense-category-chip {
    min-height: 58px !important;
    padding: 8px 5px !important;
    font-size: 11px !important;
  }
}


/* =========================================================
   Alexander OS V12.7 - hidden-state and iOS scroll hotfix
   ========================================================= */

/* Author display rules were overriding the native hidden attribute.
   This made the custom category editor and list render permanently,
   increased the sheet height and caused expensive extra painting. */
[hidden] {
  display: none !important;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) #modalBody {
  touch-action: pan-y !important;
  scroll-behavior: auto !important;
  transform: none !important;
  overflow-anchor: none;
}

.custom-category-editor[hidden],
.custom-category-list[hidden] {
  display: none !important;
}

/* Keep expanded form blocks lightweight and prevent clipped outlines. */
.custom-category-editor,
.custom-category-list,
.category-more {
  content-visibility: visible;
  overflow: visible;
}

/* The quick sheet needs no animation or promoted layers while scrolling. */
.quick-expense-form *,
dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) * {
  will-change: auto !important;
}

@supports (-webkit-touch-callout: none) {
  .expense-category-chip,
  .quick-amounts button,
  .smart-expense-line button,
  .quick-amount-wrap,
  .custom-category-editor,
  .custom-category-list {
    box-shadow: none !important;
  }
}

/* =========================================================
   Alexander OS V12.8 - premium home, progress and theme system
   ========================================================= */
:root,
:root[data-theme="emerald"] {
  --app-bg: #03130b;
  --app-bg-2: #061c11;
  --app-sheet: #0a2418;
  --app-card: #0d281c;
  --app-card-2: #102f21;
  --app-control: #133724;
  --app-text: #f7fff9;
  --app-muted: #9db5a4;
  --app-line: rgba(207,255,221,.12);
  --app-line-strong: rgba(129,255,159,.28);
  --app-accent: #78f78d;
  --app-accent-2: #2ad36a;
  --app-accent-contrast: #07150b;
  --app-track: rgba(255,255,255,.085);
  --app-shadow: 0 12px 30px rgba(0,0,0,.24);
}

:root[data-theme="graphite"] {
  --app-bg: #080c10;
  --app-bg-2: #0d1217;
  --app-sheet: #11171c;
  --app-card: #141b20;
  --app-card-2: #182128;
  --app-control: #1d2830;
  --app-text: #f5f8fa;
  --app-muted: #98a4ad;
  --app-line: rgba(255,255,255,.09);
  --app-line-strong: rgba(139,247,159,.25);
  --app-accent: #8bf79f;
  --app-accent-2: #42d77a;
  --app-accent-contrast: #07120a;
  --app-track: rgba(255,255,255,.08);
  --app-shadow: 0 12px 30px rgba(0,0,0,.29);
}

:root[data-theme="neonlime"] {
  --app-bg: #101214;
  --app-bg-2: #151719;
  --app-sheet: #191c1f;
  --app-card: #1c2023;
  --app-card-2: #22272b;
  --app-control: #282e32;
  --app-text: #f8f9f4;
  --app-muted: #a2a6a7;
  --app-line: rgba(255,255,255,.085);
  --app-line-strong: rgba(216,255,24,.28);
  --app-accent: #d8ff18;
  --app-accent-2: #9fe728;
  --app-accent-contrast: #151900;
  --app-track: rgba(255,255,255,.085);
  --app-shadow: 0 12px 30px rgba(0,0,0,.30);
}

:root[data-theme="light"] {
  --app-bg: #eef3ef;
  --app-bg-2: #e6ece8;
  --app-sheet: #ffffff;
  --app-card: #ffffff;
  --app-card-2: #f7faf8;
  --app-control: #eef4f0;
  --app-text: #112019;
  --app-muted: #66746c;
  --app-line: rgba(17,32,25,.10);
  --app-line-strong: rgba(38,181,83,.24);
  --app-accent: #35c85e;
  --app-accent-2: #19a94a;
  --app-accent-contrast: #ffffff;
  --app-track: rgba(14,44,27,.09);
  --app-shadow: 0 12px 30px rgba(30,62,43,.10);
}

html,
body {
  background: var(--app-bg) !important;
  color: var(--app-text) !important;
}

body {
  background-image:
    radial-gradient(circle at 50% -12%, color-mix(in srgb, var(--app-accent) 8%, transparent), transparent 30%),
    linear-gradient(180deg, var(--app-bg-2), var(--app-bg) 42%, var(--app-bg)) !important;
  background-attachment: scroll !important;
}

.topbar {
  color: var(--app-text) !important;
  border-color: var(--app-line) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--app-bg) 99%, transparent) 0%, color-mix(in srgb, var(--app-bg) 96%, transparent) 78%, transparent 100%) !important;
  box-shadow: none !important;
}

.card,
.stat-card,
.toolbar-card,
.item,
.action-tile,
.home-metric-card,
.goal-card,
.habit-card,
.project-card,
.settings-profile-card,
.settings-list-card,
.settings-form,
.privacy-card,
.empty-state,
.insight {
  color: var(--app-text) !important;
  border-color: var(--app-line) !important;
  background: var(--app-card) !important;
  box-shadow: var(--app-shadow) !important;
}

.card small,
.card p,
.card em,
.item-meta,
.home-goal-card p,
.progress-command-card p,
.habit-widget-title small,
.progress-streak-head small,
.premium-goal-copy small {
  color: var(--app-muted) !important;
}

.tabs,
.filter-row,
.bottom-nav {
  border-color: var(--app-line) !important;
  background: color-mix(in srgb, var(--app-sheet) 96%, transparent) !important;
  color: var(--app-text) !important;
}

.bottom-nav {
  box-shadow: 0 8px 24px rgba(0,0,0,.22), inset 0 1px 0 color-mix(in srgb, var(--app-text) 4%, transparent) !important;
}

.bottom-nav .nav-item {
  color: var(--app-muted) !important;
}

.bottom-nav .nav-item.active {
  color: var(--app-accent) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--app-accent) 12%, transparent), transparent) !important;
}

.tab.active,
.chip.active,
.btn.primary {
  background: linear-gradient(135deg, var(--app-accent), var(--app-accent-2)) !important;
  color: var(--app-accent-contrast) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--app-accent) 20%, transparent) !important;
}

.btn.secondary,
.mini-btn,
.icon-btn,
.search-input,
.field input,
.field select,
.field textarea,
.compare-selects select {
  border-color: var(--app-line) !important;
  background: var(--app-control) !important;
  color: var(--app-text) !important;
}

.link-btn,
.positive,
.compare.good {
  color: var(--app-accent) !important;
}

/* Premium progress component */
.premium-progress {
  position: relative;
  width: 100%;
  height: 12px;
  overflow: visible;
  border-radius: 999px;
  background: var(--app-track);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.24);
}

.premium-progress.compact {
  height: 8px;
}

.premium-progress > i {
  display: block;
  height: 100%;
  min-width: 0;
  max-width: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--app-accent-2), var(--app-accent));
  box-shadow: 0 0 16px color-mix(in srgb, var(--app-accent) 38%, transparent);
}

.premium-progress > b {
  position: absolute;
  top: 50%;
  z-index: 2;
  min-width: 48px;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--app-accent);
  color: var(--app-accent-contrast);
  font-size: 12px;
  line-height: 1;
  text-align: center;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 18px color-mix(in srgb, var(--app-accent) 44%, transparent);
}

/* Home */
.premium-home-welcome {
  margin: 0 0 14px;
}

.premium-home-welcome small {
  color: var(--app-accent) !important;
}

.premium-home-welcome h2 {
  margin: 5px 0 0;
  font-size: clamp(22px, 6vw, 29px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.home-premium-capital {
  padding: 18px !important;
  border-color: var(--app-line-strong) !important;
  background:
    radial-gradient(circle at 92% 0%, color-mix(in srgb, var(--app-accent) 11%, transparent), transparent 36%),
    var(--app-card) !important;
}

.home-capital-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.home-capital-head small,
.home-week-copy small {
  display: block;
  margin-bottom: 6px;
  color: var(--app-muted);
  font-size: 11px;
}

.home-capital-head strong {
  display: block;
  font-size: clamp(32px, 9vw, 46px);
  line-height: 1;
  letter-spacing: -.055em;
}

.home-premium-capital .hero-progress {
  margin-top: 24px;
}

.home-capital-goal {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 15px;
  color: var(--app-muted);
  font-size: 11px;
}

.home-capital-goal em {
  color: var(--app-accent);
  font-style: normal;
  text-align: right;
}

.home-goal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 10px;
}

.home-goal-card {
  min-width: 0;
  padding: 15px !important;
  border: 1px solid var(--app-line) !important;
  text-align: left;
  cursor: pointer;
}

.home-goal-title {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
}

.home-goal-title > span {
  color: var(--app-accent);
  font-size: 18px;
}

.home-goal-title small {
  color: var(--app-muted);
  font-size: 10px;
}

.home-goal-title strong {
  color: var(--app-accent);
  font-size: 14px;
}

.home-goal-card > b {
  display: block;
  margin-top: 16px;
  font-size: clamp(20px, 6vw, 29px);
  letter-spacing: -.04em;
}

.home-goal-card p {
  margin: 4px 0 14px;
  font-size: 10px;
}

.home-week-expense-card {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(150px, 1.2fr);
  gap: 16px;
  align-items: end;
  margin-top: 10px;
  padding: 17px !important;
}

.home-week-copy strong {
  display: block;
  font-size: clamp(27px, 8vw, 38px);
  letter-spacing: -.045em;
}

.home-week-copy span {
  display: block;
  margin-top: 7px;
  color: var(--app-accent);
  font-size: 10px;
}

.home-week-bars {
  height: 92px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  align-items: end;
  gap: 6px;
}

.home-week-bar {
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0,1fr) auto;
  align-items: end;
  gap: 6px;
}

.home-week-bar span {
  width: 100%;
  min-height: 5px;
  align-self: end;
  border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--app-accent) 95%, white 5%), var(--app-accent-2));
  box-shadow: 0 0 10px color-mix(in srgb, var(--app-accent) 22%, transparent);
}

.home-week-bar small {
  color: var(--app-muted);
  font-size: 8px;
  text-align: center;
}

.home-week-bar.today small {
  color: var(--app-accent);
}

.home-habit-preview {
  margin-top: 10px;
  padding: 17px !important;
}

.home-habit-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.home-habit-head h3 {
  margin: 4px 0 4px;
  font-size: 18px;
}

.home-habit-head p {
  margin: 0;
  font-size: 10px;
}

.home-habit-streak {
  display: flex;
  align-items: baseline;
  gap: 4px;
  color: var(--app-text);
}

.home-habit-streak strong {
  font-size: 20px;
}

.home-habit-streak small {
  font-size: 9px;
}

.home-habit-progress,
.habit-widget-footer,
.progress-streak-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 15px 0 8px;
  color: var(--app-muted);
  font-size: 10px;
}

.home-habit-progress strong,
.habit-widget-footer strong,
.progress-streak-footer > b {
  color: var(--app-accent);
  font-size: 14px;
}

/* Progress */
.premium-period-tabs {
  margin: 0 0 11px !important;
}

.progress-command-card {
  padding: 18px !important;
  border-color: var(--app-line-strong) !important;
  background:
    radial-gradient(circle at 92% 0%, color-mix(in srgb, var(--app-accent) 10%, transparent), transparent 38%),
    var(--app-card) !important;
}

.progress-command-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.progress-command-head small {
  color: var(--app-muted);
  font-size: 11px;
}

.progress-command-head h2 {
  margin: 6px 0 0;
  font-size: clamp(32px, 9vw, 46px);
  letter-spacing: -.055em;
}

.progress-command-head h2 span {
  color: var(--app-muted);
  font-size: .46em;
  font-weight: 650;
  letter-spacing: -.02em;
}

.progress-command-head > strong {
  color: var(--app-accent);
  font-size: clamp(26px, 7vw, 36px);
}

.progress-command-card .hero-progress {
  margin-top: 24px;
}

.progress-command-card p {
  margin: 17px 0 0;
  font-size: 11px;
}

.progress-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 10px;
}

.progress-kpi-card {
  min-height: 112px;
  padding: 14px !important;
  text-align: left;
  cursor: pointer;
}

.progress-kpi-card > span {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--app-accent) 10%, var(--app-control));
  color: var(--app-accent);
  font-size: 17px;
  font-weight: 800;
}

.progress-kpi-card small,
.progress-kpi-card em {
  display: block;
  color: var(--app-muted);
  font-style: normal;
  font-size: 9px;
}

.progress-kpi-card strong {
  display: block;
  margin: 5px 0 3px;
  font-size: 23px;
  letter-spacing: -.035em;
}

.progress-streak-card {
  margin-top: 10px;
  padding: 18px !important;
}

.progress-streak-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--app-line);
}

.streak-flame {
  font-size: 34px;
  filter: drop-shadow(0 0 10px rgba(255,92,52,.25));
}

.progress-streak-head h2 {
  margin: 4px 0 0;
  font-size: 27px;
}

.progress-streak-head h2 span {
  color: var(--app-muted);
  font-size: .55em;
}

.streak-footprint {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--app-control);
  color: var(--app-muted);
}

.progress-week-orbs,
.habit-orb-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 7px;
  margin-top: 17px;
}

.progress-day,
.habit-day-orb {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 7px;
  border: 0;
  padding: 0;
  background: transparent !important;
  color: var(--app-muted);
}

.progress-day > span,
.habit-orb {
  width: min(10vw, 40px);
  height: min(10vw, 40px);
  min-width: 31px;
  min-height: 31px;
  display: grid;
  place-items: center;
  border: 1px solid var(--app-line);
  border-radius: 50%;
  background: var(--app-control);
  color: transparent;
  font-size: 17px;
  font-weight: 900;
}

.progress-day small,
.habit-day-orb > small {
  color: var(--app-muted);
  font-size: 8px;
}

.progress-day.done > span,
.habit-day-orb.done .habit-orb {
  border-color: color-mix(in srgb, var(--app-accent) 80%, white 5%);
  background: radial-gradient(circle at 32% 20%, color-mix(in srgb, var(--app-accent) 90%, white 10%), var(--app-accent-2)) !important;
  color: var(--app-accent-contrast);
  box-shadow: 0 0 15px color-mix(in srgb, var(--app-accent) 30%, transparent);
}

.progress-day.partial > span,
.habit-day-orb.today:not(.done) .habit-orb {
  border: 2px solid var(--app-accent);
  color: var(--app-accent);
  background: transparent !important;
}

.progress-day.today small,
.habit-day-orb.today > small {
  color: var(--app-accent);
}

.habit-day-orb.not-scheduled {
  opacity: .42;
}

.habit-day-orb:disabled {
  cursor: default;
}

/* Goal cards */
.premium-goal-card {
  padding: 16px !important;
}

.premium-goal-head {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
}

.premium-goal-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--app-accent) 10%, var(--app-control));
  color: var(--app-accent);
  font-size: 20px;
}

.premium-goal-copy h3 {
  margin: 3px 0 0;
  font-size: 16px;
  line-height: 1.2;
}

.premium-goal-head > strong {
  color: var(--app-accent);
  font-size: 20px;
}

.premium-goal-values {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 16px 0 10px;
}

.premium-goal-values b {
  font-size: 23px;
  letter-spacing: -.035em;
}

.premium-goal-values span,
.premium-goal-meta {
  color: var(--app-muted);
  font-size: 10px;
}

.premium-goal-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 12px;
}

.premium-card-actions {
  margin-top: 10px;
}

/* Habit widgets */
.premium-habit-list {
  gap: 11px !important;
}

.habit-widget {
  padding: 17px !important;
  touch-action: pan-y;
}

.habit-widget-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  align-items: center;
  gap: 10px;
}

.habit-widget-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

.habit-widget-icon {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: color-mix(in srgb, var(--app-accent) 9%, var(--app-control));
  color: var(--app-accent);
  font-size: 20px;
}

.habit-widget-title h3 {
  margin: 3px 0 0;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.habit-widget-streak {
  display: flex;
  align-items: baseline;
  gap: 3px;
}

.habit-widget-streak strong {
  font-size: 20px;
}

.habit-widget-streak small {
  font-size: 8px;
}

.habit-more {
  width: 34px;
  height: 34px;
  border: 1px solid var(--app-line);
  border-radius: 11px;
  background: var(--app-control);
  color: var(--app-muted);
  font-weight: 800;
}

.habit-widget-score {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-top: 17px;
}

.habit-widget-score > div {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px;
}

.habit-widget-score strong {
  font-size: 25px;
}

.habit-widget-score span {
  color: var(--app-muted);
  font-size: 14px;
}

.habit-widget-score small {
  flex-basis: 100%;
  color: var(--app-muted);
  font-size: 8px;
}

.habit-widget-score > b {
  color: var(--app-accent);
  font-size: 16px;
}

.habit-card-actions-panel {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 6px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid var(--app-line);
}

.habit-card-actions-panel .mini-btn {
  width: 100%;
  min-width: 0;
  height: 34px;
  border-radius: 10px;
}

.premium-workout-card,
.premium-chart-card {
  margin-top: 16px !important;
}

/* Compact premium Quick Add */
dialog.modal.quick-add-dialog:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) {
  inset: auto auto max(10px, env(safe-area-inset-bottom)) 50% !important;
  left: 50% !important;
  width: min(calc(100% - 22px), 460px) !important;
  max-width: 460px !important;
  height: auto !important;
  max-height: calc(100dvh - max(24px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))) !important;
  margin: 0 !important;
  border: 1px solid var(--app-line-strong) !important;
  border-radius: 28px !important;
  background: var(--app-sheet) !important;
  transform: translateX(-50%) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.42) !important;
}

dialog.modal.quick-add-dialog .modal-card {
  display: block !important;
  height: auto !important;
  max-height: inherit !important;
  overflow: hidden !important;
  background: var(--app-sheet) !important;
}

dialog.modal.quick-add-dialog .modal-head {
  min-height: 72px !important;
  padding: 24px 17px 12px !important;
  border-bottom: 0 !important;
  background: var(--app-sheet) !important;
}

dialog.modal.quick-add-dialog .modal-head h2 {
  font-size: 22px !important;
}

dialog.modal.quick-add-dialog #modalBody {
  max-height: calc(100dvh - 118px - env(safe-area-inset-bottom)) !important;
  padding: 4px 13px 14px !important;
  overflow-y: auto !important;
  background: var(--app-sheet) !important;
}

.premium-quick-sheet {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
}

.premium-quick-sheet button,
.premium-quick-sheet button.primary-action {
  position: relative;
  min-height: 66px !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  gap: 1px 11px !important;
  padding: 10px 13px !important;
  border: 1px solid var(--app-line) !important;
  border-radius: 17px !important;
  background: var(--app-card) !important;
  color: var(--app-text) !important;
  box-shadow: none !important;
}

.premium-quick-sheet button.primary-action {
  border-color: var(--app-line-strong) !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--app-accent) 8%, transparent), transparent 70%),
    var(--app-card) !important;
}

.premium-quick-sheet button > span {
  grid-row: 1 / 3 !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 13px !important;
  background: color-mix(in srgb, var(--app-accent) 9%, var(--app-control)) !important;
  color: var(--app-accent) !important;
  box-shadow: none !important;
}

.premium-quick-sheet button.primary-action > span {
  background: linear-gradient(135deg, var(--app-accent), var(--app-accent-2)) !important;
  color: var(--app-accent-contrast) !important;
}

.premium-quick-sheet button b {
  font-size: 14px !important;
}

.premium-quick-sheet button small {
  overflow: hidden;
  color: var(--app-muted) !important;
  font-size: 9px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.premium-quick-sheet button i {
  grid-column: 3;
  grid-row: 1 / 3;
  color: var(--app-accent);
  font-size: 27px;
  font-style: normal;
  line-height: 1;
}

dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog),
dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-card,
dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-head,
dialog.modal:not(.workout-dialog):not(.video-workout-dialog):not(.settings-dialog) .modal-actions {
  background-color: var(--app-sheet) !important;
  color: var(--app-text) !important;
  border-color: var(--app-line) !important;
}

@media (max-width: 420px) {
  .home-goal-grid,
  .progress-kpi-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .home-week-expense-card {
    grid-template-columns: 1fr;
  }

  .home-week-bars {
    height: 78px;
  }

  .progress-week-orbs,
  .habit-orb-grid {
    gap: 4px;
  }

  .progress-day > span,
  .habit-orb {
    width: 35px;
    height: 35px;
    min-width: 35px;
    min-height: 35px;
  }

  .habit-widget {
    padding: 15px !important;
  }

  .premium-quick-sheet button,
  .premium-quick-sheet button.primary-action {
    min-height: 62px !important;
  }
}

@media (max-width: 350px) {
  .home-goal-grid,
  .progress-kpi-grid {
    grid-template-columns: 1fr;
  }

  .progress-day > span,
  .habit-orb {
    width: 31px;
    height: 31px;
    min-width: 31px;
    min-height: 31px;
  }
}

@supports (-webkit-touch-callout: none) {
  .card,
  .stat-card,
  .toolbar-card,
  .item,
  .home-metric-card,
  .goal-card,
  .habit-card,
  .project-card,
  .progress-command-card,
  .progress-streak-card,
  .home-premium-capital {
    box-shadow: 0 7px 18px rgba(0,0,0,.16) !important;
  }

  .premium-progress > i,
  .progress-day.done > span,
  .habit-day-orb.done .habit-orb {
    box-shadow: 0 0 10px color-mix(in srgb, var(--app-accent) 24%, transparent) !important;
  }
}

/* V12.8.1 title safety for long habit names */
.habit-widget-title > div {
  min-width: 0;
}

.habit-widget-streak {
  min-width: 44px;
  justify-content: flex-end;
  white-space: nowrap;
}

.habit-widget-streak small {
  white-space: nowrap;
}

.habit-widget-title h3 {
  display: -webkit-box;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/* =========================================================
   Alexander OS V12.9 - cushion source and unified themes
   ========================================================= */

/* Premium black theme inspired by native iOS widgets. */
:root[data-theme="black"] {
  --app-bg: #000000;
  --app-bg-2: #000000;
  --app-sheet: #070907;
  --app-card: #0b0d0b;
  --app-card-2: #0f120f;
  --app-control: #141814;
  --app-text: #f7faf7;
  --app-muted: #8f9690;
  --app-line: rgba(255,255,255,.10);
  --app-line-strong: rgba(92,235,111,.30);
  --app-accent: #58e76d;
  --app-accent-2: #25c953;
  --app-accent-contrast: #031006;
  --app-track: rgba(255,255,255,.10);
  --app-shadow: 0 10px 24px rgba(0,0,0,.34);
  color-scheme: dark;
}

/* Bridge legacy components to the V12.8+ theme tokens.
   This keeps every old screen readable in every selectable theme. */
:root {
  --bg: var(--app-bg);
  --bg-soft: var(--app-bg-2);
  --surface: var(--app-card);
  --surface-2: var(--app-sheet);
  --surface-3: var(--app-control);
  --surface-soft: color-mix(in srgb, var(--app-sheet) 96%, transparent);
  --text: var(--app-text);
  --muted: var(--app-muted);
  --line: var(--app-line);
  --line-strong: var(--app-line-strong);
  --accent: var(--app-accent);
  --accent-soft: color-mix(in srgb, var(--app-accent) 13%, transparent);
  --accent-2: var(--app-accent-2);
  --success: var(--app-accent);
  --shadow: var(--app-shadow);
}

html,
body,
.app-shell,
.content {
  background-color: var(--app-bg) !important;
  color: var(--app-text) !important;
}

input,
select,
textarea,
button {
  color: var(--app-text);
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--app-muted) 82%, transparent) !important;
  opacity: 1;
}

select option {
  background: var(--app-sheet);
  color: var(--app-text);
}

.modal,
.modal-card,
.modal-head,
.modal-actions,
.settings-dialog,
.workout-dialog {
  color: var(--app-text) !important;
  border-color: var(--app-line) !important;
  background-color: var(--app-sheet) !important;
}

.modal-head,
.modal-actions {
  background: var(--app-sheet) !important;
}

.badge.cushion-badge {
  border-color: color-mix(in srgb, var(--app-accent) 30%, transparent) !important;
  background: color-mix(in srgb, var(--app-accent) 12%, transparent) !important;
  color: var(--app-accent) !important;
}

.cushion-account {
  border-color: color-mix(in srgb, var(--app-accent) 20%, var(--app-line)) !important;
}

.cushion-account .account-icon {
  color: var(--app-accent) !important;
  background: color-mix(in srgb, var(--app-accent) 10%, var(--app-control)) !important;
}

/* Black theme: true black canvas, restrained cards and green system accents. */
:root[data-theme="black"] body {
  background: #000 !important;
  background-image: none !important;
}

:root[data-theme="black"] .topbar {
  background: linear-gradient(180deg, #000 0%, rgba(0,0,0,.97) 82%, transparent 100%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

:root[data-theme="black"] .bottom-nav {
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(7,9,7,.98) !important;
  box-shadow: 0 -8px 28px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

:root[data-theme="black"] .card,
:root[data-theme="black"] .stat-card,
:root[data-theme="black"] .toolbar-card,
:root[data-theme="black"] .item,
:root[data-theme="black"] .action-tile,
:root[data-theme="black"] .goal-card,
:root[data-theme="black"] .habit-card,
:root[data-theme="black"] .project-card,
:root[data-theme="black"] .home-metric-card,
:root[data-theme="black"] .settings-profile-card,
:root[data-theme="black"] .settings-list-card,
:root[data-theme="black"] .settings-form,
:root[data-theme="black"] .privacy-card,
:root[data-theme="black"] .empty-state,
:root[data-theme="black"] .insight {
  border-color: rgba(255,255,255,.10) !important;
  background: #0b0d0b !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.025) !important;
}

:root[data-theme="black"] .home-premium-capital,
:root[data-theme="black"] .progress-command-card,
:root[data-theme="black"] .progress-streak-card,
:root[data-theme="black"] .premium-goal-card,
:root[data-theme="black"] .habit-widget,
:root[data-theme="black"] .finance-master-card {
  border-color: rgba(255,255,255,.11) !important;
  background:
    radial-gradient(circle at 90% 0%, rgba(88,231,109,.07), transparent 35%),
    #0b0d0b !important;
  color: var(--app-text) !important;
}

:root[data-theme="black"] .premium-progress {
  background: #252825 !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.55) !important;
}

:root[data-theme="black"] .premium-progress > i,
:root[data-theme="black"] .progress > span,
:root[data-theme="black"] .bar-fill {
  background: linear-gradient(90deg, #28c954, #61ed75) !important;
  box-shadow: 0 0 12px rgba(79,228,101,.28) !important;
}

:root[data-theme="black"] .premium-progress > b {
  background: #58e76d !important;
  color: #041006 !important;
  box-shadow: 0 0 14px rgba(88,231,109,.30) !important;
}

:root[data-theme="black"] .home-week-bar span,
:root[data-theme="black"] .mini-bar,
:root[data-theme="black"] .chart-bar,
:root[data-theme="black"] .income-bar {
  background: linear-gradient(180deg, #63ef77, #22bd4c) !important;
  box-shadow: 0 0 9px rgba(72,222,94,.22) !important;
}

:root[data-theme="black"] .progress-day.done > span,
:root[data-theme="black"] .habit-day-orb.done .habit-orb {
  border-color: #68ee79 !important;
  background: linear-gradient(145deg, #72f383, #31c95a) !important;
  color: #041006 !important;
  box-shadow: 0 0 12px rgba(87,228,106,.28) !important;
}

:root[data-theme="black"] .progress-day.partial > span,
:root[data-theme="black"] .habit-day-orb.today:not(.done) .habit-orb {
  border-color: #50df67 !important;
  background: #0b0d0b !important;
  color: #50df67 !important;
}

:root[data-theme="black"] .account-icon,
:root[data-theme="black"] .progress-kpi-card > span,
:root[data-theme="black"] .premium-goal-icon,
:root[data-theme="black"] .habit-widget-icon,
:root[data-theme="black"] .settings-icon,
:root[data-theme="black"] .home-goal-title > span {
  color: #58e76d !important;
  background: rgba(88,231,109,.08) !important;
}

:root[data-theme="black"] .btn.secondary,
:root[data-theme="black"] .mini-btn,
:root[data-theme="black"] .icon-btn,
:root[data-theme="black"] .field input,
:root[data-theme="black"] .field select,
:root[data-theme="black"] .field textarea,
:root[data-theme="black"] .search-input,
:root[data-theme="black"] .compare-selects select {
  border-color: rgba(255,255,255,.11) !important;
  background: #111511 !important;
  color: #f7faf7 !important;
}

:root[data-theme="black"] dialog.modal,
:root[data-theme="black"] .modal-card,
:root[data-theme="black"] .modal-head,
:root[data-theme="black"] .modal-actions {
  background: #080a08 !important;
  color: #f7faf7 !important;
}

:root[data-theme="black"] dialog.modal::backdrop {
  background: rgba(0,0,0,.72) !important;
}

:root[data-theme="black"] .tabs,
:root[data-theme="black"] .filter-row {
  background: #0a0d0a !important;
  border-color: rgba(255,255,255,.09) !important;
}

:root[data-theme="black"] .tab:not(.active),
:root[data-theme="black"] .chip:not(.active),
:root[data-theme="black"] .nav-item:not(.active) {
  color: #8f9690 !important;
}

/* Keep five theme choices compact and even. */
.v11-theme-picker,
.exact-theme-picker {
  grid-template-columns: repeat(2, minmax(0,1fr));
}

.v11-theme-choice[data-theme-inline="black"] > span,
.theme-choice[data-theme-modal="black"] > span {
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.65);
}

@media (max-width: 390px) {
  .home-goal-grid {
    gap: 8px;
  }

  .home-goal-card {
    padding: 13px !important;
  }

  .home-capital-goal {
    align-items: flex-start;
  }
}


/* =========================================================
   Alexander OS V13.0 - final theme contract
   One semantic palette for every component. Last rules win.
   ========================================================= */
:root,
:root[data-theme="black"] {
  --v13-bg:#000000;
  --v13-bg-elevated:#050705;
  --v13-sheet:#080a08;
  --v13-card:#0c0f0c;
  --v13-card-2:#111511;
  --v13-control:#151a15;
  --v13-text:#f7faf7;
  --v13-muted:#929a93;
  --v13-faint:#626962;
  --v13-line:rgba(255,255,255,.10);
  --v13-line-strong:rgba(94,235,113,.30);
  --v13-accent:#62ea75;
  --v13-accent-2:#27ca52;
  --v13-accent-text:#031006;
  --v13-track:#242824;
  --v13-danger:#ff7f8d;
  --v13-danger-bg:rgba(181,48,64,.15);
  --v13-warning:#ffd37a;
  --v13-shadow:0 12px 28px rgba(0,0,0,.36);
  color-scheme:dark;
}
:root[data-theme="emerald"] {
  --v13-bg:#03130b;
  --v13-bg-elevated:#061a10;
  --v13-sheet:#092117;
  --v13-card:#0d291c;
  --v13-card-2:#103322;
  --v13-control:#153b28;
  --v13-text:#f7fff9;
  --v13-muted:#a0b6a6;
  --v13-faint:#6f8977;
  --v13-line:rgba(210,255,222,.13);
  --v13-line-strong:rgba(125,255,155,.30);
  --v13-accent:#78f78d;
  --v13-accent-2:#2bd36a;
  --v13-accent-text:#06150a;
  --v13-track:rgba(255,255,255,.09);
  --v13-danger:#ff929c;
  --v13-danger-bg:rgba(172,56,69,.17);
  --v13-warning:#ffd37a;
  --v13-shadow:0 12px 28px rgba(0,0,0,.25);
  color-scheme:dark;
}
:root[data-theme="neonlime"] {
  --v13-bg:#101214;
  --v13-bg-elevated:#141719;
  --v13-sheet:#181c1e;
  --v13-card:#1c2023;
  --v13-card-2:#22272b;
  --v13-control:#282e32;
  --v13-text:#fafbf7;
  --v13-muted:#a6aaab;
  --v13-faint:#767c7e;
  --v13-line:rgba(255,255,255,.10);
  --v13-line-strong:rgba(216,255,24,.32);
  --v13-accent:#d8ff18;
  --v13-accent-2:#9fe729;
  --v13-accent-text:#111500;
  --v13-track:rgba(255,255,255,.10);
  --v13-danger:#ff8e9a;
  --v13-danger-bg:rgba(178,56,70,.16);
  --v13-warning:#ffd85e;
  --v13-shadow:0 12px 28px rgba(0,0,0,.30);
  color-scheme:dark;
}
:root[data-theme="graphite"] {
  --v13-bg:#090d11;
  --v13-bg-elevated:#0d1217;
  --v13-sheet:#11171c;
  --v13-card:#151c21;
  --v13-card-2:#192228;
  --v13-control:#202a31;
  --v13-text:#f5f8fa;
  --v13-muted:#9ca7ae;
  --v13-faint:#6e7980;
  --v13-line:rgba(255,255,255,.10);
  --v13-line-strong:rgba(139,247,159,.27);
  --v13-accent:#8bf79f;
  --v13-accent-2:#42d77a;
  --v13-accent-text:#07120a;
  --v13-track:rgba(255,255,255,.09);
  --v13-danger:#ff8f9a;
  --v13-danger-bg:rgba(177,54,67,.16);
  --v13-warning:#ffd37a;
  --v13-shadow:0 12px 28px rgba(0,0,0,.31);
  color-scheme:dark;
}
:root[data-theme="light"] {
  --v13-bg:#eef3ef;
  --v13-bg-elevated:#e7ede9;
  --v13-sheet:#ffffff;
  --v13-card:#ffffff;
  --v13-card-2:#f7faf8;
  --v13-control:#edf3ef;
  --v13-text:#102018;
  --v13-muted:#65736b;
  --v13-faint:#87938c;
  --v13-line:rgba(16,32,24,.11);
  --v13-line-strong:rgba(45,187,84,.28);
  --v13-accent:#35c85e;
  --v13-accent-2:#18aa49;
  --v13-accent-text:#ffffff;
  --v13-track:rgba(14,44,27,.10);
  --v13-danger:#c94455;
  --v13-danger-bg:#fff0f2;
  --v13-warning:#9b6810;
  --v13-shadow:0 12px 28px rgba(30,62,43,.10);
  color-scheme:light;
}

:root[data-theme] {
  --app-bg:var(--v13-bg)!important;
  --app-bg-2:var(--v13-bg-elevated)!important;
  --app-sheet:var(--v13-sheet)!important;
  --app-card:var(--v13-card)!important;
  --app-card-2:var(--v13-card-2)!important;
  --app-control:var(--v13-control)!important;
  --app-text:var(--v13-text)!important;
  --app-muted:var(--v13-muted)!important;
  --app-line:var(--v13-line)!important;
  --app-line-strong:var(--v13-line-strong)!important;
  --app-accent:var(--v13-accent)!important;
  --app-accent-2:var(--v13-accent-2)!important;
  --app-accent-contrast:var(--v13-accent-text)!important;
  --app-track:var(--v13-track)!important;
  --app-shadow:var(--v13-shadow)!important;
  --bg:var(--v13-bg)!important;
  --bg-soft:var(--v13-bg-elevated)!important;
  --surface:var(--v13-card)!important;
  --surface-2:var(--v13-sheet)!important;
  --surface-3:var(--v13-control)!important;
  --text:var(--v13-text)!important;
  --muted:var(--v13-muted)!important;
  --line:var(--v13-line)!important;
  --line-strong:var(--v13-line-strong)!important;
  --accent:var(--v13-accent)!important;
  --accent-2:var(--v13-accent-2)!important;
  --accent-soft:color-mix(in srgb,var(--v13-accent) 14%,transparent)!important;
  --danger:var(--v13-danger)!important;
  --shadow:var(--v13-shadow)!important;
}

html,body,.app-shell,.content { background-color:var(--v13-bg)!important; color:var(--v13-text)!important; }
body { background-image:linear-gradient(180deg,var(--v13-bg-elevated),var(--v13-bg) 38%,var(--v13-bg))!important; }
:root[data-theme="black"] body { background:#000!important; background-image:none!important; }

.topbar { color:var(--v13-text)!important; border-color:var(--v13-line)!important; background:linear-gradient(180deg,color-mix(in srgb,var(--v13-bg) 100%,transparent) 0%,color-mix(in srgb,var(--v13-bg) 96%,transparent) 82%,transparent)!important; }
:root[data-theme="black"] .topbar { background:linear-gradient(180deg,#000 0%,rgba(0,0,0,.98) 84%,transparent)!important; }
.brand-line,.topbar h1,.section-head h2,h1,h2,h3,h4,strong,b,.item-title,.kpi { color:var(--v13-text)!important; }
.eyebrow,small,p,em,label,.muted,.item-meta,.modal-description,.field label,.settings-row small,.home-capital-goal,.premium-goal-meta { color:var(--v13-muted)!important; }

.card,.stat-card,.toolbar-card,.item,.action-tile,.goal-card,.habit-card,.project-card,.home-metric-card,.settings-profile-card,.settings-list-card,.settings-form,.privacy-card,.empty-state,.insight,.calendar-cell,.calendar-day-details,.utility-row,.diagnostic-row,.details-card,.life-map-card,.knowledge-card {
  color:var(--v13-text)!important;
  border-color:var(--v13-line)!important;
  background:var(--v13-card)!important;
  box-shadow:var(--v13-shadow)!important;
}

.home-premium-capital,.progress-command-card,.progress-streak-card,.premium-goal-card,.habit-widget,.finance-master-card,.home-week-expense-card {
  color:var(--v13-text)!important;
  border-color:var(--v13-line)!important;
  background:radial-gradient(circle at 92% 0%,color-mix(in srgb,var(--v13-accent) 7%,transparent),transparent 36%),var(--v13-card)!important;
  box-shadow:var(--v13-shadow)!important;
}
.finance-master-card .kpi,.finance-master-grid strong,.finance-master-card .goal-row,.finance-master-card .goal-row span,.finance-master-card .goal-row strong,.finance-master-card .capital-breakdown span { color:var(--v13-text)!important; }
.finance-master-card .eyebrow,.finance-master-grid small,.finance-master-grid em,.finance-master-card .capital-breakdown small { color:var(--v13-muted)!important; }
.finance-master-card .capital-breakdown span,.finance-master-grid>div,.finance-source-details { border-color:var(--v13-line)!important; background:var(--v13-card-2)!important; }
.finance-master-grid>div:nth-child(4),.finance-master-grid>div:nth-child(5) { background:var(--v13-danger-bg)!important; }
.finance-master-grid>div:nth-child(4) strong,.finance-master-grid>div:nth-child(5) strong,.negative,.compare.bad { color:var(--v13-danger)!important; }

.tabs,.filter-row,.bottom-nav,.progress-tabs,.finance-tabs { color:var(--v13-text)!important; border-color:var(--v13-line)!important; background:color-mix(in srgb,var(--v13-sheet) 97%,transparent)!important; }
.bottom-nav { box-shadow:0 8px 24px rgba(0,0,0,.22),inset 0 1px 0 color-mix(in srgb,var(--v13-text) 5%,transparent)!important; }
.bottom-nav .nav-item,.tab,.chip { color:var(--v13-muted)!important; }
.bottom-nav .nav-item.active { color:var(--v13-accent)!important; background:linear-gradient(180deg,color-mix(in srgb,var(--v13-accent) 13%,transparent),transparent)!important; }
.tab.active,.chip.active,.btn.primary { color:var(--v13-accent-text)!important; background:linear-gradient(135deg,var(--v13-accent),var(--v13-accent-2))!important; border-color:transparent!important; box-shadow:0 7px 18px color-mix(in srgb,var(--v13-accent) 18%,transparent)!important; }

.btn.secondary,.mini-btn,.icon-btn,.search-input,.field input,.field select,.field textarea,.compare-selects select,.smart-expense-line input,.quick-amount-wrap,.select-row select {
  color:var(--v13-text)!important;
  border-color:var(--v13-line)!important;
  background:var(--v13-control)!important;
}
input::placeholder,textarea::placeholder { color:var(--v13-faint)!important; opacity:1!important; }
select option { color:var(--v13-text)!important; background:var(--v13-sheet)!important; }

.modal,.modal-card,.modal-head,.modal-actions,.settings-dialog,.workout-dialog { color:var(--v13-text)!important; border-color:var(--v13-line)!important; background:var(--v13-sheet)!important; }
.modal-head,.modal-actions { background:var(--v13-sheet)!important; }
.modal::backdrop { background:rgba(0,0,0,.68)!important; }

.premium-progress,.progress,.money-bar-track,.dual-bars,.bar-track { background:var(--v13-track)!important; }
.premium-progress>i,.progress>span,.bar-fill,.money-bar-track>span,.mini-bar,.home-week-bar span,.expense-bar:not(.danger) { background:linear-gradient(90deg,var(--v13-accent-2),var(--v13-accent))!important; box-shadow:0 0 12px color-mix(in srgb,var(--v13-accent) 25%,transparent)!important; }
.premium-progress>b { color:var(--v13-accent-text)!important; background:var(--v13-accent)!important; box-shadow:0 0 14px color-mix(in srgb,var(--v13-accent) 28%,transparent)!important; }
.link-btn,.positive,.compare.good,.home-goal-title>span,.premium-goal-icon,.habit-widget-icon,.account-icon,.settings-icon,.section-icon { color:var(--v13-accent)!important; }

.badge,.compare,.pill,.status-pill { color:var(--v13-muted)!important; border-color:var(--v13-line)!important; background:var(--v13-control)!important; }
.badge.cushion-badge { color:var(--v13-accent)!important; border-color:var(--v13-line-strong)!important; background:color-mix(in srgb,var(--v13-accent) 12%,transparent)!important; }
.cushion-account { border-color:var(--v13-line-strong)!important; }
.cushion-account .account-icon { color:var(--v13-accent)!important; background:color-mix(in srgb,var(--v13-accent) 10%,var(--v13-control))!important; }

.day-checkbox span,.habit-day,.habit-dot,.streak-day { color:var(--v13-muted)!important; border-color:var(--v13-line)!important; background:var(--v13-control)!important; }
.day-checkbox input:checked+span,.habit-day.done,.habit-dot.done,.streak-day.done { color:var(--v13-accent-text)!important; border-color:var(--v13-accent)!important; background:linear-gradient(135deg,var(--v13-accent),var(--v13-accent-2))!important; box-shadow:0 0 13px color-mix(in srgb,var(--v13-accent) 22%,transparent)!important; }

.global-add,.floating-add,.top-add,.brand-mark { color:var(--v13-accent-text)!important; border-color:color-mix(in srgb,var(--v13-accent) 52%,white 20%)!important; background:linear-gradient(135deg,var(--v13-accent),var(--v13-accent-2))!important; box-shadow:0 8px 22px color-mix(in srgb,var(--v13-accent) 22%,transparent)!important; }

.theme-picker,.v11-theme-picker,.exact-theme-picker { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; }
.theme-choice,.v11-theme-choice { color:var(--v13-text)!important; border-color:var(--v13-line)!important; background:var(--v13-card-2)!important; }
.theme-choice.active,.v11-theme-choice.active { border-color:var(--v13-accent)!important; box-shadow:0 0 0 2px color-mix(in srgb,var(--v13-accent) 20%,transparent)!important; }
.theme-choice:last-child:nth-child(odd),.v11-theme-choice:last-child:nth-child(odd) { grid-column:1/-1; }
.theme-choice small { color:var(--v13-muted)!important; }

:root[data-theme="black"] .home-premium-capital,
:root[data-theme="black"] .progress-command-card,
:root[data-theme="black"] .progress-streak-card,
:root[data-theme="black"] .premium-goal-card,
:root[data-theme="black"] .habit-widget,
:root[data-theme="black"] .finance-master-card,
:root[data-theme="black"] .home-week-expense-card { background:radial-gradient(circle at 92% 0%,rgba(98,234,117,.055),transparent 36%),#0c0f0c!important; }
:root[data-theme="black"] .card,
:root[data-theme="black"] .item,
:root[data-theme="black"] .stat-card,
:root[data-theme="black"] .toolbar-card,
:root[data-theme="black"] .goal-card,
:root[data-theme="black"] .habit-card,
:root[data-theme="black"] .project-card,
:root[data-theme="black"] .settings-profile-card,
:root[data-theme="black"] .settings-list-card,
:root[data-theme="black"] .settings-form,
:root[data-theme="black"] .empty-state { background:#0c0f0c!important; }
:root[data-theme="black"] .bottom-nav { background:rgba(8,10,8,.98)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }

@media (max-width:520px) {
  .theme-picker,.v11-theme-picker,.exact-theme-picker { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
}


/* Alexander OS V13.1 - configurable home and clearer finance settings */
.settings-help-card {
  display: grid;
  gap: 7px;
  margin-bottom: 16px;
  padding: 14px 15px;
  border: 1px solid var(--v13-line, var(--line));
  border-radius: 17px;
  background: var(--v13-card-2, var(--surface-2));
}
.settings-help-card b { color: var(--v13-text, var(--text)); font-size: 14px; }
.settings-help-card p { margin: 0; color: var(--v13-muted, var(--muted)); font-size: 11px; line-height: 1.45; }
.dashboard-slot-preview {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin: 0 0 16px;
}
.dashboard-slot-preview > div {
  min-height: 58px;
  display: grid;
  place-items: center;
  padding: 10px;
  border: 1px solid var(--v13-line, var(--line));
  border-radius: 15px;
  background: var(--v13-card, var(--surface));
  color: var(--v13-muted, var(--muted));
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}
.dashboard-slot-preview .dashboard-slot-preview-hero {
  grid-column: 1 / -1;
  min-height: 82px;
  border-color: var(--v13-line-strong, var(--line-strong));
  color: var(--v13-accent, var(--accent));
}
.dashboard-metric-guide {
  display: grid;
  gap: 8px;
  margin-top: 15px;
}
.dashboard-metric-guide p {
  display: grid;
  gap: 3px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid var(--v13-line, var(--line));
  border-radius: 14px;
  background: var(--v13-card-2, var(--surface-2));
}
.dashboard-metric-guide b { color: var(--v13-text, var(--text)); font-size: 11px; }
.dashboard-metric-guide span { color: var(--v13-muted, var(--muted)); font-size: 10px; line-height: 1.35; }
.home-premium-income .home-capital-goal em { color: var(--v13-accent, var(--accent)); }
.quick-expense-form { padding-top: 2px; }


/* =========================================================
   Alexander OS V13.2 - iPhone native bottom tab bar
   Fixed flush to the bottom edge, WhatsApp-style geometry.
   ========================================================= */
.bottom-nav {
  position: fixed !important;
  z-index: 1000 !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  width: min(100vw, 520px) !important;
  max-width: 520px !important;
  height: auto !important;
  min-height: calc(68px + env(safe-area-inset-bottom)) !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 7px 5px max(6px, env(safe-area-inset-bottom)) !important;
  overflow: visible !important;
  border: 0 !important;
  border-top: 1px solid var(--v13-line, var(--line)) !important;
  border-radius: 0 !important;
  background: var(--v13-sheet, var(--surface-2)) !important;
  box-shadow: 0 -8px 26px rgba(0, 0, 0, .16) !important;
  transform: translateX(-50%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  isolation: isolate !important;
}

.bottom-nav .nav-item,
.nav-item[data-screen="dashboard"],
.nav-item[data-screen="finance"],
.nav-item[data-screen="tasks"],
.nav-item[data-screen="projects"],
.nav-item[data-screen="growth"] {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 60px !important;
  min-height: 60px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 5px 1px 3px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--v13-muted, var(--muted)) !important;
  box-shadow: none !important;
  transform: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

.bottom-nav .nav-item::before,
.bottom-nav .nav-item::after {
  display: none !important;
  content: none !important;
}

.bottom-nav .nav-item svg {
  width: 25px !important;
  height: 25px !important;
  flex: 0 0 25px !important;
  margin: 0 !important;
  stroke-width: 1.75 !important;
  filter: none !important;
}

.bottom-nav .nav-item small {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 12px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.bottom-nav .nav-item.active {
  color: var(--v13-accent, var(--accent)) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.bottom-nav .nav-item.active svg {
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--v13-accent, var(--accent)) 24%, transparent)) !important;
}

.bottom-nav .nav-item:active {
  opacity: .72 !important;
  transform: none !important;
}

:root[data-theme="black"] .bottom-nav {
  background: #080a08 !important;
  border-top-color: rgba(255, 255, 255, .10) !important;
}

:root[data-theme="light"] .bottom-nav {
  background: #fbfcfb !important;
  border-top-color: rgba(14, 37, 24, .12) !important;
  box-shadow: 0 -8px 24px rgba(17, 36, 25, .10) !important;
}

.app-shell {
  padding-bottom: 0 !important;
}

.content {
  padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
}

.floating-add {
  bottom: calc(82px + env(safe-area-inset-bottom)) !important;
}

.toast {
  bottom: calc(92px + env(safe-area-inset-bottom)) !important;
}

@media (max-width: 380px) {
  .bottom-nav {
    min-height: calc(65px + env(safe-area-inset-bottom)) !important;
    padding-inline: 2px !important;
  }
  .bottom-nav .nav-item,
  .nav-item[data-screen="dashboard"],
  .nav-item[data-screen="finance"],
  .nav-item[data-screen="tasks"],
  .nav-item[data-screen="projects"],
  .nav-item[data-screen="growth"] {
    height: 57px !important;
    min-height: 57px !important;
    gap: 4px !important;
  }
  .bottom-nav .nav-item svg {
    width: 23px !important;
    height: 23px !important;
    flex-basis: 23px !important;
  }
  .bottom-nav .nav-item small {
    font-size: 9px !important;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  .bottom-nav {
    width: min(100vw, 620px) !important;
    max-width: 620px !important;
    min-height: calc(57px + env(safe-area-inset-bottom)) !important;
    padding: 3px max(5px, env(safe-area-inset-right)) max(3px, env(safe-area-inset-bottom)) max(5px, env(safe-area-inset-left)) !important;
  }
  .bottom-nav .nav-item,
  .nav-item[data-screen="dashboard"],
  .nav-item[data-screen="finance"],
  .nav-item[data-screen="tasks"],
  .nav-item[data-screen="projects"],
  .nav-item[data-screen="growth"] {
    height: 51px !important;
    min-height: 51px !important;
    gap: 2px !important;
  }
  .bottom-nav .nav-item svg {
    width: 21px !important;
    height: 21px !important;
    flex-basis: 21px !important;
  }
  .bottom-nav .nav-item small {
    font-size: 8px !important;
  }
  .content {
    padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
  }
  .floating-add {
    bottom: calc(65px + env(safe-area-inset-bottom)) !important;
  }
}




/* V14.3 Compact Island UI - premium black dynamic widgets */
:root {
  --island-bg: #050706;
  --island-card: rgba(8, 11, 9, .96);
  --island-card-soft: rgba(12, 16, 13, .92);
  --island-border: rgba(255,255,255,.105);
  --island-border-strong: rgba(120,255,140,.34);
  --island-green: #72f783;
  --island-green-2: #22d46b;
  --island-muted: rgba(245,255,248,.58);
  --island-shadow: 0 18px 42px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.045);
  --island-glow: 0 0 26px rgba(82,255,123,.28);
}

:root[data-theme="black"] body,
:root[data-theme="graphite"] body {
  background:
    radial-gradient(circle at 50% -10%, rgba(75,255,118,.08), transparent 26%),
    radial-gradient(circle at 96% 14%, rgba(78,255,137,.06), transparent 25%),
    #000 !important;
}

/* Make all dashboard cards look like Dynamic Island widgets */
body[data-screen="dashboard"] .app-shell {
  padding-inline: clamp(14px, 4vw, 22px);
}

body[data-screen="dashboard"] .premium-home-welcome {
  margin: 4px 0 18px !important;
}

body[data-screen="dashboard"] .premium-home-welcome small {
  color: var(--island-green) !important;
  letter-spacing: .01em;
}

body[data-screen="dashboard"] .premium-home-welcome h2 {
  max-width: 100%;
  font-size: clamp(28px, 8.2vw, 42px) !important;
  line-height: .98 !important;
  letter-spacing: -.07em !important;
}

body[data-screen="dashboard"] .card,
body[data-screen="dashboard"] .home-premium-capital,
body[data-screen="dashboard"] .home-goal-card,
body[data-screen="dashboard"] .home-week-expense-card,
body[data-screen="dashboard"] .home-habit-preview,
body[data-screen="dashboard"] .item {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--island-border) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(114,247,131,.08), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    var(--island-card) !important;
  box-shadow: var(--island-shadow) !important;
  backdrop-filter: blur(18px);
}

body[data-screen="dashboard"] .card::before,
body[data-screen="dashboard"] .home-premium-capital::before,
body[data-screen="dashboard"] .home-goal-card::before,
body[data-screen="dashboard"] .home-week-expense-card::before,
body[data-screen="dashboard"] .home-habit-preview::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(145deg, rgba(255,255,255,.055), transparent 30%),
    radial-gradient(circle at 70% 100%, rgba(72,255,108,.05), transparent 38%);
}

body[data-screen="dashboard"] .home-premium-capital {
  min-height: 158px;
  padding: 22px 22px 20px !important;
  border-radius: 28px !important;
}

body[data-screen="dashboard"] .home-capital-head {
  position: relative;
  z-index: 1;
}

body[data-screen="dashboard"] .home-capital-head small,
body[data-screen="dashboard"] .home-week-copy small,
body[data-screen="dashboard"] .home-goal-title small,
body[data-screen="dashboard"] .home-habit-head small,
body[data-screen="dashboard"] .home-habit-head p,
body[data-screen="dashboard"] .home-capital-goal,
body[data-screen="dashboard"] .home-goal-card p {
  color: var(--island-muted) !important;
}

body[data-screen="dashboard"] .home-capital-head strong {
  margin-top: 8px;
  font-size: clamp(43px, 13vw, 66px) !important;
  font-weight: 780 !important;
  letter-spacing: -.08em !important;
  color: #f8fff9 !important;
}

body[data-screen="dashboard"] .compare {
  border: 0 !important;
  background: rgba(114,247,131,.105) !important;
  color: rgba(245,255,248,.72) !important;
  border-radius: 999px !important;
  padding: 9px 13px !important;
  font-weight: 720;
}

body[data-screen="dashboard"] .premium-progress {
  height: 10px !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.7) !important;
}

body[data-screen="dashboard"] .premium-progress > i {
  background: linear-gradient(90deg, var(--island-green-2), var(--island-green)) !important;
  box-shadow: var(--island-glow), 0 0 8px rgba(114,247,131,.5) !important;
}

body[data-screen="dashboard"] .premium-progress > b {
  background: linear-gradient(180deg, #89ff92, #46e96b) !important;
  color: #061008 !important;
  box-shadow: 0 0 30px rgba(82,255,123,.45) !important;
  font-weight: 800 !important;
}

body[data-screen="dashboard"] .home-capital-goal {
  position: relative;
  z-index: 1;
  margin-top: 18px !important;
  font-size: 13px !important;
}

body[data-screen="dashboard"] .home-capital-goal em {
  color: rgba(245,255,248,.68) !important;
}

/* Two compact upper widgets */
body[data-screen="dashboard"] .home-goal-grid {
  gap: 12px !important;
  margin-top: 12px !important;
}

body[data-screen="dashboard"] .home-goal-card {
  min-height: 138px;
  border-radius: 24px !important;
  padding: 17px !important;
}

body[data-screen="dashboard"] .home-goal-title {
  grid-template-columns: 44px 1fr auto !important;
  gap: 11px !important;
}

body[data-screen="dashboard"] .home-goal-title > span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(72,255,108,.095);
  color: var(--island-green) !important;
  font-size: 24px !important;
  box-shadow: inset 0 0 0 1px rgba(114,247,131,.14);
}

body[data-screen="dashboard"] .home-goal-title strong {
  color: #f8fff9 !important;
  font-weight: 780;
}

body[data-screen="dashboard"] .home-goal-card > b {
  margin-top: 18px !important;
  color: #f8fff9 !important;
  font-size: clamp(27px, 8.6vw, 40px) !important;
  font-weight: 760 !important;
  letter-spacing: -.075em !important;
}

/* Weekly expenses island */
body[data-screen="dashboard"] .home-week-expense-card {
  grid-template-columns: minmax(0,.78fr) minmax(165px,1.22fr) !important;
  gap: 14px !important;
  min-height: 150px;
  border-radius: 26px !important;
  padding: 18px !important;
}

body[data-screen="dashboard"] .home-week-copy {
  position: relative;
  z-index: 1;
}

body[data-screen="dashboard"] .home-week-copy strong {
  color: #f8fff9 !important;
  font-size: clamp(30px, 8.5vw, 44px) !important;
  line-height: 1;
}

body[data-screen="dashboard"] .home-week-copy span {
  color: var(--island-green) !important;
}

body[data-screen="dashboard"] .home-week-bars {
  height: 92px !important;
  position: relative;
  z-index: 1;
  gap: 8px !important;
}

body[data-screen="dashboard"] .home-week-bar span {
  width: 18px !important;
  justify-self: center;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #8cff92, #22d46b) !important;
  box-shadow: 0 0 20px rgba(82,255,123,.35) !important;
}

body[data-screen="dashboard"] .home-week-bar small {
  color: rgba(245,255,248,.52) !important;
  font-size: 11px !important;
}

/* Habit islands in the style of the reference */
body[data-screen="dashboard"] .home-island-habits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
  margin-top: 12px;
}

body[data-screen="dashboard"] .home-island-habits:empty {
  display: none;
}

body[data-screen="dashboard"] .home-island-habits .home-habit-preview {
  margin-top: 0 !important;
  border-radius: 24px !important;
  padding: 17px !important;
  min-height: 160px;
}

body[data-screen="dashboard"] .home-island-habits .home-habit-head {
  gap: 8px;
}

body[data-screen="dashboard"] .home-island-habits .home-habit-head h3 {
  color: #f8fff9 !important;
  font-size: 17px !important;
  line-height: 1.05;
}

body[data-screen="dashboard"] .home-habit-streak {
  color: #f8fff9 !important;
}

body[data-screen="dashboard"] .home-habit-streak span {
  filter: drop-shadow(0 0 10px rgba(255,70,31,.5));
}

body[data-screen="dashboard"] .habit-orb-grid.home-habit-orbs {
  grid-template-columns: repeat(7, minmax(0,1fr)) !important;
  gap: 5px !important;
  margin-top: 16px !important;
}

body[data-screen="dashboard"] .habit-day-orb {
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-screen="dashboard"] .habit-day-orb .habit-orb {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.075) !important;
  border: 2px solid rgba(255,255,255,.06) !important;
  color: #061008 !important;
  font-size: 15px !important;
  font-weight: 800;
}

body[data-screen="dashboard"] .habit-day-orb.done .habit-orb {
  border-color: transparent !important;
  background: radial-gradient(circle at 30% 20%, #baffb9, #49ed65 62%, #18a941) !important;
  box-shadow: 0 0 20px rgba(82,255,123,.35) !important;
}

body[data-screen="dashboard"] .habit-day-orb.today:not(.done) .habit-orb {
  border-color: var(--island-green) !important;
  background: conic-gradient(var(--island-green) 0 68%, rgba(255,255,255,.08) 68% 100%) !important;
  box-shadow: 0 0 18px rgba(82,255,123,.25) !important;
}

body[data-screen="dashboard"] .habit-day-orb small {
  margin-top: 5px !important;
  color: rgba(245,255,248,.45) !important;
  font-size: 9px !important;
}

/* Task/payment compact sections */
body[data-screen="dashboard"] .compact-section {
  margin-top: 12px !important;
}

body[data-screen="dashboard"] .section-head h2 {
  color: #f8fff9 !important;
  letter-spacing: -.035em;
}

/* Bottom bar like a native app */
.bottom-nav {
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(6,8,8,.93) !important;
  box-shadow: 0 -10px 34px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.bottom-nav .nav-item.active {
  background: transparent !important;
  color: var(--island-green) !important;
}

.global-add {
  background: radial-gradient(circle at 32% 22%, #c8ffc5, #69f27b 55%, #17c960) !important;
  box-shadow: 0 0 34px rgba(82,255,123,.45), 0 12px 30px rgba(0,0,0,.35) !important;
}

/* Mobile tuning */
@media (max-width: 430px) {
  body[data-screen="dashboard"] .home-goal-grid,
  body[data-screen="dashboard"] .home-island-habits {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
  }

  body[data-screen="dashboard"] .home-goal-card {
    min-height: 130px;
    padding: 14px !important;
  }

  body[data-screen="dashboard"] .home-goal-title {
    grid-template-columns: 36px 1fr auto !important;
  }

  body[data-screen="dashboard"] .home-goal-title > span {
    width: 36px;
    height: 36px;
    font-size: 20px !important;
  }

  body[data-screen="dashboard"] .home-goal-card > b {
    font-size: clamp(24px, 8vw, 34px) !important;
  }

  body[data-screen="dashboard"] .home-week-expense-card {
    grid-template-columns: 1fr !important;
  }

  body[data-screen="dashboard"] .home-week-bars {
    height: 84px !important;
  }

  body[data-screen="dashboard"] .home-island-habits .home-habit-preview {
    min-height: 150px;
    padding: 14px !important;
  }

  body[data-screen="dashboard"] .habit-day-orb .habit-orb {
    width: 24px !important;
    height: 24px !important;
    font-size: 13px !important;
  }
}

/* Keep light theme readable if user switches themes */
:root[data-theme="light"] body[data-screen="dashboard"] .card,
:root[data-theme="light"] body[data-screen="dashboard"] .home-premium-capital,
:root[data-theme="light"] body[data-screen="dashboard"] .home-goal-card,
:root[data-theme="light"] body[data-screen="dashboard"] .home-week-expense-card,
:root[data-theme="light"] body[data-screen="dashboard"] .home-habit-preview {
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(15,35,24,.12) !important;
}

:root[data-theme="light"] body[data-screen="dashboard"] .home-capital-head strong,
:root[data-theme="light"] body[data-screen="dashboard"] .home-goal-card > b,
:root[data-theme="light"] body[data-screen="dashboard"] .home-week-copy strong,
:root[data-theme="light"] body[data-screen="dashboard"] .home-island-habits .home-habit-head h3,
:root[data-theme="light"] body[data-screen="dashboard"] .section-head h2 {
  color: #102018 !important;
}

:root[data-theme="light"] body[data-screen="dashboard"] .home-capital-head small,
:root[data-theme="light"] body[data-screen="dashboard"] .home-week-copy small,
:root[data-theme="light"] body[data-screen="dashboard"] .home-goal-title small,
:root[data-theme="light"] body[data-screen="dashboard"] .home-habit-head small,
:root[data-theme="light"] body[data-screen="dashboard"] .home-habit-head p,
:root[data-theme="light"] body[data-screen="dashboard"] .home-capital-goal,
:root[data-theme="light"] body[data-screen="dashboard"] .home-goal-card p {
  color: #65736b !important;
}



/* V14.3 Strategy modules and body tracker */
.strategy-modules { margin-top: 14px; }
.strategy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.strategy-card { min-height:128px; padding:15px!important; text-align:left; border-radius:22px!important; }
.strategy-icon { width:36px; height:36px; display:grid; place-items:center; margin-bottom:10px; border-radius:12px; background:color-mix(in srgb,var(--app-accent) 13%,transparent); color:var(--app-accent); font-weight:800; box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--app-accent) 18%,transparent); }
.strategy-card small, .strategy-mini small { display:block; color:var(--app-muted); font-size:10px; }
.strategy-card strong { display:block; margin-top:5px; color:var(--app-text); font-size:clamp(20px,6vw,28px); letter-spacing:-.045em; }
.strategy-card p { margin:6px 0 0; color:var(--app-muted); font-size:10px; line-height:1.25; }
.home-mini-strategy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:10px; }
.strategy-mini { padding:14px!important; border-radius:20px!important; text-align:left; }
.strategy-mini strong { display:block; margin-top:5px; font-size:clamp(19px,5.5vw,27px); letter-spacing:-.04em; }
.body-tracker-card { margin-top:14px; padding:18px!important; border-radius:26px!important; }
.body-stats { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
.body-note { margin-top:10px; color:var(--app-muted); font-size:12px; }
.body-log-mini { display:grid; gap:6px; margin-top:12px; color:var(--app-muted); font-size:11px; }
.body-log-mini span { display:flex; justify-content:space-between; gap:10px; padding:8px 10px; border-radius:12px; background:color-mix(in srgb,var(--app-card) 88%,transparent); border:1px solid var(--app-line); }
.body-log-mini b { color:var(--app-text); }
.utility-row input[type="checkbox"] { width:22px; height:22px; accent-color:var(--app-accent); }
.btn.full { width:100%; margin-top:10px; }
@media (max-width: 430px) { .strategy-grid { grid-template-columns:1fr 1fr; gap:9px; } .strategy-card { min-height:118px; padding:13px!important; } .strategy-card strong { font-size:21px; } .body-stats { grid-template-columns:repeat(2,minmax(0,1fr))!important; } }




/* V14.3 Typography Tune - softer readable scale */
:root {
  --aos-title-tight: -.045em;
  --aos-number-tight: -.055em;
}

/* Header: calmer, less heavy */
.topbar {
  padding: calc(16px + env(safe-area-inset-top)) 18px 13px !important;
}

.brand-mark {
  width: 40px !important;
  height: 40px !important;
  flex-basis: 40px !important;
  border-radius: 14px !important;
  font-size: 23px !important;
}

.brand-line {
  font-size: 11px !important;
  font-weight: 820 !important;
}

.brand-line span {
  font-size: 9px !important;
  padding: 2px 6px !important;
}

.topbar-copy .eyebrow,
.eyebrow {
  font-size: 10px !important;
  letter-spacing: .11em !important;
}

.topbar-copy h1 {
  font-size: clamp(24px, 6.4vw, 32px) !important;
  line-height: .96 !important;
  letter-spacing: var(--aos-title-tight) !important;
}

.global-add.top-add {
  width: 46px !important;
  height: 46px !important;
}

.global-add.top-add svg {
  width: 24px !important;
  height: 24px !important;
}

/* Dashboard greeting: still premium, no screaming */
body[data-screen="dashboard"] .premium-home-welcome {
  margin: 2px 0 15px !important;
}

body[data-screen="dashboard"] .premium-home-welcome small {
  font-size: 13px !important;
  line-height: 1.15 !important;
}

body[data-screen="dashboard"] .premium-home-welcome h2 {
  font-size: clamp(25px, 7vw, 35px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.052em !important;
  max-width: 92% !important;
}

body[data-screen="dashboard"] .premium-home-welcome h2 span {
  font-size: .78em !important;
}

/* Main island card */
body[data-screen="dashboard"] .home-premium-capital {
  min-height: 146px !important;
  padding: 20px 20px 18px !important;
  border-radius: 27px !important;
}

body[data-screen="dashboard"] .home-capital-head small {
  font-size: 13px !important;
  line-height: 1.25 !important;
}

body[data-screen="dashboard"] .home-capital-head strong {
  margin-top: 7px !important;
  font-size: clamp(38px, 10.7vw, 54px) !important;
  line-height: .94 !important;
  letter-spacing: -.065em !important;
  font-weight: 760 !important;
}

body[data-screen="dashboard"] .compare {
  padding: 7px 11px !important;
  font-size: 13px !important;
  line-height: 1.05 !important;
}

body[data-screen="dashboard"] .home-premium-capital .hero-progress {
  margin-top: 20px !important;
}

body[data-screen="dashboard"] .premium-progress > b {
  min-width: 42px !important;
  padding: 4px 8px !important;
  font-size: 11px !important;
}

body[data-screen="dashboard"] .home-capital-goal {
  margin-top: 14px !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
}

/* Small metric cards */
body[data-screen="dashboard"] .home-goal-grid {
  gap: 10px !important;
  margin-top: 10px !important;
}

body[data-screen="dashboard"] .home-goal-card {
  min-height: 122px !important;
  padding: 14px !important;
  border-radius: 22px !important;
}

body[data-screen="dashboard"] .home-goal-title {
  grid-template-columns: 36px 1fr auto !important;
  gap: 9px !important;
}

body[data-screen="dashboard"] .home-goal-title > span {
  width: 36px !important;
  height: 36px !important;
  border-radius: 13px !important;
  font-size: 19px !important;
}

body[data-screen="dashboard"] .home-goal-title small {
  font-size: 11px !important;
  line-height: 1.18 !important;
}

body[data-screen="dashboard"] .home-goal-title strong {
  font-size: 13px !important;
  line-height: 1 !important;
}

body[data-screen="dashboard"] .home-goal-card > b {
  margin-top: 14px !important;
  font-size: clamp(22px, 6.6vw, 31px) !important;
  line-height: 1 !important;
  letter-spacing: -.055em !important;
  font-weight: 740 !important;
}

body[data-screen="dashboard"] .home-goal-card p {
  margin: 4px 0 12px !important;
  font-size: 10.5px !important;
}

/* Small strategy cards added in V14.1 */
body[data-screen="dashboard"] .strategy-card,
body[data-screen="dashboard"] .income-plan-card,
body[data-screen="dashboard"] .capital-structure-card,
body[data-screen="dashboard"] .payday-card,
body[data-screen="dashboard"] .focus-card {
  font-size: 13px !important;
}

body[data-screen="dashboard"] .strategy-card strong,
body[data-screen="dashboard"] .income-plan-card strong,
body[data-screen="dashboard"] .capital-structure-card strong,
body[data-screen="dashboard"] .payday-card strong,
body[data-screen="dashboard"] .focus-card strong {
  font-size: clamp(22px, 6.2vw, 31px) !important;
  line-height: 1 !important;
  letter-spacing: -.05em !important;
}

/* Weekly chart and habits */
body[data-screen="dashboard"] .home-week-expense-card {
  min-height: 136px !important;
  padding: 16px !important;
  border-radius: 24px !important;
}

body[data-screen="dashboard"] .home-week-copy small,
body[data-screen="dashboard"] .home-week-copy span {
  font-size: 11px !important;
}

body[data-screen="dashboard"] .home-week-copy strong {
  font-size: clamp(25px, 7vw, 34px) !important;
  line-height: 1 !important;
  letter-spacing: -.05em !important;
}

body[data-screen="dashboard"] .home-week-bars {
  height: 76px !important;
}

body[data-screen="dashboard"] .home-week-bar small {
  font-size: 10px !important;
}

body[data-screen="dashboard"] .home-island-habits .home-habit-preview {
  min-height: 138px !important;
  padding: 13px !important;
  border-radius: 22px !important;
}

body[data-screen="dashboard"] .home-island-habits .home-habit-head h3 {
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body[data-screen="dashboard"] .home-habit-streak strong {
  font-size: 18px !important;
}

/* Bottom navigation: less bulky */
.bottom-nav {
  padding: 8px 9px calc(8px + env(safe-area-inset-bottom)) !important;
}

.nav-item {
  gap: 3px !important;
  padding: 6px 1px 2px !important;
}

.nav-item svg {
  width: 21px !important;
  height: 21px !important;
}

.nav-item small {
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
}

.global-add {
  width: 48px !important;
  height: 48px !important;
  margin-top: -18px !important;
}

.global-add svg {
  width: 25px !important;
  height: 25px !important;
}

.floating-add {
  width: 58px !important;
  height: 58px !important;
}

.floating-add svg {
  width: 30px !important;
  height: 30px !important;
}

/* Forms and modal typography keep iOS no-zoom but look calmer */
.modal-head h2 {
  font-size: clamp(22px, 6vw, 30px) !important;
}

.field label,
.form-section-title,
.section-head h2 {
  letter-spacing: -.02em !important;
}

@media (max-width: 390px) {
  body[data-screen="dashboard"] .premium-home-welcome h2 {
    font-size: clamp(24px, 6.7vw, 32px) !important;
  }

  body[data-screen="dashboard"] .home-capital-head strong {
    font-size: clamp(36px, 10.1vw, 50px) !important;
  }

  body[data-screen="dashboard"] .home-goal-card > b {
    font-size: clamp(21px, 6.2vw, 28px) !important;
  }

  .topbar-copy h1 {
    font-size: clamp(23px, 6vw, 30px) !important;
  }
}


/* V14.3 Payday limit fix */
.payday-summary-card b,
#paydayDaily {
  display: block;
  font-size: clamp(24px, 7vw, 34px) !important;
  line-height: 1 !important;
  letter-spacing: -.05em !important;
  color: var(--app-text) !important;
}

.payday-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.payday-metrics div {
  min-height: 78px;
}

.payday-metrics small {
  line-height: 1.15;
}

.payday-metrics strong {
  font-size: clamp(20px, 5.8vw, 28px) !important;
}