/* Application color standard. Change base colors here, then reload the app.
   Keep expense separate from danger: outgoing money is not an error. */
.app-message-dialog{position:fixed;inset:0;margin:auto;width:min(520px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);overflow-y:auto;padding:28px;border:1px solid var(--color-border);border-radius:18px;background:var(--color-surface);color:var(--color-text);box-shadow:0 24px 80px #17283e35}
.app-message-dialog::backdrop{background:#17283e70;backdrop-filter:blur(2px)}
.app-message-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:var(--color-income-soft);color:var(--color-primary);font-size:25px;font-weight:600;margin-bottom:16px}
.app-message-dialog h2{font-size:21px;font-weight:700;margin:0 0 12px}
.app-message-dialog p{font-size:14px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:var(--color-muted)}
.app-message-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--color-border);padding-top:20px;margin-top:24px}
.app-message-actions button{min-width:100px;min-height:44px;padding:10px 20px;border-radius:9px;font-weight:600;font-size:14px;cursor:pointer}
.app-message-ok{background:var(--color-primary);border:1px solid var(--color-primary);color:white}
.app-message-cancel{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text)}
.app-message-ok:hover{filter:brightness(1.06)}
.app-message-cancel:hover{background:var(--color-background)}
.app-message-actions button:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}
@media(max-width:480px){.app-message-dialog{padding:22px}.app-message-actions button{flex:1;min-width:0}}
:root {
  --color-primary: #008577;
  --color-income: #009b8d;
  --color-expense: #f28a46;
  --color-expense-strong: color-mix(in srgb, var(--color-expense) 55%, #17283e);
  --color-transfer: #717987;
  --color-danger: #c93636;
  --color-info: #3575cd;
  --color-secondary: #7657bd;
  --color-text: #17283e;
  --color-muted: #778597;
  --color-surface: #ffffff;
  --color-background: #f6f7f9;
  --color-border: #e2e8ef;
  --color-income-soft: color-mix(in srgb, var(--color-income) 10%, white);
  --color-expense-soft: color-mix(in srgb, var(--color-expense) 13%, white);
  --color-income-previous: color-mix(in srgb, var(--color-income) 60%, white);
  --color-expense-previous: color-mix(in srgb, var(--color-expense) 60%, white);
  --color-income-fill: color-mix(in srgb, var(--color-income) 8%, transparent);
  --color-expense-fill: color-mix(in srgb, var(--color-expense) 4%, transparent);
  --canvas: var(--color-background);
  --paper: var(--color-surface);
  --ink: var(--color-text);
  --sub: var(--color-muted);
  --line: var(--color-border);
  --brand: var(--color-primary);
}
button.bg-primary,.recon-button:not(.light){background:var(--color-primary)!important;color:white}
button.bg-primary:disabled{opacity:.4}
/* Selected transaction type follows its financial meaning. */
:is(#btn-type-income,#statement-edit-type-income).bg-primary{background:var(--color-income)!important;color:white!important}
:is(#btn-type-expense,#statement-edit-type-expense).bg-primary{background:var(--color-expense)!important;color:var(--color-text)!important}
:is(#btn-type-transfer,#statement-edit-type-transfer).bg-primary{background:var(--color-transfer)!important;color:white!important}
.text-income{color:var(--color-income)!important}
.text-expense{color:var(--color-expense)!important}
.text-danger,.text-red-500,.text-red-600,.text-red-700{color:var(--color-danger)!important}
.text-green-600,.text-green-700{color:var(--color-income)!important}
nav button.tab-active{background:var(--color-income-soft)!important;color:var(--color-primary)!important}
#view-dashboard{--dash-teal:var(--color-income);--dash-orange:var(--color-expense);color:var(--color-text)}
#view-dashboard .dash-kpis .dash-card:before{background:var(--color-income-soft)}
#view-dashboard .dash-kpis .dash-expense:before{background:var(--color-expense-soft)}
#view-dashboard .dash-period-tabs button[aria-pressed="true"]{color:var(--color-primary)}
#view-dashboard .dash-compare input{accent-color:var(--color-primary)}
/* Settings: shared action, selection and keyboard-focus colors. */
.history-edit{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;border:1px solid var(--color-border);border-radius:9px;background:var(--color-surface);color:var(--color-primary);cursor:pointer}
.history-edit:hover{background:var(--color-income-soft);border-color:var(--color-primary)}
.history-edit:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
/* Stable column and action slots regardless of labels or number of confirmations. */
#view-transactions .history-toolbar{display:grid;grid-template-columns:auto minmax(220px,1fr) auto;align-items:center;gap:16px}
#view-transactions .history-toolbar h2{white-space:nowrap;margin:0;border:0!important}
#view-transactions .history-toolbar-search{min-width:0}
#view-transactions .history-toolbar .history-search-input{background:var(--color-surface)!important;min-height:44px;font-size:13px}
#view-transactions .history-toolbar-actions{gap:12px;flex-wrap:wrap;justify-content:flex-end}
#view-transactions .history-toolbar-actions>div{white-space:nowrap}
#view-transactions .history-toolbar-actions>button{white-space:nowrap}
#view-transactions .history-search-area{padding-top:6px;padding-bottom:6px}
#view-transactions .history-search-meta{margin-top:0}
@media(max-width:1279px){#view-transactions .history-toolbar{grid-template-columns:auto minmax(220px,1fr)}#view-transactions .history-toolbar-actions{grid-column:1/-1}}
@media(max-width:639px){#view-transactions .history-toolbar{grid-template-columns:1fr;gap:12px}#view-transactions .history-toolbar-actions{justify-content:flex-start}#view-transactions .history-toolbar-search{width:100%}#view-transactions .history-toolbar-actions>div{flex-basis:100%}#view-transactions .history-toolbar-actions>button{flex:1;font-size:11px}#view-transactions .history-toolbar .history-search-input{font-size:16px}}
#view-transactions .history-table{table-layout:fixed;min-width:1250px}
#view-transactions .history-table td{vertical-align:middle;overflow-wrap:anywhere}
#view-transactions .history-table td:nth-child(2),
#view-transactions .history-table td:nth-child(6){white-space:nowrap;font-variant-numeric:tabular-nums}
#view-transactions .history-table .row-actions{display:grid;grid-template-columns:72px 128px;gap:10px;width:210px;align-items:center;justify-content:start;margin-inline:auto;white-space:normal}
#view-transactions .history-table .history-clone{width:72px;min-height:40px;white-space:nowrap}
#view-transactions .history-action-slot{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;min-width:0;min-height:40px;text-align:center}
#view-transactions .history-action-slot>span{font-size:11px;line-height:1.5}
.history-batch-card{display:inline-flex;align-items:center;justify-content:center;width:128px;min-height:40px;padding:8px 6px;text-align:center;border:1px solid var(--color-border);border-radius:9px;background:var(--color-income-soft);color:var(--color-primary);cursor:pointer;white-space:nowrap}
.history-batch-card-heading{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;white-space:nowrap}
.history-batch-card-heading svg{flex-shrink:0}
.history-batch-card-heading>span{margin-left:auto}
.history-batch-card small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:var(--color-muted)}
.history-batch-card:hover{border-color:var(--color-primary);box-shadow:0 2px 8px #17283e0a}
.history-batch-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
.history-batch-card.history-actual-card{background:var(--color-expense-soft);color:var(--color-expense-strong);border-color:color-mix(in srgb,var(--color-expense) 35%,var(--color-border));width:128px;min-width:128px;min-height:40px}
.history-batch-card.history-actual-card:hover{border-color:var(--color-expense-strong);background:color-mix(in srgb,var(--color-expense) 20%,var(--color-surface))}
.history-batch-card.history-actual-card:focus-visible{outline-color:var(--color-expense-strong)}
.comparison-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.comparison-heading label{display:flex;align-items:center;gap:10px;font-size:13px}
.comparison-note{font-size:12px;color:var(--color-muted);margin-top:12px}
.comparison-scroll{overflow-x:auto;max-height:65dvh;overflow-y:auto;margin-top:16px}
.comparison-table{width:100%;min-width:1200px;border-collapse:separate;border-spacing:0;font-size:13px}
.comparison-table th{position:sticky;top:0;z-index:1;background:var(--color-background);font-size:12px;white-space:nowrap}
.comparison-table th,.comparison-table td{padding:12px;border-bottom:1px solid var(--color-border);text-align:left;vertical-align:middle}
.comparison-table td.text-right{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.comparison-table small{display:block;max-width:240px;color:var(--color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.comparison-table tbody tr{cursor:pointer}
.comparison-table tbody tr:hover{background:var(--color-income-soft)}
.comparison-table tbody tr:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}
#view-transactions .history-summary-row{cursor:pointer}
#view-transactions .history-summary-row:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}
#view-transactions .history-summary-row td{padding-top:10px;padding-bottom:10px}
#view-transactions .history-category-line{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#view-transactions .history-category-name{display:inline;font-weight:500}
#view-transactions .history-note-preview{display:inline;color:var(--color-muted);font-size:12px;line-height:1.5}
:is(#history-detail-dialog,#batch-detail-dialog){width:min(1188px,96vw);max-width:96vw;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--color-border);border-radius:20px;background:var(--color-surface);color:var(--color-text);box-shadow:0 24px 80px #17283e30;overscroll-behavior:contain}
:is(#history-detail-dialog,#batch-detail-dialog)::backdrop{background:#17283e70}
.history-detail-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid var(--color-border);background:var(--color-surface);position:sticky;top:0;z-index:1}
.history-detail-header p{font-size:12px;color:var(--color-muted);margin:0 0 3px}
.history-detail-header h2{font-size:24px;font-weight:700;margin:0;overflow-wrap:anywhere}
.history-detail-header button{font-size:28px;width:44px;height:44px;color:var(--color-muted);border:0;background:transparent}
:is(#history-detail-content,#batch-detail-content){padding:24px}
.history-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 24px;margin:0}
.history-detail-field{min-width:0}
.history-detail-field dt{font-size:12px;color:var(--color-muted);margin-bottom:8px}
.history-detail-field dd{margin:0;padding:12px 14px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-background);font-size:15px;min-height:48px;white-space:pre-wrap;overflow-wrap:anywhere}
.history-detail-amount dd{font-size:25px;font-weight:700;font-variant-numeric:tabular-nums}
.history-detail-wide{grid-column:1/-1}
.history-batch-links{margin-bottom:22px;padding-bottom:20px;border-bottom:1px solid var(--color-border)}
.history-batch-links>span{display:block;font-size:12px;color:var(--color-muted);margin-bottom:8px}
.history-batch-links>button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;margin-top:6px;padding:12px 16px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-income-soft);color:var(--color-primary);font-size:16px;text-align:left;overflow-wrap:anywhere;cursor:pointer}
.history-batch-links>button>span{font-size:12px;white-space:nowrap}
.history-batch-links>button:hover{border-color:var(--color-primary)}
.history-batch-links>p{font-size:13px;color:var(--color-muted)}
.history-installment-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.history-installment-actions button{padding:10px 16px;border:1px solid var(--color-border);border-radius:9px;font-size:13px;color:var(--color-primary);background:var(--color-income-soft);min-height:44px}
.batch-direct-summary{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px}
.batch-direct-summary>strong{color:var(--color-primary)}
.batch-direct-notice{background:var(--color-income-soft);padding:14px;border-radius:10px;font-size:13px;margin-top:20px;color:var(--color-text)}
#batch-detail-reverse:disabled{opacity:.4;cursor:not-allowed}
.history-detail-section{border-top:1px solid var(--color-border);padding-top:20px;margin-top:24px}
.history-detail-section h3{font-size:16px;margin-bottom:12px;font-weight:600}
.history-detail-record{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--color-border);font-size:13px}
.history-detail-record small{display:block;color:var(--color-muted);overflow-wrap:anywhere}
.history-detail-audit{font-size:12px;border:1px solid var(--color-border);padding:12px;border-radius:9px;margin-bottom:8px}
.history-detail-audit ul{list-style:disc;padding-left:20px;margin-top:8px;color:var(--color-muted)}
.history-detail-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;border-top:1px solid var(--color-border)}
.history-detail-footer>span{font-size:12px;color:var(--color-muted)}
.history-detail-footer button{white-space:nowrap;background:var(--color-primary);color:white;padding:10px 20px;border:0;border-radius:9px}
@media(max-width:900px){.history-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){:is(#history-detail-dialog,#batch-detail-dialog){width:100vw;max-width:100vw;max-height:100dvh;border-radius:0}.history-detail-grid{grid-template-columns:1fr}:is(#history-detail-content,#batch-detail-content){padding:16px}.history-detail-header,.history-detail-footer{padding:14px 16px}.history-detail-header h2{font-size:21px}.history-detail-footer{flex-wrap:wrap}}
.batch-correction-button{border:1px solid var(--color-border);border-radius:8px;padding:7px 11px;background:var(--color-surface);color:var(--color-primary);font-size:12px;cursor:pointer}
.batch-correction-button:hover{background:var(--color-income-soft);border-color:var(--color-primary)}
.batch-correction-notice{border:1px solid var(--color-border);border-left:3px solid var(--color-primary);border-radius:8px;padding:12px;background:var(--color-income-soft);color:var(--color-text);font-size:13px;margin-bottom:12px}
.batch-panel>summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;cursor:pointer;padding:7px 0;list-style:none}
.batch-panel>summary::-webkit-details-marker{display:none}
.batch-panel>summary:before{content:'›';font-size:23px;color:var(--color-primary);line-height:1}
.batch-panel[open]>summary:before{transform:rotate(90deg)}
.batch-panel-counts{font-size:12px;color:var(--color-muted)}
.batch-panel-hint{margin-left:auto;font-size:12px;color:var(--color-primary)}
.batch-panel-body{padding-top:14px}
.batch-panel-controls{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.batch-panel-tabs{display:flex;gap:4px;flex-wrap:wrap;background:var(--color-background);padding:4px;border-radius:9px}
.batch-panel-tabs button{padding:7px 12px;border-radius:7px;font-size:12px;color:var(--color-muted)}
.batch-panel-tabs button[aria-pressed="true"]{background:var(--color-surface);color:var(--color-primary);box-shadow:0 1px 5px #17283e10;font-weight:600}
#batch-panel-search{width:280px;max-width:100%;font-size:13px}
#batch-panel-results{max-height:360px;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding-right:4px}
.batch-panel-item{border:1px solid var(--color-border);border-radius:10px;padding:12px 14px;margin-bottom:10px;background:var(--color-surface)}
.batch-panel-item-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.batch-panel-item-head>div>strong{font-size:13px;overflow-wrap:anywhere}
.batch-panel-item-head>div>span{display:block;color:var(--color-muted);font-size:11px;margin-top:2px}
.batch-panel-status{font-size:11px;white-space:nowrap;background:var(--color-expense-soft);color:var(--color-text);padding:3px 8px;border-radius:6px}
.batch-panel-status.is-confirmed{background:var(--color-income-soft);color:var(--color-primary)}
.batch-panel-totals{display:flex;gap:8px 16px;flex-wrap:wrap;font-size:12px;margin:10px 0}
.batch-panel-item-actions{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.batch-panel-item-actions>div{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.batch-child-details{min-width:0;flex:1}
.batch-child-details>summary{font-size:12px;color:var(--color-primary);cursor:pointer;padding-block:7px}
.batch-child-list{font-size:12px;padding-top:5px}
.batch-child-list>div{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;border-top:1px solid var(--color-border);padding:8px 0}
.batch-child-list>div>span{min-width:0;overflow-wrap:anywhere}
.batch-child-list small{display:block;color:var(--color-muted);font-size:10px}
.batch-child-list strong{white-space:nowrap;font-variant-numeric:tabular-nums}
.batch-panel-pages{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:var(--color-muted);margin-top:10px}
.batch-panel-pages>div{display:flex;align-items:center;gap:10px}
.batch-panel-pages button{width:34px;height:34px;border:1px solid var(--color-border);border-radius:7px;background:var(--color-surface);color:var(--color-primary)}
.batch-panel-pages button:disabled{opacity:.35;cursor:not-allowed}
.batch-panel-empty{font-size:12px;color:var(--color-muted);padding:20px 8px}
@media(max-width:640px){.batch-panel>summary{gap:8px}.batch-panel-counts{font-size:11px}#batch-panel-search{width:100%}.batch-panel-controls{align-items:stretch}.batch-panel-tabs{width:100%}.batch-panel-tabs button{flex:1;min-height:40px}.batch-child-details{flex-basis:100%}.batch-panel-pages{flex-wrap:wrap}}
#view-settings button.border-primary{border-color:var(--color-primary)!important;color:var(--color-primary)!important;background:var(--color-surface)}
#view-settings button.border-primary:hover{background:var(--color-income-soft)!important}
#view-settings :is(input[type="checkbox"],input[type="radio"]){accent-color:var(--color-primary)}
#view-settings .settings-hub-tile:focus-visible,
#view-settings .settings-hub-subitem:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}
#view-settings .ac-actions #ac-reset,
#view-settings #settings-hub-back{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}
#view-settings #reset-demo{color:var(--color-danger)!important;border-color:var(--color-danger)!important}
#view-settings button:disabled{opacity:.4;cursor:not-allowed}
/* Native file picker retains its filename, keyboard support and upload behavior. */
:is(#recon-file,#backup-import-file){
  min-height:58px;padding:7px!important;border-radius:12px!important;
  border:1px solid var(--color-border)!important;background:var(--color-surface)!important;
  color:var(--color-muted);font-size:13px;cursor:pointer;
  transition:border-color .18s,box-shadow .18s;
}
:is(#recon-file,#backup-import-file)::file-selector-button{
  margin-right:16px;padding:11px 22px;border:1px solid transparent;border-radius:8px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 88%,white),var(--color-primary));
  color:white;font:inherit;font-weight:600;letter-spacing:.01em;cursor:pointer;
  box-shadow:0 3px 8px color-mix(in srgb,var(--color-primary) 20%,transparent),inset 0 1px 0 #ffffff35;
  transition:filter .18s,box-shadow .18s;
}
:is(#recon-file,#backup-import-file):hover{border-color:var(--color-primary)!important}
:is(#recon-file,#backup-import-file):hover::file-selector-button{filter:brightness(1.06);box-shadow:0 4px 12px color-mix(in srgb,var(--color-primary) 26%,transparent)}
:is(#recon-file,#backup-import-file):focus-visible{outline:2px solid var(--color-primary)!important;outline-offset:3px}
@media(prefers-reduced-motion:reduce){:is(#recon-file,#backup-import-file),:is(#recon-file,#backup-import-file)::file-selector-button{transition:none}}