:root{
  --bg:#0b0e14;
  --bg-alt:#0f131b;
  --panel:#131822;
  --border:#232a38;
  --text:#e6e9ef;
  --text-dim:#8a93a6;
  --accent:#10b981;
  --accent-soft:rgba(16,185,129,0.12);
  --blue:#3b82f6;
  --purple:#8b5cf6;
  --cyan:#06b6d4;
  --amber:#f59e0b;
  --pink:#ec4899;
  --orange:#f97316;
  --red:#ef4444;
  --radius:10px;
}

*{box-sizing:border-box; margin:0; padding:0;}

body{
  background:
    radial-gradient(circle at 20% 0%, rgba(16,185,129,0.06), transparent 40%),
    radial-gradient(circle at 80% 10%, rgba(59,130,246,0.05), transparent 40%),
    var(--bg);
  color:var(--text);
  font-family:"Inter", system-ui, -apple-system, sans-serif;
  font-size:14px;
  line-height:1.5;
  min-height:100vh;
}

.mono{font-family:"JetBrains Mono", "Courier New", monospace;}

.page{
  max-width:1080px;
  margin:0 auto;
  padding:20px 16px 60px;
}

/* ---------- TOPBAR ---------- */
.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:14px;
}
.brand{display:flex; align-items:center; gap:8px;}
.brand-dot{
  width:10px; height:10px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px var(--accent);
}
.brand-name{font-weight:700; font-size:18px; letter-spacing:-0.02em;}

.topbar-meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  font-size:12px; color:var(--text-dim);
}
.meta-item b{color:var(--text); font-family:"JetBrains Mono", monospace; font-weight:500;}

.live-pill{
  display:flex; align-items:center; gap:6px;
  background:var(--accent-soft);
  color:var(--accent);
  border:1px solid rgba(16,185,129,0.3);
  border-radius:999px;
  padding:3px 10px;
  font-size:11px;
  font-weight:600;
  letter-spacing:0.5px;
}
.live-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  animation:pulse 1.6s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;} 50%{opacity:.35;}}

.btn-refresh{
  background:var(--panel);
  border:1px solid var(--border);
  color:var(--text);
  font-family:inherit;
  font-size:12px;
  font-weight:600;
  padding:7px 14px;
  border-radius:8px;
  cursor:pointer;
  transition:border-color .15s, color .15s;
}
.btn-refresh:hover{border-color:var(--accent); color:var(--accent);}
.btn-refresh:disabled{opacity:.4; cursor:wait;}

/* ---------- TICKER ---------- */
.ticker-wrap{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:8px;
  overflow:hidden;
  white-space:nowrap;
  margin-bottom:18px;
}
.ticker{
  display:inline-block;
  padding:8px 0 8px 100%;
  font-family:"JetBrains Mono", monospace;
  font-size:12px;
  color:var(--text-dim);
  animation:scroll-left 32s linear infinite;
}
.ticker b{color:var(--accent); font-weight:600;}
@keyframes scroll-left{
  0%{transform:translateX(0);}
  100%{transform:translateX(-100%);}
}

/* ---------- TABS ---------- */
.tabs{
  display:flex;
  gap:6px;
  margin-bottom:18px;
  border-bottom:1px solid var(--border);
  overflow-x:auto;
}
.tab-btn{
  background:none;
  border:none;
  color:var(--text-dim);
  font-family:inherit;
  font-size:13px;
  font-weight:600;
  padding:9px 6px;
  cursor:pointer;
  position:relative;
  white-space:nowrap;
}
.tab-btn::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-1px;
  height:2px; background:transparent;
  border-radius:2px;
}
.tab-btn:hover{color:var(--text);}
.tab-btn.active{color:var(--accent);}
.tab-btn.active::after{background:var(--accent);}

.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* ---------- CALCULADORA ---------- */
.calc-grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:16px;
  align-items:end;
  margin-bottom:18px;
}
.calc-field label{
  display:block;
  font-size:11px;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:6px;
}
select, input[type="number"], input[type="text"]{
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  font-family:"Inter", sans-serif;
  font-size:14px;
  padding:9px 12px;
  border-radius:8px;
  width:100%;
}
select:focus, input:focus{outline:none; border-color:var(--accent);}

.segmented{
  display:flex;
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:8px;
  padding:3px;
}
.seg-btn{
  background:none;
  border:none;
  color:var(--text-dim);
  font-family:inherit;
  font-size:13px;
  font-weight:600;
  padding:7px 14px;
  border-radius:6px;
  cursor:pointer;
  white-space:nowrap;
}
.seg-btn.active{background:var(--accent); color:#04140d;}

.calc-inputs{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:14px;
  align-items:center;
}
.calc-input-box label{
  display:block;
  font-size:11px;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:6px;
}
.calc-input-box input{
  font-family:"JetBrains Mono", monospace;
  font-size:20px;
  font-weight:700;
}
.calc-input-box.result{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px 12px;
}
.calc-output-value{
  font-family:"JetBrains Mono", monospace;
  font-size:24px;
  font-weight:700;
  color:var(--accent);
}
.calc-arrow{
  font-size:20px;
  color:var(--text-dim);
  text-align:center;
}
.calc-rate-note{
  margin-top:14px;
  font-size:12px;
  color:var(--text-dim);
  font-family:"JetBrains Mono", monospace;
}

@media (max-width:600px){
  .calc-grid{grid-template-columns:1fr;}
  .calc-inputs{grid-template-columns:1fr; text-align:center;}
  .calc-arrow{transform:rotate(90deg);}
}

/* ---------- INFO TAB ---------- */
#info-table th{
  text-align:left;
  font-size:11px;
  font-weight:600;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  padding:8px 10px;
  border-bottom:1px solid var(--border);
}
#info-table td{
  padding:10px;
  border-bottom:1px solid var(--border);
  font-size:13px;
  vertical-align:top;
}
.note-small{
  margin-top:12px;
  font-size:11px;
  color:var(--text-dim);
}

