.reports-page { max-width:1440px; min-width:0; margin:0 auto; overflow-x:hidden; }
.reports-page, .reports-page * { box-sizing:border-box; }
.reports-page button, .reports-page select, .reports-page input { min-height: 44px; }
.reports-page .btn-primary { background:var(--accent); border-color:var(--accent); }
.reports-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.reports-title { font-size:32px; line-height:1.1; font-weight:800; margin:0; }
.reports-freshness { color:var(--muted); font-size:12px; font-weight:600; text-align:right; }
.reports-freshness.warning { color:#9A5B00; }
.reports-filters { position:sticky; top:calc(var(--header-h) + 8px); z-index:20; display:grid; grid-template-columns:minmax(190px,1fr) minmax(220px,1.4fr) auto; width:100%; max-width:100%; min-width:0; gap:12px; padding:12px; margin-bottom:20px; background:color-mix(in srgb, var(--surface) 94%, transparent); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-card); backdrop-filter:blur(10px); }
.reports-filters > *, .reports-filter { min-width:0; }
.reports-filter label { display:block; margin:0 0 5px; color:var(--muted); font-size:12px; font-weight:700; }
.reports-custom-dates { display:flex; gap:8px; }
.reports-org-menu { position:relative; }
.reports-org-popover { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:30; padding:10px; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-card); }
.reports-org-option { display:flex; align-items:center; gap:10px; min-height:44px; padding:5px 8px; border-radius:8px; cursor:pointer; }
.reports-org-option:hover { background:rgba(255,107,0,.08); }
.reports-org-option input { min-height:auto; width:18px; height:18px; accent-color:var(--accent); }
.reports-hero { position:relative; overflow:hidden; padding:24px; margin-bottom:20px; color:#fff; border-radius:16px; background:linear-gradient(135deg,#1B1B1B 0%,#302116 100%); box-shadow:var(--shadow-card); }
.reports-hero::after { content:""; position:absolute; width:180px; height:180px; right:-45px; top:-65px; border-radius:50%; background:rgba(255,107,0,.22); }
.reports-eyebrow { position:relative; z-index:1; font-size:12px; font-weight:800; color:#FFB27A; }
.reports-hero-value { position:relative; z-index:1; margin:6px 0 22px; font-size:42px; line-height:1; font-weight:800; }
.reports-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.reports-hero-metric { padding-top:10px; border-top:1px solid rgba(255,255,255,.18); }
.reports-hero-metric span { display:block; color:rgba(255,255,255,.65); font-size:11px; font-weight:600; }
.reports-hero-metric strong { display:block; margin-top:3px; font-size:16px; }
.reports-kpis { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:20px; }
.reports-kpi { padding:18px; min-width:0; background:var(--surface); border:1px solid rgba(27,27,27,.06); border-radius:16px; box-shadow:var(--shadow-card); }
.reports-kpi-label { color:var(--muted); font-size:12px; font-weight:700; }
.reports-kpi-value { margin-top:8px; overflow-wrap:anywhere; color:var(--ink); font-size:25px; line-height:1.08; font-weight:800; }
.reports-kpi-primary .reports-kpi-value { color:var(--accent); }
.reports-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:16px; margin-bottom:20px; }
.reports-card { padding:20px; background:var(--surface); border:1px solid rgba(27,27,27,.06); border-radius:16px; box-shadow:var(--shadow-card); }
.reports-card-title { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 16px; font-size:18px; font-weight:750; }
.reports-chart-wrap { overflow-x:auto; padding-bottom:4px; }
.reports-chart { display:block; min-width:560px; width:100%; height:230px; }
.reports-chart .grid { stroke:var(--line); stroke-width:1; }
.reports-chart .fact { fill:none; stroke:var(--accent); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.reports-chart .plan { fill:none; stroke:var(--muted); stroke-width:2; stroke-dasharray:6 5; }
.reports-chart .point { fill:var(--surface); stroke:var(--accent); stroke-width:3; cursor:pointer; }
.reports-chart text { fill:var(--muted); font:600 11px Inter, sans-serif; }
.reports-legend { display:flex; gap:16px; color:var(--muted); font-size:12px; }
.reports-legend span::before { content:""; display:inline-block; width:18px; height:3px; margin:0 6px 3px 0; background:var(--accent); }
.reports-legend .plan::before { height:2px; background:var(--muted); }
.reports-bars { display:grid; gap:15px; }
.reports-bar-head { display:flex; justify-content:space-between; gap:8px; margin-bottom:6px; }
.reports-bar-meta { color:var(--muted); font-size:12px; }
.reports-bar-track { height:8px; overflow:hidden; border-radius:999px; background:var(--line); }
.reports-bar-fill { height:100%; border-radius:inherit; background:var(--accent); }
.reports-section { margin-bottom:20px; }
.reports-payment-hero { display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; padding:20px; margin-bottom:14px; border-radius:14px; background:rgba(255,107,0,.08); border:1px solid rgba(255,107,0,.18); }
.reports-payment-hero strong { display:block; color:var(--accent); font-size:30px; }
.reports-list { display:grid; gap:1px; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--line); }
.reports-row { display:grid; grid-template-columns:minmax(150px,1.5fr) repeat(4,minmax(100px,1fr)); gap:10px; align-items:center; padding:12px 14px; background:var(--surface); }
.reports-row.header { color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; }
.reports-row .mobile-label { display:none; }
.reports-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.reports-tabs .btn { min-height:40px; }
.reports-employee { padding:16px; border:1px solid var(--line); border-radius:12px; }
.reports-employee + .reports-employee { margin-top:10px; }
.reports-employee-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:12px; }
.reports-employee-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px 16px; }
.reports-data-label { display:block; color:var(--muted); font-size:11px; font-weight:600; }
.reports-adjustment { font-weight:700; }
.reports-adjustment.positive::before { content:"↑ "; }
.reports-adjustment.negative::before { content:"↓ "; }
.reports-excluded summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-weight:700; }
.reports-sync-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
.reports-sync-item { padding:12px; border:1px solid var(--line); border-radius:12px; }
.reports-status { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; }
.reports-status::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--muted); }
.reports-status.ok::before { background:var(--success); }
.reports-status.updating::before { background:var(--info); }
.reports-status.delayed::before { background:var(--warning); }
.reports-status.failed::before { background:var(--danger); }
.reports-state { display:grid; place-items:center; min-height:220px; padding:32px; text-align:center; background:var(--surface); border:1px solid var(--line); border-radius:16px; }
.reports-state i { display:block; margin-bottom:10px; color:var(--muted); font-size:36px; }
.reports-skeleton { height:18px; overflow:hidden; border-radius:8px; background:var(--line); }
.reports-skeleton::after { content:""; display:block; width:45%; height:100%; background:rgba(255,255,255,.55); animation:reports-loading 1.2s infinite; }
@keyframes reports-loading { from { transform:translateX(-100%); } to { transform:translateX(230%); } }
.reports-partial { margin-bottom:16px; }
.reports-page :focus-visible { outline:3px solid rgba(255,107,0,.38); outline-offset:2px; }

