/* Colector operacional — CSS mínimo, pensado para cargar desde el teléfono.
   Sin framework: la herramienta tiene que poder tirarse sin extrañar nada. */
:root{
  --bg:#0f1115; --card:#181b22; --line:#2a2f3a; --fg:#e6e8ec; --muted:#9aa3b2;
  --accent:#4f8cff; --ok:#22c55e; --warn:#f59e0b; --err:#ef4444;
  --real:#22c55e; --est:#f59e0b; --hyp:#a78bfa;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);
     font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
header{position:sticky;top:0;z-index:10;background:#12151b;border-bottom:1px solid var(--line);
       padding:.6rem 1rem;display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
header .brand{font-weight:700;letter-spacing:.02em}
header nav{display:flex;gap:.75rem;flex-wrap:wrap;font-size:.92rem}
main{max-width:1000px;margin:0 auto;padding:1rem 1rem 4rem}
h1{font-size:1.35rem;margin:.4rem 0 1rem} h2{font-size:1.05rem;margin:1.5rem 0 .6rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;
      padding:1rem;margin-bottom:1rem}
label{display:block;margin:.85rem 0 .3rem;font-size:.9rem;color:var(--muted)}
/* 16px mínimo: por debajo, iOS hace zoom al enfocar un input. */
input,select,textarea,button{font-size:16px;width:100%;padding:.7rem .75rem;
  border-radius:10px;border:1px solid var(--line);background:#0d1017;color:var(--fg)}
textarea{min-height:76px}
button,.btn{background:var(--accent);border:0;color:#fff;font-weight:600;cursor:pointer;
  padding:.8rem 1rem;text-align:center;display:inline-block;width:auto}
button.wide{width:100%;margin-top:1.1rem;padding:.95rem}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--fg)}
.btn.danger{background:transparent;border:1px solid var(--err);color:var(--err);
  padding:.35rem .6rem;font-size:.8rem}
.grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.tiles{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.tile{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:.9rem;display:block}
.tile b{display:block;font-size:1.3rem;margin-bottom:.15rem}
.tile span{color:var(--muted);font-size:.82rem}
.row{display:flex;justify-content:space-between;gap:.75rem;padding:.55rem 0;
  border-bottom:1px solid var(--line);flex-wrap:wrap}
.row:last-child{border-bottom:0}
.row .k{color:var(--muted);font-size:.88rem}
.muted{color:var(--muted)} .small{font-size:.85rem}
.tag{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.72rem;
  border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.tag.REAL{color:var(--real);border-color:var(--real)}
.tag.ESTIMATED{color:var(--est);border-color:var(--est)}
.tag.HYPOTHESIS{color:var(--hyp);border-color:var(--hyp)}
.tag.sold{color:var(--ok);border-color:var(--ok)}
.tag.simulated{color:var(--hyp);border-color:var(--hyp)}
.flash{padding:.7rem .9rem;border-radius:10px;margin-bottom:1rem;border:1px solid}
.flash.ok{border-color:var(--ok);color:var(--ok)}
.flash.error{border-color:var(--err);color:var(--err)}
/* Nada de tablas en móvil: cada fila se apila y muestra su etiqueta. */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{text-align:left;padding:.5rem .4rem;border-bottom:1px solid var(--line)}
th{color:var(--muted);font-weight:600;font-size:.8rem}
@media (max-width:640px){
  table,thead,tbody,tr,th,td{display:block}
  thead{display:none}
  tr{border:1px solid var(--line);border-radius:10px;padding:.5rem;margin-bottom:.6rem}
  td{border:0;padding:.28rem 0;display:flex;justify-content:space-between;gap:1rem}
  td::before{content:attr(data-l);color:var(--muted);font-size:.8rem}
}
.timeline{list-style:none;padding:0;margin:0}
.timeline li{padding:.5rem 0 .5rem .9rem;border-left:2px solid var(--line);
  position:relative;margin-left:.3rem}
.timeline li::before{content:"";position:absolute;left:-5px;top:.95rem;width:8px;height:8px;
  border-radius:50%;background:var(--accent)}
.bar{height:7px;border-radius:4px;background:var(--accent);min-width:3px}