/* ---------- NEGOCIO TAB ---------- */
.biz-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  align-items:center;
  margin-bottom:16px;
  padding-bottom:16px;
  border-bottom:1px solid var(--border);
}
.biz-check{
  display:flex; align-items:center; gap:8px;
  font-size:13px;
  color:var(--text-dim);
  cursor:pointer;
}
.biz-check input{width:auto;}
.biz-usd-rate select{width:auto; min-width:180px;}
.biz-margin-global{
  display:flex; align-items:center; gap:8px;
  margin-left:auto;
  flex-wrap:wrap;
}
.biz-margin-global label{font-size:12px; color:var(--text-dim);}
.biz-margin-global input{width:70px;}

.btn-secondary{
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  font-family:inherit;
  font-size:12px;
  font-weight:600;
  padding:8px 14px;
  border-radius:8px;
  cursor:pointer;
}
.btn-secondary:hover{border-color:var(--accent); color:var(--accent);}

#biz-table th{
  text-align:left;
  font-size:11px;
  font-weight:600;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  padding:8px;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
#biz-table td{
  padding:6px 8px;
  border-bottom:1px solid var(--border);
}
.biz-input{
  padding:6px 8px;
  font-size:13px;
  min-width:80px;
}
.biz-nombre{min-width:150px;}
.biz-readout{
  font-family:"JetBrains Mono", monospace;
  font-size:13px;
  white-space:nowrap;
}
.biz-highlight{color:var(--accent); font-weight:700;}
.biz-remove{
  background:none;
  border:1px solid var(--border);
  color:var(--red);
  width:26px; height:26px;
  border-radius:6px;
  cursor:pointer;
  font-size:12px;
}
.biz-remove:hover{border-color:var(--red);}

#biz-add-row{margin-top:12px;}

.biz-totals{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:10px;
  margin-top:18px;
}
.biz-total-box{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px 14px;
}
.biz-total-box span{
  display:block;
  font-size:11px;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:4px;
}
.biz-total-box b{
  font-family:"JetBrains Mono", monospace;
  font-size:17px;
}
.biz-total-box.highlight{border-color:var(--accent);}
.biz-total-box.highlight b{color:var(--accent);}

/* ---------- CUENTA: BOTÓN + MODAL ---------- */
.account-btn{
  margin-left:auto;
  border:1px solid var(--border);
  border-radius:8px;
  padding:6px 12px;
}
.account-btn.active::after{display:none;}

.modal-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,0.6);
  display:flex; align-items:center; justify-content:center;
  z-index:100;
  padding:16px;
}
.modal-box{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:24px;
  width:100%;
  max-width:380px;
  position:relative;
}
.modal-close{
  position:absolute; top:12px; right:12px;
  background:none; border:none;
  color:var(--text-dim);
  font-size:16px;
  cursor:pointer;
}
.modal-close:hover{color:var(--text);}
#account-form .calc-field{margin-bottom:12px;}
#account-form{margin-top:16px;}
#account-submit{width:100%; text-align:center; margin-top:6px;}
#account-error{color:var(--red); min-height:16px;}
#account-logged-in h2{font-size:18px; margin-bottom:4px;}
#account-logged-in p{margin-bottom:16px;}
.account-server-note{margin-top:18px; padding-top:14px; border-top:1px solid var(--border);}
.account-server-note code{color:var(--accent);}

/* ---------- MI CARTERA (WATCHLIST) ---------- */
.watch-disclaimer{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-left:3px solid var(--amber);
  border-radius:8px;
  padding:12px 14px;
  font-size:12px;
  color:var(--text-dim);
  margin-bottom:18px;
}
.watch-disclaimer a{color:var(--accent);}
#watch-search-table tbody tr, #watch-list-table tbody tr{cursor:pointer;}

/* ---------- TOGGLE ROSARIO / TODAS ---------- */
.view-toggle{
  display:inline-flex;
  margin-bottom:18px;
}

