:root{ --wpt-gap:12px; }
.wpt-cards{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:var(--wpt-gap); margin:12px 0 18px; }
.wpt-card{ background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:12px 14px;box-shadow:0 1px 2px rgba(16,24,40,.04); }
.wpt-card .label{font-size:12px;color:#64748b;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.wpt-card .value{font-size:22px;font-weight:800;color:#0f172a;margin-top:6px}
.wpt-card .sub{font-size:12px;color:#475569;margin-top:2px}
.wpt-table-wrap{overflow:auto;border:1px solid #e5e7eb;border-radius:14px;background:#fff}
.wpt-table{width:100%;border-collapse:separate;border-spacing:0}
.wpt-table th, .wpt-table td{padding:10px 12px;border-bottom:1px solid #f1f5f9;white-space:nowrap;font-size:13px}
.wpt-table th{background:#f8fafc;color:#334155;text-align:left}
.wpt-actions{display:flex;gap:8px;align-items:center;margin:8px 0}
@media (max-width: 1024px){ .wpt-cards{grid-template-columns: repeat(2, minmax(0,1fr));} }
@media (max-width: 640px){ .wpt-cards{grid-template-columns: 1fr;} .wpt-table th, .wpt-table td{white-space:normal} .wpt-actions{flex-wrap:wrap} }
.wpt-head{margin:6px 0 8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.wpt-head .title{font-weight:800;font-size:clamp(18px,2.4vw,24px);color:#0f172a;margin-right:8px}
.wpt-rangeform{margin:6px 0 6px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.wpt-rangeform input[type="date"]{min-height:34px;border-radius:8px;border:1px solid #cbd5e1;padding:4px 8px}
.wpt-rangeform .button{border-radius:8px}
.wpt-muted{color:#64748b}