/* Finan+ — Copyright (C) 2026 Juscelino Be
 * SPDX-License-Identifier: GPL-3.0-or-later
 *
 * Visual do Finan+ web: o mesmo "Liquid Glass" e os mesmos temas do Finan+ web anterior
 * (Claro, Gruvbox, OLED Cinza, Gruvbox OLED, Tokyo Night, Nord), mais o layout para computador
 * (barra lateral, barra superior e colunas a partir de 900 px de largura).
 */

/* ------------------------------------------------------------------ tokens (tema claro) */
:root{--bg:#eef4ff;--surface:rgba(255,255,255,.72);--surface2:rgba(255,255,255,.55);--solid:#f7f9ff;--field:#fff;--fieldLine:#d9deea;--text:#182238;--muted:#6e788d;--accent:#4269d8;--onAccent:#fff;--accent2:#dfe8ff;--red:#c94e62;--green:#20825c;--warn:#c98a1c;--line:rgba(64,80,115,.12);--track:#dfe5ef;--shadow:0 14px 35px rgba(58,75,110,.12);--side:rgba(255,255,255,.5);--glow1:#d9e5ff;--glow2:#ffe7ed;--pill:#e1f6ec;--danger:#fde4e8;--radius:25px;color-scheme:light}
:root[data-theme=dark]{--bg:#0f1524;--surface:rgba(32,42,66,.8);--surface2:rgba(255,255,255,.06);--solid:#18213a;--field:#0f1524;--fieldLine:#2c3857;--text:#e8edf8;--muted:#9aa6bf;--accent:#7b9bff;--onAccent:#0f1524;--accent2:#27324f;--red:#ff8a9c;--green:#4fd1a0;--warn:#f0b65a;--line:rgba(160,180,230,.13);--track:#27324f;--shadow:0 14px 35px rgba(0,0,0,.3);--side:rgba(20,28,48,.7);--glow1:#1b2542;--glow2:#24203a;--pill:#173a30;--danger:#3a1f28;color-scheme:dark}
:root[data-theme=oledGray]{--bg:#181a1f;--surface:#23262d;--surface2:#292c33;--solid:#23262d;--field:#1c1e24;--fieldLine:#3a3e47;--text:#f1f3f6;--muted:#a8adb7;--accent:#8aa8ff;--onAccent:#14161a;--accent2:#30343d;--red:#ff8a91;--green:#63d6a5;--warn:#f0b65a;--line:#353941;--track:#30343d;--shadow:0 10px 28px rgba(0,0,0,.24);--side:#1d2025;--glow1:#181a1f;--glow2:#181a1f;--pill:#1d3b31;--danger:#3b2226;color-scheme:dark}
:root[data-theme=gruvbox]{--bg:#282828;--surface:#32302f;--surface2:#3c3836;--solid:#32302f;--field:#1d2021;--fieldLine:#504945;--text:#ebdbb2;--muted:#a89984;--accent:#83a598;--onAccent:#1d2021;--accent2:#3a4442;--red:#ff7f7f;--green:#b8bb26;--warn:#fabd2f;--line:#3c3836;--track:#504945;--shadow:0 10px 28px rgba(0,0,0,.3);--side:#1d2021;--glow1:#282828;--glow2:#282828;--pill:#3a3f26;--danger:#4e2f2b;color-scheme:dark}
:root[data-theme=gruvboxOled]{--bg:#000;--surface:#0d0d0c;--surface2:#1d2021;--solid:#0d0d0c;--field:#000;--fieldLine:#3c3836;--text:#ebdbb2;--muted:#a89984;--accent:#83a598;--onAccent:#000;--accent2:#17201f;--red:#ff7f7f;--green:#b8bb26;--warn:#fabd2f;--line:#1d2021;--track:#282828;--shadow:none;--side:#000;--glow1:#000;--glow2:#000;--pill:#1a1c0b;--danger:#3a1612;color-scheme:dark}
:root[data-theme=tokyo]{--bg:#1a1b26;--surface:rgba(36,40,59,.86);--surface2:rgba(255,255,255,.055);--solid:#1f2335;--field:#16161e;--fieldLine:#3b4261;--text:#c0caf5;--muted:#9aa5ce;--accent:#7aa2f7;--onAccent:#16161e;--accent2:#292e42;--red:#f7768e;--green:#9ece6a;--warn:#e0af68;--line:rgba(122,162,247,.14);--track:#292e42;--shadow:0 14px 35px rgba(0,0,0,.25);--side:rgba(22,22,30,.75);--glow1:#24283b;--glow2:#292e42;--pill:#243b35;--danger:#3b2230;color-scheme:dark}
:root[data-theme=nord]{--bg:#2e3440;--surface:rgba(59,66,82,.86);--surface2:rgba(255,255,255,.055);--solid:#3b4252;--field:#2e3440;--fieldLine:#4c566a;--text:#eceff4;--muted:#b7c0cf;--accent:#88c0d0;--onAccent:#2e3440;--accent2:#434c5e;--red:#bf616a;--green:#a3be8c;--warn:#ebcb8b;--line:rgba(216,222,233,.12);--track:#434c5e;--shadow:0 14px 35px rgba(20,24,31,.28);--side:rgba(46,52,64,.8);--glow1:#3b4252;--glow2:#354052;--pill:#34483e;--danger:#4a3036;color-scheme:dark}

/* ------------------------------------------------------------------ base */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;color:var(--text);background:radial-gradient(circle at 90% 5%,var(--glow1),transparent 30%),radial-gradient(circle at 0 28%,var(--glow2),transparent 28%),var(--bg);background-attachment:fixed;min-height:100vh;line-height:1.35}
:root[data-theme=oledGray] body,:root[data-theme=gruvbox] body,:root[data-theme=gruvboxOled] body{background:var(--bg)}
h1,h2,h3,h4{margin:0}
h1{font-size:29px;margin-top:3px}
small{color:var(--muted);font-weight:650;letter-spacing:.01em}
p{margin:.4em 0}
button{font:inherit;border:0;color:inherit;cursor:pointer;background:none}
button:disabled{opacity:.5;cursor:default}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 70%,transparent);outline-offset:2px}
.ic{fill:currentColor;flex:none;vertical-align:middle}
.ic.flip{transform:scaleX(-1)}
.ic.red{fill:var(--red)}
.muted{color:var(--muted)}.small{font-size:12.5px}.center{text-align:center}
.green{color:var(--green)!important}.red{color:var(--red)!important}.negative{color:var(--red)!important}
.srOnly{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:200;background:var(--accent);color:var(--onAccent);padding:10px 14px;border-radius:12px}
.skip:focus{left:8px}
.pre{white-space:pre-line}
kbd{font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;padding:4px 6px;border-radius:7px;background:var(--accent2);color:var(--muted);white-space:nowrap}
.eyebrow{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:750;color:var(--muted)}

.glass{background:var(--surface);border:1px solid color-mix(in srgb,#fff 55%,transparent);box-shadow:var(--shadow);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
:root:not([data-theme=light]) .glass{border-color:var(--line)}
:root[data-theme=oledGray] .glass,:root[data-theme=gruvbox] .glass,:root[data-theme=gruvboxOled] .glass{backdrop-filter:none;-webkit-backdrop-filter:none}

/* ------------------------------------------------------------------ estrutura (celular) */
.shell{min-height:100vh}
.app{width:min(100%,560px);margin:auto;padding:24px 18px 112px;outline:none}
.sidebar,.topbar{display:none}
.mobileHeader{display:flex;align-items:center;justify-content:space-between;margin:8px 2px 18px}
.headTools{display:flex;gap:8px}
.view{display:none}.view.activeView{display:block;animation:viewIn .22s ease}
@keyframes viewIn{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}
.pageTitle{margin:6px 2px 18px}.pageTitle h2{font-size:30px;margin:3px 0 5px}.pageTitle p{margin:0;color:var(--muted);font-size:14px}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 15px;border-radius:16px;font-weight:750;min-height:44px}
.btn.primary{background:var(--accent);color:var(--onAccent)}
.btn.soft{background:var(--accent2);margin:0} /* sem a margem da caixa .soft: botões lado a lado ficam da mesma altura */
.btn.danger,.dangerB{background:var(--danger)!important;color:var(--red)!important}
.btn.small{padding:8px 12px;min-height:36px;border-radius:13px;font-size:13px}
.btn.wide{width:100%}
.btn.pill{border-radius:99px;background:var(--accent2);padding:9px 14px;min-height:38px;font-size:13.5px}
.btn.pill.small{padding:7px 12px;min-height:32px;font-size:12.5px;font-weight:650}
.btn.link{background:none;color:var(--accent);padding:6px 4px;min-height:32px}
.btn.link.back{margin:-6px 0 4px -4px}
.icon,.btn.icon{width:44px;height:44px;min-height:0;padding:0;border-radius:50%;background:var(--surface);box-shadow:var(--shadow);display:inline-grid;place-items:center}
.btn.icon.small{width:38px;height:38px;box-shadow:none;background:var(--accent2)}
.btn.icon.tiny{width:32px;height:32px;box-shadow:none;background:var(--accent2)}
.dangerIc{color:var(--red)!important;background:color-mix(in srgb,var(--red) 12%,transparent)!important}
.statusPill{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:7px 10px;border-radius:99px;background:var(--pill);color:var(--green);font-weight:700}
.pillRow{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.pillRow .btn{flex:1}
.countPill{background:var(--accent2);color:var(--accent);min-width:34px;text-align:center;padding:7px 10px;border-radius:99px}

/* início */
.hero{padding:20px;border-radius:30px;container-type:inline-size}
.heroTop,.stats,.sectionHead{display:flex;justify-content:space-between;align-items:center;gap:10px}
.todayLabel{font-weight:750;font-size:15px}
.balanceGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 10px}
.balanceCard{padding:15px 14px;border-radius:21px;background:var(--surface2);min-width:0}
.balanceCard span,.balanceCard b{display:block}
.balanceCard span{font-size:12px;color:var(--muted);margin-bottom:6px}
.balanceCard span small{font-weight:600}
.balanceCard b{font-size:clamp(14px,5cqi,27px);line-height:1.15;overflow-wrap:anywhere}
@container (max-width:360px){.balanceGrid{grid-template-columns:1fr}.balanceCard b{font-size:24px}}
.balanceCard.future b{color:var(--accent)}
.stats div{flex:1;padding:13px;border-radius:19px;background:var(--surface2);min-width:0}
.stats span,.stats b{display:block}.stats span{font-size:12px;color:var(--muted);margin-bottom:5px;display:flex;align-items:center;gap:3px}
.stats b{overflow-wrap:anywhere}
.progress{height:8px;margin:18px 0 9px;background:var(--track);border-radius:10px;overflow:hidden}
.progress i{display:block;height:100%;width:0;background:var(--accent);border-radius:10px;transition:width .4s}
.progress i.over{background:var(--red)}
.monthProgressText{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
.savedPill{flex:0 0 auto;color:var(--accent);font-size:12px;padding:6px 9px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,transparent);white-space:nowrap}
.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0 22px}
.quick .btn{padding:13px 8px;border-radius:17px;background:var(--accent2)}
.section{margin:22px 0}
.sectionHead{margin-bottom:10px}.sectionHead h3{font-size:21px;margin:2px 0}
.compactBox{padding:15px;border-radius:23px}
.list{display:grid;gap:9px}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:26px 18px;border-radius:24px}
.empty span{color:var(--muted);font-size:14px}

/* vencimentos */
.dueList{display:grid;gap:4px;padding:8px}
.dueRow{display:flex;align-items:center;gap:11px;padding:10px;border-radius:16px;text-align:left;width:100%}
.dueRow:hover{background:var(--surface2)}
.dueIc{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--accent2);color:var(--accent);flex:none}
.dueIc.income{color:var(--green)}.dueIc.invoice{color:var(--accent)}
.dueRow.late .dueIc{background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red)}
.dueRow .meta{flex:1;min-width:0}.dueRow .meta b,.dueRow .meta small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dueRow .amount{font-weight:800;white-space:nowrap}

/* assistente */
.assistCard{padding:17px;border-radius:26px;margin:4px 0 8px}
.assistHead{display:flex;align-items:center;gap:6px;color:var(--accent)}
.assistCard h3{font-size:18px;margin:4px 0 6px}
.reportLines{margin:6px 0;padding-left:18px;font-size:14px}.reportLines li{margin:4px 0}
.why{margin:6px 0;font-size:13px}
.why summary{display:inline-flex;align-items:center;gap:4px;color:var(--accent);font-weight:700;cursor:pointer;list-style:none;padding:4px 0}
.why summary::-webkit-details-marker{display:none}
.why p{color:var(--muted);margin:4px 0 0;padding:10px 12px;border-radius:14px;background:var(--surface2)}
.tip{padding:13px 14px;border-radius:19px;background:color-mix(in srgb,var(--accent2) 70%,transparent);margin:10px 0}
.tip.dismissed{opacity:.75}
.tipHead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tipType{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}
.tip b{display:block;margin-top:2px}.tip p{font-size:14px;margin:4px 0}
.tipFoot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px}
.askForm{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}.askForm .searchField{flex:1 1 240px}
@media (max-width:899px){.askForm .btn{width:100%}}
.examples{display:flex;gap:6px;overflow-x:auto;padding:10px 1px 4px;scrollbar-width:thin}
.examples .btn{flex:none}
.answer{margin-top:12px;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--accent2) 60%,transparent);display:grid;gap:6px}
.answer small{line-height:1.4}.answer .btn{justify-self:start}
.catHint{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border-radius:16px;background:color-mix(in srgb,var(--accent) 10%,transparent);margin:-4px 0 6px;color:var(--accent)}
.catHint>div{flex:1;color:var(--text)}.catHint b,.catHint small{display:block}

