:root {
    --blue: #3857a6;
    --blue-dark: #203873;
    --blue-soft: #edf2ff;
    --yellow: #ffd000;
    --ink: #172033;
    --muted: #687289;
    --line: #e4e8f0;
    --surface: #ffffff;
    --canvas: #f4f6fa;
    --success: #138a5b;
    --danger: #c83f49;
    --warning: #b67808;
    --sidebar: #12214b;
    --radius: 16px;
    --shadow: 0 14px 34px rgba(23, 32, 51, .08);
}

.cards.cash-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.cash-metrics .metric strong { font-size:clamp(1.35rem,2.2vw,2rem); overflow-wrap:anywhere; }
.cash-metrics .metric small { display:block; margin-top:8px; }
.forecast-note { color:var(--muted); font-size:.86rem; margin:12px 0 20px; }
.forecast-warning { background:#fff8e5; color:#805300; border:1px solid #f1d79a; }
.commitment-list { display:grid; }
.commitment-row { display:grid; grid-template-columns:58px minmax(0,1fr) minmax(150px,auto) auto; align-items:center; gap:16px; padding:16px 0; border-top:1px solid var(--line); }
.commitment-date { display:grid; justify-items:center; padding:6px; background:var(--canvas); border-radius:10px; }
.commitment-date strong { font-size:1.2rem; }
.commitment-date small { font-size:.68rem; }
.commitment-name, .commitment-value { display:grid; gap:3px; }
.commitment-name strong { overflow-wrap:anywhere; }
.commitment-value { text-align:right; }
.commitment-value.income strong { color:var(--success); }
.commitment-value.expense strong { color:var(--danger); }
@media(max-width:650px) { .commitment-row { grid-template-columns:48px minmax(0,1fr); gap:10px; } .commitment-value { grid-column:2; text-align:left; } .commitment-row .row-actions { grid-column:2; } }
.settlement-dialog { width:min(480px,calc(100% - 24px)); border:1px solid var(--line); border-radius:20px; padding:24px; color:var(--ink); box-shadow:var(--shadow); max-height:90vh; overflow:auto; }
.settlement-dialog::backdrop { background:rgba(18,33,75,.5); }
.settlement-dialog .panel-head { margin-bottom:8px; }
.settlement-dialog .panel-head h2 { margin:0; }
.settlement-buttons { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
.settlement-buttons button:disabled { opacity:.55; cursor:wait; }
.transaction-table .row-actions { flex-wrap:wrap; min-width:180px; }
.transaction-table .row-actions .button { white-space:nowrap; }
@media(max-width:1100px) { .cards.cash-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:430px) { .cards.cash-metrics { grid-template-columns:1fr; } .settlement-dialog { padding:18px; } }

* { box-sizing: border-box; }
html { font-size: 16px; }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--canvas); font-family: Inter, "Segoe UI", Arial, sans-serif; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, .button { min-height: 42px; }
.icon { width: 20px; height: 20px; flex: 0 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.install-page { min-height: 100vh; background: linear-gradient(135deg, #eef2fb 0 52%, #fff7cb 100%); }
.install-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; min-height: 100vh; display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; padding: 48px 0; }
.install-brand { padding: 24px; }
.install-logo { display: block; width: min(360px, 90%); height: auto; margin-bottom: 28px; }
.brand-product { display: inline-flex; padding: 7px 12px; border-radius: 999px; color: var(--blue-dark); background: var(--yellow); font-weight: 800; letter-spacing: .03em; }
.install-brand h1 { font-size: clamp(2.1rem, 4vw, 3.8rem); line-height: 1.03; margin: 22px 0 16px; color: var(--blue-dark); letter-spacing: -.045em; }
.install-brand > p { color: var(--muted); font-size: 1.08rem; max-width: 540px; }
.install-card { background: var(--surface); border: 1px solid rgba(56,87,166,.12); border-radius: 24px; padding: clamp(24px, 4vw, 46px); box-shadow: var(--shadow); max-height: calc(100vh - 48px); overflow: auto; }
.install-card h2 { margin-top: 0; font-size: 1.6rem; }
.requirements { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 8px; }
.requirements li { display: flex; align-items: center; gap: 10px; color: var(--muted); }
.requirements span { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: white; font-weight: 800; }
.requirements .ok span { background: var(--success); }
.requirements .fail span { background: var(--danger); }
fieldset { margin: 0 0 24px; padding: 0; border: 0; }
legend { width: 100%; padding-bottom: 8px; margin-bottom: 14px; border-bottom: 1px solid var(--line); font-weight: 800; color: var(--blue-dark); }
label { display: grid; gap: 6px; margin-bottom: 14px; color: #344059; font-weight: 600; font-size: .9rem; }
input, select, textarea { width: 100%; border: 1px solid #ccd3df; border-radius: 10px; background: white; color: var(--ink); padding: 11px 12px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(56,87,166,.13); }
small { color: var(--muted); font-weight: 400; }
.form-grid { display: grid; gap: 0 14px; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.button { border: 0; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 42px; padding: 0 15px; font-weight: 600; cursor: pointer; transition: .18s ease; white-space: nowrap; }
.button:hover { transform: translateY(-1px); }
.button.primary { background: var(--blue); color: white; box-shadow: 0 7px 16px rgba(56,87,166,.24); }
.button.secondary { background: var(--blue-soft); color: var(--blue-dark); }
.button.danger { background: #fff0f1; color: var(--danger); }
.button.full { width: 100%; }
.button.compact { min-height: 34px; height: 34px; padding: 0 10px; font-size: .8rem; }
.alert { padding: 12px 14px; border-radius: 10px; margin: 0 0 14px; }
.alert.error { background: #fff0f1; color: #992c35; border: 1px solid #ffd1d5; }
.alert.success { background: #eaf8f2; color: #0f704b; border: 1px solid #bcebd8; }
.success-mark { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: #eaf8f2; color: var(--success); font-size: 2rem; font-weight: 900; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 270px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; background: var(--sidebar); color: white; padding: 24px 18px; display: flex; flex-direction: column; }
.sidebar-logo { width: 180px; filter: brightness(0) invert(1); margin: 6px 12px 8px; }
.sidebar-product { margin: 0 12px 26px; color: var(--yellow); font-size: .82rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 900; }
.sidebar nav { display: grid; gap: 5px; }
.sidebar nav a { display: flex; gap: 11px; align-items: center; padding: 11px 12px; border-radius: 10px; color: #d8e0f6; font-weight: 600; }
.sidebar nav a:hover, .sidebar nav a.active { background: rgba(255,255,255,.1); color: white; }
.sidebar nav a.active { box-shadow: inset 3px 0 var(--yellow); }
.sidebar-footer { margin-top: auto; border-top: 1px solid rgba(255,255,255,.14); padding-top: 15px; }
.nav-button { width: 100%; border: 0; background: transparent; color: #d8e0f6; display: flex; gap: 11px; align-items: center; padding: 11px 12px; border-radius: 10px; cursor: pointer; font-weight: 600; }
.nav-button:hover { background: rgba(255,255,255,.1); color: white; }
.main { min-width: 0; }
.topbar { min-height: 72px; background: white; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 12px 30px; position: sticky; top: 0; z-index: 10; }
.workspace-switch { min-width: 0; display: flex; gap: 12px; align-items: center; }
.workspace-switch > span { color: var(--muted); font-size: .82rem; font-weight: 600; }
.workspace-switch > div { display: flex; gap: 6px; min-width: 0; }
.workspace-switch form { margin: 0; }
.workspace-option { border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--muted); padding: 0 12px; display: inline-flex; align-items: center; gap: 7px; cursor: pointer; font-weight: 500; }
.workspace-option.active { color: var(--blue-dark); border-color: #aebde5; background: var(--blue-soft); }
.content { padding: 28px 30px 54px; max-width: 1540px; margin: 0 auto; }
.page-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.page-head > .actions { align-items: flex-end; }
.page-head > .actions > .button { align-self: flex-end; }
.dashboard-actions input[type="month"], .dashboard-actions > .button { height: 48px; min-height: 48px; }
.page-head h1 { margin: 0 0 3px; font-size: clamp(1.55rem, 2.5vw, 2.25rem); letter-spacing: -.035em; }
.page-head p { margin: 0; color: var(--muted); }
.actions { display: flex; gap: 9px; flex-wrap: wrap; }
.cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 20px; }
.metric, .panel, .bank-card { background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 25px rgba(23,32,51,.04); }
.metric { padding: 19px; min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; }
.metric .label { color: var(--muted); font-weight: 600; }
.metric strong { font-size: 1.55rem; letter-spacing: -.03em; }
.metric small { display: block; }
.metric.income strong { color: var(--success); }
.metric.expense strong { color: var(--danger); }
.dashboard-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dashboard-metrics .metric { position: relative; overflow: hidden; padding: 20px 21px 18px; border-top-width: 4px; }
.dashboard-metrics .metric.balance { border-top-color: var(--blue); background: linear-gradient(135deg,#fff 58%,#f1f4ff); }
.dashboard-metrics .metric.income { border-top-color: var(--success); background: linear-gradient(135deg,#fff 58%,#effaf5); }
.dashboard-metrics .metric.expense { border-top-color: var(--danger); background: linear-gradient(135deg,#fff 58%,#fff2f3); }
.metric-heading { display: flex; align-items: center; gap: 11px; }
.metric-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; color: var(--blue); background: var(--blue-soft); }
.metric-icon .icon { width: 21px; height: 21px; }
.metric.income .metric-icon { color: var(--success); background: #e6f7ef; }
.metric.expense .metric-icon { color: var(--danger); background: #ffe9eb; }
.panel { padding: 20px; margin-bottom: 20px; }
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; }
.panel h2 { margin: 0; font-size: 1.08rem; }
.bank-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 320px)); gap: 14px; }
.bank-card { max-width: 320px; min-width: 0; overflow: hidden; background: white; }
.bank-visual { height: 112px; min-height: 0; overflow: hidden; display: grid; place-items: center; padding: 0; background: #e9edf4; }
.bank-visual img { display: block; width: 100%; height: 100%; min-height: 0; max-width: 100%; max-height: 100%; object-fit: cover; object-position: center; }
.bank-initials { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; color: white; font-weight: 900; font-size: 1.2rem; }
.bank-info { position: relative; z-index: 1; min-height: 94px; padding: 14px 15px; background: white; }
.bank-info strong, .bank-info span { display: block; }
.bank-info span { color: var(--muted); font-size: .82rem; }
.bank-balance { margin-top: 12px; font-size: 1.12rem; }
.table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; }
th { text-align: left; padding: 10px 12px; color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .045em; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 12px; border-bottom: 1px solid #edf0f5; vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
.amount.income { color: var(--success); font-weight: 650; }
.amount.expense { color: var(--danger); font-weight: 650; }
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 999px; font-size: .78rem; font-weight: 650; white-space: nowrap; }
.badge.pending, .badge.scheduled, .badge.awaiting_value { background: #fff4cc; color: #8a6100; }
.badge.received { background: #e6f7ef; color: #0e7049; }
.badge.paid { background: #ffe9eb; color: #a92e38; }
.badge.overdue { background: #ffe7e9; color: #a92e38; }
.badge.cancelled { background: #edf0f5; color: #657086; }
.filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.filters label { margin: 0; min-width: 150px; }
.form-card { max-width: 900px; }
.inline-form { display: inline; }
.block { display: block; }
.muted { color: var(--muted); }
.category-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 8px; background: var(--blue); }
.reconcile { padding: 5px 0; }
.reconcile label { flex: 1 1 220px; }
.report-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
.chart-bars, .category-list { display: grid; gap: 16px; }
.chart-row { display: grid; grid-template-columns: 72px 1fr; gap: 14px; align-items: start; }
.chart-row > div { display: grid; gap: 5px; }
.chart-row span, .category-list span { color: var(--muted); font-size: .82rem; display: flex; justify-content: space-between; gap: 12px; }
progress { width: 100%; height: 10px; border: 0; border-radius: 999px; overflow: hidden; accent-color: var(--success); }
progress.expense-progress { accent-color: var(--danger); }
.category-list > div { display: grid; gap: 5px; }
.setting-row { padding: 13px 0; border-bottom: 1px solid var(--line); }
.setting-row:last-child { border-bottom: 0; }
.setting-row strong, .setting-row span { display: block; }
.setting-row span { color: var(--muted); font-size: .82rem; }
.public-page { background: white; }
.public-shell { width: min(100% - 32px, 960px); margin: 0 auto; padding: 54px 0 80px; }
.public-logo { width: 270px; max-width: 75%; margin-bottom: 26px; }
.public-shell h1 { color: var(--blue-dark); font-size: clamp(2.2rem, 5vw, 4rem); margin: 22px 0 0; letter-spacing: -.045em; }
.updated { color: var(--muted); }
.empty { padding: 42px 20px; text-align: center; color: var(--muted); }
.empty strong { display: block; color: var(--ink); margin-bottom: 4px; }
.privacy-content { max-width: 920px; }
.privacy-content h2 { margin-top: 32px; color: var(--blue-dark); }
.privacy-content li { margin-bottom: 7px; }
.login-page { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, .75fr) 1.25fr; background: white; }
.login-form { display: grid; place-items: center; padding: 30px; }
.login-card { width: min(430px, 100%); }
.login-card img { width: 260px; max-width: 80%; margin-bottom: 30px; }
.login-card h1 { margin: 0; font-size: 2rem; }
.login-card > p { color: var(--muted); margin-bottom: 28px; }
.login-art { background: var(--blue-dark); color: white; padding: 7vw; display: flex; flex-direction: column; justify-content: end; position: relative; overflow: hidden; }
.login-art::before { content: ''; position: absolute; width: 440px; height: 440px; border-radius: 50%; background: var(--yellow); right: -160px; top: -120px; opacity: .95; }
.login-art h2 { font-size: clamp(2.2rem, 5vw, 5rem); line-height: .98; max-width: 760px; margin: 0; letter-spacing: -.055em; }
.login-art p { color: #cad5f3; font-size: 1.1rem; max-width: 620px; }
.mobile-nav { display: none; }
.auth-public { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; background: #f5f7fb; }
.auth-card { width: min(460px, 100%); }
.auth-card.wide { width: min(760px, 100%); }
.auth-card .public-logo { display: block; }
.check-label { display: flex; flex-direction: row; gap: 10px; align-items: flex-start; font-weight: 500; }
.check-label input[type="checkbox"] { width: auto; margin-top: 4px; flex: 0 0 auto; }
.recovery-panel { border: 1px solid #efb1b6; }
.recovery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.recovery-grid code, .secret-box code { display: block; padding: 10px 12px; border-radius: 8px; background: #f3f5f9; overflow-wrap: anywhere; }
.secret-box { margin: 16px 0; }
.copy-value { margin-top: 8px; padding: 10px; border-radius: 8px; background: rgba(255,255,255,.72); overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.danger-zone { border-color: #efb1b6; }
.notification-bell { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 12px; color: var(--blue-dark); background: white; }
.notification-bell span { position: absolute; right: -5px; top: -7px; min-width: 20px; height: 20px; padding: 0 5px; display: grid; place-items: center; border-radius: 999px; background: var(--danger); color: white; font-size: .68rem; font-weight: 800; }
.notification-list { display: grid; gap: 0; }
.notification-item { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 17px 0; border-top: 1px solid var(--line); }
.notification-item.unread { border-left: 4px solid var(--yellow); padding-left: 14px; }
.notification-item p { margin: 5px 0; color: var(--muted); }
.notification-item small { color: var(--muted); }
.push-manager { margin-top: 20px; padding-top: 8px; border-top: 1px solid var(--line); }
.push-manager .actions { margin-top: 14px; }
.push-manager [data-push-status].push-error { color: var(--danger); }
.settings-tabs { display: flex; gap: 6px; overflow-x: auto; margin: -6px 0 20px; padding: 4px 0; scrollbar-width: thin; }
.settings-tabs a { flex: 0 0 auto; padding: 9px 13px; border-radius: 10px; color: var(--muted); font-size: .88rem; font-weight: 600; }
.settings-tabs a.active { background: var(--blue); color: white; }
.settings-body > .page-head { margin-top: 2px; }
.inline-create { margin: 2px 0 18px; border: 1px dashed #c8d0df; border-radius: 11px; padding: 12px 14px; background: #fafbfe; }
.inline-create summary { cursor: pointer; color: var(--blue-dark); font-weight: 600; }
.inline-create[open] summary { margin-bottom: 14px; }
.quick-value { display: flex; gap: 6px; min-width: 190px; }
.quick-value input { width: 104px; height: 34px; padding: 6px 8px; }
.transaction-table table { min-width: 1080px; }
.transaction-table th:last-child, .transaction-table .actions-cell { position:sticky; right:0; background:var(--surface); box-shadow:-7px 0 10px -9px rgba(23,32,51,.4); z-index:1; }
.transaction-row.income { box-shadow: inset 3px 0 var(--success); }
.transaction-row.expense { box-shadow: inset 3px 0 var(--danger); }
.editable-field { min-width: 0; }
.field-display { display: flex; align-items: center; gap: 5px; min-height: 32px; }
.field-display > span { min-width: 0; }
.editable-field.editing .field-display { display: none; }
.icon-action { width: 30px; height: 30px; min-height: 30px; padding: 0; border: 0; border-radius: 8px; display: inline-grid; place-items: center; flex: 0 0 auto; cursor: pointer; color: var(--muted); background: transparent; }
.icon-action .icon { width: 16px; height: 16px; }
.icon-action:hover { filter: brightness(.96); box-shadow: 0 2px 8px rgba(23,32,51,.1); }
.icon-action.edit, .icon-action.open { color: var(--blue); background: var(--blue-soft); }
.icon-action.save { color: var(--success); background: #e9f7f1; }
.icon-action.activate, .icon-action.read { color: var(--success); background: #e9f7f1; }
.icon-action.pause { color: #9a6800; background: #fff5d9; }
.icon-action.archive { color: #647086; background: #eef1f6; }
.icon-action.cancel { color: var(--muted); background: #f0f2f6; }
.icon-action.delete { color: var(--danger); background: #fff0f1; }
.field-editor { display: flex; align-items: center; gap: 5px; min-width: 155px; }
.field-editor[hidden] { display: none; }
.field-editor input, .field-editor select { min-width: 120px; height: 36px; padding: 6px 8px; font-size: .84rem; }
.field-editor-actions { display: flex; gap: 3px; }
.transaction-kind { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 7px; font-size: .76rem; font-weight: 700; }
.transaction-kind.income { color: #0e7049; background: #e6f7ef; }
.transaction-kind.expense { color: #a92e38; background: #ffe9eb; }
.category-inline { display: inline-flex; align-items: center; gap: 7px; }
.category-inline i { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; background: #94a0b8; }
.status-marker, .status-indicator { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.status-marker i, .status-indicator i { width: 8px; height: 8px; border-radius: 50%; background: #94a0b8; }
.status-marker.received { color: var(--success); }
.status-marker.received i { background: var(--success); }
.status-marker.paid { color: var(--danger); }
.status-marker.paid i { background: var(--danger); }
.status-marker.awaiting_value { color: #7040a3; }
.status-marker.awaiting_value i { background: #8b5cf6; }
.status-marker.scheduled { color: #2365a8; }
.status-marker.scheduled i { background: #3b82f6; }
.status-marker.pending { color: #9a5b08; }
.status-marker.pending i { background: #e38a14; }
.status-marker.overdue { color: #a92e38; }
.status-marker.overdue i { background: #d94751; }
.status-marker.cancelled i { background: #94a0b8; }
.row-actions { display: flex; align-items: center; gap: 4px; }
.movement-status-panel { display: flex; gap: 8px; margin-bottom: 18px; padding: 7px; overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 8px 25px rgba(23,32,51,.035); scrollbar-width: thin; }
.movement-status { min-width: max-content; min-height: 42px; padding: 0 12px; display: grid; grid-template-columns: 8px auto auto; align-items: center; gap: 8px; border: 1px solid transparent; border-radius: 10px; color: var(--muted); background: #f7f8fb; transition: .18s ease; }
.movement-status:hover { border-color: #cbd3e2; background: white; }
.movement-status.active { border-color: currentColor; background: white; box-shadow: 0 3px 10px rgba(23,32,51,.08); }
.movement-status > i { width: 8px; height: 8px; border-radius: 50%; background: #94a0b8; }
.movement-status > span { font-size: .8rem; font-weight: 600; }
.movement-status strong { min-width: 24px; padding: 2px 7px; border-radius: 999px; text-align: center; color: inherit; background: white; font-size: .78rem; }
.movement-status.received { color: var(--success); }
.movement-status.received > i { background: var(--success); }
.movement-status.paid { color: var(--danger); }
.movement-status.paid > i { background: var(--danger); }
.movement-status.awaiting_value { color: #7040a3; }
.movement-status.awaiting_value > i { background: #8b5cf6; }
.movement-status.scheduled { color: #2365a8; }
.movement-status.scheduled > i { background: #3b82f6; }
.movement-status.pending { color: #9a5b08; }
.movement-status.pending > i { background: #e38a14; }
.movement-status.overdue { color: #a92e38; }
.movement-status.overdue > i { background: #d94751; }
.transaction-status-group { padding: 0; overflow: hidden; }
.transaction-status-group > summary { list-style: none; }
.transaction-status-group > summary::-webkit-details-marker { display: none; }
.transaction-group-head { min-height: 72px; padding: 14px 18px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto 28px; align-items: center; gap: 12px; cursor: pointer; background: #fbfcfe; }
.transaction-status-group[open] .transaction-group-head { border-bottom: 1px solid var(--line); }
.group-status-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #eef1f6; }
.group-status-icon i { width: 10px; height: 10px; border-radius: 50%; background: #94a0b8; }
.transaction-group-head h2 { margin: 0; font-size: 1rem; }
.transaction-group-head p { margin: 2px 0 0; color: var(--muted); font-size: .8rem; }
.group-composition { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.group-composition b { padding: 4px 8px; border-radius: 999px; color: var(--muted); background: #edf0f5; font-size: .72rem; font-weight: 600; }
.group-toggle { width: 28px; height: 28px; display: grid; place-items: center; color: var(--muted); transition: transform .18s ease; }
.group-toggle .icon { width: 17px; height: 17px; }
.transaction-status-group[open] .group-toggle { transform: rotate(90deg); }
.transaction-group-body .transaction-table { padding: 0 12px 8px; }
.transaction-status-group.received .group-status-icon { background: #e9f7f1; }
.transaction-status-group.received .group-status-icon i { background: var(--success); }
.transaction-status-group.received .transaction-group-head h2 { color: var(--success); }
.transaction-status-group.paid .group-status-icon { background: #fff0f1; }
.transaction-status-group.paid .group-status-icon i { background: var(--danger); }
.transaction-status-group.paid .transaction-group-head h2 { color: var(--danger); }
.transaction-status-group.awaiting_value .group-status-icon { background: #f3edff; }
.transaction-status-group.awaiting_value .group-status-icon i { background: #8b5cf6; }
.transaction-status-group.awaiting_value .transaction-group-head h2 { color: #7040a3; }
.transaction-status-group.scheduled .group-status-icon { background: #eaf3ff; }
.transaction-status-group.scheduled .group-status-icon i { background: #3b82f6; }
.transaction-status-group.scheduled .transaction-group-head h2 { color: #2365a8; }
.transaction-status-group.pending .group-status-icon { background: #fff4e5; }
.transaction-status-group.pending .group-status-icon i { background: #e38a14; }
.transaction-status-group.pending .transaction-group-head h2 { color: #9a5b08; }
.transaction-status-group.overdue .group-status-icon { background: #ffe9eb; }
.transaction-status-group.overdue .group-status-icon i { background: #d94751; }
.transaction-status-group.overdue .transaction-group-head h2 { color: #a92e38; }
.secondary-action { display: flex; justify-content: flex-end; align-items: center; gap: 18px; margin: -6px 0 12px; color: var(--blue-dark); font-size: .86rem; }
.secondary-action a, .secondary-action button { display: inline-flex; align-items: center; gap: 5px; color: var(--blue-dark); background: none; border: 0; padding: 0; min-height: 36px; cursor: pointer; font-weight: 600; }
.breakdown-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.breakdown-content { display: grid; grid-template-columns: minmax(0,1fr) 168px; gap: 22px; align-items: center; }
.ranked-categories { display: grid; }
.ranked-categories > div { display: grid; grid-template-columns: 7px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.ranked-categories > div:last-child { border: 0; }
.ranked-categories strong, .ranked-categories small { display: block; }
.ranked-categories strong { font-size: .9rem; font-weight: 600; }
.ranked-categories b { font-size: .84rem; font-weight: 650; }
.category-rank-color { width: 7px; height: 34px; border-radius: 999px; background: var(--blue); }
.category-symbol { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--blue-soft); color: var(--blue); }
.category-symbol .icon { width: 16px; }
.donut { width: 158px; height: 158px; position: relative; border-radius: 50%; display: grid; place-items: center; background: #edf0f5; }
.donut::after { content: ''; width: 88px; height: 88px; position: absolute; border-radius: 50%; background: white; }
.donut span { position: relative; z-index: 2; width: 78px; text-align: center; font-size: .72rem; color: var(--muted); line-height: 1.2; }
.donut-segment { display: none; }
.install-help { margin-top: 16px; padding: 16px; border-radius: 12px; background: var(--blue-soft); }
.install-help ol { margin-bottom: 14px; padding-left: 21px; }
.notification-bell .icon { width: 21px; height: 21px; }
.panel-description { margin: 4px 0 0; color: var(--muted); font-size: .88rem; }
.account-manager, .category-editor, .space-list { display: grid; gap: 10px; }
.account-row { display: grid; grid-template-columns: minmax(180px, 1fr) auto auto; gap: 14px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.account-row > div:first-child strong, .account-row > div:first-child span { display: block; }
.account-row > div:first-child span { margin-top: 3px; color: var(--muted); font-size: .84rem; }
.balance-adjust { grid-column: 1 / -1; padding-top: 10px; border-top: 1px solid var(--line); }
.balance-adjust summary, .create-space > summary { color: var(--blue-dark); cursor: pointer; font-weight: 600; }
.balance-adjust p { margin: 8px 0 12px; color: var(--muted); font-size: .86rem; }
.category-create { max-width: none; }
.category-form { display: grid; grid-template-columns: minmax(190px, 2fr) minmax(150px, 1fr) 210px minmax(190px, 1.4fr) auto; gap: 12px; align-items: end; }
.category-form label, .category-edit-form label { margin: 0; }
.scope-control { min-width: 0; }
.color-input-group { display: grid; grid-template-columns: 52px minmax(96px,1fr); gap: 7px; }
.color-control input[type="color"] { width: 52px; height: 42px; padding: 3px; border-radius: 10px; cursor: pointer; }
.color-control input[type="text"] { height: 42px; padding-inline: 10px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .86rem; text-transform: uppercase; }
.color-control input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.color-control input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 7px; }
.color-control input[type="color"]::-moz-color-swatch { border: 0; border-radius: 7px; }
.category-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; align-items: start; }
.category-group:last-child { grid-column: 1 / -1; }
.item-count { color: var(--muted); font-size: .8rem; }
.category-clean-list { display: grid; }
.category-clean-row { border-top: 1px solid var(--line); }
.category-clean-row:first-child { border-top: 0; }
.category-clean-row > summary { display: grid; grid-template-columns: 18px minmax(0,1fr) auto 32px; gap: 12px; align-items: center; min-height: 64px; padding: 9px 0; list-style: none; cursor: pointer; }
.category-clean-row > summary::-webkit-details-marker { display: none; }
.category-color-swatch { width: 14px; height: 36px; border-radius: 7px; background: var(--blue); }
.category-summary strong, .category-summary small { display: block; }
.category-summary small { margin-top: 2px; }
.status-indicator.active { color: var(--success); }
.status-indicator.active i { background: var(--success); }
.status-indicator.inactive i { background: #94a0b8; }
.row-edit-cue { width: 30px; height: 30px; display: grid; place-items: center; color: var(--blue); border-radius: 8px; background: var(--blue-soft); }
.row-edit-cue .icon { width: 15px; height: 15px; }
.category-edit-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; align-items: end; padding: 16px; margin: 0 0 12px; border-radius: 12px; background: #f7f9fc; }
.category-row-actions { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
.installment-progress { display: grid; gap: 3px; min-width: 170px; }
.installment-progress strong { color: var(--blue-dark); font-size: .9rem; }
.installment-progress small { color: var(--muted); font-size: .75rem; white-space: nowrap; }
.space-card { padding: 0 15px; border: 1px solid var(--line); border-radius: 12px; background: #fafbfe; }
.space-card > summary { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 14px 0; cursor: pointer; list-style: none; }
.space-card > summary::-webkit-details-marker, .create-space > summary::-webkit-details-marker { display: none; }
.space-card > summary > span { color: var(--blue); }
.space-card > summary strong, .space-card > summary small { display: block; }
.space-card > summary small { margin-top: 2px; color: var(--muted); }
.space-card > summary b { color: var(--blue); font-size: .82rem; font-weight: 600; }
.space-card > form { padding: 16px 0; border-top: 1px solid var(--line); }
.create-space[open] > summary { margin-bottom: 16px; }

@media (max-width: 1050px) {
    .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .bank-grid { grid-template-columns: repeat(2, minmax(240px, 320px)); }
    .app-shell { grid-template-columns: 88px minmax(0, 1fr); }
    .sidebar { padding-inline: 12px; }
    .sidebar-logo { width: 56px; height: 52px; object-fit: cover; object-position: left; margin-inline: 4px; }
    .sidebar-product, .sidebar nav span { display: none; }
    .sidebar nav a { justify-content: center; font-size: 1.2rem; }
    .breakdown-content { grid-template-columns: 1fr; }
    .donut { margin: 0 auto; }
    .category-groups { grid-template-columns: 1fr; }
    .category-group:last-child { grid-column: auto; }
    .category-form { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .category-form > .button { width: 100%; }
}

@media (max-width: 760px) {
    .install-shell { grid-template-columns: 1fr; gap: 18px; padding: 24px 0; }
    .install-brand { padding: 10px; }
    .install-card { max-height: none; }
    .form-grid.two { grid-template-columns: 1fr; }
    .login-page { grid-template-columns: 1fr; }
    .login-art { display: none; }
    .app-shell { display: block; }
    .sidebar { display: none; }
    .topbar { min-height: 66px; padding: 9px max(12px, env(safe-area-inset-right)) 9px max(12px, env(safe-area-inset-left)); position: sticky; gap: 8px; box-shadow: 0 4px 18px rgba(23,32,51,.05); }
    .workspace-switch { flex: 1; gap: 6px; overflow: hidden; }
    .workspace-switch > span { display: none; }
    .workspace-switch > div { width: 100%; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); gap: 5px; overflow: hidden; padding: 0; }
    .workspace-switch form { min-width: 0; }
    .workspace-option { width: 100%; min-height: 42px; padding: 0 9px; max-width: none; justify-content: center; }
    .workspace-option .icon { width: 18px; height: 18px; }
    .workspace-option span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .notification-bell { width: 42px; height: 42px; min-width: 42px; margin-left: auto; }
    .content { width: 100%; padding: 20px max(12px, env(safe-area-inset-right)) calc(92px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
    .page-head { align-items: start; flex-direction: column; }
    .page-head h1 { font-size: 1.75rem; }
    .page-head > .button { width: 100%; }
    .page-head .actions { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .page-head .actions .filters { grid-column: 1 / -1; }
    .page-head .actions .button { width: 100%; }
    .cards, .bank-grid, .dashboard-metrics { grid-template-columns: 1fr; }
    .movement-status-panel { margin-inline: -12px; padding: 7px 12px; border-width: 1px 0; border-radius: 0; box-shadow: none; scroll-snap-type: x proximity; }
    .movement-status { scroll-snap-align: start; }
    .agenda-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .agenda-summary .metric { min-height: 112px; }
    .report-grid { grid-template-columns: 1fr; }
    .breakdown-grid { grid-template-columns: 1fr; }
    .breakdown-content { grid-template-columns: minmax(0,1fr) 130px; gap: 10px; }
    .donut { width: 124px; height: 124px; }
    .donut::after { width: 70px; height: 70px; }
    .donut span { display: none; }
    .secondary-action { justify-content: space-between; flex-wrap: wrap; }
    .filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; }
    .filters label { min-width: 0; }
    .filters .button { width: 100%; }
    .transaction-filters .button { grid-column: 1 / -1; }
    .transaction-table { overflow: visible; }
    .transaction-table table, .transaction-table tbody { display: block; min-width: 0; }
    .transaction-table thead { display: none; }
    .transaction-table tr { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 0 9px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 13px; padding: 12px; background: white; box-shadow: 0 5px 16px rgba(23,32,51,.035); }
    .transaction-table td { min-width: 0; padding: 0; border: 0; overflow-wrap: anywhere; }
    .transaction-table .actions-cell { position:static; box-shadow:none; }
    .transaction-table td::before { content: attr(data-label); display: block; margin-bottom: 3px; color: var(--muted); font-size: .65rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
    .transaction-table .kind-cell { grid-column: 1; grid-row: 1; align-self: start; }
    .transaction-table .kind-cell::before, .transaction-table .name-cell::before, .transaction-table .amount-cell::before, .transaction-table .status-cell::before, .transaction-table .actions-cell::before { display: none; }
    .transaction-table .name-cell { grid-column: 2; grid-row: 1; align-self: center; }
    .transaction-table .name-cell strong { display: block; line-height: 1.25; }
    .transaction-table .amount-cell { grid-column: 3; grid-row: 1; align-self: center; text-align: right; white-space: nowrap; }
    .transaction-table .amount-cell .field-display { justify-content: flex-end; }
    .transaction-table .status-cell { grid-column: 1 / -1; grid-row: 2; margin-top: 11px; padding: 9px 0; border-top: 1px solid #edf0f5; border-bottom: 1px solid #edf0f5; }
    .transaction-table .category-cell { grid-column: 1 / -1; grid-row: 3; padding-top: 9px; }
    .transaction-table .date-cell { grid-column: 1 / 3; grid-row: 4; padding-top: 10px; }
    .transaction-table .account-cell { grid-column: 3; grid-row: 4; max-width: 130px; padding-top: 10px; text-align: right; }
    .transaction-table .actions-cell { grid-column: 1 / -1; grid-row: 5; margin-top: 10px; }
    .transaction-table .actions-cell .row-actions { justify-content: flex-end; }
    .transaction-group-head { min-height: 68px; grid-template-columns: 34px minmax(0,1fr) 24px; gap: 10px; padding: 12px 14px; }
    .transaction-group-head p { display: none; }
    .group-status-icon { width: 32px; height: 32px; }
    .group-composition { grid-column: 2; justify-content: flex-start; margin-top: -4px; }
    .group-toggle { grid-column: 3; grid-row: 1 / span 2; }
    .transaction-status-group, .panel.transaction-status-group { padding: 0; border-radius: 14px; }
    .transaction-group-body .transaction-table { padding: 10px; }
    .quick-value { min-width: 0; flex-wrap: wrap; }
    .quick-value input { flex: 1 1 96px; }
    .mobile-nav { display: flex; position: fixed; bottom: 0; left: 0; right: 0; height: calc(66px + env(safe-area-inset-bottom)); background: white; border-top: 1px solid var(--line); z-index: 20; justify-content: space-around; padding: 7px 4px env(safe-area-inset-bottom); }
    .mobile-nav a { position: relative; min-width: 64px; display: grid; place-items: center; gap: 2px; color: var(--muted); font-size: .7rem; }
    .mobile-nav a.active { color: var(--blue); font-weight: 700; }
    .mobile-nav a.active::before { content: ''; position: absolute; top: -7px; width: 28px; height: 3px; border-radius: 0 0 4px 4px; background: var(--blue); }
    .mobile-nav .icon { width: 21px; height: 21px; }
    .recovery-grid { grid-template-columns: 1fr; }
    .notification-item { align-items: flex-start; flex-direction: column; }
    .settings-tabs { margin-inline: -2px; }
    .bank-card { width: 100%; max-width: none; }
    .account-row { grid-template-columns: minmax(0, 1fr) auto; }
    .account-row > .actions, .balance-adjust { grid-column: 1 / -1; }
    .category-form, .category-edit-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .category-form > .button { width: 100%; }
    .category-edit-form { margin-left: 0; }
    .category-row-actions { grid-column: 1 / -1; }
    .field-editor { width: 100%; }
    .field-editor input, .field-editor select { flex: 1; min-width: 0; }
}

@media (max-width: 430px) {
    .panel { padding: 15px; }
    .cards { gap: 10px; }
    .agenda-summary { grid-template-columns: 1fr 1fr; }
    .metric { padding: 15px; }
    .metric strong { font-size: 1.3rem; }
    .movement-status { min-height: 40px; padding: 0 10px; }
    .movement-status strong { font-size: .76rem; }
    .transaction-table tr { grid-template-columns: auto minmax(0,1fr); }
    .transaction-table .kind-cell { grid-column: 1; }
    .transaction-table .name-cell { grid-column: 2; }
    .transaction-table .amount-cell { grid-column: 1 / -1; grid-row: 2; margin-top: 9px; padding-top: 9px; border-top: 1px solid #edf0f5; text-align: left; }
    .transaction-table .amount-cell::before { display: block; }
    .transaction-table .amount-cell .field-display { justify-content: flex-start; }
    .transaction-table .status-cell { grid-row: 3; }
    .transaction-table .category-cell { grid-row: 4; }
    .transaction-table .date-cell { grid-column: 1; grid-row: 5; }
    .transaction-table .account-cell { grid-column: 2; grid-row: 5; }
    .transaction-table .actions-cell { grid-row: 6; }
    .breakdown-content { grid-template-columns: 1fr; }
    .filters { grid-template-columns: 1fr; }
    .category-form, .category-edit-form { grid-template-columns: 1fr; }
    .category-clean-row > summary { grid-template-columns: 14px minmax(0,1fr) 30px; }
    .category-clean-row > summary .status-indicator { grid-column: 2; }
    .category-clean-row > summary .row-edit-cue { grid-column: 3; grid-row: 1 / span 2; }
    .category-row-actions { grid-column: auto; }
    .category-row-actions .button { width: 100%; }
    .space-card > summary { grid-template-columns: 30px minmax(0, 1fr); }
    .space-card > summary b { grid-column: 2; }
}

/* Direct editing and separation between information and actions. */
.quick-field { display:grid; gap:4px; margin:0; }
.quick-field select, .quick-field input { height:38px; padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--canvas); font-size:.84rem; }
.quick-field select { width:180px; cursor:pointer; }
.quick-field input { width:135px; font-weight:600; color:inherit; }
.quick-field input::placeholder { color:var(--danger); opacity:1; }
.quick-field :is(input,select):focus { outline:2px solid var(--blue); outline-offset:2px; }
.quick-feedback { font-size:.72rem; color:var(--muted); white-space:normal; max-width:180px; }
.quick-feedback:empty { display:none; }
.commitment-row { grid-template-columns:58px minmax(0,1fr) minmax(160px,auto) 132px; column-gap:24px; padding:20px 0; }
.commitment-value { gap:8px; }
.commitment-value small { font-size:.78rem; }
.commitment-row > .row-actions { justify-content:flex-end; gap:12px; border-left:1px solid var(--line); padding-left:20px; }
.commitment-row .icon-action { width:36px; height:36px; flex-shrink:0; }
@media(max-width:1000px) {
 .commitment-row { grid-template-columns:48px minmax(0,1fr); gap:12px 16px; }
 .commitment-value { grid-column:2; text-align:left; }
 .commitment-row > .row-actions { grid-column:2; justify-content:flex-start; border-left:0; padding:4px 0 0; }
}

/* 1.14: calm, two-level movement rows instead of a compressed eight-column form. */
.attention-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.attention-card { display:grid; gap:7px; padding:18px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:#fafbfd; }
.attention-card strong { font-size:1.65rem; line-height:1; color:var(--blue); }
.attention-card span { font-size:.87rem; font-weight:600; }
.attention-card small { font-size:.76rem; color:var(--muted); }
.attention-card:hover { border-color:var(--blue); background:var(--blue-soft); }
.attention-panel .forecast-note { margin-bottom:0; }
.period-switch { display:flex; gap:4px; padding:4px; background:var(--canvas); border-radius:10px; flex-shrink:0; }
.period-switch a { padding:8px 12px; color:var(--muted); font-size:.82rem; border-radius:7px; white-space:nowrap; }
.period-switch a.active { background:white; color:var(--blue); box-shadow:0 1px 5px #17203312; font-weight:700; }
.upcoming-totals { display:flex; flex-wrap:wrap; gap:16px 32px; padding:14px 18px; margin:0 0 16px; background:var(--canvas); border-radius:10px; color:var(--muted); font-size:.84rem; }
.upcoming-totals strong { margin-left:12px; color:var(--ink); font-variant-numeric:tabular-nums; }
.upcoming-panel .panel-head { flex-wrap:wrap; gap:16px; }
.review-row { display:grid; grid-template-columns:minmax(180px,1fr) minmax(165px,auto) auto auto; gap:24px; align-items:center; padding:20px 0; border-top:1px solid var(--line); }
.review-row small { display:block; margin-top:6px; }
.review-row .row-actions { gap:12px; }
.review-row > strong { white-space:nowrap; }
.attention-filter { display:flex; justify-content:space-between; gap:16px; align-items:center; padding:16px 20px; margin-bottom:18px; border:1px solid #ccd7f1; background:#f0f4ff; border-radius:12px; }
.attention-filter span { display:block; margin-top:4px; font-size:.8rem; color:var(--muted); }
.bank-check-label { display:block; margin-top:6px; font-size:.73rem; font-weight:500; }
.bank-check-label.pending { color:#946108; }
.bank-check-label.checked { color:var(--success); }
.effective-date { font-size:.84rem; font-weight:600; }
.transaction-group-body .transaction-table { padding:0 20px 8px; overflow:visible; }
.transaction-table table, .transaction-table tbody { display:block; min-width:0; width:100%; }
.transaction-table thead { display:none; }
.transaction-table .transaction-row { display:grid; grid-template-columns:56px minmax(180px,1.4fr) minmax(130px,1fr) minmax(155px,1fr) minmax(125px,.8fr); gap:6px 20px; padding:22px 0 16px; margin:0; border:0; border-bottom:1px solid var(--line); border-radius:0; box-shadow:none; background:white; }
.transaction-table .transaction-row:last-child { border-bottom:0; }
.transaction-table td { border:0; padding:0; min-width:0; text-align:left; white-space:normal; align-self:center; }
.transaction-table td::before { display:none; }
.transaction-table .kind-cell { grid-column:1; grid-row:1 / 3; align-self:start; padding-top:4px; }
.transaction-table .name-cell { grid-column:2; grid-row:1 / 3; }
.transaction-table .name-cell strong { display:block; font-size:.95rem; line-height:1.4; overflow-wrap:anywhere; }
.transaction-table .name-cell small { margin-top:5px; font-size:.74rem; }
.transaction-table .category-cell { grid-column:3; grid-row:1; font-size:.81rem; padding:0; }
.transaction-table .account-cell { grid-column:3; grid-row:2; font-size:.78rem; color:var(--muted); text-align:left; padding:0; max-width:none; }
.transaction-table .date-cell { grid-column:4; grid-row:1 / 3; padding:0; font-size:.85rem; }
.transaction-table .date-cell small { margin-top:5px; font-size:.73rem; }
.transaction-table .amount-cell { grid-column:5; grid-row:1 / 3; padding:0; margin:0; border:0; text-align:right; }
.transaction-table .status-cell { grid-column:1 / 4; grid-row:3; margin:14px 0 0; padding:12px 0 0; border:0; border-top:1px solid #f0f2f7; }
.transaction-table .actions-cell { grid-column:4 / 6; grid-row:3; position:static; z-index:auto; box-shadow:none; margin:14px 0 0; padding:12px 0 0; border-top:1px solid #f0f2f7; }
.transaction-table .row-actions { justify-content:flex-end; flex-wrap:wrap; gap:10px; min-width:0; }
.transaction-table .row-actions .button { box-shadow:none; padding:8px 12px; min-height:34px; }
.transaction-table .row-actions .icon-action { width:34px; height:34px; background:transparent; }
.transaction-table .row-actions .icon-action:hover { background:var(--blue-soft); }
.transaction-table .row-actions .danger { background:transparent; color:var(--muted); }
.transaction-table .row-actions .danger:hover { background:#fff0f1; color:var(--danger); }
.transaction-table .quick-field { display:inline-grid; max-width:100%; vertical-align:middle; }
.transaction-table .quick-field select { width:210px; max-width:100%; height:34px; min-height:34px; padding:5px 28px 5px 10px; font-size:.78rem; border:1px solid transparent; border-radius:8px; color:var(--muted); background-color:#f5f7fa; }
.transaction-table .quick-field[data-status="pending"] select { color:#946108; background-color:#fff7e8; }
.transaction-table .quick-field[data-status="scheduled"] select { color:#315f99; background-color:#edf4ff; }
.transaction-table .quick-field[data-status="awaiting_value"] select { color:#7146a0; background-color:#f5efff; }
.transaction-table .quick-field[data-status="paid"] select, .transaction-table .quick-field[data-status="received"] select { color:#157753; background-color:#ecf8f2; }
.transaction-table .quick-field input:not([type="hidden"]) { width:145px; max-width:100%; min-height:36px; height:36px; padding:5px 8px; border:1px dashed #dbe1eb; border-radius:8px; background:transparent; text-align:right; font-size:.95rem; font-variant-numeric:tabular-nums; }
.transaction-table .quick-field :is(input,select):hover { border-color:#b2c2e1; background-color:#f7f9ff; }
@media(max-width:1150px) {
 .attention-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .review-row { grid-template-columns:minmax(0,1fr) auto; gap:16px; }
 .review-row .row-actions { grid-column:1 / -1; justify-content:flex-end; }
 .transaction-table .transaction-row { grid-template-columns:48px minmax(0,1fr) minmax(155px,auto); gap:10px 14px; }
 .transaction-table .kind-cell { grid-column:1; grid-row:1; }
 .transaction-table .name-cell { grid-column:2; grid-row:1; }
 .transaction-table .amount-cell { grid-column:3; grid-row:1; }
 .transaction-table .category-cell { grid-column:2; grid-row:2; }
 .transaction-table .account-cell { grid-column:2; grid-row:3; }
 .transaction-table .date-cell { grid-column:3; grid-row:2 / 4; text-align:right; }
 .transaction-table .status-cell { grid-column:1 / 3; grid-row:4; }
 .transaction-table .actions-cell { grid-column:3; grid-row:4; }
}
@media(max-width:700px) {
 .attention-grid { gap:10px; }
 .attention-card { padding:14px; }
 .attention-card span { font-size:.8rem; }
 .attention-filter { align-items:flex-start; flex-direction:column; }
 .transaction-group-body .transaction-table { padding:0 14px 6px; }
 .transaction-table .transaction-row { grid-template-columns:48px minmax(0,1fr); padding:18px 0; }
 .transaction-table .amount-cell { grid-column:1 / -1; grid-row:2; text-align:left; }
 .transaction-table .quick-field input:not([type="hidden"]) { text-align:left; }
 .transaction-table .category-cell { grid-column:1 / -1; grid-row:3; }
 .transaction-table .account-cell { grid-column:1 / -1; grid-row:4; }
 .transaction-table .date-cell { grid-column:1 / -1; grid-row:5; text-align:left; }
 .transaction-table .status-cell { grid-column:1 / -1; grid-row:6; margin-top:4px; }
 .transaction-table .actions-cell { grid-column:1 / -1; grid-row:7; margin-top:0; padding-top:8px; border:0; }
 .transaction-table .actions-cell .row-actions { justify-content:flex-start; gap:10px; }
 .review-row { grid-template-columns:minmax(0,1fr); }
 .review-row .row-actions { justify-content:flex-start; flex-wrap:wrap; }
 .upcoming-totals { gap:12px; }
}

/* A dedicated notification center, with current issues distinct from read history. */
.notification-bell [hidden] { display:none; }
.notification-preferences { margin:0 0 24px; border:1px solid var(--line); background:white; border-radius:14px; }
.notification-preferences > summary { cursor:pointer; font-weight:600; padding:20px; color:var(--muted); }
.notification-preferences > .report-grid { padding:0 16px; }
.live-alert-panel > .panel-head { flex-wrap:wrap; gap:16px; }
.financial-alert-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:24px; padding:20px; margin:12px 0; border:1px solid var(--line); border-left:4px solid #e1a449; border-radius:12px; background:#fffdf8; }
.financial-alert-card.overdue { border-left-color:#d3585f; background:#fff9f9; }
.financial-alert-card h3 { margin:8px 0; font-size:1rem; overflow-wrap:anywhere; }
.financial-alert-card p { margin:0 0 8px; font-size:.86rem; line-height:1.5; }
.financial-alert-card small { font-size:.77rem; color:var(--muted); }
.alert-deadline { font-size:.72rem; font-weight:700; color:#926013; text-transform:uppercase; letter-spacing:.035em; }
.overdue .alert-deadline { color:#b53741; }
.financial-alert-action { display:grid; justify-items:end; gap:12px; }
.financial-alert-action strong { white-space:nowrap; font-variant-numeric:tabular-nums; }
.financial-alert-dialog { width:min(700px,calc(100% - 24px)); max-height:85vh; padding:26px; border:1px solid var(--line); border-radius:20px; color:var(--ink); box-shadow:0 25px 90px #12214b40; overflow:auto; }
.financial-alert-dialog::backdrop { background:#12214b80; backdrop-filter:blur(3px); }
.financial-alert-dialog .panel-head { align-items:start; gap:16px; }
.financial-alert-dialog h2 { margin:6px 0 0; font-size:1.3rem; }
.alert-eyebrow { font-size:.74rem; font-weight:700; color:var(--blue); text-transform:uppercase; letter-spacing:.05em; }
.financial-alert-dialog > p { color:var(--muted); font-size:.85rem; line-height:1.6; }
.financial-alert-footer { display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 12px; }
.financial-alert-dialog > small { color:var(--muted); font-size:.75rem; }
.financial-alert-items { max-height:46vh; overflow:auto; padding-right:4px; }
@media(max-width:700px) {
 .financial-alert-card { grid-template-columns:minmax(0,1fr); gap:16px; padding:16px; }
 .financial-alert-action { display:flex; align-items:center; justify-content:space-between; gap:12px; }
 .financial-alert-dialog { padding:18px; max-height:90vh; }
 .financial-alert-dialog h2 { font-size:1.1rem; }
 .financial-alert-footer .button { flex:1 1 120px; text-align:center; }
 .notification-preferences > .report-grid { padding:0 8px; }
 .mobile-nav { grid-template-columns:repeat(5,minmax(0,1fr)); }
 .mobile-nav a { font-size:.65rem; }
}


/* 1.14.3: status in the main row, payment beside the value. */
.transaction-table .transaction-row { grid-template-columns:48px minmax(160px,1.3fr) minmax(130px,.9fr) minmax(145px,1fr) 190px minmax(350px,max-content); column-gap:16px; }
.transaction-table .kind-cell { grid-column:1; grid-row:1 / 3; }
.transaction-table .name-cell { grid-column:2; grid-row:1 / 3; }
.transaction-table .category-cell { grid-column:3; grid-row:1; }
.transaction-table .account-cell { grid-column:3; grid-row:2; }
.transaction-table .date-cell { grid-column:4; grid-row:1 / 3; }
.transaction-table .status-cell { grid-column:5; grid-row:1 / 3; margin:0; padding:0; border:0; }
.transaction-table .amount-cell { grid-column:6; grid-row:1 / 3; }
.transaction-table .actions-cell { grid-column:5 / 7; grid-row:3; margin:0; padding:8px 0 0; border:0; }
.transaction-table .amount-payment { display:flex; justify-content:flex-end; align-items:center; gap:12px; }
.transaction-table .amount-payment .button { box-shadow:none; white-space:nowrap; padding:8px 12px; }
.transaction-table .amount-payment .editable-field { min-width:0; }
.transaction-table .status-cell .quick-field select { width:190px; }
@media(max-width:1400px) {
 .transaction-table .transaction-row { grid-template-columns:48px minmax(170px,1fr) 190px minmax(350px,max-content); }
 .transaction-table .kind-cell { grid-column:1; grid-row:1; }
 .transaction-table .name-cell { grid-column:2; grid-row:1; }
 .transaction-table .status-cell { grid-column:3; grid-row:1; }
 .transaction-table .amount-cell { grid-column:4; grid-row:1; }
 .transaction-table .category-cell { grid-column:2; grid-row:2; }
 .transaction-table .account-cell { grid-column:3; grid-row:2; }
 .transaction-table .date-cell { grid-column:4; grid-row:2; text-align:right; }
 .transaction-table .actions-cell { grid-column:3 / 5; grid-row:3; }
}
@media(max-width:1100px) {
 .transaction-table .transaction-row { grid-template-columns:48px minmax(0,1fr) minmax(350px,max-content); }
 .transaction-table .amount-cell { grid-column:3; grid-row:1; }
 .transaction-table .status-cell { grid-column:2; grid-row:2; }
 .transaction-table .category-cell { grid-column:2; grid-row:3; }
 .transaction-table .account-cell { grid-column:2; grid-row:4; }
 .transaction-table .date-cell { grid-column:3; grid-row:2 / 4; text-align:right; }
 .transaction-table .actions-cell { grid-column:3; grid-row:4; }
}
@media(max-width:700px) {
 .transaction-table .transaction-row { grid-template-columns:48px minmax(0,1fr); }
 .transaction-table .amount-cell { grid-column:1 / -1; grid-row:2; }
 .transaction-table .amount-payment { justify-content:flex-start; flex-wrap:wrap; }
 .transaction-table .category-cell { grid-column:1 / -1; grid-row:3; }
 .transaction-table .account-cell { grid-column:1 / -1; grid-row:4; }
 .transaction-table .status-cell { grid-column:1 / -1; grid-row:5; text-align:left; }
 .transaction-table .date-cell { grid-column:1 / -1; grid-row:6; text-align:left; }
 .transaction-table .actions-cell { grid-column:1 / -1; grid-row:7; }
}

/* Keep payment and secondary actions in one group. */
.transaction-table .amount-payment { gap:10px; }
.transaction-table .amount-payment > .row-actions { flex-wrap:nowrap; gap:6px; flex-shrink:0; }
.transaction-table .amount-payment > .row-actions .inline-form { margin:0; }
@media(max-width:1100px) and (min-width:701px) {
 .transaction-table .transaction-row { grid-template-columns:48px minmax(0,1fr); }
 .transaction-table .name-cell { grid-column:2; grid-row:1; }
 .transaction-table .amount-cell { grid-column:1 / -1; grid-row:5; }
 .transaction-table .amount-payment { justify-content:flex-start; flex-wrap:wrap; }
 .transaction-table .status-cell { grid-column:2; grid-row:2; }
 .transaction-table .category-cell { grid-column:2; grid-row:3; }
 .transaction-table .account-cell { grid-column:2; grid-row:4; }
 .transaction-table .date-cell { grid-column:2; grid-row:6; text-align:left; }
}