.sr-root{display:grid;gap:18px;padding-bottom:30px}.sr-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px;border-radius:24px;background:linear-gradient(135deg,#233a7a,#315fd4);color:#fff;box-shadow:0 16px 36px rgba(31,64,145,.2)}.sr-head small{font-weight:800;letter-spacing:.12em;opacity:.78}.sr-head h3{margin:5px 0;font-size:clamp(22px,3vw,32px)}.sr-head p{margin:0;opacity:.86}.sr-head-actions{display:flex;gap:9px;flex-wrap:wrap}.sr-head-actions button,.sr-toolbar button{border:0;border-radius:12px;padding:11px 14px;font-weight:750;cursor:pointer}.sr-head-actions button{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25)}.sr-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.sr-period,.sr-tabs{display:flex;align-items:center;gap:8px;background:var(--card,#fff);padding:6px;border-radius:15px;border:1px solid rgba(120,135,160,.18)}.sr-period strong{min-width:170px;text-align:center}.sr-toolbar button{background:transparent;color:inherit}.sr-tabs button.active{background:#315fd4;color:#fff}.sr-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.sr-kpi{padding:18px;border-radius:18px;background:var(--card,#fff);border:1px solid rgba(120,135,160,.16);box-shadow:0 8px 22px rgba(35,50,80,.07)}.sr-kpi span,.sr-kpi small{display:block;color:#748096}.sr-kpi strong{display:block;font-size:clamp(19px,2.5vw,27px);margin:8px 0}.sr-kpi.income strong,.sr-kpi.positive strong{color:#109765}.sr-kpi.expense strong,.sr-kpi.negative strong{color:#df4d58}.sr-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:14px}.sr-panel{min-width:0;padding:18px;border-radius:20px;background:var(--card,#fff);border:1px solid rgba(120,135,160,.16);box-shadow:0 9px 26px rgba(35,50,80,.07)}.sr-wide{grid-column:auto}.sr-title h4{margin:0;font-size:18px}.sr-title p{margin:4px 0 12px;color:#7c879b}.sr-panel canvas{width:100%;max-width:100%;display:block}.sr-legend{display:grid;gap:7px;margin-top:8px}.sr-legend span{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;font-size:12px}.sr-legend i{width:9px;height:9px;border-radius:50%}.sr-insights{display:grid;gap:10px}.sr-insight{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start;padding:12px;border-radius:14px;background:rgba(49,95,212,.07)}.sr-insight span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#315fd4;color:#fff;font-weight:800}.sr-insight p{margin:3px 0;line-height:1.45}.sr-category-list{display:grid;gap:10px}.sr-cat{display:grid;grid-template-columns:minmax(130px,1.2fr) minmax(100px,2fr) auto 52px;gap:12px;align-items:center}.sr-cat>div:first-child{display:flex;gap:9px;align-items:center}.sr-cat>div:first-child span{color:#8993a5;font-weight:800}.sr-cat-bar{height:9px;border-radius:10px;background:rgba(120,135,160,.14);overflow:hidden}.sr-cat-bar i{display:block;height:100%;background:#315fd4;border-radius:10px}.sr-cat small{color:#7c879b;text-align:right}.sr-empty{padding:22px;text-align:center;color:#7d899c}@media(max-width:900px){.sr-kpis{grid-template-columns:repeat(2,1fr)}.sr-grid{grid-template-columns:1fr}.sr-head{align-items:flex-start;flex-direction:column}.sr-head-actions{width:100%}.sr-head-actions button{flex:1}.sr-cat{grid-template-columns:1fr auto 48px}.sr-cat-bar{grid-row:2;grid-column:1/-1}}@media(max-width:560px){.sr-root{gap:12px}.sr-head{padding:18px;border-radius:18px}.sr-toolbar{align-items:stretch;flex-direction:column}.sr-period,.sr-tabs{justify-content:center}.sr-kpis{grid-template-columns:1fr 1fr;gap:8px}.sr-kpi{padding:14px}.sr-kpi small{font-size:10px}.sr-panel{padding:14px;border-radius:16px}.sr-cat{font-size:12px}}@media print{body *{visibility:hidden!important}#screenReports,#screenReports *{visibility:visible!important}#screenReports{position:absolute;inset:0}.sr-head-actions,.sr-toolbar{display:none!important}.sr-head{background:#fff!important;color:#111!important;box-shadow:none}.sr-panel,.sr-kpi{box-shadow:none;break-inside:avoid}}

/* 8.1: mesma estrutura visual no Browser e APP */
#screenReports .sr-screen-title{display:flex!important;align-items:flex-start;justify-content:space-between;margin-bottom:14px}#screenReports .sr-screen-title h2{margin:0}#screenReports .sr-screen-title p{margin:4px 0 0;color:#748096}#screenReports #reportContent{width:100%}html.browser-mode #screenReports .sr-root,html.app-mode #screenReports .sr-root{width:100%;max-width:none;margin:0}@media(max-width:560px){#screenReports .sr-screen-title p{font-size:12px}}