/* contas, cartões, limites, metas */
.hscroll{display:flex;gap:10px;overflow:auto;padding:4px 1px 8px;scrollbar-width:none}.hscroll::-webkit-scrollbar{display:none}
.walletGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.walletCard{min-width:180px;padding:14px;border-radius:20px;background:var(--surface);border:1px solid var(--line);text-align:left;display:flex;flex-direction:column;gap:3px}
.walletCard small{display:flex;align-items:center;gap:5px}
.walletCard b{font-size:18px;margin-top:3px}
.walletCard .sub{font-size:11.5px;color:var(--muted)}
.cardActions{display:flex;gap:6px;align-items:center;margin-top:8px}
.budgetLine{display:block;width:100%;text-align:left;margin:4px 0;padding:8px 6px;border-radius:14px}
.budgetLine:hover{background:var(--surface2)}
.budgetLine>div:first-child{display:flex;justify-content:space-between;gap:8px;font-size:13px}
.budgetLine small{display:block;margin-top:4px;font-size:11.5px}
.budgetTrack{height:7px;background:color-mix(in srgb,var(--muted) 18%,transparent);border-radius:8px;overflow:hidden;margin-top:6px}
.budgetTrack i{display:block;height:100%;background:var(--accent);border-radius:8px}
.budgetLine.warn i{background:var(--warn)}.budgetLine.warn small{color:var(--warn)}
.budgetLine.over i{background:var(--red)}.budgetLine.over small{color:var(--red)}
.goal{display:block!important;text-align:left;width:100%}
.goalTop{display:flex;justify-content:space-between;gap:8px}.goalTop span{font-size:13px;color:var(--muted);white-space:nowrap}
.bar2{height:8px;background:var(--track);border-radius:9px;margin-top:8px;overflow:hidden}.bar2 i{display:block;height:100%;background:var(--accent)}
.goalInfo{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted);margin-top:6px}
.goalPlan{display:flex;align-items:center;gap:3px;flex-wrap:wrap;margin-top:4px;font-size:11.5px}