@media (max-width: 1024px) {
  .reports-kpis { grid-template-columns:repeat(3,1fr); }
  .reports-hero-grid { grid-template-columns:repeat(3,1fr); }
  .reports-sync-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 720px) {
  .reports-head { align-items:flex-start; flex-direction:column; }
  .reports-freshness { text-align:left; }
  .reports-filters { top:calc(var(--header-h) + 4px); grid-template-columns:1fr; }
  .reports-filter-actions { display:flex; justify-content:flex-end; }
  .reports-filter-actions .btn { width:100%; }
  .reports-grid { grid-template-columns:1fr; }
  .reports-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .reports-hero { padding:20px; }
  .reports-hero-value { font-size:34px; }
  .reports-hero-grid { grid-template-columns:repeat(2,1fr); }
  .reports-payment-hero { grid-template-columns:1fr; }
  .reports-row, .reports-row.header { display:block; padding:14px; }
  .reports-row.header { display:none; }
  .reports-row > span { display:flex; justify-content:space-between; gap:12px; padding-top:7px; }
  .reports-row > strong { display:block; margin-bottom:5px; font-size:15px; }
  .reports-row .mobile-label { display:inline; color:var(--muted); font-size:11px; font-weight:600; }
  .reports-employee-grid { grid-template-columns:repeat(2,1fr); }
  .reports-sync-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 380px) {
  .reports-title { font-size:28px; }
  .reports-kpi { padding:15px; }
  .reports-kpi-value { font-size:22px; }
  .reports-hero-grid, .reports-employee-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) { .reports-skeleton::after { animation:none; } }