/* Dashboard V14 reference: quiet white surfaces, dark pills, thin official icons. */
:root {--bg:#f6f5f9;--surface:#fff;--ink:#29292e;--muted:#85858e;--line:#eeeef2;--green:#27272c;--lime:#ece9f2;--soft:#f7f7fa;--danger:#b96351;--shadow:0 4px 24px #25243604;--reference-peach:#e6a27f;--reference-lavender:#b8adcf}
body[data-theme="dark"],:root[data-theme="dark"] {--bg:#18181c;--surface:#232328;--ink:#f1f0f4;--muted:#aaa6b5;--line:#36353e;--green:#e8e5ef;--lime:#393540;--soft:#2a2830;--danger:#e8a08d;--shadow:none}
.app-header {background:var(--surface);border:0;border-radius:18px;backdrop-filter:none;box-shadow:var(--shadow);gap:12px;padding:12px 16px}
.brand,.header-brand .brand>span:last-child {font-family:inherit;font-size:19px;font-weight:650;letter-spacing:-.8px}
.brand-mark,.header-brand .brand-mark {background:var(--reference-peach);color:#fff;border-radius:50%;width:29px;height:29px;font-size:21px}
.nav {background:transparent;padding:0;gap:2px;flex-wrap:wrap;justify-content:center}
.nav-item {border-radius:30px;padding:9px 11px;min-height:36px;font-size:11px;gap:5px}
.nav-item.active {background:var(--green);color:var(--surface);box-shadow:none;font-weight:500}
.nav-symbol {width:15px;height:15px}
.nav-item:not(.active) .nav-symbol {color:var(--muted)}
.workspace {padding-top:22px}
.context-bar {margin-bottom:20px}
.heading {align-items:center;margin-bottom:25px}
.heading .eyebrow {font-size:9px;letter-spacing:1.6px;font-weight:500}
h1 {font-size:34px;letter-spacing:-1.4px;font-weight:550}
.heading p.muted {font-size:12px;max-width:68ch;margin-top:7px}
.button {border-radius:26px;box-shadow:none;font-size:12px;padding:10px 16px}
.button.primary {background:var(--green);color:var(--surface);border-color:var(--green)}
.button.small {font-size:11px;padding:7px 11px}
.button.flat {color:var(--muted)}
.access-status {min-height:3.4em;margin:14px 4px 0;font-size:12px;line-height:1.7;color:var(--muted);overflow-wrap:anywhere}
.access-status[data-error="true"] {color:var(--danger)}
.entry-card .button:disabled {opacity:.65;cursor:wait}
.avatar {background:var(--soft);color:var(--ink);width:30px;height:30px;font-size:11px}
.panel,.metric,.balance-card,.savings-card,.goal-card,.account-card {border-color:var(--line);box-shadow:none;border-radius:15px}
.panel {padding:23px}
.panel h2 {font-size:16px;letter-spacing:-.4px;font-weight:550}
.metric {padding:20px;background:var(--surface)}
.metric .value {font-size:29px;font-weight:550;letter-spacing:-1px}
.metric .label,.metric .hint {font-size:11px}
.metric-icon {background:var(--soft);color:var(--ink);width:29px;height:29px;border-radius:9px}
.hero-grid {gap:18px}
.balance-card {background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.balance-number {font-size:43px;letter-spacing:-1.7px;font-weight:550}
.balance-note,.balance-bottom span {color:var(--muted)}
.balance-bottom {border-color:var(--line)}
.savings-card {background:var(--surface);border:1px solid var(--line);color:var(--ink)}
.hero-decoration {background:var(--soft);color:var(--ink);border-radius:12px;width:42px;height:42px;display:grid;place-items:center;opacity:1;transform:none}
.hero-decoration svg {width:23px;height:23px}
.category-icon {background:var(--soft);color:var(--ink);border-radius:9px;display:inline-grid;place-items:center;min-width:31px;width:31px;height:31px}
.category-icon svg {width:17px;height:17px}
.progress,.bar,.progress-track {background:var(--soft)}
.progress-fill,.bar-fill {background:var(--reference-lavender)}
.forecast-card {display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;padding:25px 29px;margin:22px 0;background:var(--surface);border:1px solid var(--line);border-radius:15px;min-width:0}
.forecast-card h2 {font-size:34px;letter-spacing:-1.3px;font-weight:550;margin:10px 0}
.forecast-card p {font-size:11px;color:var(--muted)}
.forecast-detail {border-left:1px solid var(--line);padding-left:26px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;font-size:11px;color:var(--muted)}
.forecast-detail strong {font-size:21px;letter-spacing:-.5px;font-weight:500;color:var(--ink)}
.planned-row {display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}
.planned-row:last-child {border-bottom:0}
.planned-icon {display:grid;place-items:center;background:var(--soft);color:var(--ink);width:32px;height:32px;border-radius:10px;flex-shrink:0}
.planned-icon svg {width:17px;height:17px}
.planned-info {min-width:0;flex:1}
.planned-info strong {display:block;font-size:12px;font-weight:550;overflow-wrap:anywhere}
.planned-info>span {display:block;font-size:10px;color:var(--muted);margin-top:4px}
.planned-amount {text-align:right;flex-shrink:0}
.planned-amount strong {font-size:13px;display:block;font-weight:550}
.planned-amount button {font-size:10px;padding:5px 0;min-height:30px}
.bill-template {padding:16px 0;border-bottom:1px solid var(--line)}
.bill-template:last-child {border:0}
.insight-row {display:flex;align-items:flex-start;gap:13px;padding:19px 0;border-bottom:1px solid var(--line)}
.insight-row:last-child {border-bottom:0}
.insight-symbol {display:grid;place-items:center;background:var(--soft);color:var(--ink);width:30px;height:30px;flex-shrink:0;border-radius:9px}
.insight-symbol svg {width:16px;height:16px}
.insight-row.warning .insight-symbol {background:#f9eae3;color:#a75f43}
.insight-row h3 {font-size:13px;font-weight:550;margin:0 0 7px}
.insight-row p {font-size:12px;line-height:1.7;color:var(--muted)}
.insight-row small {display:block;font-size:10px;line-height:1.6;color:var(--muted);margin-top:7px}
.planning-overview {margin-bottom:22px}
.empty-state {padding:30px 0;color:var(--muted);font-size:12px;line-height:1.8}
.pay-bill-name {font-size:18px;margin:0 0 22px;font-weight:550}
.telegram-report {font-size:14px;line-height:1.8;background:var(--soft);border-radius:16px;padding:24px;overflow-wrap:anywhere}
dialog {border:1px solid var(--line);box-shadow:0 28px 90px #20202e22;border-radius:20px;max-width:min(640px,calc(100vw - 24px))}
.setup-progress {display:flex;gap:7px;margin-bottom:26px}
.setup-progress span {height:3px;flex:1;border-radius:2px;background:var(--line)}
.setup-progress .done {background:var(--green)}
.setup-kicker {font-size:10px;letter-spacing:1.4px;color:var(--muted);margin-bottom:10px}
.setup-title {font-size:27px;letter-spacing:-1px;font-weight:550;margin-bottom:12px}
.setup-title+.muted {font-size:13px;margin-bottom:25px}
.setup-modes {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:23px 0}
.setup-mode {position:relative;display:flex;flex-direction:column;gap:9px;padding:19px 13px;border:1px solid var(--line);border-radius:13px;font-size:12px;min-width:0;background:var(--surface);margin:0;cursor:pointer}
.setup-mode:has(input:checked) {border-color:var(--ink);background:var(--soft)}
.setup-mode input {position:absolute;right:12px;top:12px;width:13px;height:13px;accent-color:var(--green)}
.setup-mode-icon {width:28px;height:28px}
.setup-mode-icon svg {width:24px;height:24px}
.setup-mode strong {font-size:13px;font-weight:550}
.setup-mode small {font-size:11px;line-height:1.6;color:var(--muted)}
.setup-priorities {display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.setup-priorities label {display:flex;flex-direction:row;align-items:center;gap:7px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font-size:11px;background:var(--surface);margin:0;cursor:pointer}
.setup-priorities label:has(input:checked) {background:var(--soft);border-color:var(--reference-lavender)}
.setup-priorities input {width:13px;height:13px;accent-color:var(--green)}
.setup-priorities svg {width:15px;height:15px}
.setup-notices {display:flex;flex-direction:column;gap:14px;margin:20px 0}
.setup-notices label {display:flex;flex-direction:row;align-items:center;gap:12px;font-size:13px;margin:0;min-height:44px;line-height:1.6;cursor:pointer}
.setup-notices input {width:16px;height:16px;accent-color:var(--green)}
.setup-notices input,.setup-priorities input,.setup-mode input {min-height:0;padding:0;flex-shrink:0;margin:0}
.dialog-head h2 {font-family:inherit;font-size:23px;font-weight:550;letter-spacing:-.8px}
.skipped-plans {margin-top:22px;font-size:12px;color:var(--muted)}
.skipped-plans summary {cursor:pointer;padding:12px 0}
.setup-bills {margin-bottom:17px}
.setup-bills:empty {display:none}
.setup-bills .icon-button svg {width:16px;height:16px}
.form-help {line-height:1.7}
input,select,textarea {border-color:var(--line);border-radius:9px;background:var(--surface);color:var(--ink)}
label>input[type="hidden"] {display:none}
label:has(>input[type="hidden"]) {display:none}
.header-actions .theme-toggle svg {width:17px;height:17px}
@media(min-width:1150px) {.layout{padding-left:64px}.app-header{gap:9px}.nav-item{padding:8px 10px}.header-brand .brand>span:last-child{font-size:17px}.nav-symbol{display:none}}
@media(max-width:850px) {.forecast-card{padding:23px;gap:18px}.app-header{border-radius:15px}.nav-item{padding:9px 10px}.balance-number{font-size:35px}.panel{padding:19px}}
@media(max-width:600px) {h1{font-size:29px}.heading p.muted{font-size:12px}.forecast-card{grid-template-columns:1fr;padding:22px;gap:17px}.forecast-detail{padding:17px 0 0;border-left:0;border-top:1px solid var(--line)}.forecast-card h2{font-size:34px}.planned-row{gap:9px}.planned-amount strong{font-size:12px}.planned-info strong{font-size:12px}.planned-info>span{font-size:11px}.planned-amount button{min-height:38px}.setup-modes{grid-template-columns:1fr}.setup-mode{display:grid;grid-template-columns:30px 1fr;padding:14px 16px;gap:3px 12px}.setup-mode-icon{grid-row:1/3}.setup-mode small{grid-column:2;padding-right:16px}.setup-mode input{top:18px}.setup-title{font-size:24px}.nav-item.active{border-radius:15px}.panel{padding:19px}.button{min-height:42px}.form-actions{gap:10px}.insight-row small{font-size:11px}.setup-priorities label{font-size:12px;min-height:44px}.forecast-card .eyebrow{font-size:10px}}

.app-icon{width:20px;height:20px;display:inline-block;vertical-align:middle;flex-shrink:0}
.demo-strip{background:var(--lime);color:var(--ink)}
dialog::backdrop{background:#24232d55}
#toast{color:var(--surface)}

.analytics-period{display:flex;align-items:center;gap:18px;margin:0 0 22px;flex-wrap:wrap;font-size:11px}
#app[aria-busy="true"]{cursor:progress}
.analytics-period .month-control .button{min-width:42px;min-height:42px}