/* lançamentos */
.tx{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:20px;background:var(--surface);border:1px solid color-mix(in srgb,#fff 50%,transparent);cursor:pointer;text-align:left}
:root:not([data-theme=light]) .tx{border-color:var(--line)}
.tx:hover{border-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.badge{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--accent2);color:var(--accent);font-weight:800;flex:none}
.tx .meta{flex:1;min-width:0}
.tx .meta b,.tx .meta small{display:block;overflow:hidden;text-overflow:ellipsis}
.tx .meta b{white-space:nowrap}.tx .meta small{line-height:1.35;font-size:12px}
.tx .amount{font-weight:800;white-space:nowrap}
.tx.income .amount{color:var(--green)}.tx.expense .amount{color:var(--red)}
.tx.payment .amount{color:var(--muted)}
.tx.pending{opacity:.86}
.chk{width:34px;height:34px;border-radius:50%;border:2px solid var(--muted);color:transparent;display:grid;place-items:center;flex:none;padding:0}
.chk.on{background:var(--green);border-color:var(--green);color:#fff}
.chk.card{border-color:transparent;background:var(--accent2);color:var(--accent)}
.period{border-radius:26px;padding:15px;margin-bottom:10px}
.periodFields{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:9px;align-items:end}
.periodFields input{min-width:0;padding:12px 10px}
.periodFields .field{margin:0}.periodFields>span{padding-bottom:15px;color:var(--muted)}
.presetRow{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}
.presetRow button{flex:1;padding:9px 6px;border-radius:13px;background:var(--accent2);font-size:12.5px;font-weight:750;min-height:38px}
.presetRow button.selected{background:var(--accent);color:var(--onAccent)}
.filterPanel{padding:14px;border-radius:24px;margin:10px 0 12px}
.filterPanel>.eyebrow{margin:0 2px 9px}
.searchField{display:flex;align-items:center;gap:9px;padding:0 13px;border:1px solid var(--line);border-radius:17px;background:color-mix(in srgb,var(--field) 74%,transparent);min-height:48px;color:var(--muted)}
.searchField input{border:0;background:transparent;padding:11px 0;margin:0;min-width:0;flex:1;width:100%;color:var(--text)}
.searchField input:focus{outline:none}
.searchField:focus-within{border-color:var(--accent)}
.filterSelects{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.filterSelects select{margin:0;padding:11px 12px;border-radius:15px;background:color-mix(in srgb,var(--field) 72%,var(--accent2));border:1px solid var(--line);font-size:14px}
.compareCards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.compare{border-radius:22px;padding:15px;min-width:0}
.compare span,.compare b{display:block}.compare span{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:3px}
.compare b{font-size:19px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compare.balance{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center}
.compare.balance b{font-size:24px;margin:0}
.comparison{padding:17px;border-radius:var(--radius);margin:12px 0 18px}
.comparison>h3{margin:2px 0 10px;font-size:19px}
.compareHead{display:flex;align-items:center;justify-content:space-between}.compareHead h3{margin:2px 0 12px}
.compareHead>b{font-size:13px;color:var(--muted)}
.barRow{display:grid;grid-template-columns:68px 1fr 40px;align-items:center;gap:8px;margin:10px 0;font-size:12.5px}
.barRow>div{height:10px;background:var(--track);border-radius:10px;overflow:hidden}
.barRow i{display:block;height:100%;background:var(--green);border-radius:10px}
.expenseBar i{background:var(--red)}.barRow b{text-align:right}
.comparison>small{display:block;margin-top:12px;line-height:1.4}

/* relatórios */
.donutWrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:6px 0 10px}
.donut{width:150px;height:150px;flex:none}
.donutTrack{stroke:var(--track)}
.donutLabel{fill:var(--muted);font-size:10px;font-weight:600}
.donutValue{fill:var(--text);font-size:13px;font-weight:800}
.legend{list-style:none;margin:0;padding:0;flex:1;min-width:200px;display:grid;gap:5px;font-size:13px}
.legend li{display:grid;grid-template-columns:10px 1fr auto 46px;align-items:center;gap:8px}
.legend i{width:10px;height:10px;border-radius:3px}
.legend span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legend small{text-align:right}
.catBars{display:grid;gap:10px;margin-top:8px}
.catTop{display:flex;align-items:center;gap:9px}.catTop b{flex:1;font-size:14px}.catTop span{font-weight:800;font-size:14px}
.catTop .badge{width:30px;height:30px;border-radius:10px}.catTop .badge .ic{width:16px;height:16px}
.catBar small{display:flex;align-items:center;gap:3px;margin-top:4px;font-size:11.5px}
.evo{display:flex;gap:8px;align-items:flex-end;height:140px;margin-top:10px}
.evoCol{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);height:100%}
.evoCol .pair{flex:1;display:flex;gap:3px;align-items:flex-end;width:100%;justify-content:center}
.evoCol .pair i{width:min(16px,40%);border-radius:5px 5px 0 0;min-height:2px}
.evoCol i.inc,.dot.inc{background:var(--green)}.evoCol i.exp,.dot.exp{background:var(--red)}
.evo.sensitive .pair{filter:blur(6px)}
.legendLine{display:flex;align-items:center;gap:6px;margin-top:10px}
.dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin:0 2px 0 8px}.dot:first-child{margin-left:0}
.reportStat{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.reportStat>div{padding:12px;border-radius:15px;background:var(--accent2);min-width:0}
.reportStat small,.reportStat b{display:block}.reportStat b{margin:5px 0;font-size:18px}
.chg{display:flex!important;align-items:center;gap:2px}
.exportCard{display:flex;flex-direction:column;gap:10px}
.exportCard h3{display:flex;align-items:center;gap:6px;font-size:18px}

/* ajustes */
.fold{border-radius:var(--radius);margin:12px 0;overflow:hidden}
.foldHead{display:flex;align-items:center;gap:12px;width:100%;padding:15px 16px;text-align:left}
.foldIc{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:var(--accent2);color:var(--accent);flex:none}
.foldTxt{flex:1;min-width:0}.foldTxt b{display:block;font-size:17px}.foldTxt small{display:block;font-weight:600}
.foldBtn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--accent2);flex:none;transition:transform .2s}
.fold.open .foldBtn{background:var(--accent);color:var(--onAccent)}
.foldBody{padding:0 16px 16px;animation:viewIn .2s ease}
.foldTools{display:flex;justify-content:flex-end;margin-bottom:6px}
.themeChoices{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.themeChoice{padding:12px;border-radius:17px;background:var(--accent2);text-align:left;font-weight:700;display:grid;gap:7px}
.themeChoice span:first-child{display:flex;align-items:center;justify-content:space-between}
.themeChoice.active{outline:2px solid var(--accent)}
.swatches{display:flex;gap:4px}.swatches i{width:22px;height:9px;border-radius:9px}
.t-auto i:nth-child(1){background:#eef4ff}.t-auto i:nth-child(2){background:#4269d8}.t-auto i:nth-child(3){background:#0f1524}.t-auto i:nth-child(4){background:#7b9bff}
.t-light i:nth-child(1){background:#eef4ff}.t-light i:nth-child(2){background:#4269d8}.t-light i:nth-child(3){background:#20825c}.t-light i:nth-child(4){background:#c94e62}
.t-gruvbox i:nth-child(1){background:#282828}.t-gruvbox i:nth-child(2){background:#83a598}.t-gruvbox i:nth-child(3){background:#b8bb26}.t-gruvbox i:nth-child(4){background:#fb4934}
.t-gruvboxOled i:nth-child(1){background:#000;outline:1px solid #3c3836}.t-gruvboxOled i:nth-child(2){background:#83a598}.t-gruvboxOled i:nth-child(3){background:#b8bb26}.t-gruvboxOled i:nth-child(4){background:#fb4934}
.t-oledGray i:nth-child(1){background:#181a1f}.t-oledGray i:nth-child(2){background:#8aa8ff}.t-oledGray i:nth-child(3){background:#63d6a5}.t-oledGray i:nth-child(4){background:#ff8a91}
.t-tokyo i:nth-child(1){background:#1a1b26}.t-tokyo i:nth-child(2){background:#7aa2f7}.t-tokyo i:nth-child(3){background:#9ece6a}.t-tokyo i:nth-child(4){background:#f7768e}
.t-nord i:nth-child(1){background:#2e3440}.t-nord i:nth-child(2){background:#88c0d0}.t-nord i:nth-child(3){background:#a3be8c}.t-nord i:nth-child(4){background:#bf616a}
.manageList{display:grid;gap:8px;margin:10px 0}
.manageItem{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;border-radius:16px;background:color-mix(in srgb,var(--surface) 80%,var(--accent2))}
.manageItem>div:first-child{min-width:0}.manageItem b,.manageItem small{display:block}.manageItem small{font-size:11.5px;overflow-wrap:anywhere}
.manageActions{display:flex;gap:6px;flex:none}
.btnGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.btnGrid .btn{background:var(--accent2)}
.btnCol{display:grid;gap:8px;margin-top:14px}
.switchRow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 2px;cursor:pointer}
.switchRow span b,.switchRow span small{display:block}.switchRow span small{font-weight:600;font-size:12px}
.switchRow input{appearance:none;-webkit-appearance:none;width:48px;height:28px;border-radius:99px;background:var(--track);position:relative;flex:none;margin:0;cursor:pointer;transition:background .2s;border:0;padding:0}
.switchRow input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:transform .2s}
.switchRow input:checked{background:var(--accent)}.switchRow input:checked::after{transform:translateX(20px)}
.switchRow input:disabled{opacity:.5}
.infoBox{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:16px;background:var(--surface2);font-size:13px;color:var(--muted);margin:10px 0}
.infoBox .ic{color:var(--accent);margin-top:1px}.infoBox p{margin:0}
.warnBox .ic{color:var(--warn)}
.subhead{font-size:15px;margin:16px 0 6px}
.soft{padding:12px 14px;border-radius:16px;background:var(--accent2);margin:10px 0}
.soft .big{display:block;font-size:22px;margin-top:2px}
.learned summary,.license summary,.dismissedBox summary{cursor:pointer;color:var(--accent);font-weight:700;padding:8px 0;list-style:none;display:flex;align-items:center;gap:4px}
.learned summary::-webkit-details-marker,.license summary::-webkit-details-marker,.dismissedBox summary::-webkit-details-marker{display:none}
details[open]>summary>.ic{transform:rotate(180deg)}
summary .ic{transition:transform .2s}
.licenseText{max-height:320px;overflow:auto;white-space:pre-wrap;font-size:11.5px;padding:12px;border-radius:14px;background:var(--surface2);border:1px solid var(--line)}
.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.filters input,.filters select{margin:0;padding:12px;border:1px solid var(--fieldLine);border-radius:15px;background:var(--field)}
.filters input{grid-column:1/-1}.filters .btn{grid-column:1/-1}

/* campos e formulários */
.field{display:block;font-size:13px;font-weight:700;margin:12px 0}
.field>span{display:block;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1px solid var(--fieldLine);border-radius:16px;background:var(--field);min-height:48px}
.field input:focus,.field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.hint{display:block;margin-top:4px;font-weight:600}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
.seg{display:grid;grid-template-columns:1fr 1fr;background:color-mix(in srgb,var(--accent2) 80%,transparent);padding:4px;border-radius:17px;margin:6px 0 4px}
.seg button{padding:11px;border-radius:14px;min-height:44px}
.seg .selected{background:var(--field);box-shadow:0 4px 12px rgba(40,55,85,.1);font-weight:800}
.sheetActions{display:flex;gap:10px;margin-top:16px;align-items:stretch}
/* margin 0: a classe genérica .soft (caixas de texto) dá margem vertical e deixava o botão "soft" mais baixo que o principal */
.sheetActions .btn{flex:1 1 0;min-width:0;margin:0;padding:15px;border-radius:18px}

/* folha (celular: de baixo; computador: janela central) e diálogos */
dialog{color:var(--text)}
.sheet{border:0;padding:0;border-radius:30px 30px 0 0;width:min(100%,560px);max-width:100%;max-height:92vh;margin:auto auto 0;background:var(--solid);box-shadow:0 -10px 40px rgba(0,0,0,.2)}
.sheet[open]{animation:sheetUp .26s cubic-bezier(.2,.8,.2,1)}
@keyframes sheetUp{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
.sheet::backdrop,.appDialog::backdrop{background:rgba(10,15,28,.48);backdrop-filter:blur(3px)}
.sheetInner{padding:12px 20px calc(24px + env(safe-area-inset-bottom))}
.handle{width:42px;height:5px;border-radius:9px;background:color-mix(in srgb,var(--muted) 45%,transparent);margin:0 auto 14px}
.dialogHead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:6px}
.dialogHead h3{font-size:23px;margin:0 0 3px}
.dlgMsg{margin:0;color:var(--muted);font-size:14px;white-space:pre-line;line-height:1.45}
.closeX{flex:none;box-shadow:none!important;background:var(--accent2)!important;width:40px!important;height:40px!important}
.appDialog{width:min(calc(100% - 32px),460px);border:1px solid var(--line);border-radius:28px;padding:0;background:var(--solid);box-shadow:0 24px 70px rgba(0,0,0,.28)}
.appDialog form{padding:20px}
.appDialogActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;align-items:stretch}
/* os dois botões (Cancelar e a ação, inclusive a de excluir) sempre com a mesma altura e largura */
.appDialogActions .btn{width:100%;height:100%;min-height:48px;margin:0;padding:12px 14px;line-height:1.2;text-align:center}
.appDialog.notice .appDialogActions{grid-template-columns:1fr}
.appDialog .field input{font-size:18px}
.shortcuts{display:grid;gap:4px}
.sc{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:14px}

/* avisos rápidos */
.toasts{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);z-index:120;display:grid;gap:8px;pointer-events:none;width:min(92vw,420px)}
.toast{background:color-mix(in srgb,var(--text) 92%,transparent);color:var(--bg);padding:12px 16px;border-radius:16px;font-weight:650;font-size:14px;text-align:center;opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s;box-shadow:var(--shadow)}
.toast.show{opacity:1;transform:none}

/* bloqueio e tela de problema */
.lock{position:fixed;inset:0;z-index:100;background:radial-gradient(circle at 90% 5%,var(--glow1),transparent 35%),var(--bg);display:grid;place-items:center;padding:20px;overflow:auto}
.lockBox{width:min(100%,340px);text-align:center;padding:26px 22px;border-radius:30px;display:grid;justify-items:center;gap:6px}
.lockBox.wideBox{width:min(100%,480px)}
.lockBox img{border-radius:18px}
.lockBox form{width:100%;display:grid;gap:12px;justify-items:center}
#pinIn{width:100%;text-align:center;font-size:24px;letter-spacing:.4em;padding:12px;border-radius:16px;border:1px solid var(--fieldLine);background:var(--field);position:absolute;opacity:0;pointer-events:none;height:1px}
.pinDots{display:flex;gap:10px;justify-content:center;min-height:16px;margin:4px 0}
.pinDots i{width:13px;height:13px;border-radius:50%;border:2px solid var(--muted);display:none}
.pinDots i:nth-child(-n+4),.pinDots i.on{display:block}
.pinDots i.on{background:var(--accent);border-color:var(--accent)}
.keypad{display:grid;grid-template-columns:repeat(3,72px);gap:12px}
.keypad button{height:62px;border-radius:22px;background:var(--surface2);font-size:24px;font-weight:700;display:grid;place-items:center;border:1px solid var(--line)}
.keypad .ok{background:var(--accent);color:var(--onAccent)}
.pinErr{min-height:18px;color:var(--red)}
.shake{animation:shake .35s}
@keyframes shake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.fatal,.noscript{position:fixed;inset:auto 16px 16px;z-index:300;padding:16px;border-radius:18px;background:var(--danger);color:var(--red);font-weight:700}

/* navegação inferior (celular) */
.bottomNav{position:fixed;z-index:5;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(calc(100% - 24px),536px);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;padding:8px;border-radius:28px;background:color-mix(in srgb,var(--solid) 92%,transparent);box-shadow:0 16px 40px rgba(40,55,85,.22);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--line)}
.bottomNav button{font-size:10px;white-space:nowrap;color:var(--muted);display:grid;place-items:center;gap:2px;min-height:56px;border-radius:20px;isolation:isolate}
.bottomNav button[data-view]::before{content:"";position:absolute;inset:4px 6px;border-radius:17px;background:color-mix(in srgb,var(--accent) 15%,transparent);border:1px solid color-mix(in srgb,var(--accent) 16%,transparent);opacity:0;transform:scale(.72);transition:opacity .22s,transform .22s cubic-bezier(.2,.85,.25,1.2);z-index:-1}
.bottomNav button.active{color:var(--accent);font-weight:800}
.bottomNav button.active::before{opacity:1;transform:scale(1)}
.bottomNav .fab{width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--onAccent);box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 40%,transparent);min-height:0;justify-self:center}
.fab:active{transform:scale(.94)!important}

/* "Liquid Glass": brilho no toque */
:where(button,.tx,.chk){-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .2s cubic-bezier(.2,.8,.2,1),background-color .2s,color .2s,box-shadow .2s,opacity .2s,border-color .2s;position:relative;overflow:hidden}
:where(button,.tx,.chk)::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--tap-x,50%) var(--tap-y,50%),rgba(255,255,255,.42) 0,rgba(255,255,255,.18) 18%,transparent 52%);opacity:0;transform:scale(.72);transition:opacity .34s,transform .34s}
:where(button,.tx,.chk).tapFx::after{opacity:1;transform:scale(1.25)}
:where(button,.tx,.chk):active{transform:scale(.97)}
.menuWrap,.menu{overflow:visible}

