/* FINANÇA+ · Design Premium 4.0
   Camada visual reversível. Não modifica a tela de login, persistência ou regras financeiras. */
.layout{
 --bg:#f2f6fb;
 --surface:#ffffff;
 --surface2:#f7faff;
 --text:#183451;
 --muted:#637b95;
 --stroke:#dfe8f3;
 --green:#117fd1;
 --green-dark:#0964a9;
 --green-pale:#eaf4ff;
 --blue:#0c77c9;
 --shadow:0 8px 30px rgba(23,70,119,.045);
 color:var(--text);
 min-width:0;
}
.layout .page{
 min-height:100dvh;
 background:linear-gradient(180deg,#f0f6ff 0,#f4f8fc 230px,#f6f9fd 100%);
}
.layout .sidebar{
 background:#fff;
 border-right:1px solid #e3ebf5;
 padding-top:24px;
 overflow-y:auto;
 overscroll-behavior:contain;
 touch-action:pan-y;
 scrollbar-color:#c3d9eb transparent;
 scrollbar-width:thin;
}
.layout .sidebar .brand{
 color:#123f6d;
 font-size:23px;
 letter-spacing:-.045em;
 padding:9px 12px 27px;
}
.layout .sidebar .brand-mark{
 background:linear-gradient(145deg,#0a5b9c,#128bce);
 border-radius:13px;
 color:white;
 box-shadow:0 5px 14px #1877bf29;
}
.layout .sidebar .brand .plus{color:#0a86dc}
.layout .sidebar .nav-label{
 color:#7a90a7;
 font-size:10px;
 letter-spacing:.115em;
 padding-top:9px;
}
.layout .sidebar .nav-list{gap:3px}
.layout .sidebar .nav-btn{
 border:1px solid transparent;
 color:#56718c;
 font-size:12.5px;
 font-weight:700;
 min-height:43px;
 padding:11px 12px;
 border-radius:11px;
 transition:color .18s ease,background .18s ease,border-color .18s ease;
}
.layout .sidebar .nav-btn:hover{
 background:#f0f6fc;
 color:#0d62a5;
}
.layout .sidebar .nav-btn.active{
 background:linear-gradient(100deg,#e8f4ff,#f4faff);
 color:#076eaf;
 border-color:#d8ebfc;
 box-shadow:inset 3px 0 #0e84d5;
}
.layout .sidebar .nav-btn.active svg{color:#097ac7}
.layout .sidebar .sidebar-end{
 margin-top:auto;
 border-top:1px solid #edf1f7;
 padding-top:15px;
}
.layout .topbar{
 background:rgba(252,254,255,.97);
 border-bottom:1px solid #e3edf7;
 min-height:70px;
 height:78px;
}
.layout .breadcrumb{font-size:12px;color:#6e849a}
.layout .breadcrumb b{color:#264663}
.layout .top-actions .icon-btn{
 border-color:#dce7f3;
 border-radius:12px;
 background:#fff;
}
.layout .top-actions .icon-btn:hover{
 background:#f0f8ff;
 border-color:#a9d2f2;
}
.layout .content{
 width:100%;
 max-width:1450px;
 padding-top:30px;
}
.layout .page-title{
 color:#153c63;
 font-size:clamp(26px,2.35vw,35px);
 letter-spacing:-.042em;
 line-height:1.18;
}
.layout .page-subtitle{
 color:#687f98;
 font-size:13px;
 line-height:1.6;
}
.layout .eyebrow{
 color:#2886c6;
 font-size:10px;
 letter-spacing:.145em;
}
.layout .section-head{margin-bottom:23px}
.layout .btn{
 border-radius:12px;
 min-height:44px;
 box-shadow:none;
 transition:background .16s ease,box-shadow .16s ease,transform .16s ease;
}
.layout .btn:not(.secondary):not(.ghost){
 background:#087dcc;
 color:#fff;
}
.layout .btn:not(.secondary):not(.ghost):hover{
 background:#0766a9;
 box-shadow:0 7px 18px #0b6fb62b;
 transform:translateY(-1px);
}
.layout .btn.secondary{
 color:#24639c;
 border-color:#d7e6f4;
 background:#fff;
}
.layout .btn.secondary:hover{
 background:#f2f8fd;
 border-color:#add4f1;
}
.layout .panel,
.layout .smart-panel{
 background:#fff;
 border:1px solid #dee9f5;
 border-radius:20px;
 box-shadow:0 5px 24px rgba(25,68,115,.045);
}
.layout .panel{padding:clamp(17px,2vw,24px)}
.layout .panel h2,
.layout .smart-panel h2{
 color:#234463;
 letter-spacing:-.02em;
}
.layout .greeting-banner{
 background:linear-gradient(110deg,#e7f3ff,#f6fbff 65%,#fff) !important;
 border:1px solid #dcecfb !important;
 border-radius:19px !important;
 padding:17px 23px !important;
 margin-bottom:15px !important;
}
.layout .greeting-banner h2{
 color:#194c77;
 font-size:16px!important;
 font-weight:800;
 line-height:1.4;
}
.layout .summary-grid{gap:14px}
.layout .summary-tile{
 border:1px solid #deebf5;
 border-top-width:3px;
 border-radius:19px;
 background:#fff;
 padding:clamp(18px,2vw,24px);
 box-shadow:0 6px 22px #184c7b0b;
 transition:box-shadow .18s ease,transform .18s ease;
}
.layout .summary-tile:hover{
 transform:translateY(-2px);
 box-shadow:0 12px 25px #184c7b15;
}
.layout .summary-tile>span{
 color:#688098;
 font-weight:700;
 font-size:12px;
}
.layout .summary-tile>strong{
 font-size:clamp(23px,2.5vw,32px);
 letter-spacing:-.045em;
 margin:11px 0 8px;
 font-variant-numeric:tabular-nums;
}
.layout .summary-tile>small{color:#7890a5;font-size:11px}
.layout .summary-tile.green{border-top-color:#15a17a}
.layout .summary-tile.red{border-top-color:#e17078}
.layout .summary-tile.blue{border-top-color:#2d8cd3}
.layout .summary-tile.green>strong{color:#147a60}
.layout .summary-tile.red>strong{color:#c84856}
.layout .summary-tile.blue>strong{color:#096dac}
.layout .period-toolbar{
 border:1px solid #dce9f4;
 border-radius:16px;
 box-shadow:0 3px 17px #174c7c0b;
}
.layout .period-pills{
 background:#eff5fc;
 border-radius:11px;
}
.layout .period-pills button.selected,
.layout .period-pills button.active{
 background:#087dcc;
 color:white;
 border-radius:10px;
 box-shadow:0 3px 9px #167bc02e;
}
.layout .overview-line{
 background:#eaf5ff;
 border:1px solid #d6eaf8;
 border-radius:13px;
 margin-bottom:20px;
 padding:13px 16px;
}
.layout .overview-line strong{color:#155f9d}
.layout .branded-source{
 border-radius:19px!important;
 box-shadow:0 8px 20px #143e661a!important;
 transition:transform .18s ease,box-shadow .18s ease;
}
.layout .branded-source:hover{
 transform:translateY(-2px);
 box-shadow:0 13px 25px #143e6627!important;
}
.layout .branded-source .profit-value{
 font-variant-numeric:tabular-nums;
 letter-spacing:-.045em;
}
.layout .source-add,.layout .source-add button{border-radius:10px}
.layout .entry-row,
.layout .table-row,
.layout .setting-row{
 border-bottom-color:#e9eff6;
}
.layout .entry-row:hover,
.layout .table-row:hover{
 background:#f7fbff;
 border-radius:10px;
}
.layout .filter-panel,
.layout .sync-panel{border-color:#dbe9f5}
.layout input:not([type="checkbox"]):not([type="radio"]),
.layout select,
.layout textarea{
 border-color:#d7e4f0;
 background-color:#fff;
 border-radius:11px;
 color:#233f5c;
}
.layout input:focus,
.layout textarea:focus,
.layout select:focus{
 border-color:#5ca9df;
}
.layout button:focus-visible,
.layout input:focus-visible,
.layout textarea:focus-visible,
.layout select:focus-visible{
 outline:3px solid #65b9f5;
 outline-offset:2px;
}
.layout .guardian-v2{
 color:#264766;
}
.layout .guardian-v2-head{
 border-radius:21px!important;
 background:linear-gradient(110deg,#e8f4ff,#fff 73%)!important;
 border-color:#d5e8fa!important;
}
.layout .guardian-v2-emblem{
 box-shadow:0 4px 18px #148de328;
}
.layout .guardian-v2-summary{
 border-radius:17px;
 border:1px solid #d6e8f7;
 box-shadow:0 5px 17px #1459880d!important;
}
.layout .guardian-tabs button{
 border-radius:11px;
 min-height:45px;
}
.layout .guardian-tabs .is-active{
 background:#087dcc;
 color:#fff;
}
.layout .guardian-workspace,
.layout .finbot-wrap{
 border-radius:18px;
}
.layout .guardian-form,
.layout .finbot-form{
 border-radius:15px!important;
 box-shadow:0 3px 14px #185d8c0b;
}
.layout .guardian-bubble{
 line-height:1.55;
 overflow-wrap:anywhere;
}
.layout .smart-screen{max-width:1350px;gap:17px}
.layout .smart-heading{
 border-radius:22px;
 background:linear-gradient(115deg,#e3f1ff,#f8fbff 68%,#fff);
 border:1px solid #cfe5f8;
 padding:clamp(20px,3vw,30px);
}
.layout .smart-heading h1{color:#14486f;letter-spacing:-.035em}
.layout .smart-heading p{color:#637e98}
.layout .smart-tabs{
 gap:7px;
 padding:2px 0 7px;
}
.layout .smart-tabs button{
 font-size:12px;
 font-weight:800;
 min-height:43px;
 border-radius:12px;
 border:1px solid #d7e6f3;
 color:#54728c;
 background:#fff;
}
.layout .smart-tabs button.active{
 color:white;
 background:linear-gradient(120deg,#0869b0,#0b8ad5);
 border-color:#087dcc;
 box-shadow:0 5px 15px #0b85c02b;
}
.layout .smart-stat{
 border-radius:17px;
 border:1px solid #deebf5;
 box-shadow:0 4px 18px #174f8510;
}
.layout .smart-stat small{font-size:12px}
.layout .smart-stat strong{
 color:#155987;
 font-variant-numeric:tabular-nums;
 letter-spacing:-.035em;
}
.layout .smart-stat span{font-size:11px}
.layout .smart-panel{padding:clamp(17px,2.1vw,24px)}
.layout .smart-panel-head h2{font-size:18px}
.layout .smart-row{gap:13px}
.layout .smart-row b{font-size:13px}
.layout .smart-row span{font-size:12px}
.layout .smart-row button,
.layout .smart-dup button{
 background:#edf7ff;
 border-color:#cde3f5;
 color:#0e6fae;
}
.layout .smart-row button:hover,
.layout .smart-dup button:hover{background:#daefff}
.layout .smart-form .smart-field label{font-size:12px;color:#4d6e8b}
.layout .smart-form .smart-field input,
.layout .smart-form .smart-field select{min-height:47px}
.layout .smart-batch-item{border-color:#d7e8f7;background:#fafeff}
.layout .smart-note{color:#627b94;line-height:1.62}
.layout .bottom-nav{background:#fff;border-top-color:#dce8f3}
.layout .bottom-tab.active{color:#087dcc;background:#edf7ff}
@media (max-width:1200px){
 .layout .content{padding-left:24px;padding-right:24px}
 .layout .summary-grid{gap:11px}
}
@media (max-width:720px){
 .layout .page{background:#f5f9fd}
 .layout .topbar{height:62px;min-height:62px}
 .layout .content{
  padding:18px 15px calc(112px + env(safe-area-inset-bottom,0px));
 }
 .layout .page-title{font-size:25px;line-height:1.2}
 .layout .page-subtitle{font-size:12px}
 .layout .section-head{gap:13px}
 .layout .greeting-banner{padding:14px 16px!important;border-radius:16px!important}
 .layout .greeting-banner h2{font-size:14px!important}
 .layout .summary-grid{gap:9px}
 .layout .summary-tile{padding:16px 13px;border-radius:16px}
 .layout .summary-tile>strong{font-size:clamp(20px,5vw,25px);margin:0;min-width:0;overflow-wrap:anywhere}
 .layout .summary-tile>span{font-size:11px;line-height:1.4}
 .layout .summary-tile>small{font-size:10px}
 .layout .overview-line{padding:12px;gap:9px}
 .layout .smart-grid{gap:9px}
 .layout .smart-stat{padding:15px 13px;border-radius:15px}
 .layout .smart-stat strong{font-size:20px}
 .layout .smart-stat small{font-size:11px}
 .layout .smart-heading{padding:19px 18px}
 .layout .smart-heading h1{font-size:25px}
 .layout .smart-panel{padding:17px 15px;border-radius:17px}
 .layout .smart-row{align-items:flex-start}
 .layout .smart-row strong{font-size:12px}
 .layout .smart-tabs button{min-height:42px}
 .layout .btn{min-height:44px}
 .layout .smart-form input,
 .layout .smart-form select,
 .layout .guardian-form textarea,
 .layout .finbot-form textarea{font-size:16px}
 .layout .modal{max-width:calc(100vw - 18px)}
}
@media(max-width:390px){
 .layout .summary-grid{grid-template-columns:1fr}
 .layout .summary-tile{grid-column:auto;padding:16px}
 .layout .summary-tile>strong{font-size:22px}
 .layout .smart-stat strong{font-size:19px}
 .layout .smart-row{gap:8px}
}
@media(prefers-reduced-motion:reduce){
 .layout .branded-source,
 .layout .btn,
 .layout .summary-tile,
 .layout .nav-btn{transition:none!important;transform:none!important}
}
