:root{--primary:#0077c8;--primary-hover:#005a99;--secondary:#8dc63f;--secondary-hover:#75a830;--background:#f4f7fb;--surface:#fff;--text-main:#2b3b4a;--text-muted:#6b7a8a;--border:#e2e8f0;--radius-sm:.5rem;--radius-md:1rem;--radius-lg:1.5rem;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000008;--shadow-lg:0 10px 15px -3px #0077c81a, 0 4px 6px -2px #0077c80d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--text-main);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5}.surface{background:var(--surface);border-radius:var(--radius-md);box-shadow:var(--shadow-md);border:1px solid var(--border);padding:1.5rem;transition:transform .2s,box-shadow .2s}.surface:hover{box-shadow:var(--shadow-lg)}.app-container{max-width:1280px;margin:0 auto;padding:2rem}.header{border-bottom:2px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;display:flex}.header-brand{align-items:center;gap:1rem;display:flex}.header-title h1{color:var(--primary);letter-spacing:-.025em;font-size:1.5rem;font-weight:700}.header-title p{color:var(--text-muted);font-size:.875rem}.month-select{border:1px solid var(--border);background-color:var(--surface);color:var(--text-main);cursor:pointer;border-radius:6px;outline:none;padding:.25rem .75rem;font-family:inherit;font-size:.85rem}.month-select:hover{border-color:var(--primary)}.month-select:focus{border-color:var(--primary);box-shadow:0 0 0 2px #0077c833}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:2.5rem;display:grid}.stat-card{flex-direction:column;gap:.5rem;display:flex}.stat-header{color:var(--text-muted);align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;display:flex}.stat-icon{color:var(--primary);background:#0077c81a;border-radius:50%;justify-content:center;align-items:center;padding:.5rem;display:flex}.stat-value{color:var(--text-main);font-size:2rem;font-weight:700;line-height:1.2}.stat-trend{align-items:center;gap:.25rem;font-size:.875rem;font-weight:500;display:flex}.trend-up{color:var(--secondary)}.charts-grid{grid-template-columns:2fr 1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}.charts-row{grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}.charts-grid-3{grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:1.5rem;display:grid}.chart-card{flex-direction:column;min-height:400px;display:flex}.chart-card.tall{min-height:450px}.chart-header{margin-bottom:1.5rem}.chart-title{color:var(--text-main);font-size:1.125rem;font-weight:600}.chart-subtitle{color:var(--text-muted);font-size:.875rem}.chart-content{flex:1;min-height:0}@media (width<=1024px){.charts-grid,.charts-grid-3{grid-template-columns:1fr}}@media (width<=768px){.charts-row{grid-template-columns:1fr}}.pl-list{flex-direction:column;gap:.75rem;margin-top:1rem;display:flex}.pl-item{background:var(--background);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;padding:.75rem 1rem;font-size:.95rem;display:flex}.pl-item.header{color:var(--primary);border-left:4px solid var(--primary);background:#0077c80d;font-weight:600}.pl-item.deduction{color:#e53e3e}.pl-item.total{color:#e53e3e;background:#e53e3e1a;border-left:4px solid #e53e3e;margin-top:.5rem;font-size:1.1rem;font-weight:700}.pl-item.total.positive{color:var(--secondary-hover);border-left-color:var(--secondary);background:#8dc63f1a}.text-danger{color:#e53e3e!important}.text-success{color:var(--secondary-hover)!important}.tabs-container{background:var(--background);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);gap:1rem;width:fit-content;margin-bottom:1.5rem;padding:.5rem;display:flex}.tab-btn{border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;transition:all .2s}.tab-btn:hover{color:var(--primary);background:#0077c80d}.tab-btn.active{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}
