/* ============================================================
   MÓDULO 1 "ROOT CAUSE" — cupos, tarjeta de contenido, revelación
   ============================================================ */
.toggle-group { display: flex; gap: 8px; margin-bottom: 16px; }
.toggle-btn {
  flex: 1; padding: 10px; border-radius: 10px; border: 1.5px solid var(--line);
  background: transparent; font-family: var(--font-mono); font-size: 11.5px;
  text-transform: uppercase; letter-spacing: 0.04em; cursor: pointer; color: var(--ink-soft);
}
.toggle-btn.active { border-color: var(--accent); color: var(--accent); background: rgba(226,96,31,0.08); }

.content-frame {
  border-radius: 12px; overflow: hidden; margin: 16px 0;
  border: 1.5px solid var(--line);
}
.content-frame img { width: 100%; display: block; }
.content-frame iframe { width: 100%; aspect-ratio: 16/9; border: none; display: block; }
.content-text {
  font-family: var(--font-display); font-size: 22px; font-weight: 700;
  padding: 24px; text-align: center; background: var(--paper);
}

.reveal-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px;
}
.tag { font-family: var(--font-mono); font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 6px; }
.tag.hit { background: rgba(35,92,58,0.12); color: var(--success); }
.tag.miss { background: rgba(178,58,46,0.12); color: var(--danger); }

.author-reveal {
  text-align: center; font-family: var(--font-display); font-size: 20px; font-weight: 700;
  margin-bottom: 18px; padding: 14px; background: rgba(226,96,31,0.08); border-radius: 10px;
}

/* ---------- Cupos de envío (video/meme) ---------- */
.quota-block { margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.quota-row { display: flex; justify-content: space-between; margin-bottom: 8px; }
.quota-label { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-soft); }
#video-input-area, #meme-input-area { display: flex; gap: 8px; }
#video-input-area input, #meme-input-area input[type="file"] { flex: 1; }
#video-input-area button, #meme-input-area button { width: auto; padding: 12px 18px; margin: 0; white-space: nowrap; }