.kit-rep-page {
  /* Tokens */
  --rep-hero-bg:var(--bg-card-2);
  --rep-bg:var(--bg);
  --rep-text-1:var(--text-1);
  --rep-text-2:var(--text-2);
  --rep-text-3:var(--text-3);
  --rep-text-hero:var(--text-1);
  --rep-text-hero-2:var(--text-2);
  --rep-text-hero-3:var(--text-3);
  --rep-accent:var(--accent-solid);
  --rep-accent-hover:#6A26A8;
  --rep-accent-dark:#fff;
  --rep-danger:var(--error);
  --rep-danger-soft:rgba(244,71,94,.14);
  --rep-success:var(--teal);
  --rep-border:var(--border);
  --rep-border-hover:var(--border-mid);
  --rep-input-border-hero:rgba(255,255,255,.18);

  background:var(--rep-bg);
  color:var(--rep-text-1);
}
.kit-rep-page * { box-sizing:border-box; }
.kit-rep-wrap   { max-width:1180px; margin:0 auto; padding:0 16px; }
.kit-rep-narrow { max-width:760px;  margin:0 auto; padding:0 16px; }

/* ────────────────────────────────────────────────────────────────
   Hero — fondo sólido, sin gradient. H1 sin accent gradient.
   ──────────────────────────────────────────────────────────────── */
.kit-rep-hero { background:var(--rep-hero-bg); color:var(--rep-text-hero); padding:48px 16px 60px; }
.kit-rep-hero-inner { max-width:1180px; margin:0 auto; }

