:root{
  --navy:#090d3d;--bg:#fff;--card:#fff;--soft:#f4f5f7;--text:#080d2e;--muted:#6c7280;--line:#e5e7eb;
  --green:#65c84d;--greenText:#169c39;--red:#d33f49;--blue:#3b9be8;--yellow:#f6c400;--orange:#ff9f1a;--purple:#8d3fe0;--pink:#f13583;--teal:#18b5b5
}
*{box-sizing:border-box}
body{margin:0;background:#ececec;font-family:Arial,Helvetica,sans-serif;color:var(--text)}
body.dark{--bg:#111820;--card:#17212b;--soft:#1f2a36;--text:#f5f7fb;--muted:#c3cad3;--line:#334150}
.app{max-width:520px;margin:0 auto;min-height:100vh;background:var(--bg);padding-bottom:86px;position:relative}
.app-header{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 22px}
.app-header h1{font-size:26px;margin:0;font-weight:900}
.header-spacer{width:28px;height:28px;display:block}
.icon-btn{border:0;background:transparent;color:var(--text);font-size:28px;cursor:pointer}
.month-row{display:flex;align-items:center;justify-content:center;gap:30px;font-size:22px;padding:8px 0 14px}
.screen{display:none}.screen.active{display:block}
.tabs{margin:0 20px;background:#eef0f3;border-radius:13px;display:flex;padding:2px}
.tab{flex:1;border:0;background:transparent;color:var(--text);padding:13px 8px;border-radius:12px;font-weight:800;font-size:16px;cursor:pointer}
.tab.active{background:var(--navy);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.16)}
.summary-card{margin:18px 20px 22px;border:1px solid var(--line);border-radius:9px;padding:18px 18px 20px;background:var(--soft);text-align:center}
.summary-card p{margin:0;color:var(--muted);font-size:16px}
.summary-card h2{margin:5px 0 24px;font-size:32px;line-height:1.05;letter-spacing:-.5px}
.summary-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.summary-mini{display:grid;grid-template-columns:28px 1fr;grid-template-areas:"icon label" "icon value";column-gap:8px;text-align:left;align-items:center;justify-content:center;max-width:170px;margin:0 auto}
.summary-mini .round{grid-area:icon}.summary-mini span:not(.round){grid-area:label;color:var(--muted);font-size:16px;line-height:1.1}.summary-mini b{grid-area:value;font-size:18px;line-height:1.2;white-space:nowrap}
.round{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;color:#fff;font-weight:900;font-size:17px}
.green{background:var(--greenText)}.red{background:var(--red)}
#leftValue{color:var(--greenText)}#rightValue{color:var(--red)}
.section-title{display:flex;align-items:center;justify-content:space-between;margin:0 22px 12px}
.section-title h3{margin:0;font-size:18px}.gear,.link-btn{border:0;background:transparent;color:var(--navy);font-size:20px;cursor:pointer}.link-btn{font-size:14px}
.category-card{margin:9px 20px;border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:0 1px 5px rgba(0,0,0,.04);overflow:hidden}
.category-head{display:flex;align-items:center;gap:12px;padding:11px 12px;cursor:pointer}
.cat-icon{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;flex:0 0 42px}
.cat-info{flex:1;min-width:0}.cat-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.cat-name{font-weight:900}.cat-total{font-weight:900}
.expense{color:var(--red)}.income{color:var(--greenText)}.zero{color:var(--muted)}
.progress{height:4px;background:#edf0f2;border-radius:6px;margin-top:8px;overflow:hidden}.progress span{height:100%;display:block;border-radius:6px;width:0}
.chev{font-size:22px;font-weight:900}
.cat-details{display:none;padding:0 18px 14px 62px}.category-card.open .cat-details{display:block}
.detail-line{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font-size:15px}.detail-line b{font-weight:700}
.detail-line.total{font-weight:900}
.recent-section{margin-top:28px}.recent-list{margin:0 20px;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--card)}
.item{display:flex;align-items:center;gap:12px;padding:14px 12px;border-bottom:1px solid var(--line);cursor:pointer}.item:last-child{border-bottom:0}
.status-ball{width:28px;height:28px;border-radius:50%;background:#eef8f0;color:var(--greenText);display:flex;align-items:center;justify-content:center;font-weight:900}
.item-info{flex:1}.item-info b{display:block}.item-info small{color:var(--muted)}
.value{font-weight:900}.empty{text-align:center;color:var(--muted);padding:25px}
.fab{position:fixed;bottom:38px;left:50%;transform:translateX(-50%);width:60px;height:60px;border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:36px;box-shadow:0 5px 14px rgba(0,0,0,.35);cursor:pointer;z-index:20;display:flex;align-items:center;justify-content:center;line-height:1}
.bottom-nav{position:fixed;z-index:6;left:50%;bottom:0;transform:translateX(-50%);max-width:520px;width:100%;height:70px;background:rgba(255,255,255,.96);display:flex;justify-content:space-around;align-items:center;border-top:1px solid var(--line)}
body.dark .bottom-nav{background:#111820}.bottom-nav button{border:0;background:transparent;color:var(--text);font-size:24px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer}.bottom-nav span{font-size:12px}.bottom-nav.two{justify-content:space-between;padding:0 62px}
.titlebar{display:flex;align-items:center;gap:14px;padding:18px}.titlebar h2{margin:0}
form{padding:0 20px}label{display:block;margin:18px 0 8px;font-weight:900}input,select{width:100%;border:0;background:var(--soft);color:var(--text);padding:16px;border-radius:8px;font-size:17px}.money-input{text-align:center;font-size:34px;font-weight:900}
.form-tabs{background:transparent;border-bottom:1px solid var(--line);border-radius:0}.form-tabs .tab{border-radius:0}.form-tabs .tab.active{box-shadow:none;border-bottom:3px solid var(--navy)}
.chips{display:flex;gap:8px}.chip{border:0;background:var(--soft);color:var(--muted);border-radius:22px;padding:12px 14px;font-weight:800}.chip.active{border:2px solid var(--navy);background:var(--bg);color:var(--navy)}
.primary,.secondary,.menu-btn{width:100%;border:0;padding:17px;border-radius:8px;font-size:18px;font-weight:900;cursor:pointer}.primary{background:var(--navy);color:#fff;margin-top:26px}.secondary{background:var(--soft);color:var(--text);margin-top:22px}
.details-card{margin:0 20px;border:1px solid var(--line);border-radius:12px;padding:18px}.details-card p{color:var(--muted);margin:22px 0 7px}.detail-actions{display:flex;gap:8px;justify-content:flex-end}.small-btn{border:0;background:var(--soft);color:var(--text);padding:10px 12px;border-radius:8px;font-weight:800}.danger{color:var(--red)!important}
.option{display:flex;align-items:center;justify-content:space-between;padding:22px 20px;border-bottom:1px solid var(--line)}.option p{margin:5px 0 0;color:var(--muted)}
.reminder-settings{display:none;margin:0 20px 12px;padding:12px 14px;background:var(--soft);border-radius:10px;border:1px solid var(--line)}.reminder-settings label{margin:0 0 8px}.reminder-settings select{padding:12px;font-size:15px;background:var(--card);border:1px solid var(--line)}
.switch input{display:none}.switch span{width:58px;height:31px;border-radius:30px;background:#c7c7c7;display:block;position:relative}.switch span:before{content:"";position:absolute;width:25px;height:25px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}.switch input:checked+span{background:var(--navy)}.switch input:checked+span:before{left:30px}
.menu-btn{margin:14px 20px 0;width:calc(100% - 40px);background:var(--soft);color:var(--text);text-align:left}.privacy{padding:20px;color:var(--muted);text-align:center}
.report-top-card{margin:0 20px 12px;background:var(--card);border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.08);padding:10px 0 16px;text-align:center;border:1px solid var(--line)}
.donut-wrap{position:relative;display:flex;justify-content:center;align-items:center}
#donutChart{width:240px;height:240px;max-width:100%}
.report-list{margin:0 20px 14px}
.report-row{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:7px;margin-bottom:8px;padding:11px 12px;box-shadow:0 1px 5px rgba(0,0,0,.08);border:1px solid var(--line)}
.report-row .report-icon{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}
.report-row .report-name{flex:1}.report-row .report-percent{color:var(--muted);width:48px;text-align:right}.report-row .report-value{font-weight:800;width:92px;text-align:right}
.report-panel{margin:14px 20px;padding:14px;background:#202d38;color:#fff;border-radius:8px;overflow:auto}.report-panel h3{text-align:center;margin:0 0 12px}.report-panel canvas{background:linear-gradient(90deg,#444,#252525);max-width:100%;border-radius:4px}
.hide{display:none!important}
.report-name small{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:3px;line-height:1.25}
.hint{display:block;margin:-6px 0 12px;color:var(--muted);font-size:12px;line-height:1.3}
.small-empty{color:rgba(255,255,255,.75);background:transparent;border:0;padding:4px;text-align:center}
.donut-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center;padding:0 8px}.donut-box{text-align:center;min-width:0}.donut-action{border:0;background:transparent;color:var(--text);cursor:pointer;border-radius:12px;padding:0}.donut-action:active{transform:scale(.98)}.donut-box h3{font-size:14px;margin:4px 0 0}.donut-box canvas{width:190px;height:190px;max-width:100%}.report-extrato-btn{margin:2px auto 0;display:block;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:9px;padding:6px 18px;font-weight:800;font-size:13px;cursor:pointer}.report-extrato-btn:hover{background:#f3f4f6}.report-switch{margin:12px 20px;background:#eef0f3;border-radius:13px;display:grid;grid-template-columns:repeat(4,1fr);padding:2px;gap:2px}.report-tab{border:0;background:transparent;color:var(--text);padding:11px 5px;border-radius:11px;font-weight:900;font-size:13px;cursor:pointer}.report-tab.active{background:var(--navy);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.16)}.report-view{display:none}.report-view.active{display:block}@media(max-width:420px){.donut-box canvas{width:160px;height:160px}.report-tab{font-size:12px;padding:10px 3px}}

/* Controles dos lançamentos recentes */
.recent-tools{margin:-4px 20px 10px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;align-items:center}
.mini-filter{border:1px solid var(--line);background:var(--soft);color:var(--text);border-radius:999px;padding:9px 6px;font-size:12px;font-weight:900;cursor:pointer}
.mini-filter.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.mini-select{grid-column:1 / -1;padding:11px 12px;border-radius:9px;font-size:14px;background:var(--soft);color:var(--text);border:1px solid var(--line)}
.scrollable-list{max-height:330px;overflow-y:auto;scroll-behavior:smooth}
.scrollable-list::-webkit-scrollbar{width:6px}
.scrollable-list::-webkit-scrollbar-thumb{background:#b8bec8;border-radius:6px}

.report-month-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:4px;font-size:18px;font-weight:900;color:var(--text)}
.report-month-nav .icon-btn{font-size:28px;width:36px;height:36px}
.report-date{text-align:center;color:var(--muted);font-weight:700;margin-top:2px}

.report-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:9px;margin:8px 0;padding:11px 12px;cursor:pointer}.report-entry small{display:block;color:var(--muted);margin-top:3px}.light-panel{background:var(--card);color:var(--text)}

/* Ajustes: menu inferior como voltar e cotações */
.titlebar.no-back{padding:18px 20px;justify-content:center}.titlebar.no-back h2{margin:0;text-align:center;width:100%;font-weight:900;text-decoration:underline;text-underline-offset:5px;letter-spacing:.5px}.btnBack{display:none!important}
.reminder-days{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:8px}.reminder-day{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:8px 0;font-weight:900;font-size:13px;cursor:pointer;min-width:0}.reminder-day.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.bottom-market-ticker{position:absolute;left:118px;right:118px;bottom:12px;height:28px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid var(--line);border-radius:999px;background:rgba(244,245,247,.95);color:var(--text);font-size:12px;font-weight:800;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottom-market-ticker b{font-weight:900}.bottom-market-ticker em{font-style:normal;margin-left:4px;font-weight:900}.bottom-market-ticker .income,.bottom-market-ticker.income{color:var(--green)}.bottom-market-ticker .expense,.bottom-market-ticker.expense{color:var(--red)}body.dark .bottom-market-ticker{background:#18222c}@media(max-width:420px){.bottom-market-ticker{left:102px;right:102px;font-size:11px;padding:0 5px}}
.bottom-nav button.back-mode{color:var(--navy);font-weight:900}.bottom-nav button.back-mode .nav-ico{font-size:26px}

.menu-title{margin:6px 0 10px!important;text-align:center;font-size:20px}
#screenMenu .titlebar{padding-bottom:4px!important;margin-bottom:0!important}
.reminder-option{margin-top:4px!important}
.privacy{padding:12px 10px!important;font-size:11px!important;white-space:nowrap!important}


/* Ajuste fino do MENU: faixa destacada e menor espaçamento */
#screenMenu .titlebar.no-back{
  padding:6px 20px!important;
  margin:-10px 0 8px!important;
  background:var(--navy)!important;
  border-top:1px solid var(--navy)!important;
  border-bottom:1px solid var(--navy)!important;
  justify-content:center!important;
}
#screenMenu .titlebar.no-back h2,
#screenMenu .menu-title{
  margin:0!important;
  color:#fff!important;
  width:100%!important;
  text-align:center!important;
  font-size:19px!important;
  line-height:1.15!important;
  font-weight:900!important;
  letter-spacing:1.4px!important;
  text-decoration:none!important;
}
#screenMenu .reminder-option{
  margin-top:0!important;
  padding-top:14px!important;
  padding-bottom:14px!important;
}
#screenMenu .privacy{
  padding:10px 4px!important;
  font-size:10px!important;
  line-height:1!important;
  white-space:nowrap!important;
  text-align:center!important;
}


/* Aba flutuante de dados do usuário */
.data-overlay{position:fixed;inset:0;background:rgba(0,0,0,.22);z-index:30;display:none}
.data-overlay.show{display:block}
.data-sheet{display:none;position:fixed;left:50%;bottom:78px;transform:translateX(-50%) translateY(0);width:calc(100% - 28px);max-width:492px;background:var(--card);border:1px solid var(--line);border-radius:22px 22px 18px 18px;box-shadow:0 -8px 28px rgba(0,0,0,.22);z-index:31;padding:10px 16px 16px}
.data-sheet.show{display:block}
.sheet-handle{width:42px;height:5px;border-radius:999px;background:#d1d5db;margin:0 auto 14px}
.user-card{display:flex;align-items:center;gap:12px;background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:12px}
.user-avatar{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:transparent;border:0}
.user-card small{display:block;color:var(--muted);font-size:12px;margin-bottom:3px}.user-card b{font-size:14px;color:var(--text)}
.sheet-btn{width:100%;border:0;border-radius:12px;background:var(--soft);color:var(--text);font-weight:900;font-size:15px;padding:13px;margin-top:9px;cursor:pointer;text-align:left}
.sheet-btn.danger{color:var(--red)}
.nav-ico-user{width:24px;height:24px;display:flex;align-items:center;justify-content:center;line-height:1}

.user-outline-icon{position:relative;display:inline-block;width:34px;height:34px;box-sizing:border-box}
.user-outline-icon:before{content:"";position:absolute;left:50%;top:1px;transform:translateX(-50%);width:15px;height:19px;border:2.6px solid var(--navy);border-radius:50%;background:var(--soft);z-index:2;box-sizing:border-box}
.user-outline-icon:after{content:"";position:absolute;left:50%;bottom:1px;transform:translateX(-50%);width:31px;height:16px;border:2.6px solid var(--navy);border-radius:12px 12px 8px 8px;background:transparent;z-index:1;box-sizing:border-box}
.user-outline-icon.small{width:24px;height:24px}
.user-outline-icon.small:before{top:1px;width:11px;height:14px;border-width:2px;background:var(--bg)}
.user-outline-icon.small:after{bottom:1px;width:22px;height:11px;border-width:2px;border-radius:8px 8px 6px 6px}

/* Tela inicial de cadastro/login */
.auth-screen{position:fixed;inset:0;background:#fff;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:18px 16px;overflow-y:auto}
.auth-screen.hide{display:none!important}
.app.app-locked{display:none!important}
.auth-card{width:100%;max-width:420px;color:var(--text)}

.auth-logo-wrap{display:flex;justify-content:center;align-items:center;margin:0 auto 12px}
.auth-logo{width:128px;height:128px;object-fit:contain;display:block;border-radius:24px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.12))}
@media(max-width:420px){.auth-logo{width:112px;height:112px}.auth-logo-wrap{margin-bottom:10px}}
.auth-hero{background:var(--soft);padding:22px 18px;margin-bottom:18px}
.auth-hero h1{font-size:22px;margin:0 0 8px;font-weight:900;color:var(--navy)}
.auth-hero p{margin:0;color:var(--muted);font-size:13px}
.auth-form{padding:0 12px}
.auth-form label{font-size:13px;margin:16px 0 8px;color:var(--text)}
.auth-form input{font-size:14px;border-radius:3px;padding:14px 12px;background:var(--soft)}

.password-wrap{position:relative}
.password-wrap input{padding-right:48px}
.toggle-pass{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:transparent;color:var(--navy);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;border-radius:50%}
.toggle-pass:active{transform:translateY(-50%) scale(.92)}
.toggle-pass svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;display:block}
.toggle-pass .eye-pupil{fill:currentColor;stroke:none}

.auth-primary{margin-top:22px;border-radius:4px;font-size:14px;padding:14px}
.auth-link{border:0;background:transparent;color:var(--navy);font-weight:800;cursor:pointer;font-size:12px;padding:12px 0}.auth-link.right{display:block;margin-left:auto;text-align:right}.auth-link.center{display:block;margin:16px auto 0;text-align:center}

/* ======================================================
   PÃO DURO - visual divertido, limpo e arredondado
   Inspirado na logo: amarelo suave, azul claro e verde.
   ====================================================== */
:root{
  --navy:#071247;
  --bg:#fffaf0;
  --card:#fffdf7;
  --soft:#fff7e6;
  --text:#071247;
  --muted:#637087;
  --line:#eadfcb;
  --green:#35b84a;
  --greenText:#139a34;
  --red:#df3d4a;
  --blue:#45afe6;
  --yellow:#ffd66b;
  --orange:#ff9f1c;
  --cream:#fff4d9;
  --mint:#e7f9df;
  --sky:#e4f7ff;
}

body{
  background:linear-gradient(135deg,#e6f7ff 0%,#fff7db 48%,#e9ffe4 100%)!important;
}
.app{
  background:linear-gradient(180deg,#fffaf0 0%,#ffffff 42%,#fffaf0 100%)!important;
  box-shadow:0 16px 40px rgba(7,18,71,.10);
  overflow:hidden;
}
.app-header{
  background:linear-gradient(180deg,#fff1c9 0%,#fffaf0 100%);
  border-bottom:1px solid rgba(234,223,203,.7);
}
.app-header h1,
.month-row strong,
.titlebar h2{
  color:var(--navy)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.7);
}
.icon-btn{color:var(--navy)!important}

/* Login e cadastro */
.auth-screen{
  background:linear-gradient(135deg,#dff4ff 0%,#fff1c7 50%,#e8ffd9 100%)!important;
  padding:22px 16px!important;
}
.auth-card{
  max-width:430px!important;
  background:rgba(255,253,247,.92);
  border:1px solid rgba(255,255,255,.75);
  border-radius:30px;
  box-shadow:0 18px 45px rgba(7,18,71,.14);
  padding:16px 14px 22px;
  overflow:hidden;
}
.auth-logo-wrap{
  margin:0 auto 4px!important;
  position:relative;
}
.auth-logo{
  width:156px!important;
  height:156px!important;
  border-radius:28px!important;
  filter:drop-shadow(0 8px 14px rgba(7,18,71,.20))!important;
}
.auth-hero{
  background:linear-gradient(135deg,#fff3ca 0%,#f4fff0 100%)!important;
  border:1px solid rgba(234,223,203,.9);
  border-radius:26px!important;
  padding:20px 18px!important;
  margin:4px 0 18px!important;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.auth-hero h1{font-size:26px!important;color:var(--navy)!important}
.auth-hero p{font-size:15px!important;color:#5c6b80!important}
.auth-form{padding:0 12px!important}
.auth-form label{font-size:14px!important;font-weight:900;color:var(--navy)!important;margin:14px 0 8px!important}
.auth-form input,
.password-wrap input{
  background:#fffdf7!important;
  border:1px solid #e8ddca!important;
  border-radius:16px!important;
  padding:15px 14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 8px rgba(7,18,71,.04);
}
.password-wrap input{padding-right:50px!important}
.toggle-pass{color:var(--navy)!important;background:transparent!important}
.auth-primary{
  border-radius:17px!important;
  padding:15px!important;
  font-size:17px!important;
  box-shadow:0 8px 14px rgba(7,18,71,.20);
}
#registerForm .auth-primary{
  background:linear-gradient(180deg,#42c856 0%,#21a83b 100%)!important;
  border:0!important;
}
#loginForm .auth-primary{
  background:linear-gradient(180deg,#113187 0%,#071247 100%)!important;
  border:0!important;
}
.auth-link.center{
  background:#fffdf7;
  border:1px solid #e8ddca;
  border-radius:16px;
  padding:13px 10px!important;
  margin-top:15px!important;
}
.auth-link.right{color:#073b96!important}

/* Abas, cards e campos */
.tabs,
.report-switch{
  background:#f1f5f5!important;
  border:1px solid rgba(234,223,203,.9);
  border-radius:18px!important;
  padding:4px!important;
}
.tab,
.report-tab,
.mini-filter,
.chip,
.reminder-day{
  border-radius:999px!important;
}
.tab.active,
.report-tab.active,
.mini-filter.active,
.reminder-day.active{
  background:linear-gradient(180deg,#10256f 0%,#071247 100%)!important;
  color:#fff!important;
  box-shadow:0 6px 12px rgba(7,18,71,.18)!important;
}
.summary-card,
.report-top-card,
.card,
.list-item,
.report-entry,
.user-card,
.sheet-btn,
.reminder-card,
.menu-item,
#screenMenu .reminder-option,
.recent-list,
.light-panel{
  border-radius:20px!important;
}
.summary-card,
.report-top-card,
.report-panel,
.light-panel{
  background:linear-gradient(180deg,#fffdf7 0%,#fff7e6 100%)!important;
  border:1px solid #eadfcb!important;
  box-shadow:0 8px 20px rgba(7,18,71,.08)!important;
}
.summary-card{
  overflow:hidden;
  position:relative;
}
.summary-card:before{
  content:"";
  position:absolute;
  left:-50px;right:-50px;top:-80px;height:130px;
  background:radial-gradient(circle at 20% 50%,rgba(69,175,230,.20),transparent 34%),radial-gradient(circle at 80% 40%,rgba(53,184,74,.18),transparent 32%),linear-gradient(90deg,rgba(255,214,107,.38),rgba(255,255,255,0));
  pointer-events:none;
}
.summary-card>*{position:relative}
.summary-mini .round,
.round{
  box-shadow:0 4px 8px rgba(7,18,71,.12);
}

/* Lançamentos */
.list-row,
.list-item,
.report-entry{
  background:#fffdf7!important;
  border:1px solid #eadfcb!important;
  box-shadow:0 3px 10px rgba(7,18,71,.05);
}
.recent-tools{gap:7px!important}
.mini-select,
select,
input,
textarea{
  border-radius:16px!important;
  border:1px solid #eadfcb!important;
  background:#fffdf7!important;
}
.primary,
.save-btn{
  border-radius:18px!important;
  background:linear-gradient(180deg,#113187 0%,#071247 100%)!important;
  box-shadow:0 8px 16px rgba(7,18,71,.18)!important;
}

/* Menu */
#screenMenu .titlebar.no-back{
  background:linear-gradient(90deg,#071247 0%,#12308b 55%,#071247 100%)!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:0 8px 18px rgba(7,18,71,.15)!important;
}
#screenMenu .reminder-option,
#screenMenu .privacy,
.menu-card,
.menu-row{
  background:#fffdf7!important;
}
.reminder-days{gap:8px!important}
.menu button,
#screenMenu button:not(.icon-btn):not(.reminder-day){
  border-radius:18px!important;
}

/* Barra inferior */
.bottom-nav{
  background:rgba(255,253,247,.96)!important;
  border-top:1px solid #eadfcb!important;
  box-shadow:0 -8px 24px rgba(7,18,71,.08)!important;
}
.fab,
#btnAdd{
  width:60px!important;
  height:60px!important;
  border-radius:50%!important;
  background:linear-gradient(180deg,#113187 0%,#071247 100%)!important;
  box-shadow:0 10px 20px rgba(7,18,71,.25)!important;
  z-index:40!important;
}
.bottom-market-ticker{
  background:#fffdf7!important;
  border:1px solid #eadfcb!important;
  border-radius:999px!important;
  box-shadow:0 3px 8px rgba(7,18,71,.08)!important;
}

/* Aba usuário */
.data-sheet{
  background:linear-gradient(180deg,#fffdf7 0%,#fff7e6 100%)!important;
  border:1px solid #eadfcb!important;
  border-radius:28px 28px 22px 22px!important;
}
.user-card,.sheet-btn{background:#fffdf7!important;border:1px solid #eadfcb!important;border-radius:18px!important}
.user-outline-icon:before,.user-outline-icon:after{border-color:var(--navy)!important;background:transparent!important}

/* Relatórios */
.report-panel{
  border-radius:22px!important;
  padding:16px!important;
}
.report-panel canvas{
  border-radius:16px!important;
  background:linear-gradient(180deg,#304055 0%,#1d2630 100%)!important;
}
.donut-action{border-radius:20px!important}
.report-extrato-btn{
  border-radius:999px!important;
  background:#fffdf7!important;
  border:1px solid #eadfcb!important;
}

@media(max-width:420px){
  .auth-logo{width:138px!important;height:138px!important}
  .auth-card{border-radius:26px;padding:12px 10px 18px}
}

/* ======================================================
   AJUSTE FINAL - Background completo estilo logo
   Gradiente suave + cards arredondados sem excesso de cor
   ====================================================== */
html, body{
  min-height:100%;
}
body{
  background:
    radial-gradient(circle at 8% 8%, rgba(163,222,255,.70) 0%, rgba(163,222,255,0) 36%),
    radial-gradient(circle at 50% 20%, rgba(255,221,130,.72) 0%, rgba(255,221,130,0) 34%),
    radial-gradient(circle at 92% 92%, rgba(180,255,164,.62) 0%, rgba(180,255,164,0) 40%),
    linear-gradient(135deg,#eaf8ff 0%,#fff8dc 48%,#edffe8 100%)!important;
  background-attachment:fixed!important;
}
.app{
  background:
    radial-gradient(circle at 10% 0%, rgba(85,188,239,.16) 0%, rgba(85,188,239,0) 34%),
    radial-gradient(circle at 88% 14%, rgba(255,214,107,.22) 0%, rgba(255,214,107,0) 38%),
    radial-gradient(circle at 100% 85%, rgba(53,184,74,.13) 0%, rgba(53,184,74,0) 34%),
    rgba(255,253,247,.96)!important;
  border-left:1px solid rgba(255,255,255,.7);
  border-right:1px solid rgba(255,255,255,.7);
}
.auth-screen{
  background:
    radial-gradient(circle at 8% 10%, rgba(150,219,255,.72) 0%, rgba(150,219,255,0) 38%),
    radial-gradient(circle at 55% 22%, rgba(255,220,128,.75) 0%, rgba(255,220,128,0) 36%),
    radial-gradient(circle at 92% 90%, rgba(178,255,164,.66) 0%, rgba(178,255,164,0) 42%),
    linear-gradient(135deg,#eaf8ff 0%,#fff3c9 50%,#eaffdf 100%)!important;
}
.auth-card{
  position:relative!important;
  overflow:hidden!important;
  background:rgba(255,253,247,.88)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-radius:34px!important;
  border:1px solid rgba(255,255,255,.85)!important;
  box-shadow:0 22px 55px rgba(7,18,71,.16)!important;
}
.auth-card:before{
  content:"";
  position:absolute;
  left:-18%;
  right:-18%;
  top:-38px;
  height:230px;
  background:
    radial-gradient(circle at 18% 35%, rgba(255,255,255,.62) 0 20px, transparent 21px),
    radial-gradient(circle at 72% 42%, rgba(255,255,255,.42) 0 17px, transparent 18px),
    linear-gradient(150deg, rgba(255,210,109,.62) 0%, rgba(255,244,199,.55) 48%, rgba(107,205,237,.38) 100%);
  border-radius:0 0 50% 50%;
  pointer-events:none;
  z-index:0;
}
.auth-logo-wrap,.auth-hero,.auth-form{position:relative;z-index:1}
.auth-logo{filter:drop-shadow(0 12px 18px rgba(7,18,71,.22))!important}
.auth-hero{
  background:rgba(255,253,247,.78)!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 8px 22px rgba(7,18,71,.07), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.summary-card,.report-top-card,.category-card,.recent-list,.details-card,.report-row,.menu-btn,.reminder-settings,.option,.report-panel,.light-panel,.auth-form input,.password-wrap input,input,select,textarea{
  border-radius:20px!important;
}
.item,.report-entry,.sheet-btn,.user-card{
  border-radius:18px!important;
}
.category-card,.recent-list,.details-card,.report-row,.menu-btn,.reminder-settings,.option,.report-panel,.light-panel,.auth-form input,.password-wrap input,input,select,textarea{
  box-shadow:0 6px 18px rgba(7,18,71,.055)!important;
}
.primary,.auth-primary,.tab.active,.report-tab.active,.mini-filter.active,.reminder-day.active{
  background:linear-gradient(180deg,#173b9b 0%,#071247 100%)!important;
}
#registerForm .auth-primary{
  background:linear-gradient(180deg,#48ca58 0%,#159936 100%)!important;
}
.bottom-nav{
  background:rgba(255,253,247,.92)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* ======================================================
   AJUSTE SOLICITADO - background especial só no Login/Cadastro
   Área interna volta ao fundo neutro/profissional.
   ====================================================== */
body{
  background:#ececec!important;
  background-attachment:initial!important;
}
.app{
  background:#ffffff!important;
  border-left:0!important;
  border-right:0!important;
  box-shadow:none!important;
}
.app-header{
  background:#ffffff!important;
  border-bottom:0!important;
}
.auth-screen{
  background:
    radial-gradient(circle at 8% 10%, rgba(150,219,255,.72) 0%, rgba(150,219,255,0) 38%),
    radial-gradient(circle at 55% 22%, rgba(255,220,128,.75) 0%, rgba(255,220,128,0) 36%),
    radial-gradient(circle at 92% 90%, rgba(178,255,164,.66) 0%, rgba(178,255,164,0) 42%),
    linear-gradient(135deg,#eaf8ff 0%,#fff3c9 50%,#eaffdf 100%)!important;
}


/* ======================================================
   AJUSTE MOBILE APP - tela fixa e rolagem só nos lançamentos
   ====================================================== */
html, body{
  width:100%;
  height:100%;
  overflow:hidden!important;
  overscroll-behavior:none;
}
body{position:fixed;inset:0;width:100%;height:100%;}
.app{
  height:100dvh!important;
  max-height:100dvh!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  padding-bottom:70px!important;
}
.screen{
  min-height:0;
  flex:1 1 auto;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding-bottom:10px;
}
#screenHome.screen.active{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  min-height:0!important;
}
#screenHome .recent-section{
  flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  margin-top:12px!important;
  overflow:hidden!important;
}
#screenHome .recent-list,
#screenHome .scrollable-list{
  flex:1 1 auto!important;
  min-height:92px!important;
  max-height:none!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  margin-bottom:6px!important;
}
#screenHome .item{flex-shrink:0;}
.bottom-nav{height:70px!important;}
.fab{bottom:38px!important;}

@media(max-height:760px){
  .app-header{height:48px!important;padding:0 18px!important;}
  .app-header h1{font-size:22px!important;}
  .month-row{padding:3px 0 8px!important;font-size:20px!important;gap:24px!important;}
  .tabs{margin:0 16px!important;}
  .tab{padding:10px 6px!important;font-size:14px!important;}
  .summary-card{margin:12px 16px 10px!important;padding:12px 14px 14px!important;}
  .summary-card h2{font-size:28px!important;margin:3px 0 14px!important;}
  .summary-card p{font-size:14px!important;}
  .summary-mini b{font-size:16px!important;}
  .summary-mini span:not(.round){font-size:14px!important;}
  .section-title{margin:0 18px 8px!important;}
  .section-title h3{font-size:18px!important;}
  .recent-tools{margin:0 16px 8px!important;}
  .mini-filter{padding:9px 8px!important;font-size:13px!important;}
  .mini-select{padding:11px 12px!important;font-size:14px!important;}
  #screenHome .recent-list{margin:0 16px 4px!important;}
  .item{padding:11px 12px!important;}
}
@media(max-height:650px){
  .app-header{height:42px!important;}
  .month-row{font-size:18px!important;padding:0 0 6px!important;}
  .summary-card{margin:9px 16px 8px!important;padding:10px 12px!important;}
  .summary-card h2{font-size:25px!important;margin:2px 0 10px!important;}
  .summary-row{gap:8px!important;}
  .round{width:22px!important;height:22px!important;font-size:15px!important;}
  .recent-section{margin-top:8px!important;}
  .item-info b{font-size:15px!important;}
  .item-info small{font-size:12px!important;}
  .value{font-size:15px!important;}
}


/* ======================================================
   RESPONSIVO FINAL - Browser e APP Android/PWA
   Desktop/browser: página pode rolar normalmente.
   Celular/app: tela principal fica fixa e só a lista rola.
   ====================================================== */
html, body{
  width:100%!important;
  min-height:100%!important;
  height:auto!important;
  overflow:auto!important;
  position:static!important;
  overscroll-behavior:auto!important;
}
body{
  background:#ececec!important;
}
.app{
  width:100%!important;
  max-width:520px!important;
  min-height:100vh!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  display:block!important;
  padding-bottom:86px!important;
  margin:0 auto!important;
  background:#fff!important;
}
.screen{overflow:visible!important;min-height:0!important;}
.screen.active{display:block!important;}
#screenHome.screen.active{display:block!important;overflow:visible!important;}
#screenHome .recent-section{display:block!important;overflow:visible!important;}
#screenHome .recent-list,#screenHome .scrollable-list{
  max-height:340px!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}

/* No celular instalado/aberto em tela estreita: sem rolagem geral */
@media(max-width:600px){
  html, body{
    height:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
    position:fixed!important;
    inset:0!important;
    overscroll-behavior:none!important;
  }
  .app{
    width:100%!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    padding-bottom:70px!important;
    margin:0!important;
  }
  .app-header{
    flex:0 0 auto!important;
    height:50px!important;
    padding:calc(env(safe-area-inset-top,0px) + 4px) 18px 4px!important;
  }
  .app-header h1{font-size:22px!important;line-height:1!important;}
  .screen{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:12px!important;
  }
  #screenHome.screen.active{
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    min-height:0!important;
  }
  #screenHome .month-row,
  #screenHome .tabs,
  #screenHome .summary-card,
  #screenHome .section-title,
  #screenHome .recent-tools{
    flex:0 0 auto!important;
  }
  #screenHome .recent-section{
    flex:1 1 auto!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    margin-top:10px!important;
  }
  #screenHome .recent-list,
  #screenHome .scrollable-list{
    flex:1 1 auto!important;
    min-height:100px!important;
    max-height:none!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    margin-bottom:0!important;
  }
  #screenHome .item{flex-shrink:0!important;}
  .bottom-nav{height:70px!important;padding-bottom:env(safe-area-inset-bottom,0px)!important;}
  .fab{bottom:38px!important;z-index:25!important;}
}

@media(max-width:600px) and (max-height:760px){
  .app-header{height:44px!important;}
  .month-row{padding:2px 0 7px!important;font-size:19px!important;gap:22px!important;}
  .tabs{margin:0 14px!important;}
  .tab{padding:9px 6px!important;font-size:14px!important;}
  .summary-card{margin:10px 14px 8px!important;padding:11px 12px!important;}
  .summary-card h2{font-size:27px!important;margin:2px 0 11px!important;}
  .summary-card p{font-size:13px!important;}
  .summary-mini span:not(.round){font-size:13px!important;}
  .summary-mini b{font-size:15px!important;}
  .section-title{margin:0 16px 7px!important;}
  .recent-tools{margin:0 14px 7px!important;}
  .mini-filter{padding:8px 7px!important;font-size:12px!important;}
  .mini-select{padding:10px 12px!important;font-size:13px!important;}
  #screenHome .recent-list{margin:0 14px!important;}
  .item{padding:10px 10px!important;}
}

@media(max-width:600px) and (max-height:650px){
  .app-header{height:38px!important;}
  .app-header h1{font-size:20px!important;}
  .month-row{font-size:17px!important;padding:0 0 5px!important;}
  .summary-card{margin:7px 14px 7px!important;padding:9px 10px!important;}
  .summary-card h2{font-size:24px!important;margin:1px 0 8px!important;}
  .summary-row{gap:6px!important;}
  .round{width:20px!important;height:20px!important;font-size:14px!important;}
  .item-info b{font-size:14px!important;}
  .item-info small{font-size:11px!important;}
  .value{font-size:14px!important;}
}


/* ======================================================
   AJUSTE FINAL: tela fixa em browser e celular.
   A rolagem geral do aplicativo fica bloqueada; na Home,
   somente a lista de lançamentos rola.
   ====================================================== */
html, body{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  overflow:hidden!important;
  position:fixed!important;
  inset:0!important;
  overscroll-behavior:none!important;
}
body{
  background:#ececec!important;
}
.auth-screen{
  height:100dvh!important;
  overflow-y:auto!important;
}
.app{
  width:100%!important;
  max-width:520px!important;
  height:100dvh!important;
  min-height:0!important;
  max-height:100dvh!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  padding-bottom:70px!important;
  margin:0 auto!important;
  background:#fff!important;
}
.app-header{
  flex:0 0 auto!important;
}
.screen{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  padding-bottom:8px!important;
}
.screen.active{
  display:flex!important;
  flex-direction:column!important;
}
#screenHome .month-row,
#screenHome .tabs,
#screenHome .summary-card,
#screenHome .section-title,
#screenHome .recent-tools{
  flex:0 0 auto!important;
}
#screenHome .recent-section{
  flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  margin-top:10px!important;
}
#screenHome .recent-list,
#screenHome .scrollable-list{
  flex:1 1 auto!important;
  min-height:95px!important;
  max-height:none!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
}
#screenHome .item{
  flex-shrink:0!important;
}
#screenReports.screen.active,
#screenMenu.screen.active,
#screenForm.screen.active,
#screenDetails.screen.active{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
}
#reportViewGeral{display:none!important;}
.bottom-nav{
  height:70px!important;
}
.fab{
  bottom:38px!important;
  z-index:35!important;
}
@media(min-width:601px){
  .app{box-shadow:0 0 0 1px rgba(0,0,0,.04);}
}


/* ======================================================
   CORREÇÃO DEFINITIVA DE ROLAGEM
   Browser e APP ficam com tela fixa. Somente a lista de
   lançamentos rola, com altura calculada pelo JavaScript.
   ====================================================== */
html,body{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  overflow:hidden!important;
  position:fixed!important;
  inset:0!important;
}
.app{
  height:100vh!important;
  height:100dvh!important;
  max-height:100vh!important;
  max-height:100dvh!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.screen{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
.screen.active{display:flex!important;flex-direction:column!important;}
#screenHome.screen.active{overflow:hidden!important;}
#screenHome .month-row,
#screenHome .tabs,
#screenHome .summary-card,
#screenHome .section-title,
#screenHome .recent-tools{
  flex:0 0 auto!important;
}
#screenHome .recent-section{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
#screenHome .recent-list,
#screenHome .scrollable-list{
  flex:0 0 auto!important;
  min-height:105px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  touch-action:pan-y!important;
}
#screenHome .recent-list .item{flex-shrink:0!important;}
#screenReports.screen.active,
#screenMenu.screen.active,
#screenForm.screen.active,
#screenDetails.screen.active{
  overflow:hidden!important;
}

/* ======================================================
   AJUSTE: Browser com rolagem geral / APP instalado fixo
   - No navegador comum: a página rola normalmente.
   - No APP/WebView/PWA: tela fixa e somente a lista de lançamentos rola.
   ====================================================== */
html:not(.app-mode),
html:not(.app-mode) body{
  width:100%!important;
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow:auto!important;
  position:static!important;
  inset:auto!important;
  overscroll-behavior:auto!important;
}
html:not(.app-mode) .app{
  width:100%!important;
  max-width:520px!important;
  height:auto!important;
  min-height:100vh!important;
  max-height:none!important;
  overflow:visible!important;
  display:block!important;
  padding-bottom:92px!important;
  margin:0 auto!important;
}
html:not(.app-mode) .screen{
  display:none!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:18px!important;
}
html:not(.app-mode) .screen.active{
  display:block!important;
}
html:not(.app-mode) #screenHome.screen.active{
  display:block!important;
  overflow:visible!important;
}
html:not(.app-mode) #screenHome .recent-section{
  display:block!important;
  overflow:visible!important;
  margin-top:14px!important;
}
html:not(.app-mode) #screenHome .recent-list,
html:not(.app-mode) #screenHome .scrollable-list{
  display:block!important;
  flex:none!important;
  min-height:120px!important;
  max-height:45vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
}
html:not(.app-mode) #screenReports.screen.active,
html:not(.app-mode) #screenMenu.screen.active,
html:not(.app-mode) #screenForm.screen.active,
html:not(.app-mode) #screenDetails.screen.active{
  display:block!important;
  overflow:visible!important;
}

html.app-mode,
html.app-mode body{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  overflow:hidden!important;
  position:fixed!important;
  inset:0!important;
  overscroll-behavior:none!important;
}
html.app-mode .app{
  width:100%!important;
  max-width:none!important;
  height:100vh!important;
  height:100dvh!important;
  min-height:0!important;
  max-height:100vh!important;
  max-height:100dvh!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  padding-bottom:70px!important;
  margin:0!important;
}
html.app-mode .screen{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
html.app-mode .screen.active{
  display:flex!important;
  flex-direction:column!important;
}
html.app-mode #screenHome.screen.active{
  overflow:hidden!important;
}
html.app-mode #screenHome .month-row,
html.app-mode #screenHome .tabs,
html.app-mode #screenHome .summary-card,
html.app-mode #screenHome .section-title,
html.app-mode #screenHome .recent-tools{
  flex:0 0 auto!important;
}
html.app-mode #screenHome .recent-section{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
html.app-mode #screenHome .recent-list,
html.app-mode #screenHome .scrollable-list{
  flex:1 1 auto!important;
  min-height:105px!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  touch-action:pan-y!important;
}
html.app-mode #screenReports.screen.active,
html.app-mode #screenMenu.screen.active,
html.app-mode #screenForm.screen.active,
html.app-mode #screenDetails.screen.active{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
}

