@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* Affinity color variables — single source of truth */
:root{
  --aff-pro-correa:#ff6b6b;--badge-pro-correa:#c92a2a;
  --aff-pro-noboa:#51cf66;--badge-pro-noboa:#2b8a3e;
  --aff-pro-lasso:#74c0fc;--badge-pro-lasso:#1971c2;
  --aff-pro-socialcristiano:#da77f2;--badge-pro-socialcristiano:#9c36b5;
  --aff-pro-pachakutik:#ffd43b;--badge-pro-pachakutik:#e67700;
  --aff-pro-aquiles:#20c997;--badge-pro-aquiles:#099268;
  --aff-anti-noboa:#e67700;--badge-anti-noboa:#e67700;
  --aff-mixto:#ff922b;--badge-mixto:#d9480f;
  --aff-bot-ruido:#868e96;--badge-bot-ruido:#495057;
  --aff-indefinido:#495057;--badge-indefinido:#343a40;
  --aff-sin-datos:#343a40;--badge-sin-datos:#212529;
  --aff-suspendido:#862e9c;--badge-suspendido:#862e9c;
  --aff-sin-afinidad:#adb5bd;--badge-sin-afinidad:#adb5bd;
}

*{margin:0;padding:0;box-sizing:border-box}
body{background:#f5f6fa;color:#1f2937;font-family:'Inter',system-ui,-apple-system,sans-serif;overflow-x:hidden}
.header{background:#ffffff;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e2e4ee;box-shadow:0 1px 3px rgba(0,0,0,.06);height:56px;position:sticky;top:0;z-index:600}
.header h1{font-size:18px;color:#4f46e5;font-weight:700;white-space:nowrap}
.header-left{display:flex;align-items:center;gap:12px}
.header-center{font-size:12px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-stat{font-weight:700;color:#1f2937}
.header-right{display:flex;align-items:center;gap:8px}
.header .subtitle{color:#6b7280;font-size:11px;display:none}
.header-icon-btn{background:none;border:1px solid #e2e4ee;border-radius:8px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#6b7280;transition:all .2s;font-size:16px}
.header-icon-btn:hover{background:#f0f1f5;border-color:#4f46e5;color:#4f46e5}
.stat-red{color:#ef4444}.stat-green{color:#10b981}.stat-gray{color:#6b7280}.stat-orange{color:#f59e0b}
.target-select{background:#f5f6fa;border:1px solid #d1d5db;border-radius:8px;color:#1f2937;padding:6px 10px;font-size:13px;cursor:pointer}
.main-container{display:flex;height:auto;position:relative;z-index:1;flex-direction:column}
.sidebar{width:300px;min-width:300px;background:#ffffff;overflow-y:auto;padding:15px}
.sidebar h3{color:#4f46e5;font-size:13px;text-transform:uppercase;margin-bottom:10px;letter-spacing:1px}
.sidebar section{margin-bottom:20px}
.filter-btn{display:inline-block;padding:5px 10px;margin:2px;border-radius:15px;font-size:11px;cursor:pointer;border:1px solid #d1d5db;background:#e8e8ef;color:#374151;transition:all .2s}
.filter-btn:hover{border-color:#4f46e5}.filter-btn.active{background:#4f46e5;color:white;border-color:#4f46e5}
.troll-toggle{display:inline-block;padding:5px 10px;margin:2px;border-radius:15px;font-size:11px;cursor:pointer;border:1px solid #d1d5db;background:#e8e8ef;color:#374151;transition:all .2s}
.troll-toggle:hover{border-color:#ff9f43}.troll-toggle.active{background:#ff9f43;color:#111;border-color:#ff9f43}
.troll-toggle[data-troll="notroll"].active{background:#556677;color:white;border-color:#556677}
.troll-toggle[data-troll="all"].active{background:#4f46e5;color:#111;border-color:#4f46e5}
.hashtag-item,.mention-item{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:12px;border-bottom:1px solid #e8e8ef}
.hashtag-item span:first-child,.mention-item span:first-child{color:#4f46e5}
.hashtag-item span:last-child,.mention-item span:last-child{background:#e8e8ef;padding:1px 6px;border-radius:8px;font-size:10px}
.size-controls{margin-top:8px}
.size-btn{display:inline-block;padding:4px 8px;margin:2px;border-radius:10px;font-size:10px;cursor:pointer;border:1px solid #d1d5db;background:#e8e8ef;color:#6b7280;transition:all .2s}
.size-btn:hover{border-color:#4ecca3}.size-btn.active{background:#4ecca3;color:#111;border-color:#4ecca3}
.graph-container{flex:1;position:relative;overflow:hidden;min-height:400px}
svg{width:100%;height:100%}
.tooltip{position:absolute;display:none;background:#e8e8ef;border:1px solid #d1d5db;border-radius:10px;padding:15px;max-width:350px;z-index:100;box-shadow:0 8px 32px rgba(0,0,0,.1);pointer-events:auto}
.tooltip .author-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.tooltip .avatar{width:40px;height:40px;border-radius:50%}
.tooltip .author-name{font-weight:bold;font-size:14px}
.tooltip .author-handle{color:#4f46e5;font-size:12px;cursor:pointer;text-decoration:none}
.tooltip .author-handle:hover{text-decoration:underline;color:#79d4fa}
.tooltip .author-meta{font-size:11px;color:#6b7280;margin-top:2px}
.tooltip .category-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:10px;font-weight:bold;margin-left:5px;color:white}
.tooltip .troll-badge{background:#ffab00;color:#111;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:bold;margin-left:5px}
.tooltip .troll-reasons{font-size:10px;color:#6b7280;margin-top:6px;padding:4px;background:#f5f6fa;border-radius:4px}
.tooltip .tweet-sample{background:#f5f6fa;padding:8px;border-radius:6px;font-size:11px;margin-top:8px;line-height:1.4;border-left:3px solid #d1d5db}
.tooltip .stats-row{display:flex;gap:12px;margin-top:8px;font-size:11px;flex-wrap:wrap}
.tooltip .stats-row span{color:#6b7280}
.timeline-container{position:absolute;bottom:0;left:0;right:0;height:100px;background:rgba(255,255,255,.95);border-top:1px solid #e2e4ee;padding:10px 20px}
.timeline-title{font-size:11px;color:#6b7280;margin-bottom:5px}
.tables-container{position:absolute;bottom:110px;left:10px;right:10px;display:flex;gap:10px;pointer-events:none}
.table-panel{flex:1;background:rgba(255,255,255,.92);border:1px solid #e2e4ee;border-radius:8px;padding:10px;max-height:200px;overflow-y:auto;pointer-events:auto;display:none}
.table-panel.visible{display:block}
.table-panel h4{font-size:11px;color:#4f46e5;text-transform:uppercase;margin-bottom:8px}
.table-row{display:flex;justify-content:space-between;align-items:center;padding:3px 0;font-size:11px;border-bottom:1px solid #f5f6fa}
.table-row .rank{color:#9ca3af;width:20px}.table-row .handle{color:#4f46e5;flex:1;cursor:pointer}
.table-row .handle:hover{text-decoration:underline}.table-row .impact{color:#4f46e5;font-weight:bold}
.table-row .followers{color:#6b7280;font-size:10px;margin-left:8px}
.toggle-tables{position:absolute;bottom:105px;right:15px;background:#e8e8ef;border:1px solid #d1d5db;color:#374151;padding:5px 12px;border-radius:15px;font-size:11px;cursor:pointer;z-index:50;transition:all .2s}
.toggle-tables:hover{border-color:#4f46e5}
.legend{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.92);border:1px solid #e2e4ee;border-radius:8px;padding:10px;font-size:11px}
.legend-item{display:flex;align-items:center;gap:6px;margin:3px 0}
.legend-dot{width:10px;height:10px;border-radius:50%}
.search-box{width:100%;padding:6px 10px;background:#f5f6fa;border:1px solid #d1d5db;border-radius:6px;color:#1f2937;font-size:12px;margin-bottom:10px;transition:all .2s}
.search-box:focus{outline:none;border-color:#4f46e5}

.time-filter{background:#f0f1f5;border:1px solid #e2e4ee;border-radius:8px;padding:12px;margin-bottom:5px}
.time-slider-group{margin-bottom:10px}
.time-slider-label{font-size:10px;color:#6b7280;margin-bottom:4px;display:block}
.time-slider{-webkit-appearance:none;width:100%;height:4px;background:#d1d5db;border-radius:2px;outline:none;margin-bottom:6px}
.time-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;background:#4f46e5;border-radius:50%;cursor:pointer;transition:background .2s}
.time-slider::-webkit-slider-thumb:hover{background:#6366f1}
.time-slider::-moz-range-thumb{width:14px;height:14px;background:#4f46e5;border-radius:50%;cursor:pointer;border:none;transition:background .2s}
.time-slider::-moz-range-thumb:hover{background:#6366f1}
.time-inputs{display:flex;gap:8px;align-items:center;margin-top:8px}
.time-inputs label{font-size:10px;color:#6b7280}
.time-input{background:#f5f6fa;border:1px solid #d1d5db;border-radius:4px;color:#1f2937;padding:4px 6px;font-size:12px;width:70px;text-align:center;transition:all .2s}
.time-input:focus{outline:none;border-color:#4f46e5}
.time-apply-btn{background:#4f46e5;color:white;border:none;border-radius:15px;padding:6px 14px;font-size:11px;cursor:pointer;margin-top:8px;width:100%;transition:background .2s}
.time-apply-btn:hover{background:#6366f1}
.time-reset-btn{background:transparent;color:#6b7280;border:1px solid #d1d5db;border-radius:15px;padding:4px 10px;font-size:10px;cursor:pointer;margin-top:5px;width:100%;transition:all .2s}
.time-reset-btn:hover{border-color:#4f46e5;color:#374151}
.time-range-display{font-size:11px;color:#4f46e5;margin-top:6px;text-align:center}
.filtered-stats{background:#e8e8ef;border-radius:6px;padding:6px 8px;margin-top:8px;font-size:11px;display:none}
.filtered-stats.visible{display:block}
.filtered-stats .fs-row{display:flex;justify-content:space-between;margin:2px 0}
.filtered-stats .fs-label{color:#6b7280}
.filtered-stats .fs-value{font-weight:bold}

.export-btn{background:#eef2ff;color:#4f46e5;border:1px solid #4f46e5;border-radius:15px;padding:6px 16px;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s;width:100%}
.export-btn:hover{background:#4f46e5;color:#f5f6fa}
.export-btn svg{width:14px;height:14px;fill:currentColor}

.topics-section{margin-bottom:15px}
.topics-group{margin-bottom:12px}
.topics-group-title{font-size:11px;font-weight:bold;margin-bottom:4px;padding:3px 8px;border-radius:4px;display:inline-block}
.topics-group-title.atk{background:#ff1744;color:white}
.topics-group-title.def{background:#00e676;color:#111}
.topics-group-title.neu{background:#90a4ae;color:#111}
.topics-group-title.glb{background:#4f46e5;color:#111}
.topic-item{display:flex;justify-content:space-between;align-items:center;padding:3px 0;font-size:11px;border-bottom:1px solid #e8e8ef}
.topic-item .topic-name{color:#1f2937;flex:1}
.topic-item .topic-count{background:#e8e8ef;padding:1px 6px;border-radius:8px;font-size:10px;color:#6b7280;margin-left:6px}

/* HAMBURGER MENU BUTTON */
.menu-toggle{display:none;background:none;border:none;color:#4f46e5;font-size:24px;cursor:pointer;padding:5px;line-height:1}


/* NEW LAYOUT STRUCTURE */
.content-wrapper {
  display: flex;
  height: calc(100vh - 80px);
  position: relative;
}

/* SIDEBAR NAV (desktop only) */
.sidebar-nav {
  display: none;
  width: 70px;
  background: #ffffff;
  border-right: 1px solid #e2e4ee;
  flex-direction: column;
  align-items: center;
  padding: 10px 0;
  position: fixed;
  left: 0;
  top: 56px;
  height: calc(100vh - 56px);
  overflow-y: auto;
  z-index: 500;
}

.sidebar-nav-item {
  width: 60px;
  height: 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 8px;
  margin: 5px 5px;
  transition: all .2s;
  position: relative;
  color: #6b7280;
  border: 1px solid transparent;
}

.sidebar-nav-item:hover {
  background: #f0f1f5;
  color: #4f46e5;
}

.sidebar-nav-item.active {
  background: #eef2ff;
  color: #4f46e5;
  border-color: #4f46e5;
}

.sidebar-nav-item svg {
  width: 24px;
  height: 24px;
  margin-bottom: 4px;
}

.sidebar-nav-item .label {
  font-size: 9px;
  text-align: center;
  line-height: 1.1;
  max-width: 50px;
}

.sidebar-nav-item .label {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity .2s;
}

.sidebar-nav-item:hover .label {
  opacity: 1;
}

/* MAIN CONTENT AREA */
.main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: #f5f6fa;
  overflow-y: auto;
  margin-left: 0;
}

/* FILTER DRAWER */
.filter-drawer {
  position: fixed;
  right: -320px;
  top: 56px;
  width: 320px;
  height: calc(100vh - 56px);
  background: #ffffff;
  border-left: 1px solid #e2e4ee;
  box-shadow: -2px 0 8px rgba(0,0,0,.1);
  z-index: 900;
  overflow-y: auto;
  padding: 15px;
  transition: right .3s ease;
}

.filter-drawer.open {
  right: 0;
}

.filter-drawer-close {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  color: #4f46e5;
  font-size: 22px;
  cursor: pointer;
  display: block;
}

.filter-drawer-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,.3);
  z-index: 850;
}

.filter-drawer-overlay.visible {
  display: block;
}

.filter-btn-floating {
  position: fixed;
  bottom: 90px;
  right: 20px;
  width: 50px;
  height: 50px;
  background: #4f46e5;
  color: white;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(79,70,229,.3);
  z-index: 700;
  transition: all .2s;
}

.filter-btn-floating:hover {
  background: #6366f1;
  transform: scale(1.1);
}

/* GRAPH CONTAINER - HIDDEN BY DEFAULT */
.graph-container {
  flex: 1;
  position: relative;
  overflow: hidden;
  display: none;
}

.graph-container.visible {
  display: flex;
  flex-direction: column;
}

/* SECTION CONTENT WRAPPERS */
.section-content {
  display: none;
  padding: 20px 30px;
}

.section-content.active {
  display: block;
}

.section-content.with-graph {
  padding: 0;
  display: flex;
  flex-direction: column;
}

/* SUB-TABS (for grouped sections) */
.sub-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 20px;
  border-bottom: 2px solid #e2e4ee;
  background: #ffffff;
  padding: 0 20px;
  margin: 0;
}

.sub-tab {
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 600;
  color: #6b7280;
  background: #f5f6fa;
  border: none;
  cursor: pointer;
  border-radius: 20px;
  margin: 0 4px;
  transition: all .2s;
  text-transform: uppercase;
  letter-spacing: .5px;
}

.sub-tab:hover {
  color: #1f2937;
  background: #e8e8ef;
}

.sub-tab.active {
  color: #ffffff;
  background: #4f46e5;
  box-shadow: 0 2px 8px rgba(79,70,229,.2);
}

/* Accounts section now acts as content container */
.accounts-section {
  margin-left: 0;
  padding-bottom: 80px;
}

/* DESKTOP LAYOUT (≥769px) */
@media (min-width: 769px) {
  .sidebar-nav {
    display: flex;
  }

  .main-content {
    margin-left: 70px;
  }

  .main-container {
    margin-left: 70px;
  }

  .accounts-section {
    margin-left: 70px;
  }

  .content-wrapper {
    position: relative;
  }

  .sidebar {
    position: fixed;
    right: -300px;
    top: 56px;
    width: 300px;
    min-width: 300px;
    height: calc(100vh - 56px);
    z-index: 850;
    transition: right .3s ease;
    padding: 15px;
    background: #ffffff;
    border-left: 1px solid #e2e4ee;
    box-shadow: -2px 0 8px rgba(0,0,0,.1);
    overflow-y: auto;
  }

  .sidebar.open {
    right: 0;
  }

  .filter-btn-floating {
    display: flex;
  }

  .bottom-nav {
    display: none;
  }
}

/* MOBILE LAYOUT (<769px) */
@media (max-width: 768px) {
  .sidebar-nav {
    display: none;
  }

  .main-content {
    margin-left: 0;
    padding-bottom: 90px;
  }

  .sidebar {
    position: fixed;
    top: 0;
    left: -300px;
    width: 280px;
    min-width: 280px;
    height: 100vh;
    z-index: 850;
    transition: left .3s ease;
    padding: 15px;
    padding-top: 60px;
    background: #ffffff;
    border-right: 1px solid #e2e4ee;
    overflow-y: auto;
  }

  .sidebar.open {
    left: 0;
  }


  .graph-container {
    height: 70vh;
  }

  .tooltip {
    max-width: 280px;
    font-size: 11px;
    left: 5px !important;
    right: 5px !important;
  }

  .filter-btn-floating {
    display: flex;
    bottom: 90px;
    right: 15px;
  }

  .bottom-nav {
    display: flex !important;
    height: 70px;
  }

  .accounts-section {
    padding: 15px;
    padding-bottom: 90px;
  }

  .header-center {
    display: none;
  }

  .header-icon-btn.logout-btn {
    display: none;
  }

  .header h1 {
    font-size: 16px;
  }

  .section-content {
    padding: 0;
  }

  /* Header mobile overrides */
  .header{flex-direction:column;gap:8px;padding:12px 15px}
  .header-left{width:100%;justify-content:space-between}
  .header-right{width:100%;flex-wrap:wrap;gap:8px;justify-content:center}
  .stats-bar{gap:8px;flex-wrap:wrap;justify-content:center}
  .stat-item{min-width:0}
  .stat-value{font-size:16px}
  .stat-label{font-size:8px}
  .target-select{max-width:150px;font-size:11px;padding:6px 8px}
  .subtitle{font-size:11px}
  .cross-btn{font-size:10px;padding:4px 10px}
  .logout-btn{font-size:10px;padding:4px 10px}
  .main-container{flex-direction:column;height:auto}
  .graph-container{width:100%;height:70vh;position:relative}
  .legend{top:5px;right:5px;padding:6px;font-size:9px}
  .toggle-tables{bottom:105px;right:5px;font-size:10px;padding:4px 8px}
  .timeline-container{height:80px;padding:5px 10px}
  .tables-container{bottom:90px;left:5px;right:5px;flex-direction:column}
  .table-panel{max-height:150px}
  .accounts-grid{grid-template-columns:1fr}
  .accounts-controls{flex-direction:column;align-items:stretch}
  .cross-panel{padding:20px 15px;max-height:90vh}
  .cross-config{flex-direction:column;gap:12px}
  .cross-table{font-size:10px}
  .cross-table th,.cross-table td{padding:4px 6px}
  .cross-results-summary{justify-content:center}
  .res-stats-4{grid-template-columns:repeat(2,1fr)!important}
  .res-stats-3{grid-template-columns:repeat(3,1fr)!important}
  .res-top10{grid-template-columns:1fr!important}
  .res-bottom3{grid-template-columns:1fr!important}
  .sent-layout{flex-direction:column!important;align-items:center!important}
  .sent-layout>div:first-child{flex-shrink:0}
  .sent-layout>div:last-child{width:100%}
  .res-header{flex-direction:column!important;gap:8px!important;align-items:flex-start!important}
  .res-header h2{font-size:15px!important}
}

/* H2 styling inside sections */
.section-content h2 {
  color: #4f46e5;
  font-size: 16px;
  margin-bottom: 15px;
}

/* SIDEBAR OVERLAY (mobile) */
.sidebar-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);z-index:800}
.sidebar-overlay.visible{display:block}

/* SIDEBAR CLOSE BUTTON - Global Style */
.sidebar-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  background: #f0f1f5;
  border: none;
  color: #4f46e5;
  font-size: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all .2s;
}

.sidebar-close:hover {
  background: #e8e8ef;
  color: #6366f1;
  transform: scale(1.1);
}

/* Mobile rules consolidated into single @media(max-width:768px) block above */

@media(max-width:400px){
  .stats-bar{gap:4px}
  .stat-value{font-size:14px}
  .header-right{gap:5px}
  .res-stats-4{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
  .res-stats-4 div{padding:6px!important}
  .res-stats-4 .res-stat-val{font-size:18px!important}
  .res-stats-3{grid-template-columns:1fr 1fr 1fr!important;gap:4px!important}
  .res-stats-3 span:first-child{font-size:13px!important}
}

/* Section tabs hidden — replaced by sidebar-nav + bottom-nav */
.section-tabs{display:none!important}

/* REPORTES SECTION */
.reportes-container{display:none}
.reportes-container.active{display:block}
.reportes-summary{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:24px}
.aff-card{background:#ffffff;border:1px solid #e2e4ee;border-radius:8px;padding:14px;text-align:center;transition:border-color .2s}
.aff-card:hover{border-color:#4f46e5}
.aff-card .aff-count{font-size:28px;font-weight:bold;margin-bottom:4px}
.aff-card .aff-label{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#6b7280}
.aff-card .aff-pct{font-size:10px;color:#9ca3af;margin-top:2px}
.aff-pro_correa{border-left:3px solid var(--aff-pro-correa)}.aff-pro_correa .aff-count{color:var(--aff-pro-correa)}
.aff-pro_noboa{border-left:3px solid var(--aff-pro-noboa)}.aff-pro_noboa .aff-count{color:var(--aff-pro-noboa)}
.aff-pro_lasso{border-left:3px solid var(--aff-pro-lasso)}.aff-pro_lasso .aff-count{color:var(--aff-pro-lasso)}
.aff-pro_socialcristiano{border-left:3px solid var(--aff-pro-socialcristiano)}.aff-pro_socialcristiano .aff-count{color:var(--aff-pro-socialcristiano)}
.aff-pro_pachakutik{border-left:3px solid var(--aff-pro-pachakutik)}.aff-pro_pachakutik .aff-count{color:var(--aff-pro-pachakutik)}
.aff-pro_aquiles{border-left:3px solid var(--aff-pro-aquiles)}.aff-pro_aquiles .aff-count{color:var(--aff-pro-aquiles)}
.aff-anti_noboa{border-left:3px solid var(--aff-anti-noboa)}.aff-anti_noboa .aff-count{color:var(--aff-anti-noboa)}
.aff-mixto{border-left:3px solid var(--aff-mixto)}.aff-mixto .aff-count{color:var(--aff-mixto)}
.aff-bot_ruido{border-left:3px solid var(--aff-bot-ruido)}.aff-bot_ruido .aff-count{color:var(--aff-bot-ruido)}
.aff-indefinido{border-left:3px solid var(--aff-indefinido)}.aff-indefinido .aff-count{color:var(--badge-sin-afinidad)}
.aff-sin_datos{border-left:3px solid var(--aff-sin-datos)}.aff-sin_datos .aff-count{color:var(--aff-bot-ruido)}
.aff-sin_datos_nosenal{border-left:3px solid var(--aff-sin-datos)}.aff-sin_datos_nosenal .aff-count{color:var(--aff-bot-ruido)}
.aff-suspendido{border-left:3px solid var(--aff-suspendido)}.aff-suspendido .aff-count{color:var(--aff-suspendido)}
.aff-sin_afinidad{border-left:3px solid var(--aff-sin-afinidad)}.aff-sin_afinidad .aff-count{color:var(--aff-sin-afinidad)}

.reportes-block{margin-bottom:24px}
.reportes-block h3{color:#4f46e5;font-size:14px;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}
.rep-table{width:100%;border-collapse:collapse;font-size:12px}
.rep-table th{background:#e8e8ef;color:#6b7280;padding:8px 12px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid #d1d5db}
.rep-table td{padding:7px 12px;border-bottom:1px solid #e2e4ee;color:#1f2937}
.rep-table tr:hover{background:#f5f5ff}
.rep-table .aff-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;color:#fff}
.badge-pro_correa{background:var(--badge-pro-correa)}.badge-pro_noboa{background:var(--badge-pro-noboa)}.badge-pro_lasso{background:var(--badge-pro-lasso)}.badge-pro_socialcristiano{background:var(--badge-pro-socialcristiano)}.badge-pro_pachakutik{background:var(--badge-pro-pachakutik)}.badge-pro_aquiles{background:var(--badge-pro-aquiles)}.badge-anti_noboa{background:var(--badge-anti-noboa)}.badge-mixto{background:var(--badge-mixto)}.badge-bot_ruido{background:var(--badge-bot-ruido)}.badge-indefinido{background:var(--badge-indefinido)}.badge-sin_datos{background:var(--badge-sin-datos)}.badge-sin_datos_nosenal{background:var(--badge-sin-datos)}.badge-suspendido{background:var(--badge-suspendido)}.badge-sin_afinidad{background:var(--badge-sin-afinidad)}
.rep-filters-bar{display:flex;gap:10px;margin-bottom:20px;align-items:center;flex-wrap:wrap}
.rep-filters-bar select{background:#ffffff;color:#1f2937;border:1px solid #e2e4ee;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer;min-width:160px}
.rep-filters-bar select:focus{border-color:#4f46e5;outline:none}
.rep-filters-bar input[type="text"]{background:#ffffff;color:#1f2937;border:1px solid #e2e4ee;border-radius:6px;padding:8px 12px;font-size:12px;min-width:180px;flex:1}

/* MIXTO ANALYSIS */
.mixto-section{margin-bottom:24px}
.mixto-pairs{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:20px}
.mixto-pair-card{background:#fff;border:1px solid #e2e4ee;border-radius:8px;padding:14px;border-left:3px solid #ff922b}
.mixto-pair-card h4{font-size:13px;color:#1f2937;margin:0 0 8px 0;font-weight:600}
.mixto-pair-card .pair-count{font-size:22px;font-weight:bold;color:#ff922b}
.mixto-pair-card .pair-label{font-size:11px;color:#6b7280;margin-top:2px}
.mixto-pair-card .pair-users{font-size:10px;color:#9ca3af;margin-top:8px;line-height:1.6}
.mixto-score-bar{display:flex;height:16px;border-radius:4px;overflow:hidden;margin:4px 0}
.mixto-score-bar div{min-width:2px;transition:width .3s}
.mixto-score-label{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:#6b7280;margin-right:8px}
.mixto-score-label .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.mixto-detail-table{width:100%;border-collapse:collapse;font-size:11px}
.mixto-detail-table th{background:#fff3e0;color:#e65100;padding:6px 10px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #ff922b}
.mixto-detail-table td{padding:6px 10px;border-bottom:1px solid #e2e4ee}
.mixto-detail-table tr:hover{background:#fff8e1}
.rep-filters-bar input[type="text"]:focus{border-color:#4f46e5;outline:none}
.rep-filters-bar input::placeholder{color:#9ca3af}
.rep-filter-count{color:#6b7280;font-size:11px;white-space:nowrap}

.camp-summary{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:24px}
.camp-stat{background:#ffffff;border:1px solid #e2e4ee;border-radius:12px;padding:14px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.06);transition:all .2s}
.camp-stat:hover{box-shadow:0 4px 12px rgba(79,70,229,.1);transform:translateY(-2px)}
.camp-stat .cs-val{font-size:28px;font-weight:bold;color:#4f46e5}
.camp-stat .cs-label{font-size:10px;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.camp-card{background:#ffffff;border-left:4px solid #4f46e5;border:1px solid #e2e4ee;border-left:4px solid #4f46e5;border-radius:12px;padding:16px;margin-bottom:12px;transition:all .2s;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.camp-card:hover{border-color:#4f46e5;box-shadow:0 4px 12px rgba(79,70,229,.12)}
.camp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.camp-time{font-size:14px;font-weight:bold;color:#4f46e5}
.camp-badge{font-size:10px;padding:3px 10px;border-radius:10px;font-weight:bold;color:#fff}
.camp-badge.high{background:#4f46e5}
.camp-badge.medium{background:#ff922b}
.camp-badge.low{background:#495057}

/* TRENDING TOPICS TAB */
.trending-container{display:none}
.trending-container.active{display:block}
.trending-summary{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:24px}
.trending-stat{background:#ffffff;border:1px solid #e2e4ee;border-radius:8px;padding:14px;text-align:center}
.trending-stat .ts-val{font-size:28px;font-weight:bold;color:#4f46e5}
.trending-stat .ts-label{font-size:10px;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.trending-controls{display:flex;gap:10px;align-items:center;margin-bottom:20px;flex-wrap:wrap}
.trending-controls select{background:#ffffff;color:#1f2937;border:1px solid #e2e4ee;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer}
.trending-controls select:focus{border-color:#4f46e5;outline:none}
.trend-timeline{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;margin-bottom:24px}
.trend-window{min-width:220px;max-width:280px;flex:0 0 auto;background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:14px;position:relative}
.trend-window.current{border-color:#4f46e5;box-shadow:0 0 12px rgba(79,70,229,.12)}
.tw-header{font-size:12px;color:#4f46e5;font-weight:bold;margin-bottom:4px}
.tw-subheader{font-size:10px;color:#6b7280;margin-bottom:10px}
.tw-topic{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid #f5f6fa;font-size:12px}
.tw-topic:last-child{border-bottom:none}
.tw-rank{color:#9ca3af;font-size:10px;width:16px;text-align:right;flex-shrink:0}
.tw-name{flex:1;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-count{background:#e8e8ef;padding:1px 6px;border-radius:8px;font-size:10px;color:#6b7280;flex-shrink:0}
.tw-trend{font-size:12px;flex-shrink:0;width:20px;text-align:center}
.tw-trend.up{color:#00e676}
.tw-trend.down{color:#ff1744}
.tw-trend.new{color:#ffd43b}
.tw-trend.stable{color:#9ca3af}
.trending-top-block{margin-bottom:24px}
.trending-top-block h3{color:#4f46e5;font-size:14px;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}
.trend-top-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.trend-top-card{background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:14px;display:flex;align-items:center;gap:12px;transition:border-color .2s}
.trend-top-card:hover{border-color:#4f46e5}
.ttc-trend{font-size:24px;flex-shrink:0}
.ttc-info{flex:1;min-width:0}
.ttc-name{font-size:14px;font-weight:bold;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ttc-meta{font-size:11px;color:#6b7280;margin-top:2px}
.ttc-bar{height:4px;background:#e2e4ee;border-radius:2px;margin-top:6px;overflow:hidden}
.ttc-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,#4f46e5,#00e676)}
.ttc-bar-fill.declining{background:linear-gradient(90deg,#ff922b,#ff1744)}
.ttc-count{font-size:18px;font-weight:bold;color:#4f46e5;flex-shrink:0}
.trend-cats{display:flex;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.trend-cat-block{flex:1;min-width:250px;background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:14px}
.trend-cat-block h4{font-size:12px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;padding:3px 8px;border-radius:4px;display:inline-block}
.trend-cat-block h4.atk{background:#ff1744;color:white}
.trend-cat-block h4.def{background:#00e676;color:#111}
.trend-cat-block h4.neu{background:#90a4ae;color:#111}

/* TROLL NETWORK GRAPH TAB */
.network-container{display:none}
.network-container.active{display:block}
.network-controls{display:flex;gap:10px;align-items:center;margin-bottom:15px;flex-wrap:wrap}
.network-controls select,.network-controls input{background:#ffffff;color:#1f2937;border:1px solid #e2e4ee;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer}
.network-controls select:focus,.network-controls input:focus{border-color:#4f46e5;outline:none}
.network-graph-wrap{position:relative;width:100%;height:600px;background:#f5f6fa;border:1px solid #e2e4ee;border-radius:10px;overflow:hidden}
.network-graph-wrap svg{width:100%;height:100%}
.net-legend{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.92);border:1px solid #e2e4ee;border-radius:8px;padding:10px;font-size:11px}
.net-legend-item{display:flex;align-items:center;gap:6px;margin:3px 0}
.net-legend-dot{width:10px;height:10px;border-radius:50%}
.net-tooltip{position:absolute;display:none;background:#e8e8ef;border:1px solid #d1d5db;border-radius:8px;padding:12px;max-width:280px;z-index:100;font-size:12px;box-shadow:0 4px 16px rgba(0,0,0,.1);pointer-events:none}
.net-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:15px}
.net-stat{background:#ffffff;border:1px solid #e2e4ee;border-radius:8px;padding:14px;text-align:center}
.net-stat .ns-val{font-size:28px;font-weight:bold;color:#4f46e5}
.net-stat .ns-label{font-size:10px;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}

/* WORD CLOUD TAB */
.wordcloud-container{display:none}
.wordcloud-container.active{display:block}
.wc-controls{display:flex;gap:10px;align-items:center;margin-bottom:15px;flex-wrap:wrap}
.wc-controls select{background:#ffffff;color:#1f2937;border:1px solid #e2e4ee;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer}
.wc-controls select:focus{border-color:#4f46e5;outline:none}
.wc-panels{display:flex;gap:16px;flex-wrap:wrap}
.wc-panel{flex:1;min-width:300px;background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:20px;min-height:300px}
.wc-panel h4{font-size:12px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px;padding:4px 10px;border-radius:4px;display:inline-block}
.wc-panel h4.atk{background:#ff1744;color:white}
.wc-panel h4.def{background:#00e676;color:#111}
.wc-panel h4.neu{background:#90a4ae;color:#111}
.wc-panel h4.glb{background:#4f46e5;color:#111}
.wc-cloud{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;padding:10px}
.wc-word{display:inline-block;padding:2px 6px;border-radius:4px;cursor:default;transition:all .2s;line-height:1.3}
.wc-word:hover{opacity:.7;transform:scale(1.1)}
.wc-word.atk{color:#ff5252}
.wc-word.def{color:#69f0ae}
.wc-word.neu{color:#b0bec5}
.wc-word.glb{color:#4f46e5}
.wc-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:15px}
.wc-stat{background:#ffffff;border:1px solid #e2e4ee;border-radius:8px;padding:14px;text-align:center}
.wc-stat .ws-val{font-size:28px;font-weight:bold;color:#4f46e5}
.wc-stat .ws-label{font-size:10px;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.wc-comparison{background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:16px;margin-top:16px}
.wc-comparison h4{color:#4f46e5;font-size:13px;margin-bottom:12px;text-transform:uppercase}
.wc-comp-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-bottom:1px solid #f5f6fa;font-size:12px}
.wc-comp-word{flex:1;color:#1f2937;font-weight:bold}
.wc-comp-bar{flex:2;display:flex;height:16px;border-radius:3px;overflow:hidden}
.wc-comp-bar .atk-bar{background:#ff1744;height:100%}
.wc-comp-bar .def-bar{background:#00e676;height:100%}
.wc-comp-counts{font-size:10px;color:#6b7280;width:80px;text-align:right}

/* HISTORY TAB */
.history-container{display:none}
.history-container.active{display:block}
.hist-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:18px}
.hist-stat-card{background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:14px;text-align:center}
.hist-stat-val{font-size:22px;font-weight:700;color:#4f46e5}
.hist-stat-val.up{color:#00e676}
.hist-stat-val.down{color:#ff1744}
.hist-stat-label{font-size:10px;color:#6b7280;text-transform:uppercase;margin-top:4px}
.hist-stat-delta{font-size:11px;margin-top:2px}
.hist-chart-wrap{background:#ffffff;border:1px solid #e2e4ee;border-radius:10px;padding:16px;margin-bottom:16px}
.hist-chart-wrap h4{color:#4f46e5;font-size:13px;text-transform:uppercase;margin-bottom:12px}
.hist-chart{width:100%;position:relative}
.hist-bars{display:flex;align-items:flex-end;gap:3px;height:180px;padding:0 4px 28px 40px;position:relative}
.hist-y-axis{position:absolute;left:0;top:0;bottom:28px;width:38px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;padding-right:4px}
.hist-y-label{font-size:9px;color:#9ca3af}
.hist-bar-group{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0;position:relative}
.hist-bar{width:100%;border-radius:3px 3px 0 0;min-height:2px;transition:height .3s;cursor:pointer;position:relative}
.hist-bar:hover{filter:brightness(1.3)}
.hist-bar-val{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:9px;color:#374151;white-space:nowrap;font-weight:600;pointer-events:none}
.hist-bar-label{font-size:9px;color:#9ca3af;margin-top:4px;white-space:nowrap;text-align:center}
.hist-legend{display:flex;gap:12px;margin-bottom:12px;font-size:11px;flex-wrap:wrap}
.hist-legend-item{display:flex;align-items:center;gap:4px}
.hist-legend-dot{width:10px;height:10px;border-radius:2px}
.hist-no-data{color:#9ca3af;text-align:center;padding:40px;font-size:13px}
.hist-grid-line{position:absolute;left:40px;right:4px;border-top:1px dashed #e2e4ee;pointer-events:none}
.camp-metrics{display:flex;gap:20px;margin-bottom:10px}
.camp-metric{text-align:center}
.camp-metric .cm-val{font-size:20px;font-weight:bold;color:#1f2937}
.camp-metric .cm-label{font-size:9px;color:#6b7280;text-transform:uppercase}
.camp-trolls{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.camp-troll-tag{font-size:10px;background:#e2e4ee;color:#4f46e5;padding:2px 8px;border-radius:10px;cursor:pointer}
.camp-troll-tag:hover{background:#4f46e5;color:#fff}
.camp-bar-bg{height:6px;background:#e2e4ee;border-radius:3px;margin-top:8px;overflow:hidden}
.camp-bar-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#ff922b,#4f46e5)}

.accounts-section{background:transparent;padding:20px 30px}
.accounts-section h2{color:#4f46e5;font-size:16px;margin-bottom:15px}
.accounts-section .filter-info{color:#6b7280;font-size:12px;margin-bottom:15px}
.accounts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.account-card{background:#ffffff;border:1px solid #e2e4ee;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:10px;transition:all .2s;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.account-card:hover{border-color:#4f46e5;box-shadow:0 4px 12px rgba(79,70,229,.12)}
.account-card .ac-avatar{width:32px;height:32px;border-radius:50%;flex-shrink:0}
.account-card .ac-info{flex:1;min-width:0}
.account-card .ac-name{font-size:12px;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-card .ac-handle{font-size:11px;color:#4f46e5}
.account-card .ac-stats{font-size:10px;color:#6b7280;margin-top:2px}
.account-card .ac-sort-val{font-size:14px;font-weight:bold;color:#4f46e5;text-align:center;flex-shrink:0;min-width:45px;line-height:1.1}
.account-card .ac-sort-label{display:block;font-size:8px;color:#6b7280;font-weight:normal;text-transform:uppercase;letter-spacing:.3px}
.account-card .ac-cat{font-size:9px;padding:2px 6px;border-radius:8px;color:#fff;font-weight:bold;flex-shrink:0}
.accounts-controls{display:flex;gap:10px;align-items:center;margin-bottom:15px;flex-wrap:wrap}
.accounts-controls select{background:#f5f6fa;border:1px solid #d1d5db;color:#1f2937;padding:5px 8px;border-radius:6px;font-size:12px;transition:all .2s}
.accounts-controls select:focus{outline:none;border-color:#4f46e5}
.accounts-count{color:#4f46e5;font-size:13px;font-weight:bold}
.no-filter-msg{color:#9ca3af;font-size:14px;text-align:center;padding:40px}

.login-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.98);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(4px)}
.login-overlay.hidden{display:none}
.login-card{background:#e8e8ef;border:1px solid #d1d5db;border-radius:12px;padding:40px;max-width:400px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.15)}
.login-card h2{color:#4f46e5;font-size:28px;margin-bottom:10px;text-align:center}
.login-card .logo-text{color:#4f46e5;font-size:14px;text-align:center;margin-bottom:30px;letter-spacing:2px;text-transform:uppercase}
.login-form{display:flex;flex-direction:column;gap:16px}
.login-form label{color:#6b7280;font-size:12px;text-transform:uppercase;letter-spacing:1px}
.login-form input{background:#f5f6fa;border:1px solid #d1d5db;color:#1f2937;padding:12px 14px;border-radius:6px;font-size:14px;transition:all .2s}
.login-form input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 8px rgba(79,70,229,.2)}
.login-form .login-btn{background:#4f46e5;color:white;border:none;padding:12px 20px;border-radius:6px;font-size:14px;font-weight:bold;cursor:pointer;transition:background .2s}
.login-form .login-btn:hover{background:#6366f1}
.login-form .login-btn:disabled{background:#9ca3af;cursor:not-allowed}
.login-error{color:#ff5252;font-size:12px;text-align:center;display:none}
.login-error.show{display:block}

.target-select:hover{border-color:#4f46e5}
.target-select:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 8px rgba(79,70,229,.2)}

.logout-btn{background:transparent;color:#6b7280;border:1px solid #d1d5db;padding:6px 12px;border-radius:15px;font-size:11px;cursor:pointer;transition:all .2s}
.logout-btn:hover{color:#4f46e5;border-color:#4f46e5}

.cross-btn{background:#eef2ff;color:#4f46e5;border:1px solid #4f46e5;border-radius:15px;padding:6px 14px;font-size:12px;cursor:pointer;transition:all .2s;white-space:nowrap}
.cross-btn:hover{background:#4f46e5;color:#f5f6fa}
.cross-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.92);display:none;align-items:center;justify-content:center;z-index:900;backdrop-filter:blur(4px)}
.cross-overlay.visible{display:flex}
.cross-panel{background:#e8e8ef;border:1px solid #d1d5db;border-radius:12px;padding:30px;max-width:900px;width:95%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.15)}
.cross-panel h2{color:#4f46e5;font-size:20px;margin-bottom:5px}
.cross-panel .cross-subtitle{color:#6b7280;font-size:12px;margin-bottom:20px}
.cross-config{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:20px;align-items:flex-end}
.cross-config .cfg-group{flex:1;min-width:200px}
.cross-config label{display:block;color:#6b7280;font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.cross-checks{display:flex;flex-direction:column;gap:6px}
.cross-check{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:#1f2937}
.cross-check input{accent-color:#4f46e5;width:16px;height:16px}
.cross-cat-select{background:#f5f6fa;border:1px solid #d1d5db;color:#1f2937;padding:8px 12px;border-radius:6px;font-size:13px;width:100%}
.cross-cat-select:focus{outline:none;border-color:#4f46e5}
.cross-run-btn{background:#4f46e5;color:white;border:none;padding:10px 24px;border-radius:6px;font-size:14px;font-weight:bold;cursor:pointer;transition:background .2s}
.cross-run-btn:hover{background:#6366f1}
.cross-close-btn{position:absolute;top:15px;right:20px;background:none;border:none;color:#6b7280;font-size:24px;cursor:pointer}
.cross-close-btn:hover{color:#4f46e5}
.cross-results{margin-top:20px;display:none}
.cross-results.visible{display:block}
.cross-results h3{color:#4f46e5;font-size:14px;margin-bottom:10px}
.cross-results-summary{display:flex;gap:15px;flex-wrap:wrap;margin-bottom:15px}
.cross-stat{background:#f0f1f5;border:1px solid #e2e4ee;border-radius:8px;padding:10px 15px;text-align:center}
.cross-stat .cs-val{font-size:22px;font-weight:bold;color:#4f46e5}
.cross-stat .cs-lbl{font-size:10px;color:#6b7280;text-transform:uppercase}
.cross-table{width:100%;border-collapse:collapse;font-size:12px}
.cross-table th{background:#f0f1f5;color:#6b7280;text-align:left;padding:8px 10px;font-size:10px;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid #e2e4ee;position:sticky;top:0}
.cross-table td{padding:6px 10px;border-bottom:1px solid #e2e4ee}
.cross-table tr:hover{background:#f0f1f5}
.cross-table .ct-handle{color:#4f46e5;cursor:pointer;text-decoration:none}
.cross-table .ct-handle:hover{text-decoration:underline}
.cross-table .ct-cat{display:inline-block;padding:2px 6px;border-radius:8px;font-size:10px;color:white;font-weight:bold}
.cross-table-wrap{max-height:400px;overflow-y:auto;border:1px solid #e2e4ee;border-radius:8px}
.cross-no-results{color:#9ca3af;text-align:center;padding:30px;font-size:14px}


/* BOTTOM NAVIGATION — hidden by default, shown only on mobile via media query */
.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;background:#ffffff;border-top:1px solid #e2e4ee;padding:4px 0;padding-bottom:env(safe-area-inset-bottom,0);z-index:900;box-shadow:0 -2px 10px rgba(0,0,0,.05)}
.bnav-item{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:#9ca3af;font-size:10px;font-family:inherit;cursor:pointer;padding:6px 0;flex:1;transition:color .2s}
.bnav-item.active{color:#4f46e5}
.bnav-item svg{transition:transform .2s}
.bnav-item.active svg{transform:scale(1.1)}

/* Sub-tabs already defined above (lines ~293-327) */