@media (max-width:380px){
  .app{padding-left:12px;padding-right:12px}
  .quick{grid-template-columns:1fr 1fr}.quick .btn:last-child{grid-column:1/-1}
  .periodFields{grid-template-columns:1fr}.periodFields>span{display:none}
  .filterSelects,.row2{grid-template-columns:1fr}
  .monthProgressText{flex-direction:column;align-items:flex-start;gap:6px}
  .keypad{grid-template-columns:repeat(3,64px)}
}

/* ------------------------------------------------------------------ computador e notebook (≥ 900 px) */
@media (min-width:900px){
  .shell{display:grid;grid-template-columns:252px minmax(0,1fr);align-items:start}
  .sidebar{display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh;padding:22px 14px 16px;border-right:1px solid var(--line);background:var(--side);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);overflow-y:auto}
  .brand{display:flex;align-items:center;gap:11px;padding:0 8px}
  .brand img{border-radius:12px}.brand b{display:block;font-size:20px}.brand small{font-size:11.5px}
  .sideNav{display:grid;gap:4px}
  .sideNav button{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:15px;text-align:left;color:var(--muted);font-weight:650}
  .sideNav button span{flex:1}
  .sideNav button kbd{opacity:0;transition:opacity .2s}
  .sideNav button:hover{background:var(--surface2);color:var(--text)}.sideNav button:hover kbd{opacity:1}
  .sideNav button.active{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-weight:800}
  .sideFoot{margin-top:auto;display:grid;gap:10px}
  .sideBal{padding:14px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
  .sideBal small,.sideBal b{display:block}.sideBal b{font-size:19px;margin:2px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sideBal b.future{color:var(--accent);margin-bottom:0}
  .sideTools{display:flex;gap:8px;justify-content:center}
  .sideNote{display:flex;align-items:center;justify-content:center;gap:4px;font-size:11px}

  .app{width:auto;max-width:1480px;margin:0;padding:0 32px 48px}
  .topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;top:0;z-index:6;margin:0 -32px 18px;padding:16px 32px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
  .topTitle{display:flex;align-items:center;gap:18px;min-width:0}.topTitle h1{font-size:25px}
  .todayChip{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:99px;background:var(--surface);border:1px solid var(--line);font-weight:700;font-size:13.5px;white-space:nowrap}
  .topActions{display:flex;align-items:center;gap:8px}
  .topActions .btn.icon{box-shadow:none;border:1px solid var(--line)}
  .menuWrap{position:relative}
  .menu{position:absolute;right:0;top:52px;width:270px;padding:8px;border-radius:20px;display:grid;gap:2px;z-index:10;background:var(--solid)}
  .menu button{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:13px;text-align:left}
  .menu button span{flex:1}.menu button:hover,.menu button:focus-visible{background:var(--accent2)}
  .mobileHeader,.bottomNav{display:none!important}
  .view .pageTitle{margin-top:0}
  .view .pageTitle .eyebrow,.view .pageTitle h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .view .pageTitle p{font-size:14.5px}
  body[data-view=home] .topTitle .eyebrow{display:block}

  .cols{display:grid;gap:22px;align-items:start}
  .cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .col>:first-child{margin-top:0}
  .col>.section:first-child{margin-top:0}
  .hero{padding:22px}
  .quick{margin-bottom:6px}
  .section{margin:22px 0}
  .walletCard{min-width:0}
  .hscroll{flex-wrap:wrap}

  .movesGrid{display:grid;grid-template-columns:minmax(300px,370px) minmax(0,1fr);gap:24px;align-items:start}
  .movesAside{position:sticky;top:92px;max-height:calc(100vh - 110px);overflow:auto;padding:2px 4px 10px 2px;scrollbar-width:thin}
  .movesAside .period{margin-top:0}
  .listSection{margin-top:0}
  .tx{padding:11px 14px}

  .comparison{margin-top:0}
  .cols .comparison+.comparison{margin-top:18px}
  .fold{margin:0 0 14px}

  .sheet,.sheet[open]{margin:auto;border-radius:28px;width:min(calc(100% - 48px),560px);max-height:88vh;box-shadow:0 30px 80px rgba(0,0,0,.3);animation:pop .2s ease}
  .sheet.wide{width:min(calc(100% - 48px),760px)}
  .sheet .handle{display:none}
  .sheetInner{padding:22px 26px 24px}
  .sheet.wide .shortcuts{grid-template-columns:1fr 1fr;column-gap:28px}
  @keyframes pop{from{transform:scale(.97);opacity:.5}to{transform:none;opacity:1}}
  .toasts{bottom:28px;left:calc(50% + 126px)}
  .tx:focus-visible,.walletCard:focus-visible{outline-offset:1px}
}
@media (min-width:1360px){
  .app{padding:0 40px 56px}
  .topbar{margin:0 -40px 22px;padding:18px 40px}
}

/* ------------------------------------------------------------------ 1.3.0: Início e Lista enxutos, calendário */
.accent{color:var(--accent)!important}
.mobileHeader h1{font-size:30px;margin:0;line-height:1.1}
.headDate{display:block;color:var(--muted);font-size:14px;margin-top:3px}
.headTools{align-items:center}
.hero>.balanceGrid:first-child{margin-top:0}
.statSub{display:block;font-size:11.5px;color:var(--muted);margin-top:3px;font-weight:500}
.statSub b{display:inline!important;font-size:inherit!important;font-weight:800}
.moreLink{display:inline-flex;align-items:center;gap:2px;margin-top:6px;padding:8px 2px;font-weight:800;color:var(--accent)}
.assistAskTxt{margin:6px 0}
.walletRow{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:22px;text-align:left}
.walletRow .meta{flex:1;min-width:0}.walletRow .meta b,.walletRow .meta small{display:block}.walletRow .meta small{color:var(--muted);font-size:12px}
.walletRow .amount{font-size:17px;font-weight:800;white-space:nowrap}
.startBox{padding:6px}
.startRow{display:flex;align-items:center;gap:12px;width:100%;padding:10px;border-radius:18px;text-align:left;color:var(--muted)}
.startRow:hover{background:var(--surface2)}
.startRow .meta{flex:1;min-width:0;color:var(--text)}.startRow .meta b,.startRow .meta small{display:block}.startRow .meta small{color:var(--muted);font-size:12.5px}
.startRow+.startRow{border-top:1px solid var(--line)}

/* chave Lista | Calendário */
.viewSwitch{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:24px;margin:0 0 12px}
.viewSwitch button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;border-radius:20px;font-weight:750;color:var(--muted)}
.viewSwitch button.selected{background:var(--accent);color:var(--onAccent)}

