* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: system-ui, sans-serif; background: #0f1117; color: #e0e0e0; font-size: 13px; }

/* Header */
header { background: #1a1d2e; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #2a2d3e; flex-wrap: wrap; gap: 8px; }
header h1 { font-size: 16px; font-weight: 600; color: #fff; }
.stats-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.stat { background: #252838; border-radius: 6px; padding: 5px 10px; font-size: 12px; color: #aaa; }
.stat span { font-weight: 700; color: #fff; }
.btn-refresh { background: #2a2d3e; border: 1px solid #3a3d4e; color: #bbb; padding: 5px 12px; border-radius: 4px; cursor: pointer; font-size: 12px; }
.btn-refresh:hover { background: #3a3d4e; color: #fff; }

/* Filters */
.filters { display: flex; gap: 8px; padding: 10px 20px; background: #151720; flex-wrap: wrap; align-items: center; border-bottom: 1px solid #1e2133; }
.filters select, .filters input[type=text], .filters input[type=number] { background: #1e2133; border: 1px solid #2a2d3e; color: #ddd; padding: 5px 8px; border-radius: 4px; font-size: 12px; }
.filter-group { display: flex; align-items: center; gap: 4px; }
.filter-sep { color: #555; font-size: 11px; }
.filters input[type=text] { min-width: 200px; }
.check-label { font-size: 12px; color: #aaa; display: flex; align-items: center; gap: 4px; cursor: pointer; }
.check-label input { cursor: pointer; }

/* Table */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
thead th { background: #1a1d2e; padding: 7px 10px; text-align: left; font-size: 11px; color: #888; border-bottom: 1px solid #2a2d3e; position: sticky; top: 0; z-index: 2; white-space: nowrap; }
thead th.sortable { cursor: pointer; user-select: none; }
thead th.sortable:hover { color: #bbb; }
thead th.active-sort { color: #4a9eff; }
.sort-icon { font-size: 10px; margin-left: 2px; }
tbody tr { border-bottom: 1px solid #1e2133; cursor: pointer; }
tbody tr:hover { background: #1a1d2e; }
tbody tr.alerta     { border-left: 3px solid #e05555; }
tbody tr.borderline { border-left: 3px solid #e0a030; }
tbody tr.descartar  { border-left: 3px solid #333; }
tbody tr.sent       { background: #12201a; }
td { padding: 6px 10px; font-size: 12px; vertical-align: middle; }
.col-titulo { max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.col-source { font-size: 11px; color: #888; }
.score-detail { color: #666; font-size: 10px; }

/* Badges */
.badge { display: inline-block; padding: 2px 7px; border-radius: 10px; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.badge.alerta     { background: #3d1515; color: #e05555; }
.badge.borderline { background: #3d2c10; color: #e0a030; }
.badge.descartar  { background: #1e2133; color: #555; }
.sent-badge { background: #12301a; color: #4ab870; font-size: 10px; }

.zona-badge { display: inline-block; padding: 1px 6px; border-radius: 8px; font-size: 10px; font-weight: 600; }
.zona-badge.zona-radio-cervino  { background: #162040; color: #4a8ee0; }
.zona-badge.zona-palermo-chico  { background: #1e1830; color: #9b72d0; }
.zona-badge.zona-barrio-parque  { background: #102020; color: #40b0a0; }
.zona-badge.zona-palermo-texto  { background: #1a2a16; color: #5cba50; }
.zona-badge.zona-fuera          { background: #2a1616; color: #b06060; }
.zona-badge.zona-desconocida    { background: #222; color: #666; }

.feat { font-size: 15px; text-align: center; }

/* Details panel */
.details { display: none; background: #12141f; padding: 14px 20px; border-top: 1px solid #1e2133; }
.details.open { display: block; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; margin-bottom: 10px; }
.detail-grid > div { font-size: 12px; line-height: 1.7; }
.detail-grid a { color: #4a9eff; word-break: break-all; }
.breakdown { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 4px; }
.bp-pos { background: #142514; color: #5cba50; border-radius: 4px; padding: 2px 6px; font-size: 11px; }
.bp-neg { background: #2a1212; color: #c05050; border-radius: 4px; padding: 2px 6px; font-size: 11px; }
.bp-neu { background: #1e2133; color: #666; border-radius: 4px; padding: 2px 6px; font-size: 11px; }
.llm-box { margin-top: 4px; font-size: 11px; color: #aaa; white-space: pre-wrap; max-height: 80px; overflow-y: auto; }
.fb-row { margin-top: 8px; display: flex; align-items: center; gap: 6px; }
.fb-btn { padding: 4px 10px; border: none; border-radius: 4px; cursor: pointer; font-size: 11px; }
.fb-ver      { background: #1a4a1a; color: #5eb85e; }
.fb-revisar  { background: #3a3010; color: #c8a030; }
.fb-descartar{ background: #3a1010; color: #c84040; }
.fb-nota { font-size: 11px; color: #888; }
.fb-tag { display: inline-block; padding: 1px 6px; border-radius: 8px; font-size: 10px; font-weight: 600; }
.fb-tag.fb-ver      { background: #1a4a1a; color: #5eb85e; }
.fb-tag.fb-revisar  { background: #3a3010; color: #c8a030; }
.fb-tag.fb-descartar{ background: #3a1010; color: #c84040; }

/* Count bar */
.count-bar { padding: 6px 20px; font-size: 11px; color: #555; background: #0f1117; border-top: 1px solid #1e2133; }

@media (max-width: 900px) {
  .detail-grid { grid-template-columns: 1fr; }
}