/* ---------- TARJETAS DE CASAS LOCALES SIN API ---------- */
.local-card{
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.local-card h3{font-size:14px; font-weight:700;}
.local-note{font-size:12px; color:var(--text-dim); flex-grow:1;}
.local-link{text-align:center; text-decoration:none; display:inline-block;}
.local-values{flex-grow:1;}
.local-values .row{display:flex; justify-content:space-between; font-size:13px; margin:3px 0;}
.local-values .label{color:var(--text-dim);}
.local-values .value{font-family:"JetBrains Mono", monospace; font-weight:700;}
.local-loading{font-size:12px; color:var(--text-dim); font-style:italic;}
.local-error{font-size:12px; color:var(--red);}

/* ---------- FILAS CLICKEABLES ---------- */
.providers-table tbody tr, .bench-card{cursor:pointer;}
.providers-table tbody tr:focus-visible, .bench-card:focus-visible{outline:1px solid var(--accent);}

/* ---------- VISTA DE DETALLE ---------- */
.detail-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:14px;
  margin:16px 0 18px;
}
.detail-head h2{font-size:20px; margin-bottom:6px;}
.detail-prices{display:flex; gap:24px;}
.detail-prices .label{
  display:block;
  font-size:11px;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:2px;
}
.detail-prices b{
  font-family:"JetBrains Mono", monospace;
  font-size:20px;
}
.detail-chart{
  width:100%;
  height:260px;
  display:block;
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:8px;
}

/* ---------- BENCHMARK CARDS ---------- */
.benchmarks{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:10px;
  margin-bottom:22px;
}

.bench-card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:12px 14px;
  border-top:2px solid var(--accent);
  position:relative;
}
.bench-card.type-oficial{border-top-color:var(--blue);}
.bench-card.type-blue{border-top-color:var(--purple);}
.bench-card.type-tarjeta{border-top-color:var(--pink);}
.bench-card.type-mep{border-top-color:var(--accent);}
.bench-card.type-ccl{border-top-color:var(--cyan);}
.bench-card.type-cripto{border-top-color:var(--amber);}

.bench-card h3{
  font-size:11px;
  font-weight:600;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  margin-bottom:8px;
}
.bench-value{
  font-family:"JetBrains Mono", monospace;
  font-size:24px;
  font-weight:700;
  color:var(--text);
}
.bench-sub{
  display:flex; justify-content:space-between; align-items:center;
  margin-top:6px;
  font-size:11px;
  color:var(--text-dim);
}
.bench-sub .compra{font-family:"JetBrains Mono", monospace;}
.bench-change{font-weight:600;}
.bench-change.up{color:var(--red);}
.bench-change.down{color:var(--accent);}
.bench-card .unavailable{color:var(--red); font-size:12px;}

/* ---------- PANEL ---------- */
.panel{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px;
  margin-bottom:20px;
}
.panel-head{margin-bottom:14px;}
.panel-head h2{font-size:16px; font-weight:700; margin-bottom:4px;}
.panel-head p{font-size:12px; color:var(--text-dim);}

.table-scroll{overflow-x:auto;}

table{width:100%; border-collapse:collapse; font-size:13px;}

.providers-table th{
  text-align:left;
  font-size:11px;
  font-weight:600;
  color:var(--text-dim);
  text-transform:uppercase;
  letter-spacing:0.5px;
  padding:8px 10px;
  border-bottom:1px solid var(--border);
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}
.providers-table th:hover{color:var(--accent);}

.providers-table td{
  padding:9px 10px;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
  font-family:"JetBrains Mono", monospace;
}
.providers-table td:first-child{font-family:"Inter", sans-serif;}

.providers-table tbody tr:hover{background:rgba(255,255,255,0.02);}

.entity{display:flex; align-items:center; gap:9px;}
.entity img{
  width:22px; height:22px;
  object-fit:contain;
  border-radius:5px;
  background:#fff;
  padding:2px;
}
.entity .fallback-icon{
  width:22px; height:22px;
  display:none;
  align-items:center; justify-content:center;
  border-radius:5px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  font-size:10px;
  font-weight:700;
  color:var(--text-dim);
}

.type-badge{
  display:inline-block;
  font-size:10px;
  font-weight:600;
  letter-spacing:0.3px;
  padding:3px 8px;
  border-radius:999px;
  text-transform:uppercase;
}
.type-badge.oficial{background:rgba(59,130,246,0.15); color:var(--blue);}
.type-badge.blue{background:rgba(139,92,246,0.15); color:var(--purple);}
.type-badge.mep{background:rgba(16,185,129,0.15); color:var(--accent);}
.type-badge.ccl{background:rgba(6,182,212,0.15); color:var(--cyan);}
.type-badge.cripto{background:rgba(245,158,11,0.15); color:var(--amber);}
.type-badge.tarjeta{background:rgba(236,72,153,0.15); color:var(--pink);}
.type-badge.p2p{background:rgba(249,115,22,0.15); color:var(--orange);}

.best{color:var(--accent); font-weight:700;}
.loading-row{text-align:center; color:var(--text-dim); padding:18px !important; font-family:"Inter", sans-serif;}

/* ---------- FOOTER ---------- */
.site-footer{
  text-align:center;
  font-size:11px;
  color:var(--text-dim);
  margin-top:6px;
}
.disclaimer{margin-top:5px; color:#7a6234;}

@media (max-width:560px){
  .topbar{flex-direction:column; align-items:flex-start;}
  .btn-refresh{width:100%;}
}