/* Lista: ‹ mês ›, filtros de um toque, resumo, dias */
.periodBar{display:flex;align-items:center;gap:2px;margin:2px 0 8px}
.periodLabel{flex:1;text-align:center;font-size:18px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.roundBtn{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none;padding:0;color:var(--accent);position:relative}
.roundBtn::before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--accent2);z-index:-1}
.roundBtn{isolation:isolate}
.roundBtn.on{color:var(--onAccent)}.roundBtn.on::before{background:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 2px}
.chip{padding:9px 14px;min-height:40px;border-radius:99px;background:var(--accent2);font-weight:700;font-size:13.5px}
.chip.on{background:var(--accent);color:var(--onAccent)}
.periodSummary{padding:14px 16px;border-radius:24px;margin:10px 0 4px}
.sumGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sumGrid>div>small:first-child{display:block;font-size:12px;color:var(--muted)}
.sumGrid>div>b{display:block;font-size:16px;margin-top:2px;overflow-wrap:anywhere}
.sumNote{display:block;margin-top:10px;font-size:12.5px}
.sumGrid .statSub b{display:block!important;margin-top:1px}
.dayHead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:16px 4px 2px;font-size:14.5px}
.dayHead b{font-size:14px;white-space:nowrap}
.listSection .list{gap:8px}