/* ======================================================
   AJUSTE LOGIN/CADASTRO - centralização vertical real
   Mantém as telas de entrada equilibradas entre topo e base
   no browser e no APP/WebView.
   ====================================================== */
.auth-screen{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  padding:12px 14px!important;
  box-sizing:border-box!important;
  overflow-y:auto!important;
}
.auth-card{
  margin:auto!important;
}
.auth-logo-wrap{
  margin-top:0!important;
  margin-bottom:6px!important;
}
.auth-hero{
  margin-top:2px!important;
  margin-bottom:14px!important;
}
.auth-form label{
  margin-top:12px!important;
  margin-bottom:7px!important;
}
.auth-primary{
  margin-top:18px!important;
}
.auth-link.center{
  margin-top:14px!important;
}
@media(max-height:740px){
  .auth-screen{align-items:center!important;padding-top:8px!important;padding-bottom:8px!important;}
  .auth-card{padding-top:10px!important;padding-bottom:14px!important;}
  .auth-logo{width:118px!important;height:118px!important;}
  .auth-hero{padding:14px 14px!important;margin-bottom:10px!important;}
  .auth-hero h1{font-size:22px!important;margin-bottom:4px!important;}
  .auth-hero p{font-size:13px!important;}
  .auth-form label{margin-top:8px!important;margin-bottom:5px!important;}
  .auth-form input,.password-wrap input{padding-top:12px!important;padding-bottom:12px!important;}
  .auth-primary{margin-top:14px!important;padding-top:13px!important;padding-bottom:13px!important;}
  .auth-link.right{padding-top:8px!important;padding-bottom:8px!important;}
  .auth-link.center{margin-top:10px!important;padding-top:8px!important;padding-bottom:8px!important;}
}
@media(max-height:660px){
  .auth-logo{width:98px!important;height:98px!important;}
  .auth-hero{padding:10px 12px!important;margin-bottom:8px!important;}
  .auth-hero h1{font-size:20px!important;}
  .auth-form label{font-size:12px!important;margin-top:6px!important;}
  .auth-form input,.password-wrap input{padding-top:10px!important;padding-bottom:10px!important;}
  .auth-primary{margin-top:10px!important;}
}

