body { font-family: Arial, sans-serif; margin: 16px; color:#1f2328; }
.page { display:block; }
.topline { display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-bottom: 12px; }
.pill { background:#f2f2f2; padding:4px 8px; border-radius:999px; font-size:12px; }
.pill.mini { font-size:11px; padding:3px 7px; }
.muted { color:#777; }
.small { font-size:12px; }

.stats-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:12px; margin: 10px 0 18px; }
.stat-card { border:1px solid #e6e6e6; border-radius:10px; padding:12px 14px; background:#fff; }
.stat-label { font-size:12px; color:#666; margin-bottom:6px; }
.stat-value { font-size:22px; font-weight:700; }
.stat-up { color:#1a7f37; }
.stat-down { color:#cf222e; }

.filters { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin: 12px 0 18px; }
.field { display:flex; flex-direction:column; gap:4px; }
.field-multi select { min-width:180px; }
label { font-size:12px; color:#333; display:block; }
select, input, textarea { padding:8px; font-size:14px; border:1px solid #d0d7de; border-radius:8px; background:#fff; }
textarea { min-width:260px; font-family: Arial, sans-serif; resize:vertical; }
.help { font-size:11px; color:#666; max-width:360px; }
button, .btn-secondary { padding:9px 12px; font-size:14px; cursor:pointer; border-radius:8px; border:1px solid #d0d7de; text-decoration:none; display:inline-block; }
button { background:#111827; color:#fff; border-color:#111827; }
.btn-secondary { background:#fff; color:#111827; }
.actions { display:flex; gap:10px; align-items:flex-end; }

.hintline { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin: 0 0 10px; font-size:12px; color:#666; }

.table-wrap { overflow:auto; border:1px solid #e6e6e6; border-radius:10px; }
table { border-collapse: collapse; width:100%; min-width: 1180px; }
th, td { border-bottom:1px solid #eee; padding:8px 10px; white-space:nowrap; vertical-align:middle; }
thead th { position:sticky; top:0; background:#f7f7f7; z-index:3; border-bottom:1px solid #e3e3e3; }

th.sticky1, td.sticky1 { position:sticky; left:0; z-index:4; background:#fff; border-right:1px solid #eee; min-width:180px; }
th.sticky2, td.sticky2 { position:sticky; left:180px; z-index:4; background:#fff; border-right:1px solid #eee; min-width:220px; }
thead th.sticky1, thead th.sticky2 { background:#f7f7f7; }

.center { text-align:center; font-variant-numeric: tabular-nums; }
.num { text-align:right; font-variant-numeric: tabular-nums; }
.strong { font-weight:700; }
.sort-col a { color:inherit; text-decoration:none; }
.sort-col a:hover { text-decoration:underline; }
.subhead { display:block; font-size:11px; color:#666; font-weight:400; margin-top:2px; }

.delta-up { color:#1a7f37; font-weight:700; }
.delta-down { color:#cf222e; font-weight:700; }
.delta-flat { color:#6b7280; }

.pos-top { background:#dff3e4; }
.pos-good { background:#eef7d3; }
.pos-mid { background:#fff5d6; }
.pos-empty { background:#fafafa; }

.note { margin-top:10px; color:#666; }