/* calendário */
.calCard{padding:10px;border-radius:26px}
.calHead{display:flex;align-items:center;margin-bottom:4px}
.calTitle{flex:1;text-align:center}.calTitle h3{margin:0;font-size:17px}
.calTitle .btn.link{margin:2px auto 0;padding:4px 10px;min-height:0;color:var(--accent);font-weight:800}
.calWeek,.calGrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.calWeek span{text-align:center;font-size:10.5px;font-weight:700;color:var(--muted);padding:4px 0}
.calDay{position:relative;min-height:54px;border-radius:14px;padding:6px 1px 5px;display:flex;flex-direction:column;align-items:center;gap:1px;container-type:inline-size;color:var(--text)}
.calDay .n{font-size:14px;font-weight:650}
.calDay.past .n{color:var(--muted);font-weight:450}
.calDay .v{font-size:clamp(7px,21cqi,11px);font-weight:800;letter-spacing:-.02em;white-space:nowrap;max-width:100%;overflow:hidden}
.calDay .dots{display:flex;gap:3px;margin-top:2px}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%}
.dot.income{background:var(--green)}.dot.expense{background:var(--red)}.dot.card{background:#7446d0}
:root:not([data-theme=light]) .dot.card{background:#c3a6ff}
.calDay.today{box-shadow:inset 0 0 0 1.5px var(--accent)}.calDay.today .n{color:var(--accent);font-weight:850}
.calDay.sel{background:var(--accent)}.calDay.sel .n,.calDay.sel .v{color:var(--onAccent)!important;font-weight:850}
.calDay.sel .dot{box-shadow:0 0 0 1.5px var(--onAccent)}
.calDay .warn{position:absolute;top:2px;right:3px;color:var(--red);line-height:0}
.calDay.sel .warn{color:var(--onAccent)}
.calDay:hover:not(.sel){background:var(--surface2)}
.calLegend{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px;margin-top:8px;font-size:11.5px;color:var(--muted)}
.calLegend span{display:inline-flex;align-items:center;gap:4px}
.calTotals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.calTotals>div{padding:12px;border-radius:20px;min-width:0}
.calTotals small{display:block;font-size:12px;color:var(--muted)}.calTotals b{display:block;font-size:15px;margin-top:2px;overflow-wrap:anywhere}
.calNote{margin:6px 4px 0}
.calDayBox{margin-top:18px}
.calDayBox .sectionHead small{display:block;margin-top:2px}
.dayBtns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.dayBtns .btn{border-radius:16px;min-height:46px}
.forecastRow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;border-radius:20px;margin-bottom:8px}
.forecastRow span{color:var(--muted)}.forecastRow b{font-size:17px;white-space:nowrap}
.invoiceRow{width:100%}
.cardBadge{color:#7446d0}
:root:not([data-theme=light]) .cardBadge{color:#c3a6ff}
@media (min-width:900px){
  .calLayout{display:grid;grid-template-columns:minmax(360px,1fr) minmax(320px,1fr);gap:24px;align-items:start}
  .calLayout .calDayBox{margin-top:0}
  .viewSwitch{max-width:420px}
}

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

/* impressão: só o conteúdo */
@media print{.sidebar,.topbar,.bottomNav,.mobileHeader,.toasts{display:none!important}.shell{display:block}.app{padding:0;max-width:none}.glass{box-shadow:none;backdrop-filter:none}}

/* Sobre › Código-fonte e outras versões: links externos (abrem em nova aba) */
.linkList{display:grid;gap:8px;margin:10px 0}
.extLink{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--accent2);color:var(--text);text-decoration:none;min-height:56px}
.extLink>svg:first-child{color:var(--accent);flex:none}
.extLink>svg:last-child{color:var(--muted);flex:none;margin-left:auto}
.extLink span{display:flex;flex-direction:column;min-width:0}
.extLink b{font-weight:700;font-size:14px}
.extLink small{color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.extLink:hover{filter:brightness(1.04)}
.extLink:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* modo remoto (aberto pelo celular): tela de conexão */
.pairBox .btn{width:100%;justify-content:center}
.pairBox form{width:100%}
.pairCode{width:100%;font-size:28px;font-weight:800;letter-spacing:.3em;text-align:center;padding:12px;border-radius:16px;border:1px solid var(--fieldLine,var(--line));background:var(--field,var(--surface));color:var(--text)}
.pairSpinner{width:34px;height:34px;margin:4px auto 6px;border-radius:50%;border:3px solid var(--track);border-top-color:var(--accent);animation:pairSpin 1s linear infinite}
@keyframes pairSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.pairSpinner{animation:none}}

/* Relatórios renovados e simulador "E se…?" (1.3.0). Só usa as cores do tema (variáveis acima). */
.reportsHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.reportsHead h2{margin:0}
.reportsHead .btn.pill{color:var(--accent);font-weight:750}
.reportsNote{margin:0 2px 10px}
.reportsEmpty>b{display:block;font-size:16px}.reportsEmpty p{margin:4px 0 10px}
.reportsEmpty .btn.link{margin:6px 0 0 -4px;font-weight:750}
.reportSum{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.reportSum>div{padding:13px 14px;border-radius:22px;min-width:0}
.reportSum small{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:12px}
.reportSum b{display:block;font-size:18px;margin-top:3px}.reportSum .chg{display:block;margin-top:2px;font-size:11.5px}
.whatIf{display:flex;align-items:center;gap:12px;width:100%;margin:0 0 12px;padding:14px 16px;border:0;border-radius:22px;background:var(--accent);color:var(--onAccent);text-align:left;font:inherit;cursor:pointer}
.whatIf svg{fill:currentColor;flex:none}.whatIf span{flex:1;min-width:0}.whatIf b{display:block;font-size:16px;font-weight:850}.whatIf small{display:block;font-size:12.5px;line-height:1.3;margin-top:1px}
.whatIf:focus-visible{outline:3px solid var(--text);outline-offset:2px}
.simWrap>.muted{margin:0 0 2px}
.simBack{margin:-6px 0 2px -4px;font-weight:750}
.simSafe{display:inline-flex;align-items:center;gap:6px;margin:6px 0 4px;padding:7px 12px;border-radius:99px;background:var(--pill);color:var(--green);font-size:12.5px;font-weight:650}
.simSafe svg{fill:currentColor}
.simBox{margin-top:12px;padding:14px;border-radius:20px;background:var(--accent2)}
.simBox:empty{display:none}
.simBase{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0 4px}
.simBase small{display:block;color:var(--muted);font-size:12px}.simBase b{font-size:17px}
.simAdjust{margin:4px 0 4px -4px;font-weight:750}
.simH{margin:16px 2px 6px;font-size:16px}
.simScen{display:flex;align-items:center;gap:12px;width:100%;margin:0 0 8px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--text);text-align:left;font:inherit;cursor:pointer}
.simScen>svg{fill:var(--muted);flex:none}
.simIco{width:42px;height:42px;flex:none;border-radius:14px;background:var(--accent2);display:flex;align-items:center;justify-content:center}.simIco svg{fill:var(--accent)}
.simTxt{flex:1;min-width:0}.simTxt b{display:block;font-size:15px}.simTxt small{color:var(--muted);font-size:12.5px}
.simForm{margin-top:10px}
.simBig{font-size:30px;font-weight:850;letter-spacing:-.02em;line-height:1.15;margin-top:2px}
.simSentence{margin:0 0 6px}
.simLine{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:4px 0}.simLine span{color:var(--muted)}.simLine b{text-align:right}
.simWhy{color:var(--muted);font-size:11.5px;line-height:1.4;margin:8px 0 0}
.simChart{display:flex;align-items:flex-end;gap:3px;height:80px;margin:8px 0 6px}
.simChart i{flex:1;border-radius:5px 5px 2px 2px;background:color-mix(in srgb,var(--accent) 45%,transparent)}.simChart i.done{background:var(--green)}
.simChart.sensitive{filter:blur(6px)}
.simDebt{display:flex;align-items:center;gap:10px;width:100%;margin:0 0 6px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);text-align:left;font:inherit;cursor:pointer}
.simDebt span{flex:1;min-width:0}.simDebt small{display:block;color:var(--muted);font-size:12.5px}
.simDebt.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 15%,var(--surface))}
#simGoal .btn{margin-top:12px;width:100%}
.whatIf small,.whatIf b{color:inherit}
.simBack{display:flex;width:max-content}