/* ===== DIFERENCIAIS PÃO DURO: PRO, COFRE, MISSÕES ===== */
.pao-insight-card,.mission-mini-card,.plan-card,.premium-gate,.cofre-hero,.cofre-box,.mission-hero,.upgrade-card{
  margin:12px 20px;
  border:1px solid rgba(7,18,71,.10);
  border-radius:20px;
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 22px rgba(7,18,71,.07);
}
.pao-insight-card{display:flex;gap:12px;align-items:center;padding:12px 14px;background:linear-gradient(135deg,#fff8d6,#eefbea)}
.pao-insight-card b,.mission-mini-card b{font-size:15px;font-weight:900;color:var(--navy)}
.pao-insight-card p,.mission-mini-card p,.plan-card p,.cofre-hero p,.mission-hero p,.upgrade-card p,.cofre-box small{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.25}
.pao-face{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff3ba;border:1px solid #f1d36b;font-size:22px;flex:0 0 auto}
.pao-face.big{width:54px;height:54px;font-size:30px}
.mission-mini-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;background:linear-gradient(135deg,#fff,#f0fbff)}
.mission-mini-card button,.plan-card button{border:0;border-radius:999px;padding:8px 14px;background:var(--navy);color:#fff;font-weight:900;white-space:nowrap;cursor:pointer}
.plan-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;background:linear-gradient(135deg,#fff8d6,#ffffff)}
.plan-card small{display:block;color:var(--muted);font-weight:800}.plan-card b{font-size:17px;color:var(--navy)}
.plan-card.pro{background:linear-gradient(135deg,#e8fff0,#ffffff)}.plan-card.pro button{background:#149a34}
.premium-gate{padding:26px 18px;text-align:center;background:linear-gradient(135deg,#fff8d6,#eefbea)}
.premium-gate h3,.cofre-hero h3,.upgrade-card h3,.mission-hero h3{margin:8px 0 6px;font-size:20px;color:var(--navy)}
.premium-icon{font-size:38px;line-height:1}
.cofre-hero,.upgrade-card{text-align:center;padding:20px 18px;background:linear-gradient(135deg,#fff8d6,#effaf0)}
.cofre-box{padding:14px;background:#fff}.cofre-box label{display:block;font-weight:900;color:var(--navy);margin-bottom:8px}.cofre-box input,.cofre-box textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px;background:#fbfbfb;color:var(--text);font:inherit}.cofre-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.mission-hero{display:flex;align-items:center;gap:12px;padding:14px;background:linear-gradient(135deg,#fff8d6,#eefbea)}
.missions-list{margin:12px 20px 20px}.mission-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:13px;margin-bottom:10px;box-shadow:0 5px 14px rgba(7,18,71,.06)}
.mission-card .mission-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.mission-card b{color:var(--navy)}.mission-card small{color:var(--muted)}.mission-bar{height:10px;background:#eef0f3;border-radius:99px;overflow:hidden;margin-top:10px}.mission-bar span{display:block;height:100%;background:linear-gradient(90deg,#0c2c8c,#22b35b);border-radius:99px}.mission-done{color:#149a34;font-weight:900}
.upgrade-card ul{text-align:left;margin:14px auto;max-width:330px;color:var(--text);font-weight:700;line-height:1.7}.upgrade-card li{margin:3px 0}.hide{display:none!important}
#reportContent.locked{display:none!important}
.menu-btn.pro-action{background:linear-gradient(135deg,#fff8d6,#f7fff0);border-color:#f0dd9a}
@media(max-width:380px){.cofre-actions{grid-template-columns:1fr}.plan-card{align-items:flex-start;flex-direction:column}.plan-card button{width:100%}}


/* Ajuste: remover Ver todos/Ver menos e destacar tipo do lançamento */
#btnShowAll{display:none!important;}
#screenHome .section-title{justify-content:flex-start!important;}
.item.item-income{border-left:4px solid var(--greenText)!important;}
.item.item-expense{border-left:4px solid var(--redText)!important;}
.status-ball.status-income{background:#eefbf1!important;color:var(--greenText)!important;}
.status-ball.status-expense{background:#fff0f1!important;color:var(--redText)!important;}

/* Correção definitiva da barra lateral dos lançamentos */
#screenHome .recent-list .item{
  position:relative!important;
  overflow:hidden!important;
  border-left:0!important;
  padding-left:18px!important;
}
#screenHome .recent-list .item::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  border-radius:18px 0 0 18px;
  background:#d33f49;
}
#screenHome .recent-list .item.item-income::before{
  background:var(--greenText,#169c39)!important;
}
#screenHome .recent-list .item.item-expense::before{
  background:var(--red,#d33f49)!important;
}
#screenHome .recent-list .item.item-income{
  box-shadow:inset 0 0 0 1px rgba(22,156,57,.10)!important;
}
#screenHome .recent-list .item.item-expense{
  box-shadow:inset 0 0 0 1px rgba(211,63,73,.10)!important;
}

/* Cofre de objetivos financeiros */
.goal-mini-card{
  margin:12px 20px 14px;
  padding:13px 14px;
  border:1px solid #e8d9b8;
  border-radius:22px;
  background:linear-gradient(135deg,#fff8d6,#effaf0);
  box-shadow:0 8px 22px rgba(7,18,71,.07);
}
.goal-mini-top{display:flex;align-items:center;gap:10px}
.goal-mini-top span:first-child{font-size:24px;line-height:1}
.goal-mini-top small{display:block;color:var(--muted);font-weight:800}
.goal-mini-top b{display:block;color:var(--navy);font-weight:900}
.goal-mini-top button{margin-left:auto;border:0;border-radius:999px;padding:7px 12px;background:var(--navy);color:#fff;font-weight:900;cursor:pointer}
.goal-progress{height:10px;background:#eef0f3;border-radius:99px;overflow:hidden;margin-top:10px}
.goal-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#0c2c8c,#22b35b);border-radius:99px;transition:width .25s ease}
.goal-mini-card p{margin:7px 0 0;color:var(--muted);font-size:12px;font-weight:700}
.goals-panel{margin:12px 20px;padding:14px;border:1px solid var(--line);border-radius:22px;background:var(--card);box-shadow:0 8px 22px rgba(7,18,71,.06)}
.goals-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.goals-head h3{margin:0;color:var(--navy);font-size:18px}.goals-head p{margin:3px 0 0;color:var(--muted);font-size:12px}
.small-primary{padding:9px 12px!important;font-size:12px!important;border-radius:999px!important;white-space:nowrap}
.goals-list{display:grid;gap:10px}
.goal-card{border:1px solid var(--line);border-radius:18px;padding:12px;background:#fffdf8;box-shadow:0 5px 14px rgba(7,18,71,.05)}
.goal-card.done{background:linear-gradient(135deg,#effaf0,#fff)}
.goal-card-top{display:flex;align-items:center;gap:10px}
.goal-emoji{font-size:25px;line-height:1}.goal-card-top b{display:block;color:var(--navy);font-weight:900}.goal-card-top small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.goal-card-top strong{margin-left:auto;color:var(--navy);font-weight:900}
.goal-card p{margin:8px 0 0;color:var(--muted);font-size:12px;font-weight:700}
.goal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.goal-actions button{border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);padding:7px 11px;font-weight:900;cursor:pointer}.goal-actions .goal-deposit{background:var(--navy);color:#fff;border-color:var(--navy)}.goal-actions .goal-delete{color:#df3d4a}
.empty-goals{text-align:center;padding:18px 12px;color:var(--muted);border:1px dashed var(--line);border-radius:18px;background:#fff}.empty-goals b{display:block;color:var(--navy);margin-bottom:4px}.empty-goals p{margin:0;font-size:12px}
.cofre-hero.compact{padding:14px 18px}.goal-deposit-name{margin:0 0 10px;color:var(--navy);font-weight:900}
@media(max-width:380px){.goals-head{align-items:flex-start;flex-direction:column}.small-primary{width:100%}.goal-mini-top{align-items:flex-start}.goal-mini-top button{padding:7px 10px}}

/* Backup automático seguro PRO */
.backup-secure-card{
  margin:14px 20px 0;
  width:calc(100% - 40px);
  border:1px solid #eadfcb;
  border-radius:18px;
  padding:14px;
  background:linear-gradient(135deg,#fff8d6,#ffffff);
  box-shadow:0 8px 22px rgba(13,22,75,.07);
}
.backup-secure-card.locked{opacity:.72;filter:saturate(.75)}
.backup-secure-card.active{background:linear-gradient(135deg,#e8fff0,#fffdf7)}
.backup-secure-head{display:flex;align-items:flex-start;gap:10px}
.backup-secure-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:999px;background:#fff;color:var(--navy);border:1px solid #eadfcb;font-size:17px;flex:none}
.backup-secure-card b{display:block;color:var(--navy);font-size:16px;line-height:1.1}
.backup-secure-card p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.25}
.backup-secure-meta{margin-top:10px;padding:9px 10px;border-radius:14px;background:#fffdf7;border:1px dashed #eadfcb;color:var(--muted);font-size:12px;text-align:center}
.backup-secure-card .secondary.mini{margin-top:10px;padding:11px 12px;border-radius:14px;font-size:13px;background:#fff;color:var(--navy);border:1px solid #eadfcb;box-shadow:none}
.recovery-sheet{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 30px);max-width:470px;background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:0 18px 50px rgba(0,0,0,.25);z-index:40;padding:16px;text-align:center}
.recovery-sheet.show{display:block}
.recovery-icon{width:54px;height:54px;border-radius:999px;margin:4px auto 8px;display:grid;place-items:center;background:linear-gradient(135deg,#fff8d6,#e8fff0);border:1px solid #eadfcb;font-size:26px}
.recovery-sheet h2{margin:4px 0 8px;font-size:20px;color:var(--navy)}
.recovery-sheet p{margin:0 auto 12px;max-width:390px;color:var(--muted);font-size:13px;line-height:1.35}
.recovery-key-box{padding:13px;border:1px dashed #d6c69f;border-radius:16px;background:#fffdf7;color:var(--navy);font-weight:900;font-size:14px;line-height:1.45;word-break:break-word;user-select:text}
.recovery-sheet .secondary,.recovery-sheet .primary{margin-top:10px;border-radius:16px;font-size:15px;padding:13px}


/* Modal flutuante padrão do Pão Duro */
.app-modal-overlay{position:fixed;inset:0;background:rgba(7,18,71,.42);z-index:80;display:none;backdrop-filter:blur(2px)}
.app-modal-overlay.show{display:block}
.app-modal{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:90;width:calc(100% - 32px);max-width:430px;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:26px;box-shadow:0 22px 70px rgba(7,18,71,.28);padding:18px;text-align:center;color:var(--navy)}
.app-modal.show{display:block;animation:modalPop .16s ease-out}
@keyframes modalPop{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.app-modal h2{margin:6px 0 10px;font-size:20px;font-weight:900;letter-spacing:.02em;color:var(--navy)}
.app-modal p{margin:0 auto 14px;max-width:360px;color:#43516a;font-size:14px;line-height:1.45;white-space:pre-line}
.app-modal-input{display:none;width:100%;border:1px solid var(--line);border-radius:16px;background:#fffefa;padding:13px 14px;font-weight:800;color:var(--navy);outline:none;margin:8px 0 14px;text-align:left}
.app-modal-input.show{display:block}
.app-modal-actions{display:flex;gap:10px;justify-content:center;align-items:center;margin-top:8px;flex-wrap:wrap}
.app-modal-actions button{border:0;border-radius:18px;padding:12px 18px;font-weight:900;cursor:pointer;min-width:120px}
.app-modal-actions .modal-primary{background:linear-gradient(180deg,#113aa2,#071247);color:#fff;box-shadow:0 8px 18px rgba(7,18,71,.18)}
.app-modal-actions .modal-secondary{background:#fff4df;color:var(--navy);border:1px solid var(--line)}
.app-modal-actions .modal-danger{background:#fff0f0;color:#e23b4b;border:1px solid rgba(226,59,75,.22)}

.goal-mini-card{cursor:pointer;overflow:hidden}
.goal-mini-card .goal-mini-top small,.goal-mini-card #btnGoalMini{display:none!important}
.goal-mini-card:focus{outline:2px solid rgba(17,58,162,.35);outline-offset:3px}
.goal-slide-up{animation:goalSlideUp .36s ease both}
@keyframes goalSlideUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.goal-modal-form{text-align:left;margin-top:4px}
.goal-modal-form label{display:block;margin:12px 0 6px;font-weight:900;color:var(--navy);font-size:14px}
.goal-modal-form input{width:100%;border:1px solid var(--line);border-radius:16px;background:#fffefa;padding:13px 14px;font-weight:800;color:var(--navy);outline:none}
.goal-modal-form input:focus{border-color:#113aa2;box-shadow:0 0 0 3px rgba(17,58,162,.12)}
.goal-modal-note{font-size:12px!important;margin:10px 0 0!important;color:#607089!important;white-space:normal!important}

.deposit-modal-head{display:flex;align-items:center;gap:12px;background:#fffaf0;border:1px solid var(--line);border-radius:18px;padding:12px;margin-bottom:12px}
.deposit-modal-head .goal-emoji{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff3d5;border:1px solid #f1d8a8;font-size:20px;flex:0 0 auto}
.deposit-modal-head b{display:block;color:var(--navy);font-size:17px}
.deposit-modal-head small{display:block;color:#607089;font-weight:800;margin-top:2px}
.deposit-modal-form .goal-progress{margin:10px 0 8px}
.conquest-rank{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px;border-radius:22px;background:linear-gradient(135deg,#fff7cf,#eaffdf);border:1px solid #ead9aa;margin-bottom:14px}
.conquest-rank h3{margin:2px 0;font-size:22px;color:var(--navy)}
.conquest-rank p{margin:0;color:#5f6b7a;font-weight:700}.rank-medal{font-size:38px}
.conquest-title{font-size:18px;margin:18px 0 10px;color:var(--navy)}
.achievements-grid{display:grid;grid-template-columns:1fr;gap:10px}.achievement-badge{display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;border:1px solid #ead9aa;background:#fffdf8}.achievement-badge span{font-size:24px}.achievement-badge b{display:block;color:var(--navy)}.achievement-badge small{display:block;color:#64748b}.achievement-badge strong{margin-left:auto}.achievement-badge.locked{opacity:.55;filter:grayscale(1)}.achievement-badge.unlocked{box-shadow:0 10px 22px rgba(16,185,129,.08)}.ranking-box{padding:14px;border-radius:20px;background:#fffdf8;border:1px solid #ead9aa}.ranking-box p{margin:0 0 10px;color:#334155;font-weight:700;font-size:13px}
.conquest-note{margin:0 0 10px;color:#64748b;font-weight:700;font-size:12px;line-height:1.35}.mission-card.completed{background:linear-gradient(90deg,#f0fff4,#fffdf8);border-color:#b7efca}.mission-points{margin:8px 0 0;color:#64748b;font-size:12px;font-weight:800}.ranking-box small{display:block;margin-top:8px;color:#64748b;font-weight:700;line-height:1.35}

/* Ajuste 07/07 - Conquistas compactas: uma missão por período */
.single-mission .mission-label{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:4px 9px;
  margin-bottom:8px;
  border-radius:999px;
  background:#fff3cf;
  color:#071247;
  font-size:11px;
  font-weight:900;
  border:1px solid #ead9aa;
}
.mission-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}
.mission-foot b{color:#071247;font-size:12px}
.mission-system-note,.catalog-summary,.medal-summary{
  margin:12px 0;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid #ead9aa;
  background:linear-gradient(135deg,#fffdf8,#f3fff0);
}
.mission-system-note b,.catalog-summary b,.medal-summary b{color:#071247;font-size:14px}
.mission-system-note p,.catalog-summary p,.medal-summary p{margin:4px 0 0;color:#64748b;font-size:12px;font-weight:700;line-height:1.35}
.medal-summary{display:flex;align-items:center;justify-content:space-between;gap:12px}
.medal-summary span{font-size:30px}
.medal-mini-list{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px}
.medal-mini-list span{font-size:11px;font-weight:800;color:#071247;background:#fff;border:1px solid #ead9aa;border-radius:999px;padding:6px 9px;box-shadow:0 4px 10px rgba(7,18,71,.04)}
.missions-list{padding-bottom:80px}


/* Pão Duro 2.2 — Monetização e diagnóstico */
.smart-diagnosis{margin:14px 0;padding:18px;border-radius:24px;background:linear-gradient(135deg,#111827,#263449);color:#fff;box-shadow:0 14px 32px rgba(17,24,39,.16)}
.smart-diagnosis-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.smart-diagnosis-head small{opacity:.68;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.smart-diagnosis-head h3{margin:3px 0;font-size:1.15rem}.smart-diagnosis-head>span{font-size:2rem}.smart-diagnosis>p{margin:8px 0 16px;color:#dbeafe;line-height:1.45}.diagnosis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.diagnosis-grid div{padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:rgba(255,255,255,.08)}.diagnosis-grid small{display:block;font-size:.67rem;opacity:.7}.diagnosis-grid b{display:block;margin-top:4px;font-size:.92rem}
.upgrade-hero{text-align:center;padding:26px 18px;border-radius:28px;background:linear-gradient(145deg,#111827,#24324a);color:white;position:relative;overflow:hidden}.pro-badge{position:absolute;top:14px;right:14px;background:#facc15;color:#111827;font-weight:1000;padding:6px 12px;border-radius:999px}.upgrade-hero h3{font-size:1.45rem;margin:8px auto;max-width:480px}.upgrade-hero p{color:#dbeafe;line-height:1.5}.billing-status{display:inline-block;margin-top:12px;padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.12);font-weight:800}.plan-selector{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.price-card{position:relative;padding:18px 12px;border:2px solid #d6dbe4;border-radius:22px;background:white;text-align:left}.price-card.active{border-color:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.14)}.price-card.best em{position:absolute;right:8px;top:-10px;background:#facc15;color:#111827;border-radius:999px;padding:4px 8px;font-size:.65rem;font-style:normal;font-weight:900}.price-card small,.price-card span{display:block;color:#64748b}.price-card b{display:block;font-size:1.35rem;margin:4px 0}.pro-benefits{display:grid;gap:9px}.pro-benefits div{display:grid;grid-template-columns:auto 1fr;column-gap:9px;padding:12px;border:1px solid #e5e7eb;border-radius:17px;background:white}.pro-benefits span{grid-column:2;color:#64748b;font-size:.82rem}.subscribe-pro{width:100%;margin-top:16px}.subscription-action{width:100%;margin-top:9px}.danger-link{border:0;background:transparent;color:#dc2626;font-weight:800;padding:12px}.checkout-note{text-align:center;color:#64748b;font-size:.76rem;line-height:1.4;margin:12px 10px}
@media(max-width:430px){.diagnosis-grid{grid-template-columns:1fr}.plan-selector{grid-template-columns:1fr}.price-card{text-align:center}}

/* ETAPA 2.3 — experiência PRO */
.pro-value-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.pro-value-strip div{text-align:center;padding:12px 6px;border-radius:16px;background:linear-gradient(180deg,#f8fafc,#fff);border:1px solid #e2e8f0}.pro-value-strip b{display:block;font-size:1rem;color:#166534}.pro-value-strip span{display:block;font-size:.68rem;color:#64748b;margin-top:3px}.plan-comparison{border:1px solid #e2e8f0;border-radius:20px;overflow:hidden;background:#fff;margin:14px 0}.plan-comparison>div{display:grid;grid-template-columns:1fr 64px 64px;align-items:center;gap:6px;padding:11px 12px;border-bottom:1px solid #eef2f7}.plan-comparison>div:last-child{border-bottom:0}.plan-comparison span{font-size:.78rem;color:#334155}.plan-comparison b{text-align:center;font-size:.8rem}.plan-comparison div b:last-child{color:#15803d}.comparison-head{background:#f8fafc}.comparison-head span,.comparison-head b{font-weight:900;color:#0f172a!important}.trial-button{width:100%;margin-top:16px;padding:14px;border-radius:16px;border:1px solid #16a34a;background:#f0fdf4;color:#166534;font-weight:900}.billing-history{margin-top:12px;border:1px solid #e2e8f0;border-radius:18px;background:#fff;overflow:hidden}.billing-history-item{padding:12px 14px;border-bottom:1px solid #eef2f7}.billing-history-item:last-child{border-bottom:0}.billing-history-item b{display:block;font-size:.82rem}.billing-history-item span{display:block;color:#64748b;font-size:.72rem;margin-top:3px}@media(max-width:390px){.pro-value-strip{grid-template-columns:1fr}.plan-comparison>div{grid-template-columns:1fr 48px 48px}}



/* ======================================================
   PÃO DURO V4 — DESKTOP PREMIUM + APP NATIVO RESPONSIVO
   ====================================================== */
:root{--pd-navy:#07164f;--pd-blue:#123b98;--pd-soft:#f5f8fc;--pd-line:#e4eaf3;--pd-text:#0e1b45;--pd-muted:#687594;--pd-green:#10a85a;--pd-red:#ef4354;--pd-card:#fff}
.desktop-only{display:none!important}

@media (min-width: 900px){
  html.browser-mode,html.browser-mode body{width:100%!important;min-height:100%!important;background:#f3f7fc!important;overflow:auto!important}
  html.browser-mode body{padding:0!important;color:var(--pd-text)!important}
  html.browser-mode .app{width:100%!important;max-width:none!important;min-height:100vh!important;margin:0!important;padding:0 0 0 244px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#f8fbff!important;overflow:visible!important;position:relative!important}
  html.browser-mode .app-header{height:88px!important;padding:0 34px!important;border-bottom:1px solid var(--pd-line)!important;background:rgba(255,255,255,.96)!important;position:sticky!important;top:0!important;z-index:30!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
  html.browser-mode .app-header h1{font-size:24px!important;margin:0!important;color:var(--pd-text)!important;letter-spacing:-.03em!important}
  html.browser-mode .app-header h1:after{content:'Visão geral da sua vida financeira';display:block;font-size:12px;font-weight:600;color:var(--pd-muted);letter-spacing:0;margin-top:5px}
  html.browser-mode .header-spacer{display:none!important}
  html.browser-mode #btnGoReportTop{width:42px!important;height:42px!important;border:1px solid var(--pd-line)!important;border-radius:12px!important;background:#fff!important;box-shadow:0 4px 16px rgba(20,44,100,.06)!important}
  html.browser-mode .bottom-nav{display:none!important}
  html.browser-mode .desktop-only{display:block!important}
  html.browser-mode .desktop-sidebar{position:fixed;left:0;top:0;bottom:0;width:244px;background:linear-gradient(180deg,#07164f 0%,#143b91 58%,#2d80d8 100%);color:#fff;padding:26px 14px 18px;z-index:50;display:flex!important;flex-direction:column;box-shadow:10px 0 36px rgba(7,22,79,.14)}
  html.browser-mode .desktop-brand{display:flex;align-items:center;gap:12px;padding:0 12px 24px;border-bottom:1px solid rgba(255,255,255,.13)}
  html.browser-mode .desktop-brand-mark{width:44px;height:44px;border-radius:14px;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;font-size:24px;background:rgba(255,255,255,.10)}
  html.browser-mode .desktop-brand b{display:block;font-size:20px;letter-spacing:-.02em}.desktop-brand small{color:#c8d8ff;font-size:11px}
  html.browser-mode .desktop-menu{display:flex;flex-direction:column;gap:5px;padding:22px 0;overflow:auto}
  html.browser-mode .desktop-menu button{border:0;background:transparent;color:#e8efff;border-radius:12px;min-height:46px;padding:0 13px;display:flex;align-items:center;gap:12px;font-weight:800;font-size:13px;text-align:left;cursor:pointer;transition:.18s}
  html.browser-mode .desktop-menu button:hover,html.browser-mode .desktop-menu button.active{background:#fff;color:#123276;box-shadow:0 8px 24px rgba(2,15,63,.18)}
  html.browser-mode .desktop-menu .ico{width:22px;text-align:center;font-size:17px}
  html.browser-mode .desktop-user{margin-top:auto;padding:14px 12px;border-top:1px solid rgba(255,255,255,.14);display:flex;align-items:center;gap:10px}
  html.browser-mode .desktop-avatar{width:38px;height:38px;border-radius:50%;background:#85ded2;color:#0c3479;display:grid;place-items:center;font-weight:900}
  html.browser-mode .desktop-user b{font-size:12px;display:block}.desktop-user small{color:#c9d9ff;font-size:10px}
  html.browser-mode .screen{display:none!important;height:auto!important;min-height:calc(100vh - 88px)!important;overflow:visible!important;padding:28px 32px 42px!important}
  html.browser-mode .screen.active{display:block!important;max-width:1500px!important;margin:0 auto!important}
  html.browser-mode #screenHome.screen.active{display:block!important}
  html.browser-mode .desktop-greeting{display:flex!important;align-items:flex-end;justify-content:space-between;margin-bottom:20px}
  html.browser-mode .desktop-greeting h2{font-size:26px;margin:0 0 5px;color:var(--pd-text)}.desktop-greeting p{margin:0;color:var(--pd-muted);font-size:13px}
  html.browser-mode .month-row{position:absolute!important;right:32px;top:27px;width:auto!important;gap:8px!important;margin:0!important;padding:0!important;background:#fff;border:1px solid var(--pd-line);border-radius:12px;box-shadow:0 4px 15px rgba(18,46,105,.05)}
  html.browser-mode .month-row strong{padding:0 8px;min-width:120px;text-align:center}.month-row .icon-btn{border:0!important;background:transparent!important}
  html.browser-mode #screenHome{position:relative}
  html.browser-mode #screenHome>.tabs{display:none!important}
  html.browser-mode #screenHome>.summary-card{display:none!important}
  html.browser-mode .desktop-kpis{display:grid!important;grid-template-columns:repeat(4,minmax(180px,1fr));gap:16px;margin:0 0 18px}
  html.browser-mode .desktop-kpi{background:#fff;border:1px solid var(--pd-line);border-radius:16px;padding:18px;display:flex;gap:14px;align-items:center;box-shadow:0 8px 26px rgba(18,46,105,.055);min-height:108px}
  html.browser-mode .desktop-kpi-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:22px;background:#eef5ff;color:#1a5bd8;flex:0 0 auto}.desktop-kpi.green .desktop-kpi-icon{background:#eaf9ef;color:var(--pd-green)}.desktop-kpi.red .desktop-kpi-icon{background:#fff0f2;color:var(--pd-red)}
  html.browser-mode .desktop-kpi small{display:block;color:var(--pd-muted);font-size:12px;margin-bottom:5px}.desktop-kpi b{display:block;font-size:21px;color:var(--pd-text)}.desktop-kpi.green b{color:#07904b}.desktop-kpi.red b{color:#df3045}.desktop-kpi em{font-size:10px;color:var(--pd-muted);font-style:normal}
  html.browser-mode .desktop-dashboard-grid{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(320px,.78fr);gap:16px;margin-bottom:16px}
  html.browser-mode .desktop-panel,html.browser-mode #screenHome .recent-section{background:#fff!important;border:1px solid var(--pd-line)!important;border-radius:16px!important;box-shadow:0 8px 26px rgba(18,46,105,.05)!important;padding:18px!important;margin:0!important}
  html.browser-mode .desktop-panel h3{font-size:14px;margin:0 0 16px}.desktop-panel-head{display:flex;align-items:center;justify-content:space-between}.desktop-panel-head span{font-size:11px;color:var(--pd-muted)}
  html.browser-mode .desktop-chart{width:100%;height:230px;display:block}.desktop-chart-grid{stroke:#e9eef6;stroke-width:1}.desktop-chart-income{fill:none;stroke:#12a95b;stroke-width:3}.desktop-chart-expense{fill:none;stroke:#ef4354;stroke-width:3}.desktop-chart-area{fill:url(#incomeGradient);opacity:.18}
  html.browser-mode #screenHome .recent-section{min-height:330px!important;max-height:330px!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
  html.browser-mode #screenHome .section-title{margin:0!important}.section-title h3{font-size:14px!important}.recent-tools{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:7px!important;margin:8px 0!important}.mini-select{grid-column:1/-1!important}.mini-filter{min-height:34px!important}.mini-select{min-height:36px!important}
  html.browser-mode #screenHome .recent-list{flex:1!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;margin:0!important;border:0!important}.item{padding:11px 12px!important}
  html.browser-mode .desktop-lower-grid{display:grid!important;grid-template-columns:1fr 1fr 1fr;gap:16px}
  html.browser-mode .desktop-category-list,.desktop-upcoming-list{display:flex;flex-direction:column;gap:9px}.desktop-cat-row,.desktop-upcoming-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;font-size:12px;padding:9px 0;border-bottom:1px solid #edf1f7}.desktop-cat-row:last-child,.desktop-upcoming-row:last-child{border-bottom:0}.desktop-cat-row b,.desktop-upcoming-row b{font-size:12px}.desktop-cat-bar{grid-column:1/-1;height:6px;background:#edf1f7;border-radius:99px;overflow:hidden}.desktop-cat-bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#215bc1,#68a8ef)}
  html.browser-mode #goalMiniCard{margin:0!important;min-height:100%;border:1px solid var(--pd-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 8px 26px rgba(18,46,105,.05)!important;padding:18px!important}.goal-progress{height:8px!important}
  html.browser-mode .desktop-pro-card{background:linear-gradient(145deg,#08205d,#1746a8)!important;color:#fff!important}.desktop-pro-card h3,.desktop-pro-card p{color:#fff}.desktop-pro-card ul{list-style:none;padding:0;margin:12px 0}.desktop-pro-card li{font-size:11px;margin:7px 0}.desktop-pro-card button{width:100%;border:0;border-radius:10px;padding:11px;background:#fff;color:#0c2d75;font-weight:900;cursor:pointer}
  html.browser-mode .fab{position:fixed!important;right:30px!important;bottom:28px!important;left:auto!important;transform:none!important;width:auto!important;min-width:170px!important;height:50px!important;border-radius:14px!important;padding:0 20px!important;font-size:0!important;z-index:42!important}.fab:after{content:'+  Novo lançamento';font-size:13px;font-weight:900}
  html.browser-mode .titlebar{margin-bottom:18px!important}.titlebar h2{font-size:24px!important}.report-panel,.report-top-card,.goals-panel,.cofre-box,.mission-card,.menu-btn,.option,.plan-card,.backup-secure-card,.reminder-settings{border-radius:16px!important;box-shadow:0 8px 26px rgba(18,46,105,.045)!important}
  html.browser-mode #screenMenu.screen.active,html.browser-mode #screenReports.screen.active,html.browser-mode #screenCofre.screen.active,html.browser-mode #screenMissions.screen.active,html.browser-mode #screenForm.screen.active,html.browser-mode #screenDetails.screen.active{max-width:1200px!important}
  html.browser-mode .data-sheet{left:calc(50% + 122px)!important;max-width:520px!important}
}

@media (min-width:900px) and (max-width:1180px){
 html.browser-mode .desktop-kpis{grid-template-columns:repeat(2,1fr)}html.browser-mode .desktop-dashboard-grid{grid-template-columns:1fr}.desktop-lower-grid{grid-template-columns:1fr 1fr!important}.desktop-pro-card{grid-column:1/-1}
}

/* APP/PWA/APK — preserva a experiência móvel e safe areas */
html.app-mode,html.app-mode body{width:100%!important;height:100%!important;overflow:hidden!important;position:fixed!important;inset:0!important;background:var(--bg)!important}
html.app-mode .app{width:100%!important;max-width:560px!important;height:100dvh!important;margin:0 auto!important;padding-bottom:calc(70px + env(safe-area-inset-bottom))!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
html.app-mode .app-header{padding-top:env(safe-area-inset-top)!important;height:calc(62px + env(safe-area-inset-top))!important}
html.app-mode .screen{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important}.app-mode .screen.active{display:flex!important;flex-direction:column!important}.app-mode .bottom-nav{padding-bottom:env(safe-area-inset-bottom)!important;height:calc(70px + env(safe-area-inset-bottom))!important}.app-mode .fab{bottom:calc(38px + env(safe-area-inset-bottom))!important}
@media(max-width:899px){.desktop-sidebar,.desktop-greeting,.desktop-kpis,.desktop-dashboard-grid,.desktop-lower-grid{display:none!important}html.browser-mode body{padding:0!important}html.browser-mode .app{max-width:560px!important;margin:0 auto!important}}


/* =========================================================
   PÃO DURO V5 — CENTRAL FINANCEIRA DESKTOP
   ========================================================= */
@media (min-width: 900px){
  html.browser-mode body{
    background:#f4f7fb;
  }
  html.browser-mode .desktop-sidebar{
    width:250px;
    background:linear-gradient(180deg,#07164f 0%,#0a2b79 52%,#267ed7 100%);
    box-shadow:10px 0 34px rgba(7,22,79,.08);
  }
  html.browser-mode .app{
    margin-left:250px;
    width:calc(100% - 250px);
    min-height:100vh;
    max-width:none;
    border-radius:0;
    box-shadow:none;
    background:#f7f9fc;
  }
  html.browser-mode .desktop-hidden{display:none!important}
  html.browser-mode .desktop-brand{padding:28px 22px 24px}
  html.browser-mode .desktop-brand-mark{
    width:48px;height:48px;border-radius:15px;
    display:grid;place-items:center;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.22);
    font-size:24px
  }
  html.browser-mode .desktop-brand b{font-size:21px}
  html.browser-mode .desktop-brand small{opacity:.78}
  html.browser-mode .desktop-menu{padding:12px}
  html.browser-mode .desktop-menu button{
    display:flex;align-items:center;gap:12px;
    width:100%;padding:13px 15px;margin:3px 0;
    border-radius:12px;border:0;background:transparent;
    color:#eef5ff;font-weight:750;text-align:left;
    transition:.18s ease
  }
  html.browser-mode .desktop-menu button:hover{background:rgba(255,255,255,.09);transform:translateX(2px)}
  html.browser-mode .desktop-menu button.active{
    background:#fff;color:#102968;
    box-shadow:0 8px 22px rgba(2,14,62,.18)
  }
  html.browser-mode .desktop-menu .ico{width:22px;text-align:center;font-size:18px}
  html.browser-mode .desktop-user{margin:16px;padding:17px 14px;border-top:1px solid rgba(255,255,255,.15)}
  html.browser-mode .desktop-top-actions{display:flex;align-items:center;gap:10px}
  html.browser-mode .desktop-top-actions small{color:#64748b}
  html.browser-mode .desktop-sync-dot{width:8px;height:8px;border-radius:50%;background:#16a365;box-shadow:0 0 0 4px rgba(22,163,101,.10)}
  html.browser-mode #desktopNewLaunch,
  html.browser-mode .desktop-primary-button{
    border:0;border-radius:12px;padding:12px 18px;
    background:linear-gradient(135deg,#173b9d,#071d69);
    color:#fff;font-weight:800;box-shadow:0 10px 24px rgba(14,43,129,.20)
  }
  html.browser-mode .desktop-greeting{padding:26px 30px 12px}
  html.browser-mode .desktop-greeting h2{font-size:25px;margin:0}
  html.browser-mode .desktop-greeting p{margin:6px 0 0;color:#64748b}
  html.browser-mode .desktop-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:12px 30px}
  html.browser-mode .desktop-kpi{
    min-height:116px;border:1px solid #e3e9f3;border-radius:18px;background:#fff;
    box-shadow:0 8px 26px rgba(26,51,94,.055);padding:19px
  }
  html.browser-mode .desktop-kpi-icon{width:44px;height:44px;border-radius:14px;background:#edf3ff;color:#1745b2;display:grid;place-items:center;font-size:21px}
  html.browser-mode .desktop-kpi.green .desktop-kpi-icon{background:#e7f8ee;color:#0c9a50}
  html.browser-mode .desktop-kpi.red .desktop-kpi-icon{background:#fff0f1;color:#e23949}
  html.browser-mode .desktop-kpi small{color:#68758c}
  html.browser-mode .desktop-kpi b{font-size:22px;margin:6px 0 3px}
  html.browser-mode .desktop-kpi em{font-style:normal;color:#8390a5;font-size:12px}
  html.browser-mode .desktop-dashboard-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr);
    gap:16px;padding:14px 30px
  }
  html.browser-mode .desktop-panel{
    background:#fff;border:1px solid #e2e8f1;border-radius:18px;
    box-shadow:0 8px 26px rgba(26,51,94,.05);padding:18px
  }
  html.browser-mode .desktop-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
  html.browser-mode .desktop-panel-head h3{margin:0;font-size:16px;color:#10204e}
  html.browser-mode .desktop-panel-head small{display:block;color:#8490a3;margin-top:4px}
  html.browser-mode .desktop-panel-head>span{background:#f4f7fb;border:1px solid #e4eaf3;border-radius:9px;padding:7px 10px;color:#67758c;font-size:12px}
  html.browser-mode .desktop-chart-panel{min-height:322px}
  html.browser-mode .desktop-chart{height:225px}
  html.browser-mode .desktop-chart-legend{display:flex;gap:18px;color:#607089;font-size:12px;margin-top:4px}
  html.browser-mode .desktop-chart-legend i{display:inline-block;width:18px;height:4px;border-radius:4px;margin-right:6px;vertical-align:middle}
  html.browser-mode .desktop-chart-legend i.income{background:#13aa5b}
  html.browser-mode .desktop-chart-legend i.expense{background:#ee3f50}
  html.browser-mode .desktop-lower-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:0 30px 30px}
  html.browser-mode .desktop-health-card{background:linear-gradient(145deg,#fff,#f6f9ff)}
  html.browser-mode .desktop-health-score{display:flex;align-items:flex-end;gap:4px;margin:10px 0}
  html.browser-mode .desktop-health-score strong{font-size:48px;line-height:1;color:#14378f}
  html.browser-mode .desktop-health-score small{font-size:15px;color:#8794a7;margin-bottom:7px}
  html.browser-mode .desktop-health-card p{min-height:55px;color:#64748b;line-height:1.45}
  html.browser-mode .desktop-health-card button{width:100%;border:1px solid #dce5f2;background:#f8fbff;color:#14378f;border-radius:10px;padding:10px;font-weight:800}
  html.browser-mode .desktop-pro-card{background:linear-gradient(145deg,#0a206b,#173fa8);color:#fff}
  html.browser-mode .desktop-pro-card h3{color:#fff}
  html.browser-mode .desktop-pro-card p,.desktop-pro-card li{color:#e7efff}
  html.browser-mode .desktop-upcoming-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #eef2f7}
  html.browser-mode .desktop-upcoming-row>span{display:flex;align-items:center;gap:10px}
  html.browser-mode .desktop-upcoming-row span span{display:flex;flex-direction:column}
  html.browser-mode .desktop-upcoming-row small{color:#8390a5;margin-top:3px}
  html.browser-mode .tx-in,.tx-out{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-style:normal}
  html.browser-mode .tx-in{background:#e6f8ed;color:#0b9f50}
  html.browser-mode .tx-out{background:#fff0f1;color:#df3547}
  html.browser-mode .positive{color:#0a9a4c!important}
  html.browser-mode .negative{color:#df3547!important}
  html.browser-mode .desktop-cat-row{margin:12px 0}
  html.browser-mode .desktop-cat-row>span{font-size:13px;color:#46536a}
  html.browser-mode .desktop-cat-row>b{float:right;font-size:12px;color:#253555}
  html.browser-mode .desktop-cat-bar{height:7px;background:#edf1f6;border-radius:999px;overflow:hidden;margin-top:7px}
  html.browser-mode .desktop-cat-bar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#254fd1,#43a0ef)}
  html.browser-mode .desktop-workspace{
    display:none;margin-left:250px;min-height:100vh;background:#f4f7fb;padding:30px
  }
  html.browser-mode .desktop-workspace.show{display:block}
  html.browser-mode .desktop-workspace-header{
    max-width:1450px;margin:0 auto 22px;display:flex;align-items:center;justify-content:space-between;
    background:#fff;border:1px solid #e2e8f1;border-radius:18px;padding:22px 24px;
    box-shadow:0 8px 26px rgba(26,51,94,.05)
  }
  html.browser-mode .desktop-workspace-header small{color:#6d7b93;font-weight:800;letter-spacing:.09em}
  html.browser-mode .desktop-workspace-header h2{margin:5px 0 4px;font-size:25px;color:#10204e}
  html.browser-mode .desktop-workspace-header p{margin:0;color:#7d899b}
  html.browser-mode .desktop-workspace-actions{display:flex;gap:10px}
  html.browser-mode .desktop-workspace-actions button{
    border:1px solid #dce4ef;background:#fff;color:#173987;border-radius:10px;padding:10px 13px;font-weight:750
  }
  html.browser-mode .desktop-workspace-actions button:last-child{background:#102d85;color:#fff;border-color:#102d85}
  html.browser-mode .desktop-workspace-body{max-width:1450px;margin:0 auto}
  html.browser-mode .desktop-page-toolbar{display:flex;justify-content:space-between;gap:15px;margin-bottom:16px}
  html.browser-mode .desktop-search{
    display:flex;align-items:center;gap:9px;flex:1;background:#fff;border:1px solid #e1e7f0;border-radius:12px;padding:0 15px;color:#718096
  }
  html.browser-mode .desktop-search input{width:100%;border:0;outline:0;padding:13px 0;background:transparent;font:inherit}
  html.browser-mode .desktop-table-card{background:#fff;border:1px solid #e2e8f1;border-radius:18px;overflow:hidden;box-shadow:0 8px 26px rgba(26,51,94,.05)}
  html.browser-mode .desktop-table-head,.desktop-table-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;align-items:center;gap:14px;padding:14px 18px}
  html.browser-mode .desktop-table-head{background:#f7f9fc;color:#718096;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
  html.browser-mode .desktop-table-row{border-top:1px solid #edf1f6}
  html.browser-mode .desktop-table-row>span:first-child{display:flex;align-items:center;gap:10px}
  html.browser-mode .desktop-table-row strong{text-align:right}
  html.browser-mode .desktop-empty{padding:34px;text-align:center;color:#8290a4}
  html.browser-mode .desktop-central-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px}
  html.browser-mode .desktop-central-kpis article{background:#fff;border:1px solid #e2e8f1;border-radius:16px;padding:20px;box-shadow:0 8px 26px rgba(26,51,94,.05)}
  html.browser-mode .desktop-central-kpis small{color:#748197}
  html.browser-mode .desktop-central-kpis strong{display:block;font-size:24px;color:#10204e;margin:8px 0}
  html.browser-mode .desktop-central-kpis span{color:#8b97a8;font-size:12px}
  html.browser-mode .desktop-central-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  html.browser-mode .desktop-wide-panel{grid-column:1/-1}
  html.browser-mode .desktop-finance-map>div{margin:18px 0}
  html.browser-mode .desktop-finance-map span{color:#5f6e86}
  html.browser-mode .desktop-finance-map b{float:right;color:#1d2b4e}
  html.browser-mode .mapbar{height:10px;border-radius:999px;background:#eef2f7;overflow:hidden;clear:both;margin-top:9px}
  html.browser-mode .mapbar i{display:block;height:100%;background:#18a85b;border-radius:inherit}
  html.browser-mode .mapbar.danger i{background:#e94352}
  html.browser-mode .mapbar.balance i{background:#2a64d7}
  html.browser-mode .diagnosis-item{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:12px;margin:9px 0;background:#f6f8fc;color:#536178}
  html.browser-mode .diagnosis-item i{width:10px;height:10px;border-radius:50%;margin-top:5px;background:#4a77d4}
  html.browser-mode .diagnosis-item.success i{background:#16a15a}.diagnosis-item.warning i{background:#efa928}.diagnosis-item.danger i{background:#e63a4c}
  html.browser-mode .desktop-mini-transactions>div{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #edf1f6}
  html.browser-mode .desktop-mini-transactions>div>span{display:flex;align-items:center;gap:10px}
  html.browser-mode .desktop-mini-transactions span span{display:flex;flex-direction:column}
  html.browser-mode .desktop-mini-transactions small{color:#8390a5}
  html.browser-mode .desktop-calendar-toolbar{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:14px}
  html.browser-mode .desktop-calendar-toolbar button{width:38px;height:38px;border-radius:10px;border:1px solid #dce4ef;background:#fff;color:#173987;font-size:20px}
  html.browser-mode .desktop-calendar-card{background:#fff;border:1px solid #e2e8f1;border-radius:18px;padding:16px;box-shadow:0 8px 26px rgba(26,51,94,.05)}
  html.browser-mode .desktop-calendar-week,.desktop-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr)}
  html.browser-mode .desktop-calendar-week span{padding:10px;text-align:center;color:#718096;font-weight:800;font-size:12px}
  html.browser-mode .desktop-calendar-day{min-height:115px;border:1px solid #edf1f6;padding:9px;background:#fff}
  html.browser-mode .desktop-calendar-day b{color:#2a3757}
  html.browser-mode .desktop-calendar-day span{display:block;margin-top:7px;padding:5px 6px;border-radius:7px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html.browser-mode .desktop-calendar-day span.income{background:#e9f8ee;color:#0a9148}
  html.browser-mode .desktop-calendar-day span.expense{background:#fff0f1;color:#d83948}
  html.browser-mode .desktop-calendar-day small{display:block;margin-top:5px;color:#8490a3}
}


/* =========================================================
   PÃO DURO V5.1 — CORREÇÃO DE NAVEGAÇÃO E SOBREPOSIÇÃO
   ========================================================= */
@media (min-width: 900px){
  /* .desktop-only usa !important na base; portanto o workspace também
     precisa controlar sua exibição com !important. */
  html.browser-mode .desktop-workspace{
    display:none!important;
  }
  html.browser-mode .desktop-workspace.show{
    display:block!important;
  }

  /* Garante que a aplicação original desapareça ao abrir páginas novas. */
  html.browser-mode .app.desktop-hidden{
    display:none!important;
  }

  /* Menu lateral sem a barra branca interna que apareceu nas capturas. */
  html.browser-mode .desktop-sidebar{
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:none;
  }
  html.browser-mode .desktop-sidebar::-webkit-scrollbar{
    width:0;
    height:0;
  }
  html.browser-mode .desktop-menu{
    overflow:visible!important;
    max-height:none!important;
  }

  /* Evita sobra de tela antiga abaixo das páginas nativas. */
  html.browser-mode .desktop-workspace:not(.show){
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    border:0!important;
  }
}


/* =========================================================
   PÃO DURO V5.2 — LOGO OFICIAL E SAIR DA CONTA
   ========================================================= */
@media (min-width: 900px){
  html.browser-mode .desktop-brand-mark{
    overflow:hidden;
    padding:0;
    background:#fff;
  }
  html.browser-mode .desktop-brand-mark img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  html.browser-mode .desktop-user{
    display:flex;
    flex-direction:column;
    gap:13px;
  }
  html.browser-mode .desktop-user-main{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
  }
  html.browser-mode .desktop-user-main>div:last-child{
    min-width:0;
    display:flex;
    flex-direction:column;
  }
  html.browser-mode .desktop-user-main b,
  html.browser-mode .desktop-user-main small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  html.browser-mode .desktop-logout{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid rgba(255,255,255,.24);
    background:rgba(255,255,255,.08);
    color:#fff;
    border-radius:11px;
    padding:10px 12px;
    font-weight:800;
    cursor:pointer;
    transition:.18s ease;
  }
  html.browser-mode .desktop-logout:hover{
    background:#fff;
    color:#12337f;
    transform:translateY(-1px);
  }
}


/* =========================================================
   PÃO DURO — ETAPA 1: BROWSER PREMIUM
   ========================================================= */
@media (min-width: 900px){
  html.browser-mode body{background:#eef3f9}
  html.browser-mode .premium-topbar{
    position:fixed;top:0;left:250px;right:0;height:76px;z-index:70;
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    padding:0 30px;background:rgba(255,255,255,.96);
    border-bottom:1px solid #dfe7f1;backdrop-filter:blur(14px)
  }
  html.browser-mode .app{padding-top:76px}
  html.browser-mode .desktop-workspace{padding-top:106px}
  html.browser-mode .premium-search{
    flex:1;max-width:560px;height:44px;display:flex;align-items:center;gap:10px;
    padding:0 15px;border:1px solid #dce5f0;border-radius:13px;background:#f7f9fc
  }
  html.browser-mode .premium-search input{width:100%;border:0;outline:0;background:transparent;font:inherit;color:#17213f}
  html.browser-mode .premium-top-actions{display:flex;align-items:center;gap:10px}
  html.browser-mode .premium-top-actions button{
    height:42px;border-radius:12px;border:1px solid #dce5f0;background:#fff;
    color:#14347f;font-weight:800;padding:0 14px;position:relative
  }
  html.browser-mode .premium-top-actions #premiumAdd{
    border:0;color:#fff;padding:0 19px;
    background:linear-gradient(135deg,#214fce,#071e6b);
    box-shadow:0 10px 24px rgba(24,59,159,.22)
  }
  html.browser-mode .premium-sync{font-size:12px;color:#66758c;display:flex;align-items:center;gap:7px}
  html.browser-mode .premium-sync i{width:8px;height:8px;border-radius:50%;background:#16a05a;box-shadow:0 0 0 4px rgba(22,160,90,.1)}
  html.browser-mode .premium-badge{
    position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;border-radius:999px;
    display:grid;place-items:center;background:#e7384a;color:#fff;font-size:10px
  }
  html.browser-mode .desktop-greeting{padding-top:30px}
  html.browser-mode .premium-highlights{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
    padding:0 30px 16px
  }
  html.browser-mode .premium-highlights article{
    background:linear-gradient(145deg,#fff,#f8fbff);border:1px solid #dfe7f1;
    border-radius:16px;padding:18px;box-shadow:0 8px 24px rgba(27,55,103,.045)
  }
  html.browser-mode .premium-highlights small{display:block;color:#77859a;margin-bottom:7px}
  html.browser-mode .premium-highlights strong{display:block;font-size:22px;color:#10245d;margin-bottom:4px}
  html.browser-mode .premium-highlights span{font-size:12px;color:#8b97a8}
  html.browser-mode .premium-footer{
    display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;
    margin:0 30px 24px;padding:15px 18px;border:1px solid #dfe7f1;border-radius:14px;
    background:#fff;color:#718096;font-size:12px
  }
  html.browser-mode .premium-footer b{color:#173783}
  html.premium-dark.browser-mode body{background:#0e1728}
  html.premium-dark.browser-mode .app,
  html.premium-dark.browser-mode .desktop-workspace{background:#101b2d;color:#edf3ff}
  html.premium-dark.browser-mode .premium-topbar,
  html.premium-dark.browser-mode .desktop-panel,
  html.premium-dark.browser-mode .desktop-kpi,
  html.premium-dark.browser-mode .premium-highlights article,
  html.premium-dark.browser-mode .premium-footer,
  html.premium-dark.browser-mode .desktop-workspace-header,
  html.premium-dark.browser-mode .desktop-table-card,
  html.premium-dark.browser-mode .desktop-central-kpis article,
  html.premium-dark.browser-mode .desktop-calendar-card{background:#17243a;border-color:#263752;color:#edf3ff}
  html.premium-dark.browser-mode .premium-search{background:#111d30;border-color:#2a3a55}
  html.premium-dark.browser-mode .premium-search input{color:#edf3ff}
  html.premium-dark.browser-mode h1,
  html.premium-dark.browser-mode h2,
  html.premium-dark.browser-mode h3,
  html.premium-dark.browser-mode strong,
  html.premium-dark.browser-mode b{color:#edf3ff!important}
}


/* =========================================================
   PÃO DURO — ETAPA 1.1
   CORREÇÃO DE ORGANIZAÇÃO DO BROWSER E DO APP
   ========================================================= */

/* ---------- BROWSER / DESKTOP ---------- */
@media (min-width: 900px){
  html.browser-mode .premium-topbar{
    left:250px;
    height:72px;
    padding:0 24px;
    gap:18px;
  }

  html.browser-mode .premium-search{
    min-width:240px;
    max-width:460px;
    height:42px;
    flex:1 1 340px;
  }

  html.browser-mode .premium-top-actions{
    margin-left:auto;
    flex:0 0 auto;
    flex-wrap:nowrap;
  }

  html.browser-mode .premium-top-actions button{
    white-space:nowrap;
  }

  html.browser-mode #premiumTheme,
  html.browser-mode #premiumNotifications{
    width:42px;
    padding:0;
    display:grid;
    place-items:center;
  }

  html.browser-mode #premiumAdd{
    min-width:180px;
  }

  html.browser-mode .desktop-workspace{
    padding-top:96px;
  }

  html.browser-mode .desktop-workspace-header,
  html.browser-mode .desktop-workspace-body{
    max-width:none;
    width:100%;
  }

  html.browser-mode .desktop-page-toolbar{
    align-items:center;
  }

  html.browser-mode .desktop-search{
    max-width:none;
    min-width:0;
  }

  html.browser-mode .desktop-table-head,
  html.browser-mode .desktop-table-row{
    grid-template-columns:minmax(280px,2fr) minmax(150px,1fr) 130px 150px;
  }

  html.browser-mode .desktop-table-row{
    min-height:62px;
  }

  html.browser-mode .desktop-table-row>span:first-child{
    min-width:0;
  }

  html.browser-mode .desktop-table-row>span:first-child b{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  html.browser-mode .desktop-table-row>span:nth-child(2){
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  html.browser-mode .desktop-table-row strong{
    white-space:nowrap;
  }
}

@media (min-width: 900px) and (max-width: 1180px){
  html.browser-mode .premium-sync{
    display:none;
  }

  html.browser-mode .premium-search{
    max-width:360px;
  }

  html.browser-mode #premiumAdd{
    min-width:150px;
    padding:0 14px;
  }
}

/* ---------- APP / APK / PWA ---------- */
html.app-mode body{
  margin:0!important;
  background:#f7f2e8!important;
  min-height:100vh!important;
  display:flex!important;
  justify-content:center!important;
  align-items:flex-start!important;
  overflow-x:hidden!important;
}

html.app-mode .desktop-only,
html.app-mode .desktop-sidebar,
html.app-mode .desktop-workspace,
html.app-mode .premium-topbar,
html.app-mode .premium-highlights,
html.app-mode .premium-footer{
  display:none!important;
}

html.app-mode .app{
  width:100%!important;
  max-width:430px!important;
  min-width:0!important;
  min-height:100vh!important;
  margin:0 auto!important;
  padding-top:0!important;
  border-radius:0!important;
  box-shadow:0 0 28px rgba(12,34,80,.08)!important;
  overflow:hidden!important;
  background:#f8fbff!important;
}

html.app-mode .screen{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding-left:16px!important;
  padding-right:16px!important;
  box-sizing:border-box!important;
}

html.app-mode .screen.active{
  display:block!important;
}

html.app-mode .desktop-dashboard-grid,
html.app-mode .desktop-lower-grid,
html.app-mode .desktop-kpis,
html.app-mode .premium-highlights{
  display:none!important;
}

html.app-mode #screenHome{
  padding-top:0!important;
}

html.app-mode .topbar,
html.app-mode header{
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

html.app-mode .tabs,
html.app-mode .filters,
html.app-mode .summary,
html.app-mode .recent-section,
html.app-mode .card,
html.app-mode .panel{
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

html.app-mode .tabs{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

html.app-mode .filters{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}

html.app-mode #list{
  width:100%!important;
  overflow:hidden!important;
}

html.app-mode #list .item{
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

html.app-mode .bottom-nav{
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:100%!important;
  max-width:430px!important;
}

html.app-mode .fab,
html.app-mode #btnAdd{
  position:fixed!important;
  right:calc(50% - 195px)!important;
  bottom:78px!important;
  z-index:50!important;
}

@media (max-width: 460px){
  html.app-mode .app{
    max-width:100%!important;
  }

  html.app-mode .fab,
  html.app-mode #btnAdd{
    right:18px!important;
  }
}


/* =========================================================
   PÃO DURO — ETAPA 1.2
   CORREÇÃO DEFINITIVA DO APP + NOTIFICAÇÕES
   ========================================================= */

/* O app.html já inicia com class="app-mode" antes do CSS carregar. */
html.app-mode,
html.app-mode body{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  position:static!important;
  inset:auto!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  background:#f6f0e5!important;
}

html.app-mode body{
  display:block!important;
}

html.app-mode .app{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:430px!important;
  min-width:0!important;
  min-height:100vh!important;
  height:auto!important;
  max-height:none!important;
  margin:0 auto!important;
  padding:0 0 86px!important;
  overflow:visible!important;
  display:block!important;
  background:#f8fbff!important;
}

html.app-mode .app > *:not(.bottom-nav):not(.fab):not(.toast):not(.modal):not(.app-modal):not(.app-modal-overlay){
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  transform:none!important;
}

html.app-mode .app-header{
  width:100%!important;
  height:66px!important;
  padding:0 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
}

html.app-mode .app-header h1{
  font-size:24px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
}

html.app-mode .screen{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0 14px!important;
  overflow:visible!important;
  display:none!important;
  flex:none!important;
}

html.app-mode .screen.active{
  display:block!important;
}

html.app-mode .month-row{
  width:100%!important;
  margin:0!important;
  padding:10px 0 14px!important;
  justify-content:center!important;
  gap:24px!important;
}

html.app-mode .tabs{
  width:100%!important;
  margin:0 0 14px!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
}

html.app-mode .summary-card,
html.app-mode .recent-section,
html.app-mode .recent-tools,
html.app-mode .recent-list,
html.app-mode .category-card,
html.app-mode .form-card,
html.app-mode .menu-card,
html.app-mode .card,
html.app-mode .panel{
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

html.app-mode .recent-list{
  overflow:hidden!important;
}

html.app-mode #list{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}

html.app-mode #list .item{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  overflow:hidden!important;
}

html.app-mode #list .item-info{
  min-width:0!important;
  flex:1 1 auto!important;
}

html.app-mode #list .item-info b,
html.app-mode #list .item-info small{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

html.app-mode #list .value{
  flex:0 0 auto!important;
  white-space:nowrap!important;
  font-size:16px!important;
}

html.app-mode .bottom-nav{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:0!important;
  transform:translateX(-50%)!important;
  width:100%!important;
  max-width:430px!important;
  margin:0!important;
}

html.app-mode .fab,
html.app-mode #btnAdd{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:38px!important;
  transform:translateX(-50%)!important;
  margin:0!important;
}

html.app-mode .desktop-only,
html.app-mode .desktop-sidebar,
html.app-mode .desktop-workspace,
html.app-mode .premium-topbar,
html.app-mode .premium-highlights,
html.app-mode .premium-footer{
  display:none!important;
}

@media (max-width:430px){
  html.app-mode .app{
    max-width:100%!important;
  }

  html.app-mode .bottom-nav{
    max-width:100%!important;
  }
}


/* =========================================================
   PÃO DURO — ETAPA 1.6
   SETAS FUNCIONAIS + NOTIFICAÇÃO FLUTUANTE
   ========================================================= */
.premium-floating-toast{
  position:fixed;
  top:92px;
  right:24px;
  z-index:99999;
  width:min(390px,calc(100vw - 32px));
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 16px;
  border:1px solid #dce6f2;
  border-left:5px solid #1d4fc3;
  border-radius:15px;
  background:#fff;
  color:#13234e;
  box-shadow:0 20px 50px rgba(9,31,83,.24);
  opacity:0;
  visibility:hidden;
  transform:translateY(-14px) translateX(14px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease;
}

.premium-floating-toast.show{
  opacity:1;
  visibility:visible;
  transform:translateY(0) translateX(0);
}

.premium-toast-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#edf3ff;
  color:#1747b4;
  font-size:20px;
  font-weight:900;
}

.premium-toast-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.premium-toast-copy strong{
  color:#10275f;
  font-size:15px;
}

.premium-toast-copy span{
  color:#65738a;
  font-size:13px;
  line-height:1.4;
}

#premiumToastClose{
  border:0;
  background:transparent;
  color:#718096;
  font-size:23px;
  line-height:1;
  cursor:pointer;
  padding:0 2px;
}

@media (min-width:900px){
  html.browser-mode #btnReportPrev,
  html.browser-mode #btnReportNext,
  html.browser-mode #desktopCalendarPrev,
  html.browser-mode #desktopCalendarNext{
    position:relative!important;
    z-index:20!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    min-width:44px!important;
    width:44px!important;
    height:44px!important;
    display:inline-grid!important;
    place-items:center!important;
    border:1px solid #d7e1ee!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#0b2a75!important;
    font-size:22px!important;
    font-weight:900!important;
    box-shadow:0 5px 15px rgba(14,42,108,.07)!important;
  }

  html.browser-mode #btnReportPrev:hover,
  html.browser-mode #btnReportNext:hover,
  html.browser-mode #desktopCalendarPrev:hover,
  html.browser-mode #desktopCalendarNext:hover{
    background:#eaf1ff!important;
    transform:translateY(-1px);
  }
}

@media (max-width:600px){
  .premium-floating-toast{
    top:16px;
    right:16px;
    left:16px;
    width:auto;
  }
}

/* AJUSTES DE INTERFACE — JULHO/2026 */
@media (min-width:900px){
  html.browser-mode .fab,
  html.browser-mode #btnAdd{display:none!important}

  html.browser-mode .premium-topbar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:28px!important;
    min-height:94px!important;
    padding:16px 34px!important;
  }
  html.browser-mode .premium-welcome{min-width:300px}
  html.browser-mode .premium-welcome h2{margin:0 0 5px;font-size:25px;color:#10204e}
  html.browser-mode .premium-welcome p{margin:0;color:#64748b;font-size:13px}
  html.browser-mode .premium-search-area{width:min(620px,52vw);display:flex;flex-direction:column;align-items:stretch;gap:6px}
  html.browser-mode .premium-search{width:100%!important;max-width:none!important}
  html.browser-mode .premium-sync{align-self:flex-start;margin-left:4px;font-size:12px}

  html.browser-mode .desktop-workspace-header{justify-content:flex-start!important}
  html.browser-mode .desktop-workspace-actions{display:none!important}
  html.browser-mode .desktop-page-toolbar-single{justify-content:flex-end!important}

  html.browser-mode .desktop-user{position:relative;display:block!important;padding:12px!important}
  html.browser-mode .desktop-user-main{
    width:100%;border:0;background:transparent;color:#fff;cursor:pointer;
    display:grid!important;grid-template-columns:40px 1fr 20px;align-items:center;gap:10px;
    text-align:left;padding:6px;border-radius:12px
  }
  html.browser-mode .desktop-user-main:hover{background:rgba(255,255,255,.08)}
  html.browser-mode .desktop-user-chevron{font-size:15px;transition:.2s;justify-self:end}
  html.browser-mode #desktopUserToggle[aria-expanded="true"] .desktop-user-chevron{transform:rotate(180deg)}
  html.browser-mode .desktop-user-menu{
    position:absolute;left:10px;right:10px;bottom:84px;z-index:80;
    display:none;background:#fff;color:#10204e;border:1px solid #dfe7f3;border-radius:16px;
    box-shadow:0 18px 45px rgba(15,38,95,.28);padding:14px
  }
  html.browser-mode .desktop-user-menu.show{display:block}
  html.browser-mode .desktop-user-menu-head{padding:2px 2px 12px;border-bottom:1px solid #e8edf5}
  html.browser-mode .desktop-user-menu-head b{font-size:14px;color:#10204e}
  html.browser-mode .desktop-user-menu-head small{display:block;margin-top:4px;color:#718096;font-size:11px;overflow:hidden;text-overflow:ellipsis}
  html.browser-mode .desktop-user-details{display:grid;gap:9px;padding:12px 2px}
  html.browser-mode .desktop-user-details span{display:flex;justify-content:space-between;gap:12px}
  html.browser-mode .desktop-user-details small{color:#7b8799!important;font-size:11px}
  html.browser-mode .desktop-user-details b{color:#10204e!important;font-size:11px;text-align:right}
  html.browser-mode .desktop-user-menu-actions{display:grid;gap:6px;border-top:1px solid #e8edf5;padding-top:10px}
  html.browser-mode .desktop-user-menu-actions button{border:0;background:#f5f8fc;color:#15306c;border-radius:9px;padding:9px 10px;text-align:left;font-weight:700;cursor:pointer}
  html.browser-mode .desktop-user-menu-actions button:hover{background:#eaf0fb}
  html.browser-mode .desktop-user-menu-actions button.danger{color:#c62828;background:#fff2f2}
  html.browser-mode .desktop-logout{display:none!important}
}


/* AJUSTES DE INTERFACE V16.1 — pesquisa, usuário e ícones */
@media (min-width:900px){
  html.browser-mode .premium-topbar{
    left:268px!important;
    right:0!important;
    height:102px!important;
    min-height:102px!important;
    padding:14px 36px!important;
    display:grid!important;
    grid-template-columns:minmax(300px,1fr) minmax(360px,620px)!important;
    align-items:center!important;
    gap:34px!important;
    overflow:visible!important;
    background:#fff!important;
  }
  html.browser-mode .premium-search-area{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:stretch!important;
    gap:7px!important;
  }
  html.browser-mode .premium-search{
    position:static!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:52px!important;
    flex:none!important;
    padding:0 16px!important;
    margin:0!important;
    border:1.5px solid #d7dee9!important;
    border-radius:16px!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  html.browser-mode .premium-search:focus-within{
    border-color:#2454c6!important;
    box-shadow:0 0 0 3px rgba(36,84,198,.10)!important;
  }
  html.browser-mode .premium-search input{
    background:transparent!important;
  }
  html.browser-mode .premium-sync{
    position:static!important;
    align-self:flex-start!important;
    margin:0 0 0 6px!important;
  }
  html.browser-mode .app{padding-top:102px!important}
  html.browser-mode .desktop-workspace{padding-top:122px!important}

  html.browser-mode .desktop-menu button .ico{
    width:30px!important;
    height:30px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 30px!important;
    border-radius:9px!important;
    font-size:17px!important;
    line-height:1!important;
    background:rgba(255,255,255,.14)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)!important;
  }
  html.browser-mode .desktop-menu button.active .ico{
    background:#edf3ff!important;
    box-shadow:0 4px 12px rgba(8,28,83,.14)!important;
  }
  html.browser-mode .desktop-menu button.active .ico-dashboard{background:#dff4ff!important}
  html.browser-mode .desktop-menu button.active .ico-transactions{background:#e8f7e9!important}
  html.browser-mode .desktop-menu button.active .ico-central{background:#fff1d9!important}
  html.browser-mode .desktop-menu button.active .ico-calendar{background:#ece7ff!important}
  html.browser-mode .desktop-menu button.active .ico-reports{background:#e3f3ff!important}
  html.browser-mode .desktop-menu button.active .ico-goals{background:#ffe8ea!important}
  html.browser-mode .desktop-menu button.active .ico-missions{background:#fff4cf!important}
  html.browser-mode .desktop-menu button.active .ico-pro{background:#fff0d5!important}
  html.browser-mode .desktop-menu button.active .ico-settings{background:#e9eef7!important}

  html.browser-mode .desktop-user-menu-actions{
    grid-template-columns:1fr!important;
  }
  html.browser-mode .desktop-user-menu-actions button.danger{
    text-align:center!important;
  }
}

/* AJUSTES V16.2 — pesquisa única, status à direita e seletor de mês */
@media (min-width:900px){
  /* A pesquisa passa a ter somente um contorno. O input interno não cria outra caixa. */
  html.browser-mode .premium-search{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    background:#fff!important;
    border:1.5px solid #d7dee9!important;
    border-radius:16px!important;
    padding:0 16px!important;
    overflow:hidden!important;
  }
  html.browser-mode .premium-search input,
  html.browser-mode .premium-search input[type="search"]{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    outline:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
    appearance:none!important;
    -webkit-appearance:none!important;
  }
  html.browser-mode .premium-search input:focus{
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }

  /* Status no final da barra, alinhado ao canto direito. */
  html.browser-mode .premium-search-area{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-rows:auto auto!important;
    column-gap:10px!important;
    row-gap:5px!important;
    align-items:center!important;
  }
  html.browser-mode .premium-search{
    grid-column:1 / -1!important;
    grid-row:1!important;
  }
  html.browser-mode .premium-sync{
    grid-column:2!important;
    grid-row:2!important;
    justify-self:end!important;
    align-self:center!important;
    margin:0 4px 0 0!important;
    white-space:nowrap!important;
  }

  /* Reserva espaço acima dos cartões para o seletor não cobrir a Taxa de economia. */
  html.browser-mode #screenHome .month-row{
    top:22px!important;
    right:32px!important;
    z-index:8!important;
  }
  html.browser-mode #screenHome .desktop-kpis{
    margin-top:64px!important;
  }
}

/* =====================================================
   V16.3 - cabeçalhos uniformes e layout compacto
   ===================================================== */
@media (min-width: 900px){
  /* O botão circular de dados não deve aparecer no navegador. */
  html.browser-mode #btnHome,
  html.browser-mode .bottom-nav #btnHome,
  html.browser-mode .user-outline-icon.small{display:none!important}

  /* Remove a faixa azul MENU da tela Configurações. */
  html.browser-mode #screenMenu .titlebar.no-back{
    display:flex!important;
    max-width:1450px!important;
    margin:18px auto 10px!important;
    padding:22px 24px!important;
    background:#fff!important;
    border:1px solid #dfe6ef!important;
    border-radius:18px!important;
    color:#10204e!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }
  html.browser-mode #screenMenu .titlebar.no-back h2,
  html.browser-mode #screenMenu .menu-title{
    color:#10204e!important;
    text-align:left!important;
    font-size:25px!important;
    line-height:1.15!important;
    letter-spacing:0!important;
  }
  html.browser-mode #screenMenu .titlebar.no-back h2:after{
    content:"Ajuste preferências, lembretes e recursos da sua conta.";
    display:block;
    margin-top:6px;
    color:#7d899b;
    font-size:15px;
    font-weight:400;
  }

  /* Mesmo cabeçalho do Calendário em todas as telas nativas. */
  html.browser-mode .section-standard-header,
  html.browser-mode #screenReports>.titlebar,
  html.browser-mode #screenCofre>.titlebar,
  html.browser-mode #screenMissions>.titlebar,
  html.browser-mode #screenUpgrade>.titlebar{
    display:flex!important;
    max-width:1450px!important;
    margin:18px auto 10px!important;
    padding:22px 24px!important;
    background:#fff!important;
    border:1px solid #dfe6ef!important;
    border-radius:18px!important;
    justify-content:flex-start!important;
    text-align:left!important;
    text-decoration:none!important;
  }
  html.browser-mode .section-standard-header>div{width:100%}
  html.browser-mode .section-standard-header h2,
  html.browser-mode #screenReports>.titlebar h2,
  html.browser-mode #screenCofre>.titlebar h2,
  html.browser-mode #screenMissions>.titlebar h2,
  html.browser-mode #screenUpgrade>.titlebar h2{
    margin:0!important;
    color:#10204e!important;
    font-size:25px!important;
    text-align:left!important;
    letter-spacing:0!important;
    text-decoration:none!important;
  }
  html.browser-mode .section-standard-header p{
    margin:5px 0 0!important;
    color:#7d899b!important;
    font-size:15px!important;
    font-weight:400!important;
  }

  /* Redução do excesso de espaço vertical. */
  html.browser-mode .premium-topbar{min-height:108px!important;padding-top:14px!important;padding-bottom:12px!important}
  html.browser-mode .app{padding-top:108px!important}
  html.browser-mode .desktop-workspace{padding-top:108px!important}
  html.browser-mode .desktop-workspace-header{margin-top:18px!important;margin-bottom:10px!important;padding:22px 24px!important}
  html.browser-mode #screenReports,
  html.browser-mode #screenCofre,
  html.browser-mode #screenMissions,
  html.browser-mode #screenUpgrade,
  html.browser-mode #screenMenu{padding-top:0!important}
  html.browser-mode #screenReports .report-top-card{margin-top:10px!important}
  html.browser-mode #screenReports .report-month-nav{margin-top:0!important}
  html.browser-mode #screenCofre .cofre-hero,
  html.browser-mode #screenMissions .pao-insight-card,
  html.browser-mode #screenUpgrade .upgrade-hero{margin-top:10px!important}
}


/* =====================================================
   V16.4 - remoção definitiva do cabeçalho antigo
   ===================================================== */
@media (min-width: 900px){
  /* O cabeçalho antigo "Pão Duro / Visão geral" e o botão circular
     não devem existir no modo navegador. O cabeçalho premium superior
     já contém saudação, pesquisa e status de sincronização. */
  html.browser-mode .app > .app-header,
  html.browser-mode header.app-header,
  html.browser-mode #btnGoReportTop{
    display:none!important;
  }

  /* Com o cabeçalho antigo removido, as telas sobem e aproveitam melhor o espaço. */
  html.browser-mode .screen{
    min-height:calc(100vh - 88px)!important;
    padding-top:20px!important;
  }

  html.browser-mode #screenHome.screen{
    padding-top:18px!important;
  }

  /* Mantém o seletor do mês bem posicionado sem o cabeçalho antigo. */
  html.browser-mode #screenHome .month-row{
    top:18px!important;
    right:32px!important;
  }

  html.browser-mode #screenHome .desktop-kpis{
    margin-top:58px!important;
  }
}

/* =====================================================
   V16.5 — IDENTIDADE VISUAL PREMIUM
   Padronização de cartões, botões, formulários, tabelas,
   pop-ups, estados de foco e microinterações no Browser.
   ===================================================== */
@media (min-width: 900px){
  html.browser-mode{
    --pd-navy:#0d2768;
    --pd-navy-strong:#071d55;
    --pd-blue:#184fa9;
    --pd-bg:#f4f8fd;
    --pd-surface:#ffffff;
    --pd-surface-warm:#fffcf5;
    --pd-border:#dfe7f1;
    --pd-border-warm:#eadfca;
    --pd-text:#10204e;
    --pd-muted:#738198;
    --pd-success:#079648;
    --pd-danger:#eb3349;
    --pd-radius-sm:12px;
    --pd-radius-md:16px;
    --pd-radius-lg:20px;
    --pd-shadow-sm:0 5px 16px rgba(10,35,92,.06);
    --pd-shadow-md:0 12px 28px rgba(10,35,92,.09);
    --pd-transition:160ms ease;
  }

  html.browser-mode body{
    background:var(--pd-bg)!important;
    color:var(--pd-text)!important;
  }

  /* Cabeçalhos de seção: mesmo padrão em todas as páginas. */
  html.browser-mode .section-standard-header,
  html.browser-mode #screenReports>.titlebar,
  html.browser-mode #screenCofre>.titlebar,
  html.browser-mode #screenMissions>.titlebar,
  html.browser-mode #screenUpgrade>.titlebar,
  html.browser-mode #screenMenu>.titlebar,
  html.browser-mode .desktop-workspace-header{
    border-color:var(--pd-border)!important;
    border-radius:var(--pd-radius-lg)!important;
    box-shadow:var(--pd-shadow-sm)!important;
  }

  /* Cartões e blocos de conteúdo. */
  html.browser-mode .desktop-kpi,
  html.browser-mode .desktop-panel,
  html.browser-mode .summary-card,
  html.browser-mode .details-card,
  html.browser-mode .recent-section,
  html.browser-mode .report-top-card,
  html.browser-mode .report-panel,
  html.browser-mode .cofre-hero,
  html.browser-mode .goals-panel,
  html.browser-mode .pao-insight-card,
  html.browser-mode .mission-card,
  html.browser-mode .upgrade-hero,
  html.browser-mode .plan-card,
  html.browser-mode .backup-secure-card,
  html.browser-mode .reminder-settings,
  html.browser-mode .plan-comparison,
  html.browser-mode .billing-status,
  html.browser-mode .data-sheet,
  html.browser-mode .user-card{
    border-color:var(--pd-border)!important;
    border-radius:var(--pd-radius-lg)!important;
    box-shadow:var(--pd-shadow-sm)!important;
    transition:transform var(--pd-transition), box-shadow var(--pd-transition), border-color var(--pd-transition)!important;
  }

  html.browser-mode .desktop-kpi:hover,
  html.browser-mode .desktop-panel:hover,
  html.browser-mode .mission-card:hover,
  html.browser-mode .plan-card:hover{
    transform:translateY(-2px)!important;
    box-shadow:var(--pd-shadow-md)!important;
    border-color:#cbd8ea!important;
  }

  /* Botões principais e secundários. */
  html.browser-mode button,
  html.browser-mode .primary,
  html.browser-mode .secondary,
  html.browser-mode .small-btn,
  html.browser-mode .sheet-btn,
  html.browser-mode .report-extrato-btn,
  html.browser-mode .trial-button{
    transition:transform var(--pd-transition), box-shadow var(--pd-transition), background-color var(--pd-transition), border-color var(--pd-transition), color var(--pd-transition)!important;
  }

  html.browser-mode .primary,
  html.browser-mode .small-primary,
  html.browser-mode .subscribe-pro,
  html.browser-mode .trial-button{
    border-radius:var(--pd-radius-sm)!important;
    box-shadow:0 7px 16px rgba(13,39,104,.16)!important;
  }

  html.browser-mode .secondary,
  html.browser-mode .small-btn,
  html.browser-mode .sheet-btn,
  html.browser-mode .report-extrato-btn{
    border-radius:var(--pd-radius-sm)!important;
  }

  html.browser-mode button:not(:disabled):hover{
    transform:translateY(-1px);
  }
  html.browser-mode button:not(:disabled):active{
    transform:translateY(0) scale(.985);
  }
  html.browser-mode button:disabled{
    cursor:not-allowed!important;
    opacity:.55!important;
  }

  /* Campos e seletores com a mesma altura e o mesmo foco. */
  html.browser-mode input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  html.browser-mode select,
  html.browser-mode textarea,
  html.browser-mode .mini-select,
  html.browser-mode .app-modal-input{
    min-height:46px!important;
    border:1px solid var(--pd-border)!important;
    border-radius:var(--pd-radius-sm)!important;
    background:var(--pd-surface)!important;
    color:var(--pd-text)!important;
    box-shadow:none!important;
    transition:border-color var(--pd-transition), box-shadow var(--pd-transition), background-color var(--pd-transition)!important;
  }

  html.browser-mode input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus,
  html.browser-mode select:focus,
  html.browser-mode textarea:focus,
  html.browser-mode .app-modal-input:focus{
    outline:0!important;
    border-color:#7fa5df!important;
    box-shadow:0 0 0 4px rgba(24,79,169,.10)!important;
  }

  html.browser-mode input::placeholder,
  html.browser-mode textarea::placeholder{
    color:#96a2b3!important;
  }

  /* Abas, filtros e chips. */
  html.browser-mode .tabs,
  html.browser-mode .report-switch,
  html.browser-mode .recent-tools{
    border-radius:var(--pd-radius-md)!important;
  }
  html.browser-mode .tab,
  html.browser-mode .report-tab,
  html.browser-mode .mini-filter,
  html.browser-mode .chip{
    border-radius:999px!important;
    transition:background-color var(--pd-transition), color var(--pd-transition), box-shadow var(--pd-transition), transform var(--pd-transition)!important;
  }
  html.browser-mode .tab.active,
  html.browser-mode .report-tab.active,
  html.browser-mode .mini-filter.active,
  html.browser-mode .chip.active{
    box-shadow:0 6px 14px rgba(13,39,104,.16)!important;
  }

  /* Tabelas e listas: linhas mais claras e leitura melhor. */
  html.browser-mode table{
    width:100%;
    border-collapse:separate!important;
    border-spacing:0!important;
    overflow:hidden;
    border-radius:var(--pd-radius-lg)!important;
    background:var(--pd-surface)!important;
  }
  html.browser-mode table thead th{
    background:#f3f6fb!important;
    color:#65748c!important;
    font-size:12px!important;
    letter-spacing:.045em!important;
    text-transform:uppercase!important;
  }
  html.browser-mode table tbody tr{
    transition:background-color var(--pd-transition)!important;
  }
  html.browser-mode table tbody tr:hover{
    background:#f8fbff!important;
  }
  html.browser-mode table th,
  html.browser-mode table td{
    border-color:#e8eef6!important;
  }

  html.browser-mode .recent-list > *,
  html.browser-mode .report-list > *,
  html.browser-mode .goals-list > *,
  html.browser-mode .missions-list > *{
    transition:transform var(--pd-transition), box-shadow var(--pd-transition), background-color var(--pd-transition)!important;
  }

  /* Pop-ups e modais. */
  html.browser-mode .app-modal-overlay,
  html.browser-mode .data-overlay{
    backdrop-filter:blur(5px)!important;
    -webkit-backdrop-filter:blur(5px)!important;
    background:rgba(5,18,52,.42)!important;
  }
  html.browser-mode .app-modal,
  html.browser-mode .data-sheet,
  html.browser-mode .recovery-sheet{
    border:1px solid rgba(255,255,255,.75)!important;
    border-radius:22px!important;
    box-shadow:0 28px 70px rgba(5,18,52,.24)!important;
  }

  /* Menu lateral: alinhamento e resposta visual uniforme. */
  html.browser-mode .desktop-menu button{
    border-radius:14px!important;
    transition:background-color var(--pd-transition), color var(--pd-transition), transform var(--pd-transition), box-shadow var(--pd-transition)!important;
  }
  html.browser-mode .desktop-menu button:not(.active):hover{
    background:rgba(255,255,255,.10)!important;
    transform:translateX(3px)!important;
  }
  html.browser-mode .desktop-menu button .ico{
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:10px!important;
  }

  /* Barra superior e pesquisa. */
  html.browser-mode .premium-topbar{
    border-bottom:1px solid var(--pd-border)!important;
    box-shadow:0 3px 14px rgba(10,35,92,.035)!important;
  }
  html.browser-mode .premium-search{
    border-color:var(--pd-border)!important;
    border-radius:var(--pd-radius-md)!important;
    transition:border-color var(--pd-transition), box-shadow var(--pd-transition)!important;
  }
  html.browser-mode .premium-search:focus-within{
    border-color:#7fa5df!important;
    box-shadow:0 0 0 4px rgba(24,79,169,.08)!important;
  }

  /* Acessibilidade de teclado. */
  html.browser-mode button:focus-visible,
  html.browser-mode a:focus-visible,
  html.browser-mode [tabindex]:focus-visible{
    outline:3px solid rgba(24,79,169,.30)!important;
    outline-offset:3px!important;
  }

  /* Movimento reduzido para quem usa essa preferência no sistema. */
  @media (prefers-reduced-motion: reduce){
    html.browser-mode *,
    html.browser-mode *::before,
    html.browser-mode *::after{
      scroll-behavior:auto!important;
      animation-duration:.01ms!important;
      animation-iteration-count:1!important;
      transition-duration:.01ms!important;
    }
  }
}

/* =========================================================
   PÃO DURO — ETAPA 1.6 | UX PREMIUM v16.6
   Microinterações, transições e feedback visual
   ========================================================= */
:root{
  --pd-motion-fast:160ms;
  --pd-motion-base:240ms;
  --pd-motion-slow:380ms;
  --pd-ease:cubic-bezier(.2,.8,.2,1);
}

html{scroll-behavior:smooth}
body{overscroll-behavior-y:none}

/* Transição suave entre telas e painéis */
.screen.active,
.desktop-section.active,
[data-screen].active,
.pd-view-enter{
  animation:pdViewIn var(--pd-motion-slow) var(--pd-ease) both;
}
@keyframes pdViewIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* Cards e blocos interativos */
.summary-card,
.card,
.panel,
.goal-card,
.report-card,
.calendar-card,
.stat-card,
.kpi-card,
.desktop-card,
[class*="card"]{
  transition:transform var(--pd-motion-base) var(--pd-ease),
             box-shadow var(--pd-motion-base) var(--pd-ease),
             border-color var(--pd-motion-base) ease;
}
@media (hover:hover) and (pointer:fine){
  .summary-card:hover,
  .card:hover,
  .goal-card:hover,
  .report-card:hover,
  .calendar-card:hover,
  .stat-card:hover,
  .kpi-card:hover,
  .desktop-card:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 32px rgba(15,23,42,.10);
  }
}

/* Botões com resposta mais natural */
button,
.button,
.btn,
[role="button"]{
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
  transition:transform var(--pd-motion-fast) var(--pd-ease),
             box-shadow var(--pd-motion-base) var(--pd-ease),
             filter var(--pd-motion-fast) ease,
             background-color var(--pd-motion-base) ease,
             border-color var(--pd-motion-base) ease;
}
button:active,
.button:active,
.btn:active,
[role="button"]:active{transform:scale(.98)}
button:disabled{transform:none!important;filter:saturate(.6);cursor:not-allowed}

/* Efeito ripple */
.pd-ripple{
  position:absolute;
  border-radius:999px;
  pointer-events:none;
  transform:translate(-50%,-50%) scale(0);
  background:rgba(255,255,255,.38);
  animation:pdRipple .58s ease-out forwards;
}
@keyframes pdRipple{
  to{transform:translate(-50%,-50%) scale(4);opacity:0}
}

/* Inputs com foco refinado */
input,select,textarea{
  transition:border-color var(--pd-motion-base) ease,
             box-shadow var(--pd-motion-base) ease,
             background-color var(--pd-motion-base) ease;
}
input:focus,select:focus,textarea:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

/* Barra de progresso de navegação */
#pdUxProgress{
  position:fixed;
  z-index:99999;
  top:0;
  left:0;
  width:0;
  height:3px;
  opacity:0;
  background:linear-gradient(90deg,#2563eb,#22c55e);
  box-shadow:0 0 10px rgba(37,99,235,.35);
  transition:width 220ms ease,opacity 180ms ease;
}
#pdUxProgress.is-running{opacity:1}

/* Toasts profissionais */
#pdToastStack{
  position:fixed;
  z-index:100000;
  top:18px;
  right:18px;
  width:min(360px,calc(100vw - 36px));
  display:grid;
  gap:10px;
  pointer-events:none;
}
.pd-toast{
  pointer-events:auto;
  display:grid;
  grid-template-columns:34px 1fr auto;
  align-items:start;
  gap:10px;
  padding:13px 14px;
  border:1px solid rgba(148,163,184,.28);
  border-radius:14px;
  background:rgba(255,255,255,.96);
  color:#0f172a;
  box-shadow:0 18px 46px rgba(15,23,42,.16);
  backdrop-filter:blur(12px);
  animation:pdToastIn 280ms var(--pd-ease) both;
}
.pd-toast.is-leaving{animation:pdToastOut 220ms ease forwards}
.pd-toast-icon{
  width:32px;height:32px;border-radius:10px;
  display:grid;place-items:center;font-weight:800;
}
.pd-toast.success .pd-toast-icon{background:#dcfce7;color:#15803d}
.pd-toast.error .pd-toast-icon{background:#fee2e2;color:#b91c1c}
.pd-toast.warning .pd-toast-icon{background:#fef3c7;color:#a16207}
.pd-toast.info .pd-toast-icon{background:#dbeafe;color:#1d4ed8}
.pd-toast strong{display:block;font-size:.92rem;margin:1px 0 3px}
.pd-toast p{margin:0;font-size:.84rem;line-height:1.35;color:#475569}
.pd-toast-close{border:0;background:transparent;color:#64748b;padding:2px 4px;font-size:18px;line-height:1}
@keyframes pdToastIn{from{opacity:0;transform:translateX(24px) scale(.98)}to{opacity:1;transform:none}}
@keyframes pdToastOut{to{opacity:0;transform:translateX(26px) scale(.98)}}

/* Estados de atualização sem piscar */
.pd-soft-refresh{animation:pdSoftRefresh 320ms ease}
@keyframes pdSoftRefresh{0%{opacity:.58}100%{opacity:1}}

/* Respeita preferência do sistema */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}

@media (max-width:720px){
  #pdToastStack{top:10px;right:10px;width:calc(100vw - 20px)}
  .pd-toast{border-radius:12px}
}


/* =========================================================
   ETAPA 2 — DASHBOARD PREMIUM
   ========================================================= */
@keyframes premiumNumberPop{0%{transform:translateY(7px);opacity:.35}100%{transform:translateY(0);opacity:1}}
.premium-number-pop{animation:premiumNumberPop .36s ease both}
.mobile-premium-overview{margin:0 20px 14px;padding:16px;border:1px solid #dce7f8;border-radius:18px;background:linear-gradient(145deg,#f8fbff,#eef5ff);box-shadow:0 10px 28px rgba(31,75,145,.08)}
.mobile-premium-head{display:flex;align-items:center;justify-content:space-between}.mobile-premium-head span{font-weight:900;color:#102f70}.mobile-premium-head b{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:#fff;background:#154eae;border-radius:99px;padding:5px 9px}.mobile-premium-overview p{margin:7px 0 14px;color:#68758c;font-size:12px}.mobile-quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.mobile-quick-actions button{min-height:62px;border:1px solid #dbe5f4;border-radius:14px;background:#fff;color:#173a7b;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;box-shadow:0 6px 18px rgba(24,61,123,.06)}.mobile-quick-actions i{font-size:20px;font-style:normal}.mobile-quick-actions span{font-size:11px}
@media(min-width:900px){
 html.browser-mode .mobile-premium-overview{display:none!important}
 html.browser-mode .premium-dashboard-hero{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;margin:0 0 18px;padding:24px 26px;border-radius:20px;background:linear-gradient(120deg,#071c58 0%,#123c91 58%,#287fd1 100%);color:#fff;box-shadow:0 18px 45px rgba(8,38,105,.19);overflow:hidden;position:relative}
 html.browser-mode .premium-dashboard-hero:after{content:"";position:absolute;width:270px;height:270px;border-radius:50%;right:-90px;top:-150px;background:rgba(255,255,255,.10)}
 html.browser-mode .premium-hero-copy{position:relative;z-index:1}.premium-eyebrow{display:inline-block;font-size:10px;letter-spacing:1.2px;font-weight:900;color:#9fddff;margin-bottom:7px}.premium-hero-copy h2{margin:0 0 7px;font-size:23px;letter-spacing:-.3px;color:#fff}.premium-hero-copy p{margin:0;color:#d8e7ff;font-size:12px;max-width:690px;line-height:1.55}
 html.browser-mode .premium-hero-actions{display:flex;gap:9px;position:relative;z-index:1}.premium-hero-actions button{width:82px;min-height:77px;padding:9px 6px;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:rgba(255,255,255,.10);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.2s ease}.premium-hero-actions button:hover{transform:translateY(-3px);background:#fff;color:#123a88;box-shadow:0 10px 24px rgba(0,0,0,.16)}.premium-hero-actions i{font-size:20px;font-style:normal}.premium-hero-actions span{font-size:10px;font-weight:850;text-align:center}
 html.browser-mode .desktop-kpi.premium{position:relative;overflow:hidden;transition:.22s ease;border-color:#e2e9f4}.desktop-kpi.premium:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(18,46,105,.11)}.desktop-kpi.premium:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,#2159bd,#72b5f0)}.desktop-kpi.premium.green:before{background:linear-gradient(90deg,#0a9d50,#55d488)}.desktop-kpi.premium.red:before{background:linear-gradient(90deg,#e03248,#ff8491)}.desktop-kpi.premium.saving:before{background:linear-gradient(90deg,#7d4fe0,#b998ff)}.desktop-kpi .kpi-spark{position:absolute;right:15px;bottom:10px;font-size:28px;opacity:.08;font-weight:900}
 html.browser-mode .premium-highlights{display:grid!important;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 16px}.premium-highlights article{background:#fff;border:1px solid #e2e9f4;border-radius:16px;padding:15px 17px;box-shadow:0 8px 24px rgba(18,46,105,.045)}.premium-highlights small,.premium-highlights span{display:block;color:#77839a;font-size:10px}.premium-highlights strong{display:block;margin:5px 0 3px;color:#102f70;font-size:18px}
 html.browser-mode .desktop-chart-panel{background:linear-gradient(180deg,#fff,#fbfdff)!important}.desktop-chart-income,.desktop-chart-expense{filter:drop-shadow(0 4px 6px rgba(0,0,0,.08))}
 html.browser-mode .desktop-panel,html.browser-mode #screenHome .recent-section{transition:transform .2s ease,box-shadow .2s ease}.desktop-panel:hover,html.browser-mode #screenHome .recent-section:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(18,46,105,.08)!important}
}
@media(min-width:900px) and (max-width:1250px){html.browser-mode .premium-dashboard-hero{grid-template-columns:1fr}.premium-hero-actions{flex-wrap:wrap}.premium-hero-actions button{width:100px}}
@media(max-width:899px){.mobile-premium-overview{display:block}.summary-card{box-shadow:0 12px 30px rgba(25,62,130,.10)!important;border-radius:18px!important;background:linear-gradient(145deg,#fff,#f5f9ff)!important}}


/* =========================================================
   ETAPA 2.1 — AJUSTES DO PAINEL PREMIUM
   ========================================================= */
@media(min-width:900px){
  html.browser-mode .premium-dashboard-hero{
    display:block!important;
    padding:22px 26px 24px!important;
  }
  html.browser-mode .premium-hero-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:24px;
    position:relative;
    z-index:2;
  }
  html.browser-mode .premium-hero-month-slot{
    flex:0 0 auto;
    min-width:220px;
    display:flex;
    justify-content:flex-end;
  }
  html.browser-mode #screenHome .premium-hero-month-slot .month-row{
    position:static!important;
    display:flex!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    gap:4px!important;
    min-height:48px;
    align-items:center;
    background:rgba(255,255,255,.10)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    border-radius:14px!important;
    box-shadow:none!important;
    overflow:hidden;
  }
  html.browser-mode #screenHome .premium-hero-month-slot .month-row strong{
    min-width:132px;
    padding:0 12px;
    color:#fff!important;
    font-size:18px!important;
    font-weight:900!important;
  }
  html.browser-mode #screenHome .premium-hero-month-slot .month-row .icon-btn{
    width:43px!important;
    height:46px!important;
    min-width:43px!important;
    color:#fff!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    font-size:28px!important;
  }
  html.browser-mode #screenHome .premium-hero-month-slot .month-row .icon-btn:hover{
    background:rgba(255,255,255,.14)!important;
  }
  html.browser-mode .premium-hero-actions{
    margin-top:20px;
    display:flex;
    align-items:stretch;
    justify-content:flex-start;
    gap:10px;
  }
  html.browser-mode .premium-hero-actions .premium-new-entry{
    width:365px!important;
    min-height:78px!important;
    padding:12px 18px!important;
    flex-direction:row!important;
    justify-content:flex-start!important;
    text-align:left!important;
    background:#fff!important;
    color:#123a88!important;
    border-color:#fff!important;
  }
  html.browser-mode .premium-hero-actions .premium-new-entry i{
    width:48px;
    height:48px;
    border-radius:13px;
    background:#e7f0ff;
    display:grid;
    place-items:center;
    font-size:31px;
    color:#1761d2;
    flex:0 0 auto;
  }
  html.browser-mode .premium-hero-actions .premium-new-entry span{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    font-size:15px!important;
  }
  html.browser-mode .premium-hero-actions .premium-new-entry b{
    font-size:15px;
    color:#102f70;
  }
  html.browser-mode .premium-hero-actions .premium-new-entry small{
    color:#6c7890;
    font-size:11px;
    font-weight:600;
  }
}
@media(min-width:900px) and (max-width:1250px){
  html.browser-mode .premium-hero-top{align-items:center}
  html.browser-mode .premium-hero-actions{flex-wrap:wrap!important}
  html.browser-mode .premium-hero-actions .premium-new-entry{width:320px!important}
}

/* =========================================================
   ETAPA 2.2 — DASHBOARD ULTRA PREMIUM
   ========================================================= */
@media(min-width:900px){
  html.browser-mode #screenHome{padding-top:0!important}
  html.browser-mode .premium-dashboard-hero{
    min-height:220px;
    border-radius:22px!important;
    padding:24px 300px 24px 28px!important;
    background:
      radial-gradient(circle at 88% 20%,rgba(75,155,255,.28),transparent 24%),
      linear-gradient(118deg,#061f66 0%,#0739a2 58%,#0755c9 100%)!important;
    box-shadow:0 22px 50px rgba(7,43,120,.24)!important;
    isolation:isolate;
  }
  html.browser-mode .premium-dashboard-hero:before{
    content:"";position:absolute;inset:0;z-index:-1;opacity:.18;
    background-image:radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px);
    background-size:18px 18px;mask-image:linear-gradient(90deg,transparent 48%,#000 100%);
  }
  html.browser-mode .premium-dashboard-hero:after{right:-115px!important;top:-145px!important;width:360px!important;height:360px!important}
  html.browser-mode .premium-hero-top{min-height:78px}
  html.browser-mode .premium-hero-copy h2{font-size:27px!important;line-height:1.15;max-width:720px}
  html.browser-mode .premium-hero-copy p{font-size:13px!important}
  html.browser-mode .premium-eyebrow{font-size:11px!important;letter-spacing:1.4px!important}
  html.browser-mode .premium-hero-actions{position:relative;z-index:3;gap:10px!important;flex-wrap:nowrap!important}
  html.browser-mode .premium-hero-actions>button:not(.premium-new-entry){
    width:104px!important;min-height:78px!important;background:rgba(255,255,255,.96)!important;
    color:#082d79!important;border-color:rgba(255,255,255,.9)!important;box-shadow:0 8px 18px rgba(0,20,70,.14)
  }
  html.browser-mode .premium-hero-actions>button:not(.premium-new-entry) i{font-size:24px!important;color:#1261df}
  html.browser-mode .premium-hero-actions>button:not(.premium-new-entry):hover{background:#fff!important;transform:translateY(-4px) scale(1.015)}
  html.browser-mode .premium-hero-actions .premium-new-entry{width:355px!important}
  html.browser-mode .premium-hero-month-slot{position:absolute;right:246px;top:24px;z-index:5}
  html.browser-mode .premium-hero-visual{position:absolute;right:16px;bottom:12px;width:255px;height:145px;z-index:1;opacity:.96;pointer-events:none}
  html.browser-mode .hero-chart-bars{position:absolute;left:25px;bottom:24px;width:110px;height:92px;display:flex;align-items:flex-end;gap:8px;padding:10px;border-radius:14px;background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);transform:skewY(-4deg);box-shadow:0 16px 35px rgba(0,0,0,.2)}
  html.browser-mode .hero-chart-bars i{display:block;flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#8ce7ff,#2d73ff);box-shadow:0 0 14px rgba(87,183,255,.7)}
  html.browser-mode .hero-chart-bars i:nth-child(1){height:28%}.hero-chart-bars i:nth-child(2){height:44%}.hero-chart-bars i:nth-child(3){height:58%}.hero-chart-bars i:nth-child(4){height:76%}.hero-chart-bars i:nth-child(5){height:96%}
  html.browser-mode .hero-pie{position:absolute;right:28px;top:10px;width:76px;height:76px;border-radius:50%;background:conic-gradient(#63d9ff 0 31%,#8b6cff 31% 64%,#ffcf54 64% 100%);box-shadow:inset 0 0 0 12px rgba(9,43,130,.55),0 12px 30px rgba(0,0,0,.24)}
  html.browser-mode .hero-coins{position:absolute;right:5px;bottom:4px;width:110px;height:62px}.hero-coins i{position:absolute;bottom:0;width:42px;height:20px;border-radius:50%;background:linear-gradient(#ffe08a,#f2a900);border:3px solid #ffd05c;box-shadow:0 -7px 0 #f7b622,0 -14px 0 #ffd05c,0 8px 18px rgba(0,0,0,.24)}.hero-coins i:nth-child(1){left:0;transform:scale(.72)}.hero-coins i:nth-child(2){left:34px;transform:scale(.9)}.hero-coins i:nth-child(3){right:0;transform:scale(1.05)}

  html.browser-mode .desktop-kpis{gap:14px!important;margin-bottom:14px!important}
  html.browser-mode .desktop-kpi.premium{min-height:188px!important;padding:22px 20px 18px!important;border-radius:20px!important;background:linear-gradient(150deg,#fff,#fbfdff)!important;box-shadow:0 12px 30px rgba(23,56,117,.075)!important}
  html.browser-mode .desktop-kpi.premium .desktop-kpi-icon{width:54px!important;height:54px!important;border-radius:16px!important;font-size:25px!important;align-self:flex-start}
  html.browser-mode .desktop-kpi.premium .kpi-copy{min-width:0;flex:1}
  html.browser-mode .desktop-kpi.premium small{font-size:12px!important}
  html.browser-mode .desktop-kpi.premium b{font-size:25px!important;letter-spacing:-.6px}
  html.browser-mode .desktop-kpi.premium em{font-size:11px!important;min-height:18px}
  html.browser-mode .kpi-info{display:inline-grid!important;place-items:center;width:16px;height:16px;border:1px solid #9aa8bf;border-radius:50%;font-style:normal;font-size:10px!important;margin-left:4px;color:#7b8aa3}
  html.browser-mode .kpi-trend{position:absolute;left:20px;bottom:16px;border-radius:999px;background:#eef4ff;color:#2a5da7;padding:5px 9px;font-size:10px;font-weight:850}
  html.browser-mode .kpi-trend.positive{background:#e8f8ef;color:#188a4f}.kpi-trend.negative{background:#fff0f1;color:#c43a49}
  html.browser-mode .kpi-sparkline{position:absolute;right:16px;bottom:17px;width:108px;height:38px;overflow:visible}
  html.browser-mode .kpi-sparkline path{fill:none;stroke:#3477ef;stroke-width:2.3;stroke-linecap:round;filter:drop-shadow(0 5px 4px rgba(52,119,239,.18))}
  html.browser-mode .desktop-kpi.green .kpi-sparkline path{stroke:#16a85d}.desktop-kpi.red .kpi-sparkline path{stroke:#ff5262}.desktop-kpi.saving .kpi-sparkline path{stroke:#8d55ef}

  html.browser-mode .premium-highlights{gap:14px!important}
  html.browser-mode .premium-highlights article{display:flex;align-items:center;gap:13px;padding:14px 16px!important;border-radius:17px!important}
  html.browser-mode .premium-highlights article>i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-style:normal;font-size:20px;flex:0 0 auto}
  html.browser-mode .premium-highlights article>div{min-width:0}
  html.browser-mode .premium-highlights strong{font-size:17px!important;margin:3px 0 1px!important}
  html.browser-mode .highlight-income{background:linear-gradient(135deg,#f1fcf5,#fff)!important}.highlight-income>i{background:#d9f6e4;color:#0c9b4b}
  html.browser-mode .highlight-expense{background:linear-gradient(135deg,#fff4f4,#fff)!important}.highlight-expense>i{background:#ffe1e1;color:#ed4152}
  html.browser-mode .highlight-average{background:linear-gradient(135deg,#f1f7ff,#fff)!important}.highlight-average>i{background:#dceaff;color:#1762d4}
  html.browser-mode .highlight-score{background:linear-gradient(135deg,#f8f2ff,#fff)!important}.highlight-score>i{background:#eadcff;color:#7c3ee7}

  html.browser-mode .desktop-dashboard-grid{grid-template-columns:minmax(0,1.65fr) minmax(340px,.8fr)!important;gap:14px!important}
  html.browser-mode .desktop-chart-panel,html.browser-mode #screenHome .recent-section{border-radius:20px!important;box-shadow:0 12px 30px rgba(23,56,117,.065)!important}
  html.browser-mode .desktop-chart-panel{min-height:340px}.desktop-chart{height:245px!important}
  html.browser-mode .desktop-panel-head h3{font-size:16px!important}.desktop-panel-head small{font-size:11px!important}
  html.browser-mode .desktop-lower-grid{gap:14px!important}
  html.browser-mode .desktop-panel{border-radius:20px!important}
}
@media(min-width:900px) and (max-width:1390px){
  html.browser-mode .premium-dashboard-hero{padding-right:28px!important}
  html.browser-mode .premium-hero-visual{display:none}
  html.browser-mode .premium-hero-month-slot{position:static!important}
  html.browser-mode .premium-hero-actions{flex-wrap:wrap!important}
  html.browser-mode .premium-hero-actions .premium-new-entry{width:320px!important}
}
@media(max-width:899px){
  .mobile-premium-overview{border-radius:22px!important;background:linear-gradient(145deg,#f9fbff,#eef5ff)!important;box-shadow:0 14px 34px rgba(19,55,124,.11)!important}
  .mobile-quick-actions button{border-radius:16px!important;transition:transform .18s ease,box-shadow .18s ease}
  .mobile-quick-actions button:active{transform:scale(.96)}
  .summary-card,.card{border-radius:20px!important}
}

/* =========================================================
   ETAPA 3 — INTELIGÊNCIA FINANCEIRA
   ========================================================= */
.pd-intelligence{margin:22px 0;display:grid;gap:16px}.pd-intelligence-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.pd-intelligence-head span{font-size:11px;font-weight:900;letter-spacing:.14em;color:#1768d5}.pd-intelligence-head h3{margin:5px 0 3px;font-size:22px;color:#14213d}.pd-intelligence-head p{margin:0;color:#718096;font-size:13px}.pd-intelligence-head>strong{padding:8px 13px;border-radius:999px;background:#e9f2ff;color:#1768d5;font-size:12px}.pd-intelligence-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.pd-ai-card{min-height:145px;padding:18px;border:1px solid #e3eaf5;border-radius:18px;background:linear-gradient(145deg,#fff,#f8fbff);box-shadow:0 12px 30px rgba(31,68,123,.07);display:flex;flex-direction:column;gap:8px}.pd-ai-card small{font-size:12px;font-weight:800;color:#718096}.pd-ai-card strong{font-size:22px;color:#14213d}.pd-ai-card span{font-size:12px;line-height:1.45;color:#718096}.pd-ai-alert{background:linear-gradient(145deg,#fffaf1,#fff)}.pd-progress{height:7px;border-radius:999px;background:#e8eef8;overflow:hidden;margin-top:auto}.pd-progress i{display:block;height:100%;width:8%;border-radius:inherit;background:linear-gradient(90deg,#1b77e8,#67a8ff);transition:width .45s ease}.pd-assistant{display:grid;grid-template-columns:auto minmax(300px,1fr);gap:14px 24px;align-items:center;padding:18px 20px;border-radius:20px;background:linear-gradient(120deg,#0f56bd,#1678e7);color:#fff;box-shadow:0 16px 35px rgba(15,86,189,.2)}.pd-assistant>div{display:flex;align-items:center;gap:12px}.pd-assistant-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.18);font-weight:900}.pd-assistant b{display:block}.pd-assistant small{display:block;color:rgba(255,255,255,.75);margin-top:3px}.pd-assistant form{display:flex;gap:8px}.pd-assistant input{min-width:0;flex:1;border:0;border-radius:12px;padding:12px 14px;background:#fff;color:#14213d;outline:none}.pd-assistant button{border:0;border-radius:12px;padding:0 18px;background:#0b2f68;color:#fff;font-weight:800;cursor:pointer}.pd-assistant p{grid-column:1/-1;margin:0;padding-top:12px;border-top:1px solid rgba(255,255,255,.18);font-size:13px;line-height:1.5;color:#fff}
@media(max-width:1180px){.pd-intelligence-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pd-assistant{grid-template-columns:1fr}.pd-assistant p{grid-column:auto}}
@media(max-width:760px){.pd-intelligence{display:none}}

/* =========================================================
   ETAPA 4 — CENTRAL FINANCEIRA PRO
   ========================================================= */
.cf-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 28px;margin-bottom:16px;border-radius:22px;color:#fff;background:linear-gradient(120deg,#082d79,#0c5dcc 58%,#1689ef);box-shadow:0 18px 42px rgba(15,78,176,.22)}
.cf-hero:after{content:"";position:absolute;right:-80px;top:-120px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.09)}.cf-hero>div{position:relative;z-index:1}.cf-hero small{font-size:10px;font-weight:900;letter-spacing:.16em;color:#bfe0ff}.cf-hero h2{margin:7px 0 5px;font-size:25px}.cf-hero p{margin:0;font-size:13px;color:rgba(255,255,255,.78)}.cf-hero-score{min-width:260px;padding:15px 18px;border:1px solid rgba(255,255,255,.2);border-radius:17px;background:rgba(255,255,255,.11);backdrop-filter:blur(10px)}.cf-hero-score strong{display:block;margin:4px 0;font-size:25px}.cf-hero-score span{font-size:11px;color:rgba(255,255,255,.75)}
.cf-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:16px}.cf-kpis article{display:flex;align-items:center;gap:12px;padding:17px;border:1px solid #e3eaf5;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(29,59,111,.065)}.cf-kpis i{width:45px;height:45px;border-radius:14px;display:grid;place-items:center;background:#edf5ff;font-style:normal;font-size:20px}.cf-kpis span{min-width:0}.cf-kpis small,.cf-kpis em{display:block;color:#718096;font-size:11px;font-style:normal}.cf-kpis strong{display:block;margin:3px 0;color:#14213d;font-size:19px}
.cf-flow,.cf-transactions,.cf-panel{border:1px solid #e3eaf5;border-radius:19px;background:#fff;box-shadow:0 10px 28px rgba(29,59,111,.055)}.cf-flow{padding:18px;margin-bottom:16px}.cf-flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.cf-flow-grid>div{padding:13px;border-radius:14px;background:#f7f9fd}.cf-flow-grid small{display:block;color:#718096;font-size:11px}.cf-flow-grid b{display:block;margin-top:5px;font-size:17px;color:#14213d}.cf-limit-summary{margin-top:15px}.cf-limit-summary>span{display:flex;justify-content:space-between;margin-bottom:7px;font-size:12px;color:#53627a}
.cf-meter{height:8px;overflow:hidden;border-radius:999px;background:#e8eef7}.cf-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1ca962,#63d58f);transition:width .35s ease}.cf-meter.warning i{background:linear-gradient(90deg,#efa51d,#ffd15a)}.cf-meter.danger i{background:linear-gradient(90deg,#e53e4f,#ff7783)}
.cf-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px}.cf-panel{padding:17px;min-height:260px}.cf-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.cf-panel-head h3{margin:0;color:#18243d;font-size:16px}.cf-panel-head small{display:block;margin-top:3px;color:#8090a8;font-size:11px}.cf-panel-head button,.cf-transactions .desktop-panel-head button{border:0;border-radius:10px;padding:9px 11px;background:#eaf3ff;color:#1768d5;font-size:11px;font-weight:850;cursor:pointer}.cf-list{display:grid;gap:9px}.cf-item,.cf-card-item{position:relative;border:1px solid #edf0f6;border-radius:14px;background:#fafcff}.cf-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:11px}.cf-item-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#eaf3ff}.cf-item strong,.cf-card-item strong{display:block;color:#1a2740;font-size:13px}.cf-item small,.cf-card-item small{display:block;margin-top:2px;color:#8190a6;font-size:10px}.cf-item>b{font-size:13px;color:#18243d}.cf-delete{width:25px;height:25px;border:0;border-radius:8px;background:#fff0f1;color:#cf4050;font-size:17px;line-height:1;cursor:pointer}.cf-card-item{padding:12px}.cf-card-top,.cf-card-values{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.cf-card-values{margin:11px 0 8px}.cf-card-values span{font-size:10px;color:#8190a6}.cf-card-values b{display:block;margin-top:2px;color:#24334e;font-size:12px}.cf-card-item>.cf-meter{margin-bottom:6px}.cf-empty{padding:28px 12px;border:1px dashed #dce4ef;border-radius:14px;text-align:center;color:#8a98ac;font-size:12px}.cf-transactions{padding:18px}
.cf-modal-backdrop{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px;background:rgba(8,21,48,.55);backdrop-filter:blur(4px)}.cf-modal{width:min(580px,100%);padding:20px;border-radius:20px;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.28)}.cf-modal-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px}.cf-modal-head small{font-size:9px;font-weight:900;letter-spacing:.14em;color:#1768d5}.cf-modal-head h3{margin:5px 0 0;color:#17243c}.cf-modal-head>button{width:32px;height:32px;border:0;border-radius:10px;background:#f0f3f8;color:#55657d;font-size:20px;cursor:pointer}.cf-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.cf-form-grid label{display:grid;gap:6px;color:#53627a;font-size:11px;font-weight:800}.cf-form-grid label:last-child:nth-child(odd){grid-column:1/-1}.cf-form-grid input,.cf-form-grid select{width:100%;box-sizing:border-box;border:1px solid #dce4ef;border-radius:11px;padding:12px;background:#fafcff;color:#17243c;outline:none}.cf-form-grid input:focus,.cf-form-grid select:focus{border-color:#2c7be5;box-shadow:0 0 0 3px rgba(44,123,229,.11)}.cf-modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:19px}.cf-modal-actions button{border:0;border-radius:11px;padding:11px 16px;font-weight:850;cursor:pointer}.cf-secondary{background:#eef2f7;color:#53627a}.cf-primary{background:#1768d5;color:#fff}
@media(max-width:1180px){.cf-kpis,.cf-flow-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cf-sections{grid-template-columns:1fr}}
@media(max-width:760px){.cf-hero{align-items:flex-start;flex-direction:column}.cf-hero-score{min-width:0;width:100%;box-sizing:border-box}.cf-kpis,.cf-flow-grid,.cf-form-grid{grid-template-columns:1fr}.cf-form-grid label:last-child:nth-child(odd){grid-column:auto}}

/* =========================================================
   ETAPA 5 — CALENDÁRIO FINANCEIRO INTELIGENTE
   ========================================================= */
html.browser-mode .calendar-pro-summary{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px
}
html.browser-mode .calendar-pro-summary article{
  background:#fff;border:1px solid #e8edf4;border-radius:20px;padding:20px;box-shadow:0 12px 34px rgba(28,45,76,.07)
}
html.browser-mode .calendar-pro-summary small{display:block;color:#7d8798;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
html.browser-mode .calendar-pro-summary b{display:block;font-size:25px;margin:8px 0 4px;color:#172033}
html.browser-mode .calendar-pro-summary span{font-size:12px;color:#8c96a7}
html.browser-mode .calendar-pro-summary .positive{color:#13975a}
html.browser-mode .calendar-pro-summary .negative{color:#dd4d5b}
html.browser-mode .calendar-pro-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}
html.browser-mode #calendarNewEvent{border:0;border-radius:14px;background:#172033;color:#fff;padding:14px 20px;font-weight:900;cursor:pointer;box-shadow:0 10px 22px rgba(23,32,51,.18)}
html.browser-mode .calendar-pro-actions .desktop-calendar-toolbar{margin:0;min-width:310px}
html.browser-mode .calendar-pro-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
html.browser-mode .desktop-calendar-card{background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:16px;box-shadow:0 14px 34px rgba(28,45,76,.07)}
html.browser-mode .desktop-calendar-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;padding:0 0 9px}
html.browser-mode .desktop-calendar-week span{text-align:center;font-size:11px;font-weight:900;color:#8993a3;text-transform:uppercase}
html.browser-mode .desktop-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
html.browser-mode .desktop-calendar-day{appearance:none;text-align:left;min-height:112px;padding:10px;border:1px solid #edf0f5;border-radius:15px;background:#fbfcfe;color:#1c2638;cursor:pointer;overflow:hidden;transition:.18s ease}
html.browser-mode .desktop-calendar-day:hover{transform:translateY(-2px);border-color:#cfd9e8;background:#fff;box-shadow:0 10px 22px rgba(34,49,79,.08)}
html.browser-mode .desktop-calendar-day.empty-day{visibility:hidden;pointer-events:none}
html.browser-mode .desktop-calendar-day.today{border-color:#1b9a60;box-shadow:inset 0 0 0 1px #1b9a60}
html.browser-mode .desktop-calendar-day>b{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;font-size:12px}
html.browser-mode .desktop-calendar-day.today>b{background:#17965b;color:#fff}
html.browser-mode .calendar-day-events{display:flex;flex-direction:column;gap:4px;margin-top:7px}
html.browser-mode .calendar-day-events span{display:block;border-radius:7px;padding:4px 6px;font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#f1f3f7;color:#536074}
html.browser-mode .calendar-day-events span.income{background:#e9f8f0;color:#138a53}
html.browser-mode .calendar-day-events span.expense{background:#fff0f1;color:#cf4654}
html.browser-mode .calendar-day-events span.card{background:#eef2ff;color:#4b59b9}
html.browser-mode .calendar-day-events span.subscription{background:#fff7e7;color:#a86d13}
html.browser-mode .calendar-day-events span.paid{text-decoration:line-through;opacity:.6}
html.browser-mode .calendar-day-events small{font-size:9px;color:#8a94a4}
html.browser-mode .calendar-upcoming{background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:18px;box-shadow:0 14px 34px rgba(28,45,76,.07)}
html.browser-mode .calendar-upcoming-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid #eef1f5}
html.browser-mode .calendar-upcoming-row:last-child{border-bottom:0}
html.browser-mode .calendar-upcoming-row span{min-width:0}
html.browser-mode .calendar-upcoming-row b,html.browser-mode .calendar-upcoming-row small{display:block}
html.browser-mode .calendar-upcoming-row b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.browser-mode .calendar-upcoming-row small{font-size:11px;color:#8a94a4;margin-top:3px}
html.browser-mode .calendar-upcoming-row strong{font-size:12px;color:#d64956;white-space:nowrap}
html.browser-mode .calendar-timeline{margin-top:18px;background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:20px;box-shadow:0 14px 34px rgba(28,45,76,.07)}
html.browser-mode .calendar-timeline-item{display:grid;grid-template-columns:56px minmax(0,1fr) 150px 150px;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #eef1f5}
html.browser-mode .calendar-timeline-item:last-child{border-bottom:0}
html.browser-mode .calendar-timeline-item.paid{opacity:.65}
html.browser-mode .calendar-timeline-date{width:46px;height:46px;border-radius:14px;background:#f1f4f8;display:grid;place-items:center;align-content:center}
html.browser-mode .calendar-timeline-date b{font-size:16px;line-height:1}
html.browser-mode .calendar-timeline-date small{font-size:9px;color:#7d8798;text-transform:uppercase}
html.browser-mode .calendar-timeline-copy strong,html.browser-mode .calendar-timeline-copy span{display:block}
html.browser-mode .calendar-timeline-copy strong{font-size:14px;color:#172033}
html.browser-mode .calendar-timeline-copy span{font-size:11px;color:#8892a2;margin-top:4px}
html.browser-mode .calendar-timeline-value{text-align:right}
html.browser-mode .calendar-timeline-value b,html.browser-mode .calendar-timeline-value small{display:block}
html.browser-mode .calendar-timeline-value b{font-size:14px}
html.browser-mode .calendar-timeline-value small{font-size:10px;color:#8a94a4}
html.browser-mode .calendar-timeline-actions{display:flex;justify-content:flex-end;gap:7px}
html.browser-mode .calendar-timeline-actions button{border:1px solid #dfe5ee;background:#fff;border-radius:9px;padding:7px 9px;font-size:10px;font-weight:800;cursor:pointer;color:#536074}
html.browser-mode .calendar-timeline-actions button:first-child{background:#172033;color:#fff;border-color:#172033}
html.browser-mode .calendar-empty{padding:30px;text-align:center;color:#7c8798}
html.browser-mode .calendar-empty b,html.browser-mode .calendar-empty span{display:block}
html.browser-mode .calendar-empty span{margin-top:6px;font-size:12px}
html.browser-mode .calendar-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(16,25,40,.48);backdrop-filter:blur(5px);z-index:9999}
html.browser-mode .calendar-modal.show{display:flex}
html.browser-mode .calendar-modal-card{position:relative;width:min(620px,100%);background:#fff;border-radius:24px;padding:28px;box-shadow:0 30px 80px rgba(16,25,40,.3)}
html.browser-mode .calendar-modal-card h3{margin:0 0 5px;font-size:23px;color:#172033}
html.browser-mode .calendar-modal-card>p{margin:0 0 20px;color:#7e8999;font-size:13px}
html.browser-mode .calendar-modal-close{position:absolute;right:18px;top:16px;border:0;background:#f1f4f8;width:34px;height:34px;border-radius:10px;font-size:22px;cursor:pointer}
html.browser-mode #calendarForm label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:900;color:#5c687a;text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
html.browser-mode #calendarForm input,html.browser-mode #calendarForm select{width:100%;box-sizing:border-box;border:1px solid #dfe5ee;border-radius:12px;padding:12px 13px;background:#fbfcfe;color:#172033;font:inherit;font-size:13px;text-transform:none;letter-spacing:0;outline:none}
html.browser-mode #calendarForm input:focus,html.browser-mode #calendarForm select:focus{border-color:#19955b;box-shadow:0 0 0 3px rgba(25,149,91,.1)}
html.browser-mode .calendar-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
html.browser-mode .calendar-submit{width:100%;border:0;border-radius:13px;padding:14px;background:#17965b;color:#fff;font-weight:900;cursor:pointer}
@media(max-width:1250px){
  html.browser-mode .calendar-pro-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  html.browser-mode .calendar-pro-layout{grid-template-columns:1fr}
  html.browser-mode .calendar-upcoming{order:-1}
}
@media(max-width:980px){
  html.browser-mode .calendar-timeline-item{grid-template-columns:50px minmax(0,1fr) 120px}
  html.browser-mode .calendar-timeline-actions{grid-column:2/4;justify-content:flex-start}
}

/* ETAPA 6 — indicador de sincronização */
.pd-sync-status{position:fixed;right:22px;bottom:22px;z-index:9998;border:1px solid rgba(148,163,184,.28);background:rgba(15,23,42,.94);color:#e2e8f0;border-radius:999px;padding:9px 13px;display:flex;align-items:center;gap:8px;box-shadow:0 12px 34px rgba(15,23,42,.22);font:700 12px/1.1 Inter,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(14px)}
.pd-sync-status i{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.13)}
.pd-sync-status.syncing i{background:#38bdf8;animation:pdSyncPulse 1s infinite}.pd-sync-status.pending i,.pd-sync-status.warning i{background:#f59e0b}.pd-sync-status.offline i,.pd-sync-status.error i{background:#ef4444}
@keyframes pdSyncPulse{50%{opacity:.35;transform:scale(.72)}}
@media(max-width:700px){.pd-sync-status{right:12px;bottom:82px;padding:8px 10px}.pd-sync-status span{max-width:125px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}

/* ETAPA 7 — Calendário Premium completo */
html.browser-mode .calendar-commandbar,
html.browser-mode .calendar-filterbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
html.browser-mode .calendar-command-left{display:flex;gap:9px;align-items:center}
html.browser-mode #calendarToday{border:1px solid #dfe5ee;background:#fff;color:#26344e;border-radius:13px;padding:12px 16px;font-weight:900;cursor:pointer}
html.browser-mode .calendar-view-switch{display:flex;align-items:center;gap:4px;padding:4px;background:#edf1f6;border-radius:13px}
html.browser-mode .calendar-view-switch button{border:0;background:transparent;color:#6f7b8d;border-radius:10px;padding:9px 14px;font-weight:900;cursor:pointer}
html.browser-mode .calendar-view-switch button.active{background:#fff;color:#172033;box-shadow:0 4px 12px rgba(25,39,65,.1)}
html.browser-mode .calendar-filterbar{background:#fff;border:1px solid #e8edf4;border-radius:18px;padding:10px 12px;box-shadow:0 8px 24px rgba(28,45,76,.05)}
html.browser-mode .calendar-filterbar select,
html.browser-mode .calendar-filterbar input{border:1px solid #dfe5ee;border-radius:11px;padding:10px 12px;background:#fbfcfe;color:#26344e;font:inherit;font-size:12px;outline:none}
html.browser-mode .calendar-filterbar input{min-width:230px}
html.browser-mode .calendar-filterbar .desktop-calendar-toolbar{margin:0;margin-left:auto}
html.browser-mode [data-calendar-drag]{cursor:grab}
html.browser-mode [data-calendar-drag]:active{cursor:grabbing}
html.browser-mode .desktop-calendar-day.drag-over,
html.browser-mode .calendar-week-column.drag-over{border-color:#17965b!important;background:#ecfbf3!important;box-shadow:inset 0 0 0 2px rgba(23,150,91,.18)!important}
html.browser-mode .calendar-week-view{display:grid;grid-template-columns:repeat(7,minmax(125px,1fr));gap:8px;overflow-x:auto;background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:14px;box-shadow:0 14px 34px rgba(28,45,76,.07)}
html.browser-mode .calendar-week-column{min-height:430px;border:1px solid #edf0f5;border-radius:15px;background:#fbfcfe;padding:10px;transition:.18s ease}
html.browser-mode .calendar-week-column.today{border-color:#17965b;box-shadow:inset 0 0 0 1px #17965b}
html.browser-mode .calendar-week-column header{display:flex;align-items:center;justify-content:space-between;padding-bottom:9px;border-bottom:1px solid #edf0f5}
html.browser-mode .calendar-week-column header small{font-size:10px;text-transform:uppercase;color:#8892a2;font-weight:900}
html.browser-mode .calendar-week-column header b{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#eef2f7;color:#26344e}
html.browser-mode .calendar-week-column.today header b{background:#17965b;color:#fff}
html.browser-mode .calendar-week-events{display:flex;flex-direction:column;gap:7px;margin-top:9px}
html.browser-mode .calendar-week-events em{color:#a0a9b7;font-size:10px;text-align:center;padding-top:20px;font-style:normal}
html.browser-mode .calendar-week-event{border-radius:10px;padding:9px;background:#f2f4f8;border-left:4px solid #7e8ca4}
html.browser-mode .calendar-week-event strong,
html.browser-mode .calendar-week-event span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.browser-mode .calendar-week-event strong{font-size:11px;color:#26344e}
html.browser-mode .calendar-week-event span{font-size:10px;margin-top:3px;color:#7c8798}
html.browser-mode .calendar-week-event.income{background:#e9f8f0;border-left-color:#138a53}
html.browser-mode .calendar-week-event.expense{background:#fff0f1;border-left-color:#cf4654}
html.browser-mode .calendar-week-event.card{background:#eef2ff;border-left-color:#4b59b9}
html.browser-mode .calendar-week-event.subscription{background:#fff7e7;border-left-color:#a86d13}
html.browser-mode .calendar-week-event.paid{text-decoration:line-through;opacity:.6}
html.browser-mode .calendar-agenda-view{background:#fff;border:1px solid #e8edf4;border-radius:22px;padding:10px 18px;box-shadow:0 14px 34px rgba(28,45,76,.07)}
html.browser-mode .calendar-agenda-item{display:grid;grid-template-columns:52px minmax(0,1fr) 130px;align-items:center;gap:14px;padding:15px 2px;border-bottom:1px solid #eef1f5}
html.browser-mode .calendar-agenda-item:last-child{border-bottom:0}
html.browser-mode .calendar-agenda-item time{width:44px;height:44px;border-radius:13px;background:#f1f4f8;display:grid;place-items:center;align-content:center}
html.browser-mode .calendar-agenda-item time b{font-size:16px;line-height:1}.calendar-agenda-item time small{font-size:9px;text-transform:uppercase;color:#7d8798}
html.browser-mode .calendar-agenda-item>div strong,
html.browser-mode .calendar-agenda-item>div span{display:block}
html.browser-mode .calendar-agenda-item>div strong{font-size:13px;color:#172033}
html.browser-mode .calendar-agenda-item>div span{font-size:11px;color:#8892a2;margin-top:4px}
html.browser-mode .calendar-agenda-item>b{text-align:right;font-size:13px;color:#26344e}
html.browser-mode .calendar-agenda-item.income>b{color:#138a53}.calendar-agenda-item.expense>b{color:#cf4654}
html.browser-mode .calendar-agenda-item.paid{opacity:.58;text-decoration:line-through}
@media(max-width:1050px){html.browser-mode .calendar-commandbar,html.browser-mode .calendar-filterbar{align-items:stretch;flex-wrap:wrap}html.browser-mode .calendar-filterbar input{min-width:170px;flex:1}.calendar-filterbar .desktop-calendar-toolbar{width:100%;justify-content:center}}
@media(max-width:700px){html.browser-mode .calendar-commandbar{flex-direction:column}html.browser-mode .calendar-command-left,html.browser-mode .calendar-view-switch{width:100%}html.browser-mode .calendar-command-left button,html.browser-mode .calendar-view-switch button{flex:1}html.browser-mode .calendar-filterbar{flex-direction:column}html.browser-mode .calendar-filterbar input,html.browser-mode .calendar-filterbar select{width:100%;min-width:0}html.browser-mode .calendar-agenda-item{grid-template-columns:46px minmax(0,1fr)}html.browser-mode .calendar-agenda-item>b{grid-column:2;text-align:left}}

/* ETAPA 7.1 — seleção do dia e inclusão pelo botão + */
.desktop-calendar-day{position:relative}
.desktop-calendar-day.selected{outline:2px solid var(--primary,#2563eb);outline-offset:-2px;background:rgba(37,99,235,.07)}
.calendar-day-add{position:absolute;top:7px;right:7px;width:23px;height:23px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:800;line-height:1;background:rgba(15,23,42,.07);color:#334155;opacity:0;transform:scale(.88);transition:.18s ease;z-index:3}
.desktop-calendar-day:hover .calendar-day-add,.desktop-calendar-day.selected .calendar-day-add,.calendar-day-add:focus{opacity:1;transform:scale(1)}
.calendar-day-add:hover{background:var(--primary,#2563eb);color:#fff}
.calendar-week-column{position:relative}
.calendar-week-column.selected{outline:2px solid var(--primary,#2563eb);outline-offset:-2px;background:rgba(37,99,235,.06)}
.calendar-week-column header{position:relative}
.calendar-week-add{position:absolute;top:8px;right:8px;width:25px;height:25px;border:0;border-radius:8px;background:rgba(15,23,42,.07);font-weight:800;cursor:pointer;opacity:.25;transition:.18s ease}
.calendar-week-column:hover .calendar-week-add,.calendar-week-column.selected .calendar-week-add{opacity:1}
.calendar-week-add:hover{background:var(--primary,#2563eb);color:#fff}
@media (max-width:780px){.calendar-day-add{opacity:.85;transform:none}.calendar-week-add{opacity:.8}}

/* ETAPA 7.2 — Calendário Profissional */
.calendar-event-chip{display:flex!important;align-items:center;gap:5px;min-width:0;cursor:pointer}
.calendar-event-chip i{font-style:normal;font-size:10px;opacity:.85;flex:0 0 auto}
.calendar-event-chip em{font-style:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calendar-more-events{display:block!important;margin-top:3px;padding:2px 5px;border-radius:6px;background:rgba(15,23,42,.06);font-weight:700;color:#475569!important}
.calendar-day-balance{display:flex;gap:5px;flex-wrap:wrap;margin-top:auto;padding-top:4px;font-size:9px;font-weight:800}
.calendar-day-balance span{padding:2px 4px;border-radius:5px;background:rgba(255,255,255,.76)}
.calendar-smart-alert{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:12px 15px;border-radius:14px;border:1px solid rgba(148,163,184,.24);background:#f8fafc}
.calendar-smart-alert>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e2e8f0;font-weight:900}
.calendar-smart-alert div{display:flex;flex-direction:column;gap:2px}
.calendar-smart-alert b{font-size:13px}
.calendar-smart-alert small{font-size:12px;color:#64748b}
.calendar-smart-alert.warning{background:#fff7ed;border-color:#fed7aa}
.calendar-smart-alert.warning>span{background:#ffedd5;color:#c2410c}
.calendar-smart-alert.ok{background:#f0fdf4;border-color:#bbf7d0}
.calendar-smart-alert.ok>span{background:#dcfce7;color:#15803d}
.calendar-agenda-item[data-calendar-open],.calendar-week-event[data-calendar-open]{cursor:pointer}
.calendar-agenda-item strong i,.calendar-week-event strong i{font-style:normal;margin-right:7px}
.calendar-detail-modal .calendar-modal-card{max-width:560px}
.calendar-detail-head{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.calendar-detail-head>span{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;font-size:20px;background:#e2e8f0}
.calendar-detail-head.income>span{background:#dcfce7;color:#15803d}
.calendar-detail-head.expense>span{background:#fee2e2;color:#b91c1c}
.calendar-detail-head.card>span{background:#e0e7ff;color:#4338ca}
.calendar-detail-head.subscription>span{background:#fef3c7;color:#b45309}
.calendar-detail-head small{display:block;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.calendar-detail-head h3{margin:3px 0 0;font-size:22px}
.calendar-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}
.calendar-detail-grid>div,.calendar-detail-note{padding:12px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0}
.calendar-detail-grid small,.calendar-detail-note small{display:block;color:#64748b;font-size:11px;margin-bottom:4px}
.calendar-detail-grid b{font-size:14px}
.calendar-detail-note p{margin:0;color:#334155;line-height:1.5}
.calendar-detail-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}
.calendar-detail-actions button{border:1px solid #dbe3ee;background:#fff;border-radius:10px;padding:9px 12px;font-weight:700;cursor:pointer}
.calendar-detail-actions button:hover{background:#f8fafc}
.calendar-detail-actions button.danger{color:#b91c1c;border-color:#fecaca;background:#fff7f7}
.desktop-calendar-day.drag-over,.calendar-week-column.drag-over{outline:2px dashed #2563eb;outline-offset:-3px;background:#eff6ff!important}
@media(max-width:760px){.calendar-detail-grid{grid-template-columns:1fr}.calendar-detail-actions button{flex:1 1 45%}.calendar-day-balance{display:none}}


/* ETAPA 10.0 — Gamificação Premium */
.pd-game-dashboard{display:grid;grid-template-columns:1.15fr 1fr;gap:14px;padding:18px;border-radius:24px;background:linear-gradient(135deg,#071247,#123a93);color:#fff;box-shadow:0 16px 36px rgba(7,18,71,.18)}
.pd-game-level{display:flex;align-items:center;gap:14px}.pd-game-level-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:20px;background:rgba(255,255,255,.14);font-size:30px}.pd-game-level small,.pd-game-level p{opacity:.78}.pd-game-level h3{margin:3px 0;font-size:24px}.pd-game-level p{margin:0;font-weight:700}
.pd-game-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pd-game-kpis div{display:grid;align-content:center;text-align:center;padding:10px;border-radius:16px;background:rgba(255,255,255,.1)}.pd-game-kpis b{font-size:20px}.pd-game-kpis span{font-size:11px;opacity:.78}
.pd-game-next{display:grid;grid-template-columns:1fr auto;gap:5px 12px;padding:15px 17px;border:1px solid rgba(49,95,212,.16);border-radius:18px;background:#fff}.pd-game-next small{display:block;margin-top:3px;color:#64748b}.pd-game-next strong{align-self:center;color:#123a93}.pd-game-progress{grid-column:1/-1;height:10px;border-radius:99px;background:#e8edf7;overflow:hidden}.pd-game-progress span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#123a93,#00a86b)}
.pd-game-section-head{display:flex;justify-content:space-between;gap:12px;align-items:end}.pd-game-section-head p{margin:2px 0 0;color:#64748b;font-size:12px}.pd-game-section-head strong{font-size:12px;color:#123a93;background:#edf3ff;padding:7px 10px;border-radius:999px;white-space:nowrap}
.pd-game-medals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pd-game-medal{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:13px;border-radius:17px;border:1px solid #e3e9f3;background:#fff}.pd-game-medal>span{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#f1f5fb;font-size:22px}.pd-game-medal b,.pd-game-medal small{display:block}.pd-game-medal small{margin-top:3px;color:#64748b;line-height:1.3}.pd-game-medal em{font-style:normal;font-size:11px;font-weight:900;color:#00a86b}.pd-game-medal.is-locked{opacity:.55;filter:grayscale(.8)}.pd-game-medal.is-locked em{color:#64748b}
.pd-game-rules{display:grid;gap:7px;padding:15px 17px;border-radius:18px;background:#fff9df;border:1px solid #f0dfa2}.pd-game-rules>b{color:#071247}.pd-game-rules div{display:flex;justify-content:space-between;gap:12px;font-size:12px}.pd-game-rules span{color:#64748b}.pd-game-rules strong{color:#071247}
@media(max-width:720px){.pd-game-dashboard{grid-template-columns:1fr}.pd-game-medals{grid-template-columns:1fr}.pd-game-level h3{font-size:21px}.pd-game-kpis b{font-size:17px}.pd-game-medal{grid-template-columns:40px 1fr auto}.pd-game-medal em{max-width:62px;text-align:right}}