.kit-rep-hero .eyebrow {
  display:inline-block; background:rgba(255,255,255,.08); color:var(--rep-text-hero-2);
  padding:5px 12px; border-radius:999px; font-size:.74rem; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
}
.kit-rep-hero .eyebrow.danger { background:var(--rep-danger-soft); color:#FFCED5; }
.kit-rep-hero .eyebrow.success { background:rgba(39,225,157,.16); color:#A5F4D0; }

.kit-rep-hero h1 {
  font-size:clamp(1.65rem, 4vw, 2.4rem);
  font-weight:700; line-height:1.15;
  margin:10px 0 14px; letter-spacing:-.01em; overflow-wrap:break-word;
}
.kit-rep-hero p {
  font-size:1rem; color:var(--rep-text-hero-2);
  max-width:560px; line-height:1.55; margin:0;
}
.kit-rep-hero-micro { font-size:.82rem; color:var(--rep-text-hero-3); margin-top:8px; }
.kit-rep-hero-link {
  color:var(--rep-text-hero-2); font-size:.88rem; text-decoration:none;
  display:inline-flex; align-items:center; gap:4px; margin-top:14px;
}
.kit-rep-hero-link:hover { color:#fff; text-decoration:underline; }

/* ────────────────────────────────────────────────────────────────
   Buscador hero (form WA/TG)
   ──────────────────────────────────────────────────────────────── */
.kit-rep-search { max-width:680px; margin:24px 0 0; }
.kit-rep-search-row {
  display:grid; grid-template-columns:1fr 1fr auto; gap:8px;
  background:var(--bg-card); padding:6px; border-radius:13px;
  box-shadow:0 18px 40px -16px rgba(0,0,0,.4);
}
.kit-rep-search-input {
  padding:13px 14px; border:0; outline:none; font-size:.96rem;
  color:var(--rep-text-1); border-radius:9px; min-width:0; font-family:inherit;
  background:var(--bg-card);
}
.kit-rep-search-input::placeholder { color:#a995c4; }
.kit-rep-search-btn-main {
  background:var(--rep-accent); color:var(--rep-accent-dark); border:0;
  padding:0 22px; border-radius:9px; font-weight:600; font-size:.94rem;
  cursor:pointer; transition:background .12s, transform .12s; white-space:nowrap;
}
.kit-rep-search-btn-main:hover { background:var(--rep-accent-hover); }
.kit-rep-search-btn-main:disabled { opacity:.45; cursor:not-allowed; }
.kit-rep-search-mismatch {
  background:rgba(255,203,71,.18); border:1px solid rgba(255,203,71,.4);
  color:#FFE08A; padding:10px 14px; border-radius:10px;
  margin-top:10px; font-size:.84rem;
}

/* ────────────────────────────────────────────────────────────────
   Panel base
   ──────────────────────────────────────────────────────────────── */
.kit-rep-panel { background:var(--bg-card); border:1px solid var(--rep-border); border-radius:14px; padding:22px; margin-bottom:16px; }
.kit-rep-panel h2 { font-size:1.05rem; font-weight:700; margin:0 0 8px; color:var(--rep-text-1); }
.kit-rep-panel p  { color:var(--rep-text-2); line-height:1.55; font-size:.95rem; }

/* ────────────────────────────────────────────────────────────────
   "Cómo funciona" comprimido a 1 línea
   ──────────────────────────────────────────────────────────────── */
.kit-rep-flow {
  display:flex; gap:8px; align-items:center; justify-content:center;
  flex-wrap:wrap; padding:20px 0; color:var(--rep-text-3); font-size:.86rem;
}
.kit-rep-flow-step { display:inline-flex; align-items:center; gap:6px; }
.kit-rep-flow-step strong { color:var(--rep-text-2); font-weight:600; }
.kit-rep-flow-sep { opacity:.45; }

/* ────────────────────────────────────────────────────────────────
   "Últimos reportados" cards
   ──────────────────────────────────────────────────────────────── */
.kit-rep-cards {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr));
  gap:12px; padding:8px 0 24px;
}
.kit-rep-card {
  background:var(--bg-card); border:1px solid var(--rep-border); border-radius:12px;
  padding:14px 16px; text-decoration:none; color:inherit; display:block;
  transition:border-color .15s, transform .15s;
}
.kit-rep-card:hover { border-color:var(--rep-border-hover); transform:translateY(-1px); }
.kit-rep-card-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.kit-rep-card-id  { font-family:ui-monospace,Consolas,monospace; font-size:.9rem; color:var(--rep-text-1); font-weight:700; word-break:break-all; }
.kit-rep-card-tag {
  font-size:.6rem; padding:3px 8px; border-radius:999px; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; flex-shrink:0;
}
.kit-rep-card-tag.wa { background:#25D366; color:#fff; }
.kit-rep-card-tag.tg { background:#0088CC; color:#fff; }
.kit-rep-card-count { font-size:.82rem; color:var(--rep-danger); font-weight:700; margin-top:6px; }
.kit-rep-card-foot  { font-size:.74rem; color:var(--rep-text-3); margin-top:2px; }

/* ────────────────────────────────────────────────────────────────
   Empty state minimalista (reemplaza banner ámbar)
   ──────────────────────────────────────────────────────────────── */
.kit-rep-empty {
  text-align:center; padding:36px 16px 16px;
  color:var(--rep-text-3); font-size:.92rem;
}
.kit-rep-empty a { color:var(--rep-text-2); font-weight:600; text-decoration:none; border-bottom:1px solid currentColor; }
.kit-rep-empty a:hover { color:var(--accent-text, #7B2FBE); }

/* ────────────────────────────────────────────────────────────────
   Status banner — border-left, no gradient
   ──────────────────────────────────────────────────────────────── */
.kit-rep-status-banner {
  display:flex; align-items:flex-start; gap:14px;
  padding:16px 20px; border-radius:12px; margin-bottom:18px;
  background:var(--bg-card); border:1px solid var(--rep-border);
}
.kit-rep-status-banner.clean    { border-left:3px solid var(--rep-success); }
.kit-rep-status-banner.flagged  { border-left:3px solid var(--rep-danger); }
.kit-rep-status-icon {
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-size:1rem; flex-shrink:0; font-weight:700;
}
.kit-rep-status-banner.clean   .kit-rep-status-icon { background:rgba(39,225,157,.18); color:var(--rep-success); }
.kit-rep-status-banner.flagged .kit-rep-status-icon { background:var(--rep-danger-soft); color:var(--rep-danger); }
.kit-rep-status-text { flex:1; min-width:0; }
.kit-rep-status-text > strong { display:block; font-size:.98rem; color:var(--rep-text-1); font-weight:700; margin-bottom:2px; }
.kit-rep-status-text span   { font-size:.86rem; color:var(--rep-text-2); }

/* ────────────────────────────────────────────────────────────────
   Identificador prominente
   ──────────────────────────────────────────────────────────────── */
.kit-rep-identifier {
  background:var(--rep-hero-bg); color:var(--text-1); padding:18px 22px;
  border-radius:13px; margin-bottom:14px;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.kit-rep-identifier-text { font-family:ui-monospace,Consolas,monospace; font-size:1.2rem; font-weight:700; word-break:break-all; flex:1; min-width:0; }
.kit-rep-identifier-tag  {
  display:inline-block; font-size:.68rem; padding:4px 10px;
  border-radius:999px; background:rgba(255,255,255,.12);
  font-weight:700; text-transform:uppercase; letter-spacing:.04em;
}
.kit-rep-identifier-claimed {
  display:inline-flex; align-items:center; gap:5px; font-size:.72rem;
  background:rgba(39,225,157,.16); color:#A5F4D0;
  padding:4px 10px; border-radius:999px; font-weight:600;
}
.kit-rep-identifier-link {
  color:var(--rep-text-hero-2); font-size:.82rem; text-decoration:none;
  margin-top:8px; display:inline-flex; align-items:center; gap:4px;
}
.kit-rep-identifier-link:hover { color:#fff; text-decoration:underline; }

/* ────────────────────────────────────────────────────────────────
   Tarjeta de reporte
   ──────────────────────────────────────────────────────────────── */
.kit-rep-report {
  background:var(--bg-card); border:1px solid var(--rep-border);
  border-radius:12px; padding:18px 20px; margin-bottom:12px;
}
.kit-rep-report-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.kit-rep-report-cat  {
  background:var(--rep-danger-soft); color:var(--rep-danger);
  font-size:.7rem; font-weight:700; padding:3px 10px;
  border-radius:999px; text-transform:uppercase; letter-spacing:.04em;
}
.kit-rep-report-date { font-size:.76rem; color:var(--rep-text-3); }
.kit-rep-report-body {
  color:var(--rep-text-1); line-height:1.6; font-size:.94rem; white-space:pre-wrap;
}
.kit-rep-report-meta {
  display:flex; gap:18px; margin-top:12px; padding-top:10px;
  border-top:1px solid var(--rep-border); flex-wrap:wrap;
  font-size:.8rem; color:var(--rep-text-3);
}
.kit-rep-report-meta strong { color:var(--rep-text-1); font-weight:600; }

.kit-rep-evidencias { margin-top:12px; display:flex; flex-wrap:wrap; gap:8px; }
.kit-rep-evidencia  {
  background:var(--bg-card); border:1px solid var(--rep-border); border-radius:8px;
  padding:4px; display:inline-flex; align-items:center; gap:6px;
  font-size:.76rem; color:var(--rep-text-2);
}
.kit-rep-evidencia img { width:60px; height:60px; object-fit:cover; border-radius:5px; display:block; }
.kit-rep-evidencia a   { color:var(--accent-text, #7B2FBE); font-weight:600; text-decoration:none; padding:0 6px; }
.kit-rep-evidencia a:hover { text-decoration:underline; }

/* Réplica (respuesta del proveedor) */
.kit-rep-replica {
  background:var(--bg-card-2); border-left:3px solid #C9B6E8;
  padding:12px 14px; margin-top:12px; border-radius:0 8px 8px 0;
}
.kit-rep-replica.verified { border-left-color:var(--rep-accent); }
.kit-rep-replica-head { display:flex; align-items:center; gap:8px; margin-bottom:5px; flex-wrap:wrap; }
.kit-rep-replica-tag  {
  font-size:.62rem; font-weight:700; padding:2px 8px;
  border-radius:999px; text-transform:uppercase; letter-spacing:.04em;
  background:#E6D5FF; color:#5b3d8a;
}
.kit-rep-replica.verified .kit-rep-replica-tag { background:rgba(39,225,157,.18); color:var(--rep-success); }
.kit-rep-replica-date { font-size:.72rem; color:var(--rep-text-3); }
.kit-rep-replica-body { color:var(--rep-text-1); font-size:.9rem; line-height:1.55; }

/* Tabs del panel "¿Eres tú?" cuando el dueño verificado responde o pide baja */
.kit-rep-tab {
  background:transparent; border:0; padding:8px 14px;
  font-size:.86rem; font-weight:600; color:var(--rep-text-3);
  cursor:pointer; border-bottom:2px solid transparent;
  margin-bottom:-1px; transition:color .12s, border-color .12s;
  font-family:inherit;
}
.kit-rep-tab:hover { color:var(--rep-text-2); }
.kit-rep-tab.is-active { color:var(--rep-text-1); border-bottom-color:var(--rep-accent); }

/* "Me pasó lo mismo" botón */
.kit-rep-me-too {
  display:inline-flex; align-items:center; gap:6px; margin-top:10px;
  padding:7px 12px; background:transparent; color:var(--rep-text-2);
  border:1px solid var(--rep-border); border-radius:8px;
  font-size:.82rem; font-weight:600; cursor:pointer;
  transition:background .12s, border-color .12s;
}
.kit-rep-me-too:hover { background:var(--bg-card-2); border-color:var(--rep-border-hover); }
.kit-rep-me-too-count { color:var(--rep-danger); font-weight:700; margin-left:4px; }

/* ────────────────────────────────────────────────────────────────
   Botones — 1 primario teal, secundario outline
   ──────────────────────────────────────────────────────────────── */
.kit-rep-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:12px 22px; border-radius:10px;
  font-weight:600; font-size:.92rem; cursor:pointer; border:0;
  text-decoration:none; transition:background .15s, border-color .15s, color .15s;
  white-space:nowrap; font-family:inherit;
}
.kit-rep-btn-primary { background:var(--rep-accent); color:var(--rep-accent-dark); }
.kit-rep-btn-primary:hover { background:var(--rep-accent-hover); }
.kit-rep-btn-secondary { background:transparent; color:var(--rep-text-2); border:1.5px solid var(--rep-border); }
.kit-rep-btn-secondary:hover { border-color:var(--rep-border-hover); color:var(--accent-text, #7B2FBE); }
.kit-rep-btn-danger { background:transparent; color:var(--rep-danger); border:1.5px solid var(--rep-danger-soft); }
.kit-rep-btn-danger:hover { background:var(--rep-danger-soft); }

/* Link-style action */
.kit-rep-link {
  color:var(--rep-text-2); font-size:.9rem; font-weight:600;
  text-decoration:none; display:inline-flex; align-items:center; gap:4px;
}
.kit-rep-link:hover { color:var(--accent-text, #7B2FBE); text-decoration:underline; }

/* CTA bar simple */
.kit-rep-ctabar {
  display:flex; gap:12px; flex-wrap:wrap;
  padding:14px 18px; background:var(--bg-card);
  border:1px solid var(--rep-border); border-radius:12px;
  align-items:center; justify-content:space-between; margin-bottom:16px;
}
.kit-rep-ctabar-text { color:var(--rep-text-2); font-size:.92rem; flex:1; min-width:180px; line-height:1.45; }

/* ────────────────────────────────────────────────────────────────
   Form
   ──────────────────────────────────────────────────────────────── */
.kit-rep-form { display:flex; flex-direction:column; gap:14px; }
.kit-rep-form-group {
  background:var(--bg-card); border:1px solid var(--rep-border);
  border-radius:12px; padding:18px 20px;
}
.kit-rep-form-group + .kit-rep-form-group { margin-top:14px; }
.kit-rep-form-group h2 {
  font-size:.74rem; font-weight:700; color:var(--rep-text-3);
  text-transform:uppercase; letter-spacing:.06em;
  margin:0 0 14px; padding-bottom:10px;
  border-bottom:1px solid var(--rep-border);
}
.kit-rep-field { margin-bottom:12px; }
.kit-rep-field:last-child { margin-bottom:0; }
.kit-rep-field label {
  display:block; font-size:.82rem; color:var(--rep-text-2);
  font-weight:600; margin-bottom:5px;
}
.kit-rep-field input[type="text"],
.kit-rep-field input[type="email"],
.kit-rep-field input[type="number"],
.kit-rep-field input[type="date"],
.kit-rep-field select,
.kit-rep-field textarea {
  width:100%; padding:11px 14px;
  border:1.5px solid var(--rep-border); border-radius:9px;
  font-size:.94rem; outline:none; font-family:inherit; color:var(--rep-text-1);
  background:var(--bg-card);
}
.kit-rep-field textarea { min-height:130px; resize:vertical; line-height:1.5; }
.kit-rep-field input:focus,
.kit-rep-field select:focus,
.kit-rep-field textarea:focus { border-color:var(--rep-accent); }
.kit-rep-field small.help { display:block; font-size:.76rem; color:var(--rep-text-3); margin-top:4px; line-height:1.4; }

.kit-rep-checkbox { display:flex; gap:10px; align-items:flex-start; }
.kit-rep-checkbox input { margin-top:3px; flex-shrink:0; }
.kit-rep-checkbox label { font-size:.86rem; color:var(--rep-text-2); line-height:1.5; }

.kit-rep-fileinput {
  background:var(--bg-card-2); border:1.5px dashed #C9B6E8;
  border-radius:10px; padding:18px; text-align:center;
  cursor:pointer; transition:border-color .15s, background .15s;
}
.kit-rep-fileinput:hover { border-color:var(--rep-accent); background:rgba(39,225,157,.04); }
.kit-rep-fileinput input { display:none; }
.kit-rep-fileinput strong { display:block; color:var(--rep-text-1); font-size:.92rem; margin-bottom:4px; }
.kit-rep-fileinput small  { color:var(--rep-text-3); font-size:.78rem; }

/* Form row 2-col */
.kit-rep-form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:520px) { .kit-rep-form-row { grid-template-columns:1fr; } }

/* ────────────────────────────────────────────────────────────────
   Toasts — sutiles
   ──────────────────────────────────────────────────────────────── */
.kit-rep-toast {
  background:rgba(39,225,157,.12); color:var(--rep-success);
  padding:12px 16px; border-radius:10px; margin-bottom:14px;
  font-size:.9rem; font-weight:600;
  border:1px solid rgba(39,225,157,.28);
}
.kit-rep-toast.info { background:rgba(123,47,190,.08); color:var(--rep-text-2); border-color:var(--rep-border); }
.kit-rep-toast.warn { background:rgba(255,203,71,.18); color:#5C3D00; border-color:rgba(255,203,71,.4); }

/* ────────────────────────────────────────────────────────────────
   Términos — tipografía mejorada
   ──────────────────────────────────────────────────────────────── */
.kit-rep-terms { font-size:.95rem; line-height:1.75; color:var(--rep-text-2); }
.kit-rep-terms h2 {
  font-size:1.08rem; font-weight:600; color:var(--rep-text-1);
  margin:32px 0 10px;
}
.kit-rep-terms h2:first-child { margin-top:6px; }
.kit-rep-terms p  { margin:10px 0; }
.kit-rep-terms ul, .kit-rep-terms ol { padding-left:24px; margin:10px 0; }
.kit-rep-terms li { margin:6px 0; }
.kit-rep-terms li::marker { color:var(--accent-text, #7B2FBE); }
.kit-rep-terms code {
  background:rgba(123,47,190,.08); color:var(--rep-text-2);
  padding:1px 6px; border-radius:5px; font-size:.88em;
}
.kit-rep-terms a { color:var(--accent-text, #7B2FBE); }

/* ────────────────────────────────────────────────────────────────
   Mobile responsive
   ──────────────────────────────────────────────────────────────── */
@media (max-width:520px) {
  .kit-rep-hero { padding:36px 16px 52px; }
  .kit-rep-search-row { grid-template-columns:1fr; gap:6px; padding:5px; }
  .kit-rep-search-btn-main { padding:13px 22px; width:100%; }
  .kit-rep-cards { grid-template-columns:1fr 1fr; gap:10px; }
  .kit-rep-card  { padding:12px; }
  .kit-rep-card-id { font-size:.82rem; }
  .kit-rep-panel { padding:18px; }
  .kit-rep-identifier { padding:14px 16px; }
  .kit-rep-identifier-text { font-size:1.02rem; }
  .kit-rep-status-banner { padding:14px 16px; gap:10px; }
  .kit-rep-status-icon { width:24px; height:24px; font-size:.86rem; }
  .kit-rep-ctabar { padding:14px; flex-direction:column; align-items:stretch; }
  .kit-rep-btn { justify-content:center; }
  .kit-rep-report { padding:14px 16px; }
  .kit-rep-form-group { padding:16px; }
}
@media (max-width:360px) {
  .kit-rep-cards { grid-template-columns:1fr; }
}

.kit-rep-hero-inner { padding:0 16px; }
.kit-rep-page .kit-rep-hero-inner { text-align:left; }
.kit-rep-page .kit-rep-hero p, .kit-rep-page .kit-rep-hero .kit-rep-search { margin-left:0; margin-right:0; }
.kit-rep-hero .eyebrow { background:var(--bg-card-2); color:var(--text-2); }
.kit-rep-hero .eyebrow.danger { background:var(--bg-card); color:var(--error); }
.kit-rep-hero .eyebrow.success { background:var(--bg-card); color:var(--teal); }
.kit-rep-hero-link, .kit-rep-link { text-decoration:underline; text-underline-offset:3px; min-height:44px; }
button.kit-rep-link { background:transparent; border:0; padding:0; text-align:left; }
.kit-rep-hero-link:hover, .kit-rep-identifier-link:hover { color:var(--accent-text); }
.kit-rep-identifier-claimed { background:var(--bg-card); color:var(--teal); }
.kit-rep-search-row { padding:16px; box-shadow:none; border:1px solid var(--border); align-items:end; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; }
.kit-rep-input-wrap { position:relative; min-width:0; }
.kit-rep-input-wrap label { display:block; color:var(--text-2); font-size:.85rem; font-weight:600; margin-bottom:8px; }
.kit-rep-input-wrap .kit-rep-search-input { padding-left:42px; width:100%; border:1px solid var(--border-mid); }
.kit-rep-input-icon { position:absolute; left:12px; bottom:14px; width:20px; height:20px; pointer-events:none; color:var(--text-2); }
.kit-rep-search-mismatch, .kit-rep-toast.warn { background:var(--bg-card); color:var(--error); border-color:var(--border); }
.kit-rep-form-group h2 { text-transform:none; letter-spacing:0; font-size:1rem; color:var(--text-1); }
.kit-rep-form-group + .kit-rep-form-group { margin-top:0; }
.kit-rep-fileinput input { display:block; margin-top:10px; width:100%; }
.kit-rep-field input[type="file"] { width:100%; max-width:100%; font-size:.85rem; }
.kit-rep-upload-error { margin-top:8px; color:var(--error); font-size:.85rem; line-height:1.5; }
.kit-rep-btn { white-space:normal; text-align:center; }
.kit-rep-terms a, .kit-rep-form a, .kit-rep-wrap > p a { text-decoration:underline !important; text-underline-offset:3px; }
.kit-rep-report-cat, .kit-rep-replica.verified .kit-rep-replica-tag { background:var(--bg-card); }
.kit-rep-replica-tag { background:var(--bg-card); color:var(--text-2); }
.kit-rep-toast { background:var(--bg-card); }
.kit-rep-form label { font-size:.9rem; color:var(--text-2); font-weight:600; }
@media(max-width:640px) { .kit-rep-search-row { grid-template-columns:1fr; gap:12px; } .kit-rep-search-btn-main { padding:12px; } .kit-rep-identifier { gap:8px; } }

.kit-rep-response-form { display:flex; flex-direction:column; gap:10px; }
.kit-rep-response-form label { display:block; font-size:.9rem; font-weight:600; color:var(--text-2); margin-top:8px; }
.kit-rep-response-form input:not([type="hidden"]), .kit-rep-response-form select, .kit-rep-response-form textarea { display:block; width:100%; }