/* Início — visual do conceito de outubro/2026 (só aparência; mesmos dados e ações) */
.hero .tile,.flowCard .tile,.reportTile .tile{display:grid;place-items:center;flex:none;border-radius:13px;background:var(--accent2);color:var(--accent)}
.balanceMain{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;font-weight:600}
.balanceMain .tile{width:44px;height:44px;border-radius:14px}
.heroTop+.balanceMain{margin-top:16px}
.balanceBig{display:block;margin:10px 0 12px;font-size:clamp(26px,10cqi,36px);font-weight:800;letter-spacing:-.5px;line-height:1.1;overflow-wrap:anywhere}
.forecastBox{display:flex;align-items:center;gap:12px;padding:12px;border-radius:20px;background:var(--surface2)}
.forecastBox .tile{width:40px;height:40px}
.forecastBox .meta{flex:1;min-width:0}.forecastBox small{display:block;font-size:12px;color:var(--muted)}
.forecastBox b{display:block;font-size:clamp(18px,7cqi,23px);font-weight:800;color:var(--accent);overflow-wrap:anywhere}
.flowGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.flowCard{display:flex;flex-direction:column;padding:14px;border-radius:22px;border:1px solid color-mix(in srgb,#fff 55%,transparent);box-shadow:var(--shadow);min-width:0}
:root:not([data-theme=light]) .flowCard{border-color:var(--line)}
.flowCard.in{background:color-mix(in srgb,var(--green) 7%,var(--solid))}
.flowCard.out{background:color-mix(in srgb,var(--red) 7%,var(--solid))}
.flowCard .tile{width:36px;height:36px;border-radius:12px;margin:0}
.flowCard{text-align:left;width:100%}
.flowTop{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.flowGo{display:grid;color:var(--muted)}
.flowCard:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* ondas ao lado do saldo (decoração) */
.balanceWrap{position:relative}
.balanceWrap>:not(.balanceWaves){position:relative}
.balanceWaves{position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:min(190px,52%);height:96px;color:var(--accent);pointer-events:none}
.hero{overflow:hidden}
/* saldo previsto: comparação com o mês anterior e a conta que leva a ele */
.compareChip{display:inline-block;margin-top:6px;padding:4px 9px;border-radius:99px;font-size:12px;font-weight:700;color:var(--muted);background:color-mix(in srgb,var(--muted) 12%,transparent);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compareChip.up{color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent)}
.compareChip.down{color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent)}
.forecastExplain{display:block;margin:8px 4px 0;font-size:12px;color:var(--muted)}
.flowCard.in .tile{background:color-mix(in srgb,var(--green) 15%,transparent);color:var(--green)}
.flowCard.out .tile{background:color-mix(in srgb,var(--red) 15%,transparent);color:var(--red)}
.flowLabel{font-size:12px;font-weight:600;color:var(--muted)}
.flowCard>b{font-size:19px;font-weight:800;overflow-wrap:anywhere}
.flowCard.in>b,.flowCard.in .statSub b{color:var(--green)}
.flowCard.out>b,.flowCard.out .statSub b{color:var(--red)}
.flowFill{flex:1}
.flowBar{height:6px;margin-top:10px;border-radius:3px;overflow:hidden}
.flowBar i{display:block;height:100%;border-radius:3px;min-width:3px}
.flowCard.in .flowBar{background:color-mix(in srgb,var(--green) 15%,transparent)}.flowCard.in .flowBar i{background:var(--green)}
.flowCard.out .flowBar{background:color-mix(in srgb,var(--red) 15%,transparent)}.flowCard.out .flowBar i{background:var(--red)}
.flowBar.sensitive{filter:blur(4px)}
.flowPct{display:block;margin-top:5px;font-size:11.5px;color:var(--muted)}
.assistHead{gap:8px}
.assistCard h3.assistTitle{margin:0;font-size:17px;font-weight:800;color:var(--text)}
.reportTiles{display:flex;flex-direction:column;gap:8px;margin:12px 0 6px}
.reportTile{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border-radius:18px;background:var(--surface2);text-align:left;color:var(--muted)}
.reportTile:hover{background:color-mix(in srgb,var(--accent) 8%,var(--surface2))}
.reportTile .tile{width:36px;height:36px;border-radius:12px}
.reportTile .txt{flex:1;min-width:0;font-size:14px;line-height:1.4;color:var(--text)}
.startGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.startCard{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px;border-radius:20px;text-align:left;min-width:0}
.startCard .badge{width:40px;height:40px;border-radius:13px}
.startCard b{font-size:14.5px}.startCard small{font-size:12.5px;line-height:1.35;color:var(--muted)}

/* ---- Ler fatura ou boleto (FATURAS.md) */
.billShortcut{margin:2px 0 6px}.billShortcut .btn{width:100%}
.sheetActions.single{justify-content:stretch}.sheetActions.single .btn{flex:1}
.infoBox.warn .ic{color:var(--warn)}
.billFrom{margin:-2px 4px 6px;font-weight:500;color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.billPrivacy{display:flex;gap:8px;align-items:flex-start;color:var(--muted);font-weight:500;margin-top:14px}.billPrivacy .ic{color:var(--accent);flex:none}
.billBusy{display:flex;align-items:center;justify-content:center;gap:10px;padding:28px 0;color:var(--muted)}
.billBusy .spinner{width:20px;height:20px;border-radius:50%;border:2.5px solid color-mix(in srgb,var(--accent) 25%,transparent);border-top-color:var(--accent);animation:billSpin .8s linear infinite}
@keyframes billSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.billBusy .spinner{animation-duration:2.4s}}
.formError{color:var(--red);font-size:13px;font-weight:600;margin:0 4px 8px}
.billCompare{display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:16px;background:color-mix(in srgb,var(--accent) 10%,transparent);margin:8px 0}
.billCompare span{color:var(--muted);font-size:14px}.billCompare strong.ok{color:var(--green)}.billCompare strong.bad{color:var(--red)}
.billPw{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:500}.billPw span{flex:1}

/* ================================================================== 1.4.0 (mesmo visual do Android 1.6.0) */
/* fundo pontilhado discreto que acompanha o tema */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(color-mix(in srgb,var(--text) 9%,transparent) 1px,transparent 1.4px);background-size:22px 22px}
@media print{body::before{display:none}}
/* cabeçalho do celular */
.mobileHeader .headTag{display:block;font-size:13px;color:var(--muted)}
.privacyPill{display:inline-flex;align-items:center;gap:5px;padding:8px 11px;border-radius:99px;background:var(--accent2);color:var(--accent);font-size:12px;font-weight:650}
.privacyPill.on{background:color-mix(in srgb,var(--green) 16%,transparent);color:var(--green)}
.forecastBox small.forecastNote{font-size:11.5px;line-height:1.3;margin-top:2px}
.flowCard .flowTop{justify-content:flex-start;gap:8px}
/* próximos vencimentos */
.dueList{display:flex;flex-direction:column;gap:10px}
.dueList .dueRow{padding:14px;border-radius:20px}
.dueRow .dueIc{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--accent2);color:var(--accent);flex:none}
.dueRow .dueIc.ok{background:color-mix(in srgb,var(--green) 13%,transparent);color:var(--green)}
.dueRow .meta small.dueGo{color:var(--accent);font-weight:700;margin-top:4px}
/* botão + flutuante (só celular, em Início e Lançamentos) */
.floatFab{position:fixed;z-index:6;right:18px;bottom:calc(max(14px,env(safe-area-inset-bottom)) + 104px);display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--onAccent);box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 40%,transparent)}
@media (max-width:899px){body[data-view=home] .app,body[data-view=moves] .app{padding-bottom:180px}.toasts{bottom:calc(max(14px,env(safe-area-inset-bottom)) + 104px)}}
/* aviso com ação (Desfazer) */
.toast.withAction{display:flex;align-items:center;gap:12px;text-align:left;pointer-events:auto}
.toast.withAction span{flex:1}
.toastAct{color:var(--accent2);font-weight:800;padding:6px 8px;border-radius:10px;text-transform:none}
:root:not([data-theme=light]) .toastAct{color:var(--accent)}
/* situação do lançamento por escrito */
.txStatus{font-weight:650}
/* Meu dinheiro */
.moneyCard{padding:16px;border-radius:24px;margin-top:12px;display:flex;flex-direction:column;gap:10px}
.moneyHead{display:flex;align-items:center;gap:12px}
.moneyHead .tile{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--accent2);color:var(--accent);flex:none}
.moneyHead>div{flex:1;min-width:0}.moneyHead h3{margin:0;font-size:16.5px}.moneyHead small{color:var(--muted);font-size:12.5px}
.moneyCard .manageList{margin:0}
.invoiceRow{display:flex;align-items:center;gap:10px;padding-top:4px}
.invoiceRow>div{flex:1;min-width:0}.invoiceRow small{display:block;color:var(--muted);font-size:12px}.invoiceRow b{font-size:17px;font-weight:800}
.btn.wide{width:100%}
/* Resumo */
.resultBox{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:20px;margin-top:10px}
.resultBox b{font-size:22px;font-weight:800}
.flowBox .subhead{margin:12px 0 4px}
.flowSeg{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--track)}
.flowSeg i{display:block;height:100%}
.flowSeg.sensitive{filter:blur(4px)}
.flowLegend{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:5px}
.flowLegend li{display:flex;align-items:center;gap:8px;font-size:13px}
.flowLegend li>i{width:12px;height:12px;border-radius:50%;flex:none}
.flowLegend li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flowLegend li b{display:flex;flex-direction:column;align-items:flex-end;font-size:13px}
.flowLegend li b small{font-weight:500;color:var(--muted);font-size:11px}
.flowPill{display:flex;justify-content:center;margin:12px 0}
.flowPill span{padding:8px 20px;border-radius:24px;background:var(--text);color:var(--bg);font-weight:800;font-size:14px}
/* Ajustes em grupos */
.prefsGroup{margin:20px 4px 8px;font-size:13px;font-weight:800;color:var(--muted);letter-spacing:.2px}
.prefsGroup:first-child,.pageTitle+.prefsGroup{margin-top:8px}
/* Adicionar movimentação */
.choiceList{display:flex;flex-direction:column;gap:8px}
.choiceRow{display:flex;align-items:center;gap:12px;width:100%;padding:14px;border-radius:20px;text-align:left}
.choiceRow .tile{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--accent2);color:var(--accent);flex:none}
.choiceRow .tile.out{background:color-mix(in srgb,var(--red) 13%,transparent);color:var(--red)}
.choiceRow .tile.in{background:color-mix(in srgb,var(--green) 13%,transparent);color:var(--green)}
.choiceRow .meta{flex:1;min-width:0}.choiceRow .meta b,.choiceRow .meta small{display:block}.choiceRow .meta small{color:var(--muted);font-size:12.5px}
/* formulário de lançamento em cartões */
.formCard{padding:12px 14px;border-radius:20px;background:var(--surface2);margin-top:10px}
.formCard .field:first-child{margin-top:0}
.valueCard input{font-size:22px;font-weight:800}
.formHead{margin:0 0 6px;font-size:15px}
.moreToggle{margin-top:4px}
.radioRow{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 4px;border-radius:12px;cursor:pointer}
.radioRow input{width:20px;height:20px;accent-color:var(--accent);margin:0}
.radioRow:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}
@media (min-width:900px){.floatFab{display:none}}